diff options
Diffstat (limited to 'static')
| -rw-r--r-- | static/css/main.css | 53 |
1 files changed, 31 insertions, 22 deletions
diff --git a/static/css/main.css b/static/css/main.css index 3bf1e1e..2bb9803 100644 --- a/static/css/main.css +++ b/static/css/main.css | |||
| @@ -92,61 +92,59 @@ p + p { | |||
| 92 | 92 | ||
| 93 | #header { | 93 | #header { |
| 94 | background: url('../images/noise-bg.png'); | 94 | background: url('../images/noise-bg.png'); |
| 95 | height: 90px; | ||
| 96 | width: 100%; | 95 | width: 100%; |
| 97 | box-shadow: 0 3px 8px #ccc; | 96 | box-shadow: 0 3px 8px #ccc; |
| 97 | margin-bottom: 1em; | ||
| 98 | } | 98 | } |
| 99 | 99 | ||
| 100 | #header .logo { | 100 | #header a.logo:focus img { |
| 101 | padding: 10px; | ||
| 102 | display: block; | ||
| 103 | height: 25rem; | ||
| 104 | margin-bottom: 2em; | ||
| 105 | } | ||
| 106 | |||
| 107 | #header a:focus .logo { | ||
| 108 | border-left: 2px dotted #118ab2; | 101 | border-left: 2px dotted #118ab2; |
| 109 | border-right: 2px dotted #118ab2; | 102 | border-right: 2px dotted #118ab2; |
| 110 | } | 103 | } |
| 111 | 104 | ||
| 112 | #header .logo.small { | 105 | #header .logo.small img { |
| 113 | height: 4.5rem; | 106 | height: 4.5rem; |
| 114 | } | 107 | } |
| 115 | 108 | ||
| 116 | #header .members { | 109 | #header .logo.small { |
| 117 | float: right; | 110 | border: none; |
| 118 | } | 111 | } |
| 119 | 112 | ||
| 120 | @media screen and (min-width: 640px) { | 113 | #header .members { |
| 121 | #header { | 114 | float: right; |
| 122 | height: 110px; | ||
| 123 | } | ||
| 124 | } | 115 | } |
| 125 | 116 | ||
| 126 | #header.frontpage { | 117 | .frontpage #header { |
| 127 | height: auto; | 118 | height: auto; |
| 128 | margin-bottom: 1em; | ||
| 129 | text-align: center; | 119 | text-align: center; |
| 130 | padding-top: 2rem; | 120 | padding-top: 2rem; |
| 131 | padding-bottom: 1rem; | 121 | padding-bottom: 1rem; |
| 132 | } | 122 | } |
| 133 | 123 | ||
| 134 | #header.frontpage .front-page-heading { | 124 | .frontpage #header .front-page-heading { |
| 135 | font-size: 175%; | 125 | font-size: 175%; |
| 136 | line-height: 150%; | 126 | line-height: 150%; |
| 137 | text-align: left; | 127 | text-align: left; |
| 138 | padding-top: 0.5em; | 128 | padding-top: 0.5em; |
| 139 | } | 129 | } |
| 140 | 130 | ||
| 141 | #header.frontpage .logo { | 131 | .frontpage #header .logo img { |
| 142 | padding: 0; | ||
| 143 | margin: 0 auto; | 132 | margin: 0 auto; |
| 144 | max-width: 100%; | 133 | max-width: 100%; |
| 134 | padding: 10px; | ||
| 135 | display: block; | ||
| 136 | height: 25rem; | ||
| 145 | } | 137 | } |
| 146 | 138 | ||
| 147 | #menubar { | 139 | #menubar { |
| 140 | display: inline-block; | ||
| 141 | vertical-align: middle; | ||
| 142 | } | ||
| 143 | |||
| 144 | .frontpage #menubar { | ||
| 148 | margin: auto; | 145 | margin: auto; |
| 149 | padding: 0px; | 146 | padding: 0px; |
| 147 | display: block; | ||
| 150 | clear: both; | 148 | clear: both; |
| 151 | } | 149 | } |
| 152 | 150 | ||
| @@ -155,6 +153,17 @@ p + p { | |||
| 155 | padding: 0px; | 153 | padding: 0px; |
| 156 | } | 154 | } |
| 157 | 155 | ||
| 156 | #header-inner * { | ||
| 157 | vertical-align: middle; | ||
| 158 | } | ||
| 159 | |||
| 160 | /* ghost element to maintain perfect centering */ | ||
| 161 | #header-inner:before { | ||
| 162 | content: ''; | ||
| 163 | display: inline-block; | ||
| 164 | height: 100%; | ||
| 165 | vertical-align: middle; | ||
| 166 | } | ||
| 158 | 167 | ||
| 159 | .latest-news { | 168 | .latest-news { |
| 160 | margin-top: 20px; | 169 | margin-top: 20px; |
| @@ -290,7 +299,7 @@ h1 { | |||
| 290 | 299 | ||
| 291 | h1:first-child { | 300 | h1:first-child { |
| 292 | font-size: 1.8rem; | 301 | font-size: 1.8rem; |
| 293 | margin-bottom: 3rem; | 302 | margin-bottom: 2rem; |
| 294 | margin-top: 0; | 303 | margin-top: 0; |
| 295 | } | 304 | } |
| 296 | 305 | ||