Skip to content

Commit

Permalink
Replace "Cloud" upload icon with more neutral one
Browse files Browse the repository at this point in the history
Adds rendering rule for the icon to accomplish two things:
- give the icon room to breathe
- force crisp rendering, to render large source image cleanly
  at smaller size (the source PNG is a bit larger than the
  default size to accommodate zooming)

The crisp rendering rule may make sense as a generic rule at a
later point, but so far this seems to be the best candidate
for using it.

The new icon was designed by Nina Alter (@ninavizz) and is not
derived from FontAwesome, hence not in the font-awesome directory.

Resolves #4535
  • Loading branch information
eloquence committed Jun 24, 2019
1 parent 0005dc5 commit 6a49d6f
Show file tree
Hide file tree
Showing 10 changed files with 14 additions and 7 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -246,13 +246,13 @@
/var/www/securedrop/static/i/un-star.png r,
/var/www/securedrop/static/i/delete_red.png r,
/var/www/securedrop/static/i/securedrop_small.png r,
/var/www/securedrop/static/i/arrow-upload-blue.png r,
/var/www/securedrop/static/i/arrow-upload-white.png r,
/var/www/securedrop/static/i/arrow-upload-large.png r,
/var/www/securedrop/static/i/font-awesome/black/times.svg r,
/var/www/securedrop/static/i/font-awesome/cancel-blue.png r,
/var/www/securedrop/static/i/font-awesome/checkmark-white.png r,
/var/www/securedrop/static/i/font-awesome/checkmark-blue.png r,
/var/www/securedrop/static/i/font-awesome/cloud-upload-blue.png r,
/var/www/securedrop/static/i/font-awesome/cloud-upload-blue-large.png r,
/var/www/securedrop/static/i/font-awesome/cloud-upload-white.png r,
/var/www/securedrop/static/i/font-awesome/comments-blue.png r,
/var/www/securedrop/static/i/font-awesome/comments-white.png r,
/var/www/securedrop/static/i/font-awesome/exclamation-triangle-black.png r,
Expand All @@ -267,7 +267,7 @@
/var/www/securedrop/static/i/font-awesome/trash-black.png r,
/var/www/securedrop/static/i/font-awesome/black/guard.svg r,
/var/www/securedrop/static/i/font-awesome/white/guard.svg r,
/var/www/securedrop/static/i/font-awesome/white/exclamation-circle.svg r,
/var/www/securedrop/static/i/font-awesome/white/exclamation-circle.svg r,
/var/www/securedrop/static/i/hand_with_fingerprint.png r,
/var/www/securedrop/static/i/success_checkmark.png r,
/var/www/securedrop/static/i/server_upload.png r,
Expand Down
7 changes: 7 additions & 0 deletions securedrop/sass/source.sass
Original file line number Diff line number Diff line change
Expand Up @@ -211,3 +211,10 @@ div.bubble

.close
cursor: pointer

// For forcing cleaner rendering of large PNG icons to smaller sizes
#upload-icon
image-rendering: -moz-crisp-edges
image-rendering: crisp-edges
margin-bottom: 10px
margin-top: 5px
4 changes: 2 additions & 2 deletions securedrop/source_templates/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -60,8 +60,8 @@ <h2 class="welcome-text">

<div class="index-column index-left index-bottom">
<a href="{{ url_for('main.generate') }}" id="submit-documents-button" class="sd-button btn alt">
<img class="icon off-hover" src="{{ url_for('static', filename='i/font-awesome/cloud-upload-white.png') }}" width="20px" height="14px">
<img class="icon on-hover" src="{{ url_for('static', filename='i/font-awesome/cloud-upload-blue.png') }}" width="20px" height="14px">
<img class="icon off-hover" src="{{ url_for('static', filename='i/arrow-upload-white.png') }}" width="20px" height="14px">
<img class="icon on-hover" src="{{ url_for('static', filename='i/arrow-upload-blue.png') }}" width="20px" height="14px">
{{ gettext('SUBMIT DOCUMENTS') }}
</a>
</div>
Expand Down
2 changes: 1 addition & 1 deletion securedrop/source_templates/lookup.html
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ <h1 class="headline">{{ gettext('Submit Files or Messages') }}</h1>
<input name="csrf_token" type="hidden" value="{{ csrf_token() }}">
<div class="snippet">
<div class="attachment grid-item center">
<img class="center" src="{{ url_for('static', filename='i/font-awesome/cloud-upload-blue-large.png') }}" width="80px" height="80px">
<img class="center" id="upload-icon" src="{{ url_for('static', filename='i/arrow-upload-large.png') }}" width="56px" height="56x">
<input type="file" name="fh" autocomplete="off">
<p class="center" id="max-file-size">{{ gettext('Maximum upload size: 500 MB') }}</p>
</div>
Expand Down
Binary file added securedrop/static/i/arrow-upload-blue.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added securedrop/static/i/arrow-upload-large.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added securedrop/static/i/arrow-upload-white.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Binary file not shown.
Binary file not shown.

0 comments on commit 6a49d6f

Please sign in to comment.