From 3e64d82fed10bde8004ade798f3f71d462fb5e5a Mon Sep 17 00:00:00 2001 From: David Fourney Date: Wed, 5 Jul 2017 12:25:51 -0400 Subject: [PATCH] Prune CSS and update button colors --- wmca.css | 83 +++++++++++++++++++++++--------------------------------- 1 file changed, 34 insertions(+), 49 deletions(-) diff --git a/wmca.css b/wmca.css index 91f254b..c19ff53 100644 --- a/wmca.css +++ b/wmca.css @@ -24,6 +24,8 @@ img.logo { } .langlink { + /*display: flex; + justify-content: flex-start;*/ float: right; } @@ -60,17 +62,15 @@ p { flex-flow: row; } -header, -footer, #main > article, #main > leftmargin, #main > rightmargin { + background: #F3F3F3; margin: 4px; - padding: 1em; -} + padding: 0em 1.0rem; + } #main > article { - background: #F3F3F3; -webkit-flex: 4 1 0; flex: 4 1 0; -webkit-order: 2; @@ -86,15 +86,15 @@ footer, } #join { - background-color: #CCE7CD; border: 1px solid #5EAC58; + background-color: #CCE7CD; padding: 1em; width: 60%; } #donate { - background-color: #CCE7CD; border: 1px solid #5EAC58; + background-color: #CCE7CD; padding: 1em; width: 40%; } @@ -103,15 +103,6 @@ footer, text-align: center; } -#why { - background: #F3F3F3; -} - -#main > leftmargin, -#main > rightmargin { - background: #F3F3F3; -} - #main > leftmargin { -webkit-order: 1; order: 1; @@ -122,29 +113,23 @@ footer, order: 3; } -header, footer { - display: block; - min-height: 80px; -} - header { - background: #F3F3F3; + display: block; + padding: 1.0em; } footer { + display: block; + min-height: 80px; background: #DDD; font-size: 75%; font-style: italic; padding: 0.5em; } -.flex-outer, -.flex-inner { +.flex-outer { list-style-type: none; padding: 0; -} - -.flex-outer { margin: 0 auto; } @@ -154,15 +139,8 @@ footer { align-items: center; } -.flex-inner { - display: flex; - flex-wrap: wrap; - justify-content: space-between; - flex-direction: column; -} - -.flex-outer > li:not(:last-child) { - margin-bottom: 20px; +.flex-outer li:not(:last-child) { + margin-bottom: 10px; } .flex-outer li label { @@ -170,7 +148,7 @@ footer { } .flex-outer li p { - padding: 8px; + /*padding: 8px;*/ align-items: center; } @@ -178,20 +156,26 @@ footer { .flex-outer li p { flex: 1 0 120px; max-width: 220px; + padding: 8px; } .flex-outer > li > label + * { flex: 1 0 220px; } -.flex-outer li p { - margin: 0; -} - .flex-outer li input:not([type='radio']) { padding: 15px; } +.flex-inner { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + flex-direction: column; + list-style-type: none; + padding: 0; +} + span.break:before { content: "\A"; white-space: pre; @@ -223,20 +207,20 @@ input[type='text'] { font-size: 1.4rem; } +#donate > form { + text-align: center; +} + .btn-item { display: flex; padding-top: 1.5rem; justify-content: center; } -#donate > form { - text-align: center; -} - .btn { padding: 1.0rem; border: 1px solid #333; - background: #333; + background: #000; color: #fff; text-transform: uppercase; letter-spacing: .09em; @@ -246,13 +230,13 @@ input[type='text'] { } .btn:hover { - background: yellow; + background: gold; color: #000; border: 1px solid #333; } .btn:focus { - background: yellow; + background: gold; color: #000; border: 1px solid #333; } @@ -280,7 +264,7 @@ input[type='text'] { } #main > article { - padding 0.5em; + /*padding 0.5em;*/ } #main > leftmargin, #main > rightmargin { @@ -330,6 +314,7 @@ input[type='text'] { } footer { + margin-top: 0.25em; position: sticky; } -- 2.42.0