re style, 1st draft

This commit is contained in:
Frédéric Péters 2018-03-03 23:33:14 +01:00
parent b5aaa4a987
commit 6edb61b464
1 changed files with 30 additions and 14 deletions

View File

@ -3,6 +3,8 @@
$mobile-limit: 760px;
$font-family: "Open Sans", sans-serif;
$sidepage-background: #23282d url(texture.png);
$sidepage-background: white;
/* generalities */
@ -13,7 +15,7 @@ html, body {
@media screen and (min-width: 1260px) {
font-size: 13px;
}
background: #f2f2f2;
background: linear-gradient(to bottom, #4E7EE2 0%, #00D6EB 130vh);
color: #3c3c33;
}
@ -79,12 +81,8 @@ div#top {
}
div#top a {
color: #aaa;
font-weight: normal;
border: 0;
&:hover {
color: #888;
}
}
ul.user-info {
@ -97,13 +95,16 @@ ul.user-info {
top: 0px;
right: 0px;
z-index: 10;
background: #23282d url(texture.png);
background: #00d6eb;
height: 40px;
line-height: 40px;
li {
display: inline;
padding-left: 3em;
}
a {
color: white;
}
}
/* header */
@ -113,6 +114,7 @@ $header-height: 40px;
div#header {
background: #C2D1CC url(header-03.jpeg);
background-size: 100% 500px;
background: #4e7ee2;
padding-left: 0px;
border-bottom: 1px solid #888;
position: relative;
@ -303,10 +305,10 @@ div#main-content {
flex: 1 1 auto;
width: 100%;
margin-left: 0;
padding: 1em 6px 0 16px;
padding: 1em 6px 0 52px;
border: 1px solid #ccc;
border-width: 0 1px 1px 0;
background: white;
background: #ecf0f3;
position: relative;
overflow-x: auto;
overflow-y: hidden;
@ -401,7 +403,9 @@ div#more-user-links a:hover:after {
div#content {
margin: 0 1ex 1em 0;
padding: 0px;
background: white;
padding: 1ex;
border-radius: 3px;
position: relative;
}
@ -708,7 +712,10 @@ input[type=submit]:hover {
@include vendor-prefix('transition', 'width 0ms ease-in');
height: 100%;
overflow: initial;
background: #23282d url(texture.png);
color: white;
li a {
filter: invert(70%);
}
}
body[data-has-sidepage] #header,
@ -716,7 +723,6 @@ body[data-has-sidepage] #main {
margin-left: 36px;
}
body.sidepage-expanded #header,
body.sidepage-expanded #main {
margin-left: 30ex;
}
@ -748,6 +754,12 @@ body.sidepage-expanded #sidepage {
position: relative;
}
#sidepage-menu,
#sidepage {
color: #333;
}
#sidepage span#applabel {
visibility: hidden; /* will be turned visible by publik.js */
@ -762,10 +774,11 @@ body.sidepage-expanded #sidepage {
line-height: 40px;
font-weight: normal;
font-size: 20px;
border-bottom: 1px solid #666;
border-bottom: 1px solid #888;
background: white;
width: 150px;
&:hover {
color: #fff;
}
}
@ -786,11 +799,13 @@ body.sidepage-expanded #sidepage span#applabel {
}
#sidepage ul#sidepage-menu {
background: white;
position: relative;
left: 36px;
list-style: none;
padding: 0;
padding-top: 1em;
margin: 0;
background: #23282d url(texture.png);
min-height: 100%;
min-height: calc(100% - 41px); /* #top 40px + border 1px */
box-sizing: border-box;
@ -817,6 +832,7 @@ ul#sidepage-menu li a {
#sidepage ul#sidepage-menu .active a {
color: #eee;
filter: none;
}
#sidepage ul#sidepage-menu li.active,