From 4ccd84fe6d457ebfb67e4d26655151a3f4ea7db3 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Wed, 5 Sep 2018 10:10:20 -0400 Subject: [PATCH 1/4] add browser support styles to footer --- styles/components/_footer.scss | 27 +++++++++++++++++++++++++-- 1 file changed, 25 insertions(+), 2 deletions(-) diff --git a/styles/components/_footer.scss b/styles/components/_footer.scss index 964ff393..8d77e408 100644 --- a/styles/components/_footer.scss +++ b/styles/components/_footer.scss @@ -1,6 +1,29 @@ .app-footer { background-color: $color-gray-lightest; border-top: 1px solid $color-gray-lighter; - padding-left: $gap*4; - padding-bottom: $gap*2; + display: flex; + flex-direction: row; + justify-content: space-between; + + h5, + .browser-support { + margin: 0; + padding: $gap * 2; + } + + .browser-support { + color: $color-gray; + text-align: right; + dt, dd { + @include h5; + display: inline-block; + } + + dd { + font-weight: normal; + &::before { + content: '・'; + } + } + } } From f513e5ce350a1dccb743a8169c4231202ffcbc18 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Wed, 5 Sep 2018 10:10:37 -0400 Subject: [PATCH 2/4] login page styles and markup --- styles/sections/_login.scss | 26 +++++++++++++++++--- templates/root.html | 49 +++++++++++++++++++++++++++++-------- 2 files changed, 62 insertions(+), 13 deletions(-) diff --git a/styles/sections/_login.scss b/styles/sections/_login.scss index 030d09d5..9234f5cb 100644 --- a/styles/sections/_login.scss +++ b/styles/sections/_login.scss @@ -1,3 +1,23 @@ -.login-area { - text-align: center; -} \ No newline at end of file +.login-layout { + align-items: center; + justify-content: center; + + .login-container { + max-width: 70rem; + + .login-banner { + text-align: center; + margin-bottom: $gap * 10; + + .login-banner__heading { + @include h1; + } + + .login-banner__logo { + display: block; + max-width: 15rem; + margin: ($gap * 2) auto; + } + } + } +} diff --git a/templates/root.html b/templates/root.html index 090196ec..84432c55 100644 --- a/templates/root.html +++ b/templates/root.html @@ -1,9 +1,12 @@ +{% from "components/alert.html" import Alert %} + - {% block title %}JEDI{% endblock %} + + {% block title %}JEDI Cloud{% endblock %} {% assets "css" %} {% endassets %} @@ -11,19 +14,45 @@ -
+
- Defense Digital Service Logo +
+ + + + + + {{ Alert('Certificate Selection', + message='When you are prompted to select a certificate, please select E-mail Certificate from the provided choices.', + actions=[ + { + 'label': 'Learn More', + 'icon': 'help', + 'href': '/' + } + ] + ) }} + + + + + +
+
Joint Enterprise Defense Infrastructure
+
+
JEDI Cloud supported on these web browsers
+
Chrome
Firefox
Safari
Edge
IE11 on Windows 10
IE10 on Windows 7
+
+ + From a9c777c28f441c0b89ab2a55538067628111577f Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Wed, 5 Sep 2018 13:51:44 -0400 Subject: [PATCH 3/4] dont use flexbox to lay this out because IE --- styles/sections/_login.scss | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/styles/sections/_login.scss b/styles/sections/_login.scss index 9234f5cb..05bb15ae 100644 --- a/styles/sections/_login.scss +++ b/styles/sections/_login.scss @@ -1,13 +1,14 @@ .login-layout { - align-items: center; - justify-content: center; + display: block; .login-container { max-width: 70rem; + margin-left: auto; + margin-right: auto; .login-banner { text-align: center; - margin-bottom: $gap * 10; + margin: ($gap * 5) 0 ($gap * 10); .login-banner__heading { @include h1; From bdd1af579fa07fc7b908a1001dda574e8cc79943 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Wed, 5 Sep 2018 13:58:32 -0400 Subject: [PATCH 4/4] add back dev login button --- templates/root.html | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/templates/root.html b/templates/root.html index 84432c55..b67f67b7 100644 --- a/templates/root.html +++ b/templates/root.html @@ -27,7 +27,9 @@ - + {% if g.dev %} + DEV Login + {% endif %} {{ Alert('Certificate Selection',