re style, 1st draft
This commit is contained in:
parent
b5aaa4a987
commit
6edb61b464
|
@ -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,
|
||||
|
|
Loading…
Reference in New Issue