X-Git-Url: https://nos-oignons.net/gitweb/website.git/blobdiff_plain/dad71eb99687c7709f5efe2eb8e664a26166c902..73e61e98e53fe94541eb13e8d8a6a581b988e376:/local.css?ds=inline diff --git a/local.css b/local.css index a53aa29..ba0db98 100644 --- a/local.css +++ b/local.css @@ -100,9 +100,9 @@ thead td { padding: 1em 0; border-bottom: solid 1px #ccc; } -@media screen and (min-width: 400px) { +@media screen and (min-width: 390px) { .body-wrapper > header { - background: url("assets/filet.png") no-repeat scroll 99% 80% #FFF; + background: url("assets/filet.png") no-repeat scroll 99% 105px #FFF; } } @@ -110,11 +110,18 @@ thead td { #logo { display: block; width: 394px; /* same as .pageheader .header:margin-left */ - height: 100px; + height: 104px; max-width: 100%; background: url(assets/logo-nos-oignons-blanc.png) no-repeat top left; background-size: 100%; } +@media screen and (max-width: 390px) { + #logo { + background-image: url(assets/logo-nos-oignons-blanc-small.png); + background-position: left center; + height: 100px; + } +} #logo span { display: none; @@ -273,6 +280,9 @@ main a:hover { main p { margin: 1em 0 1em 0; } +main li p { + margin-top: 0; +} main hr { border: none; @@ -357,22 +367,28 @@ main .header a { } main .feedlink a { - text-decoration: none; + text-decoration: none; + /*color: #ffa430;*/ } main .feedlink { - text-align: right; - margin-top: -2.8em; - min-height: 2.8em; + float: right; + text-align: left; + margin-top: -3.5em; +} +@media screen and (max-width: 400px) { + main .feedlink { + float: none; + margin-top: -2em; + margin-bottom: 2em; + } } main .feedlink .feedbutton { font-size: 0.8em; - color: #57075f !important; background: transparent; border: none; } main .feedlink .feedbutton:hover { - color: #57075f !important; background: transparent; text-decoration: underline; } @@ -399,8 +415,8 @@ main .footnotes { text-align: center; } -#bandwidth {text-align: center;} -#bandwidth svg {text-align: left;} +#bandwidth, #weights {text-align: center;} +#bandwidth svg, #weights svg {text-align: left;} /* Tor nodes table */ .tor-nodes {} @@ -436,7 +452,7 @@ main .footnotes { margin: 2em auto; height: 85px; width: 600px; - background: lightGrey url(assets/progress_bar.png) top left repeat-x; + background: url(assets/progress_bar.png) top left repeat-x; border: 1px solid #ccc; border-bottom: 0; position: relative; @@ -444,7 +460,7 @@ main .footnotes { .progress-bar-wrapper .progress-bar { position: absolute; height: 85px; - background: grey url(assets/progress_bar.png) left -85px repeat-x; + background: url(assets/progress_bar.png) left -85px repeat-x; z-index: 2; /* animate progress bar */ -webkit-animation: progress-bar 1.5s; @@ -452,7 +468,7 @@ main .footnotes { animation: progress-bar 1.5s; } .progress-bar-wrapper .progress-bar-promises { - background: grey url(assets/progress_bar.png) left bottom repeat-x; + background-position: left bottom; z-index: 1; } @@ -578,18 +594,26 @@ main .footnotes { /* {{{ #footer */ #footer { - margin: 0; - padding: 0.5em 0; - text-align: center; - color: white; - background: #57075f; + margin: 0; + padding: 0.5em 0; + text-align: center; + color: white; + background: #57075f; + font-size: 0.85em; } -@media screen and (max-width: 400px) { +@media screen and (max-width: 45em) { #footer { - font-size: 0.85em; + text-align: left; padding: 0.5em 1em; + font-size: 0.8em; } } +@media screen and (max-width: 480px) { + #footer .pagecopyright span { + display: block; + } +} + #footer > div { margin-top: 1em; }