From f4503fb654a246817010ef2bb6b0860a10432fff Mon Sep 17 00:00:00 2001
From: Erik Moeller
Date: Fri, 19 Jul 2019 15:42:34 -0700
Subject: [PATCH] [WIP] Design updates for SecureDrop 1.0.0, rev1
Updates colors throughout to a new "SecureDrop Blue" and a darker
"Grimace Blue", a new "danger" color, and blue gradients on the
index page; updates the favicon and the default logo.
Resolves #4500
Resolves #4501
Resolves #4502
Resolves #4503
Additional tweaks chiefly agreed upon with Nina Alter (@ninavizz)
during pair development:
Global:
- Removal of some button icons that did not disambiguate meaning
- Tweaks to default button letter spacing, font weight
- Pick headline color that fits with new overall theme
- Ensure consistent use of headline levels
- Removed unused colors, styles, icons
- More careful spacing between icons and text on buttons
- Consistent use of upper case on large buttons
Source Interface:
- New trashcan icon for deleting replies
- Flipped order of introductory text on submit page by importance
Journalist Interface:
- Restyled timestamps, "0 docs, 1 message" type counters to be
less easily confused with buttons
- Restyled "Select all" type buttons to not have checkbox icons
on them, to ensure they're not confused with actual checkboxes
- Added spacing between Select buttons and other actions, to
make logical distinction more obvious
- Removed download icon from each table row, as it did not convey
sufficient meaning to justify keeping it
- Removed "Reply" icon from Reply headline, and left-aligned it,
for consistency with other headlines
- Made textbox the same width as the table above it, and removed
fixed column width, to ensure proper scaling across viewport
sizes
- Right-aligned "Submit" button consistent with other forms
- Removed hover from "X" of modals, as it did not really add
value here
Admin Interface:
- Made it more obvious when the Delete icon is disabled
Out of scope for this rev:
- String changes
- Typography changes
- Docs screenshot updates (will be done after final rev)
---
.../files/usr.sbin.apache2 | 6 +-
.../_confirmation_modal.html | 4 +-
.../account_edit_hotp_secret.html | 2 +-
.../account_new_two_factor.html | 2 +-
securedrop/journalist_templates/admin.html | 10 +-
.../journalist_templates/admin_add_user.html | 2 +-
.../admin_edit_hotp_secret.html | 2 +-
.../admin_new_user_two_factor.html | 2 +-
securedrop/journalist_templates/base.html | 2 +-
securedrop/journalist_templates/col.html | 24 ++---
securedrop/journalist_templates/config.html | 8 +-
securedrop/journalist_templates/delete.html | 2 +-
.../journalist_templates/edit_account.html | 8 +-
securedrop/journalist_templates/index.html | 2 +-
securedrop/journalist_templates/locales.html | 2 +-
securedrop/journalist_templates/login.html | 2 +-
securedrop/sass/_base.sass | 6 --
securedrop/sass/_source_index.sass | 65 ++++++++++---
securedrop/sass/_variables.sass | 14 +--
securedrop/sass/global/_body-tag.sass | 1 -
securedrop/sass/journalist.sass | 28 +++++-
securedrop/sass/modules/_button.sass | 89 +++++++++++-------
securedrop/sass/modules/_cols.sass | 17 ++--
securedrop/sass/modules/_confirm-modal.sass | 3 -
securedrop/sass/modules/_headline.sass | 7 +-
.../modules/_hr-horizontal-rule-line.sass | 7 +-
securedrop/sass/modules/_link.sass | 18 +++-
securedrop/sass/modules/_option.sass | 19 ----
securedrop/sass/modules/_panel.sass | 2 +-
securedrop/sass/modules/_sd-button.sass | 7 --
securedrop/sass/modules/_snippet.sass | 2 +-
securedrop/sass/modules/_submission.sass | 14 ++-
securedrop/sass/modules/_text-link.sass | 8 +-
securedrop/sass/source.sass | 9 +-
securedrop/source_templates/base.html | 4 +-
securedrop/source_templates/generate.html | 6 +-
securedrop/source_templates/index.html | 57 +++++------
securedrop/source_templates/locales.html | 2 +-
securedrop/source_templates/login.html | 9 +-
securedrop/source_templates/lookup.html | 26 ++---
securedrop/static/i/favicon.png | Bin 1948 -> 5185 bytes
.../static/i/font-awesome/trash-black.png | Bin 2280 -> 0 bytes
securedrop/static/i/logo.png | Bin 44138 -> 10629 bytes
securedrop/static/i/trash-x-out.png | Bin 0 -> 2263 bytes
securedrop/static/i/trash-x-solid.png | Bin 0 -> 2198 bytes
securedrop/static/i/x_icon-button_blue.png | Bin 0 -> 1558 bytes
securedrop/static/i/x_icon-grimace_blue.png | Bin 0 -> 1641 bytes
securedrop/static/i/x_icon-sd_blue.png | Bin 0 -> 254 bytes
securedrop/static/js/journalist.js | 14 +--
49 files changed, 294 insertions(+), 220 deletions(-)
delete mode 100644 securedrop/sass/modules/_option.sass
delete mode 100644 securedrop/sass/modules/_sd-button.sass
delete mode 100644 securedrop/static/i/font-awesome/trash-black.png
create mode 100644 securedrop/static/i/trash-x-out.png
create mode 100644 securedrop/static/i/trash-x-solid.png
create mode 100644 securedrop/static/i/x_icon-button_blue.png
create mode 100644 securedrop/static/i/x_icon-grimace_blue.png
create mode 100644 securedrop/static/i/x_icon-sd_blue.png
diff --git a/install_files/ansible-base/roles/build-securedrop-app-code-deb-pkg/files/usr.sbin.apache2 b/install_files/ansible-base/roles/build-securedrop-app-code-deb-pkg/files/usr.sbin.apache2
index aa20d309d27..125892bb742 100644
--- a/install_files/ansible-base/roles/build-securedrop-app-code-deb-pkg/files/usr.sbin.apache2
+++ b/install_files/ansible-base/roles/build-securedrop-app-code-deb-pkg/files/usr.sbin.apache2
@@ -264,7 +264,6 @@
/var/www/securedrop/static/i/font-awesome/refresh-blue.png r,
/var/www/securedrop/static/i/font-awesome/refresh-white.png r,
/var/www/securedrop/static/i/font-awesome/times-white.png r,
- /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,
@@ -277,6 +276,11 @@
/var/www/securedrop/static/i/tipbox/tipbox-hed-j-single.png r,
/var/www/securedrop/static/i/tipbox/tipbox-hed-submit3.png r,
/var/www/securedrop/static/i/tipbox/tipbox-logo.png r,
+ /var/www/securedrop/static/i/trash-x-out.png r,
+ /var/www/securedrop/static/i/trash-x-solid.png r,
+ /var/www/securedrop/static/i/x_icon-button_blue.png r,
+ /var/www/securedrop/static/i/x_icon-grimace_blue.png r,
+ /var/www/securedrop/static/i/x_icon-sd_blue.png r,
/var/www/securedrop/static/js/journalist.js r,
/var/www/securedrop/static/js/source.js r,
/var/www/securedrop/static/fonts/fa-brands-400.eot r,
diff --git a/securedrop/journalist_templates/_confirmation_modal.html b/securedrop/journalist_templates/_confirmation_modal.html
index 26662d56e3d..ad2d52d6886 100644
--- a/securedrop/journalist_templates/_confirmation_modal.html
+++ b/securedrop/journalist_templates/_confirmation_modal.html
@@ -4,7 +4,7 @@
X
{{ modal_data.modal_header }}
{{ modal_data.modal_body }}
- {{ gettext('Cancel') }}
-
+ {{ gettext('CANCEL') }}
+
diff --git a/securedrop/journalist_templates/account_edit_hotp_secret.html b/securedrop/journalist_templates/account_edit_hotp_secret.html
index cc4bc0bb954..131fc3a231f 100644
--- a/securedrop/journalist_templates/account_edit_hotp_secret.html
+++ b/securedrop/journalist_templates/account_edit_hotp_secret.html
@@ -6,6 +6,6 @@
-
+
{% endblock %}
diff --git a/securedrop/journalist_templates/account_new_two_factor.html b/securedrop/journalist_templates/account_new_two_factor.html
index c7ee696e8bb..60d0c05e090 100644
--- a/securedrop/journalist_templates/account_new_two_factor.html
+++ b/securedrop/journalist_templates/account_new_two_factor.html
@@ -21,6 +21,6 @@ {{ gettext('Enable YubiKey (OATH-HOTP)') }}
-
+
{% endblock %}
diff --git a/securedrop/journalist_templates/admin.html b/securedrop/journalist_templates/admin.html
index 2a54f19b49f..7a516c6129c 100644
--- a/securedrop/journalist_templates/admin.html
+++ b/securedrop/journalist_templates/admin.html
@@ -3,7 +3,7 @@
{{ gettext('Admin Interface') }}
@@ -22,9 +22,9 @@ {{ gettext('Admin Interface') }}
{% for user in users %}
{{ user.username }} |
- |
+ |
{% if user.id == g.user.id %}
- |
+ |
{% else %}
|
{% endif %}
@@ -44,8 +44,8 @@ {{ gettext('Admin Interface') }}
-
- {{ gettext('INSTANCE CONFIG') }}
+
+ {{ gettext('INSTANCE CONFIG') }}
diff --git a/securedrop/journalist_templates/admin_add_user.html b/securedrop/journalist_templates/admin_add_user.html
index da5e1aa88df..0423e5fc0d3 100644
--- a/securedrop/journalist_templates/admin_add_user.html
+++ b/securedrop/journalist_templates/admin_add_user.html
@@ -71,6 +71,6 @@
{{ error }}
{% endfor %}
-
+
{% endblock %}
diff --git a/securedrop/journalist_templates/admin_edit_hotp_secret.html b/securedrop/journalist_templates/admin_edit_hotp_secret.html
index 7a33f3abe45..397df7c7d9c 100644
--- a/securedrop/journalist_templates/admin_edit_hotp_secret.html
+++ b/securedrop/journalist_templates/admin_edit_hotp_secret.html
@@ -7,6 +7,6 @@
-
+
{% endblock %}
diff --git a/securedrop/journalist_templates/admin_new_user_two_factor.html b/securedrop/journalist_templates/admin_new_user_two_factor.html
index fa8abd38a22..52938994d15 100644
--- a/securedrop/journalist_templates/admin_new_user_two_factor.html
+++ b/securedrop/journalist_templates/admin_new_user_two_factor.html
@@ -24,6 +24,6 @@ {{ gettext('Enable YubiKey (OATH-HOTP)') }}
-
+
{% endblock %}
diff --git a/securedrop/journalist_templates/base.html b/securedrop/journalist_templates/base.html
index a18021178fb..cb020c79130 100644
--- a/securedrop/journalist_templates/base.html
+++ b/securedrop/journalist_templates/base.html
@@ -33,7 +33,7 @@
{% block header %}