Fix responsive + plus de contraste

This commit is contained in:
Evarin 2017-10-19 23:14:07 +02:00
parent adcf615e5b
commit d750ad6ae0
2 changed files with 33 additions and 31 deletions

View file

@ -76,7 +76,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
/* line 17, ../sass/screen.scss */ /* line 17, ../sass/screen.scss */
body, html { body, html {
background: #fff9a4; background: #f8ef78;
padding: 0; padding: 0;
margin: 0; margin: 0;
height: 100%; height: 100%;
@ -226,8 +226,9 @@ header {
flex-grow: 1; flex-grow: 1;
padding: 20px; padding: 20px;
width: 100%; width: 100%;
border: 1px solid rgba(140, 14, 0, 0.5);
} }
/* line 154, ../sass/screen.scss */ /* line 155, ../sass/screen.scss */
.main .last-publication a { .main .last-publication a {
display: block; display: block;
max-width: 350px; max-width: 350px;
@ -243,35 +244,35 @@ header {
box-shadow: 0 0 0 rgba(140, 14, 0, 0); box-shadow: 0 0 0 rgba(140, 14, 0, 0);
transition: box-shadow 1s ease-out; transition: box-shadow 1s ease-out;
} }
/* line 169, ../sass/screen.scss */ /* line 170, ../sass/screen.scss */
.main .last-publication a:hover { .main .last-publication a:hover {
box-shadow: 0 0 5px #8c0e00; box-shadow: 0 0 5px #8c0e00;
} }
/* line 175, ../sass/screen.scss */ /* line 176, ../sass/screen.scss */
.publication-list { .publication-list {
margin: 10px 5px; margin: 10px 5px;
margin-left: 30px; margin-left: 30px;
padding: 0 30px; padding: 0 30px;
max-width: 700px; max-width: 700px;
} }
/* line 181, ../sass/screen.scss */ /* line 182, ../sass/screen.scss */
.publication-list .publication-entry { .publication-list .publication-entry {
display: flex; display: flex;
align-items: center; align-items: center;
position: relative; position: relative;
border-bottom: 1px solid #86abcb; border-bottom: 1px solid #86abcb;
} }
/* line 187, ../sass/screen.scss */ /* line 188, ../sass/screen.scss */
.publication-list .publication-entry:first-child { .publication-list .publication-entry:first-child {
border-top: 1px solid #86abcb; border-top: 1px solid #86abcb;
} }
/* line 191, ../sass/screen.scss */ /* line 192, ../sass/screen.scss */
.publication-list .publication-entry > span { .publication-list .publication-entry > span {
padding: 7px 5px; padding: 7px 5px;
display: inline-block; display: inline-block;
} }
/* line 195, ../sass/screen.scss */ /* line 196, ../sass/screen.scss */
.publication-list .publication-entry .publication-date { .publication-list .publication-entry .publication-date {
text-align: right; text-align: right;
font-weight: light; font-weight: light;
@ -279,16 +280,16 @@ header {
font-style: italic; font-style: italic;
width: 100px; width: 100px;
} }
/* line 202, ../sass/screen.scss */ /* line 203, ../sass/screen.scss */
.publication-list .publication-entry .publication-descr { .publication-list .publication-entry .publication-descr {
font-size: 0.9em; font-size: 0.9em;
opacity: 0.9; opacity: 0.9;
} }
/* line 205, ../sass/screen.scss */ /* line 206, ../sass/screen.scss */
.publication-list .publication-entry .publication-descr:before { .publication-list .publication-entry .publication-descr:before {
content: " "; content: " ";
} }
/* line 209, ../sass/screen.scss */ /* line 210, ../sass/screen.scss */
.publication-list .publication-entry a.overlay { .publication-list .publication-entry a.overlay {
position: absolute; position: absolute;
z-index: 1; z-index: 1;
@ -298,13 +299,13 @@ header {
left: 0; left: 0;
} }
@media screen and (max-width: 600px) { @media screen and (max-width: 599px) {
/* line 221, ../sass/screen.scss */ /* line 222, ../sass/screen.scss */
.container { body {
margin-top: 60px; padding-top: 75px;
} }
/* line 224, ../sass/screen.scss */ /* line 225, ../sass/screen.scss */
header, .sidebar { header, .sidebar {
position: fixed; position: fixed;
top: 0; top: 0;
@ -312,39 +313,39 @@ header {
width: 100%; width: 100%;
} }
/* line 230, ../sass/screen.scss */ /* line 231, ../sass/screen.scss */
header { header {
z-index: 15; z-index: 15;
right: 60px; right: 60px;
height: 60px; height: 60px;
} }
/* line 234, ../sass/screen.scss */ /* line 235, ../sass/screen.scss */
header img { header img {
height: 55px; height: 55px;
} }
/* line 238, ../sass/screen.scss */ /* line 239, ../sass/screen.scss */
.sidebar { .sidebar {
z-index: 14; z-index: 14;
background: #fff9a4; background: #f8ef78;
border-bottom: 3px solid #8c0e00; border-bottom: 3px solid #8c0e00;
padding: 4px; padding: 4px;
padding-top: 55px; padding-top: 55px;
max-height: 100vh; max-height: 100vh;
overflow-y: auto; overflow-y: auto;
} }
/* line 247, ../sass/screen.scss */ /* line 248, ../sass/screen.scss */
.sidebar .minimenu { .sidebar .minimenu {
position: absolute; position: absolute;
right: 5px; right: 5px;
top: 5px; top: 5px;
display: block; display: block;
} }
/* line 252, ../sass/screen.scss */ /* line 253, ../sass/screen.scss */
.sidebar .minimenu img { .sidebar .minimenu img {
height: 50px; height: 50px;
} }
/* line 256, ../sass/screen.scss */ /* line 257, ../sass/screen.scss */
.sidebar ul.nav { .sidebar ul.nav {
display: flex; display: flex;
width: 100%; width: 100%;
@ -353,17 +354,17 @@ header {
font-size: 0.95em; font-size: 0.95em;
margin-bottom: 10px; margin-bottom: 10px;
} }
/* line 264, ../sass/screen.scss */ /* line 265, ../sass/screen.scss */
.sidebar ul.nav li { .sidebar ul.nav li {
display: inline-block; display: inline-block;
min-width: 150px; min-width: 150px;
margin: 5px; margin: 5px;
} }
/* line 268, ../sass/screen.scss */ /* line 269, ../sass/screen.scss */
.sidebar ul.nav li a { .sidebar ul.nav li a {
padding: 10px; padding: 10px;
} }
/* line 275, ../sass/screen.scss */ /* line 276, ../sass/screen.scss */
.sidebar.collapse ul { .sidebar.collapse ul {
display: none; display: none;
} }

View file

@ -15,7 +15,7 @@ $switchwidth: 600px;
} }
body, html { body, html {
background: $cadreclair; background: desaturate(darken($cadreclair, 10%), 10%);
padding: 0; padding: 0;
margin: 0; margin: 0;
height: 100%; height: 100%;
@ -150,6 +150,7 @@ header {
flex-grow: 1; flex-grow: 1;
padding: 20px; padding: 20px;
width: 100%; width: 100%;
border: 1px solid rgba($rouge, 0.5);
.last-publication a { .last-publication a {
display: block; display: block;
@ -217,9 +218,9 @@ header {
} }
} }
@media screen and (max-width:$switchwidth) { @media screen and (max-width:$switchwidth - 1px) {
.container { body {
margin-top: 60px; padding-top: 75px;
} }
header, .sidebar { header, .sidebar {
position:fixed; position:fixed;
@ -237,7 +238,7 @@ header {
} }
.sidebar { .sidebar {
z-index: 14; z-index: 14;
background: $cadreclair; background: desaturate(darken($cadreclair, 10%), 10%);
border-bottom: 3px solid $rouge; border-bottom: 3px solid $rouge;
padding: 4px; padding: 4px;
padding-top: 55px; padding-top: 55px;