From 7ccf6fa13c79d0f3c6042f33ec0f895f8e0ec360 Mon Sep 17 00:00:00 2001 From: Matti Schneider Date: Sat, 3 Dec 2016 13:45:08 +0100 Subject: [PATCH 1/8] Rewrite and refactor footer --- app/styles/_theme-variables.scss | 2 -- app/styles/_theme.scss | 3 +- app/styles/footer.css | 17 ++++++++++++ app/styles/front.scss | 25 ----------------- app/styles/main.css | 19 +++++++++++++ app/styles/text-container.css | 1 - app/views/front.html | 47 ++++++++++++-------------------- 7 files changed, 55 insertions(+), 59 deletions(-) create mode 100644 app/styles/footer.css create mode 100644 app/styles/main.css diff --git a/app/styles/_theme-variables.scss b/app/styles/_theme-variables.scss index 1999df8703..e26e62f249 100644 --- a/app/styles/_theme-variables.scss +++ b/app/styles/_theme-variables.scss @@ -511,12 +511,10 @@ $list-group-link-heading-color: #333; $panel-bg: #fff; $panel-body-padding: 15px; $panel-heading-padding: 10px 15px; -$panel-footer-padding: $panel-heading-padding; $panel-border-radius: $border-radius-base; //** Border color for elements within panels $panel-inner-border: #ddd; -$panel-footer-bg: #f5f5f5; $panel-default-text: $gray-dark; $panel-default-border: #ddd; diff --git a/app/styles/_theme.scss b/app/styles/_theme.scss index 8b4780889c..af92519985 100644 --- a/app/styles/_theme.scss +++ b/app/styles/_theme.scss @@ -313,8 +313,7 @@ label, } .panel { - &.panel-heading, - &.panel-footer { + &.panel-heading { border-top-right-radius: 0; border-top-left-radius: 0; } diff --git a/app/styles/footer.css b/app/styles/footer.css new file mode 100644 index 0000000000..94c3e3effb --- /dev/null +++ b/app/styles/footer.css @@ -0,0 +1,17 @@ +footer { + background-color: #333; + color: #FFF; + width: 100%; + + margin-top: 3em; + padding-top: 2em; + padding-bottom: 1em; +} + +footer li { + margin-bottom: .5em; +} + +footer a, footer a:hover { + color: inherit; +} diff --git a/app/styles/front.scss b/app/styles/front.scss index d044da8afc..8af08e1b1b 100644 --- a/app/styles/front.scss +++ b/app/styles/front.scss @@ -1,12 +1,5 @@ @import 'commons'; -html { - overflow-y: scroll; - position: relative; - min-height: 100%; -} - -$main-footer-height: 220px; $body-front-base-padding: 45px; // .navbar's min-height h1[tabindex="-1"] { @@ -14,7 +7,6 @@ h1[tabindex="-1"] { } .body-front { - margin-bottom: $main-footer-height; padding-top: $body-front-base-padding; background-color: $color-background; } @@ -39,23 +31,6 @@ h1[tabindex="-1"] { vertical-align: middle; } -.main-footer { - background-color: $navbar-default-bg; - color: $navbar-default-color; - position: absolute; - bottom: 0; - width: 100%; - height: $main-footer-height; - - padding-top: 30px; - padding-bottom: 30px; - - & ul li a { - color: white; - font-size: 12px; - } -} - .form-foyer { padding-bottom: 5px; } diff --git a/app/styles/main.css b/app/styles/main.css new file mode 100644 index 0000000000..bcf190fa53 --- /dev/null +++ b/app/styles/main.css @@ -0,0 +1,19 @@ +html, body { + height: 100%; +} + +body { + position: relative; + padding: 0; + display: flex; + flex-direction: column; +} + +header, footer { + flex: none; +} + +.content { + flex: 1 0 auto; + width: 100%; +} diff --git a/app/styles/text-container.css b/app/styles/text-container.css index 4f4ce3b05d..4e8d2b1a70 100644 --- a/app/styles/text-container.css +++ b/app/styles/text-container.css @@ -2,7 +2,6 @@ font-size: 140%; line-height: 1.6; max-width: 40em; - padding-bottom: 3em; text-rendering: optimizeLegibility; } diff --git a/app/views/front.html b/app/views/front.html index 78c79948be..2211f8575a 100644 --- a/app/views/front.html +++ b/app/views/front.html @@ -24,9 +24,10 @@ - + + @@ -82,35 +83,23 @@ - From ba3c9bfc6d28d37081874157c13f0fa892532972 Mon Sep 17 00:00:00 2001 From: Matti Schneider Date: Tue, 13 Dec 2016 17:14:03 +0100 Subject: [PATCH 7/8] Make footer vertical alignment more explicit --- app/styles/footer.css | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/app/styles/footer.css b/app/styles/footer.css index 94c3e3effb..6e269c341f 100644 --- a/app/styles/footer.css +++ b/app/styles/footer.css @@ -5,7 +5,11 @@ footer { margin-top: 3em; padding-top: 2em; - padding-bottom: 1em; + padding-bottom: 1.5em; +} + +footer ul { + margin-bottom: 0; } footer li { From 4b20361952b254143dd8c7d0ce67566ee0085b30 Mon Sep 17 00:00:00 2001 From: Matti Schneider Date: Wed, 14 Dec 2016 11:37:07 +0100 Subject: [PATCH 8/8] Increase footer accessibility --- app/styles/footer.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/styles/footer.css b/app/styles/footer.css index 6e269c341f..5b0bc3e75c 100644 --- a/app/styles/footer.css +++ b/app/styles/footer.css @@ -16,6 +16,6 @@ footer li { margin-bottom: .5em; } -footer a, footer a:hover { +footer a, footer a:hover, footer a:focus { color: inherit; }