Styling fixes
This commit is contained in:
Ruud committed
1 parent
f467d1c4f7
commit
9e3f978677
14 files changed
+387
-335
No files matched your search
@@ -178,13 +178,10 @@ body > .spinner, .mask{
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
z-index: 5;
|
||||
background: #4e5969;
|
||||
background: #5c697b;
|
||||
box-shadow: 0 0 10px rgba(0,0,0,.1);
|
||||
transition: all .4s ease-in-out;
|
||||
}
|
||||
.header.with_shadow {
|
||||
background-color: #46505e;
|
||||
}
|
||||
|
||||
@media all and (max-width: 480px) {
|
||||
.header {
|
||||
@@ -315,7 +312,7 @@ body > .spinner, .mask{
|
||||
}
|
||||
|
||||
.menu_shown body {
|
||||
left: 160px;
|
||||
left: 240px;
|
||||
}
|
||||
|
||||
.header .navigation {
|
||||
@@ -327,13 +324,13 @@ body > .spinner, .mask{
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 160px;
|
||||
left: 240px;
|
||||
}
|
||||
|
||||
.header .navigation ul {
|
||||
width: 160px;
|
||||
width: 240px;
|
||||
position: fixed;
|
||||
left: -160px;
|
||||
left: -240px;
|
||||
background: rgba(0,0,0,.5);
|
||||
transition: all .5s cubic-bezier(0.9,0,0.1,1);
|
||||
}
|
||||
@@ -374,26 +371,15 @@ body > .spinner, .mask{
|
||||
|
||||
.header .more_menu .button {
|
||||
height: 100%;
|
||||
width: 44px;
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
border-radius: 0;
|
||||
background: none;
|
||||
line-height: 66px;
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
border: 1px solid transparent;
|
||||
border-width: 0 0 4px;
|
||||
}
|
||||
.header .more_menu .button:hover {
|
||||
background: none;
|
||||
border-color: #047792;
|
||||
}
|
||||
|
||||
.header .more_menu .wrapper {
|
||||
width: 150px;
|
||||
width: 200px;
|
||||
margin-left: -106px;
|
||||
margin-top: 66px;
|
||||
margin-top: 22px;
|
||||
}
|
||||
|
||||
@media all and (max-width: 480px) {
|
||||
@@ -402,7 +388,7 @@ body > .spinner, .mask{
|
||||
}
|
||||
|
||||
.header .more_menu .wrapper {
|
||||
margin-top: 44px;
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -439,12 +425,10 @@ body > .spinner, .mask{
|
||||
}
|
||||
|
||||
.header .notification_menu ul {
|
||||
min-height: 80px;
|
||||
max-height: 300px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.header .notification_menu > a {
|
||||
background-position: center -209px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.header .notification_menu li > span {
|
||||
@@ -491,6 +475,7 @@ body > .spinner, .mask{
|
||||
width: 16px;
|
||||
cursor: pointer;
|
||||
background: url('../images/sprite.png') no-repeat -200px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
.check.highlighted { background-color: #424c59; }
|
||||
.check.checked { background-position: -2px 0; }
|
||||
@@ -566,15 +551,14 @@ body > .spinner, .mask{
|
||||
.inlay {
|
||||
color: #fff;
|
||||
border: 0;
|
||||
border-radius:3px;
|
||||
background-color: #282d34;
|
||||
box-shadow: inset 0 1px 8px rgba(0,0,0,0.25), 0 1px 0px rgba(255,255,255,0.25);
|
||||
box-shadow: inset 0 1px 8px rgba(0,0,0,0.25);
|
||||
}
|
||||
|
||||
.inlay.light {
|
||||
background-color: #47515f;
|
||||
outline: none;
|
||||
box-shadow: inset 0 1px 8px rgba(0,0,0,0.05), 0 1px 0px rgba(255,255,255,0.15);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.inlay:focus {
|
||||
@@ -585,7 +569,7 @@ body > .spinner, .mask{
|
||||
.onlay, .inlay .selected, .inlay:not(.reversed) > li:hover, .inlay > li.active, .inlay.reversed > li {
|
||||
border-radius:3px;
|
||||
border: 1px solid #252930;
|
||||
box-shadow: inset 0 1px 0px rgba(255,255,255,0.20), 0 0 3px rgba(0,0,0, 0.2);
|
||||
box-shadow: inset 0 1px 0px rgba(255,255,255,0.20);
|
||||
background: rgb(55,62,74);
|
||||
background-image: linear-gradient(
|
||||
0,
|
||||
@@ -597,7 +581,7 @@ body > .spinner, .mask{
|
||||
color: #fff;
|
||||
border: 1px solid transparent;
|
||||
background-color: #282d34;
|
||||
box-shadow: inset 0 1px 8px rgba(0,0,0,0.25), 0 1px 0px rgba(255,255,255,0.25);
|
||||
box-shadow: inset 0 1px 8px rgba(0,0,0,0.25);
|
||||
}
|
||||
|
||||
.question {
|
||||
@@ -648,38 +632,37 @@ body > .spinner, .mask{
|
||||
|
||||
.more_menu > a {
|
||||
display: block;
|
||||
background: url('../images/sprite.png') no-repeat center -137px;
|
||||
height: 25px;
|
||||
width: 25px;
|
||||
border: 1px solid rgba(0,0,0,0.3);
|
||||
height: 44px;
|
||||
width: 44px;
|
||||
transition: all 0.3s ease-in-out;
|
||||
border-bottom: 4px solid transparent;
|
||||
border-radius: 0;
|
||||
}
|
||||
.more_menu.show > a:not(:active), .more_menu > a:hover:not(:active) {
|
||||
background-color: #406db8;
|
||||
|
||||
.more_menu .button:hover {
|
||||
border-color: #047792;
|
||||
}
|
||||
|
||||
.more_menu.show .button {
|
||||
border-color: #04bce6;
|
||||
}
|
||||
|
||||
.more_menu .wrapper {
|
||||
display: none;
|
||||
background: rgba(255,255,255,0.98);
|
||||
top: 0;
|
||||
right: 0;
|
||||
padding: 4px;
|
||||
margin: 26px 0 0 0;
|
||||
margin: 11px 0 0 0;
|
||||
position: absolute;
|
||||
z-index: 90;
|
||||
width: 185px;
|
||||
box-shadow: 0 20px 20px -5px rgba(0,0,0,0.1);
|
||||
text-align: center;
|
||||
color: #000;
|
||||
background-image: linear-gradient(
|
||||
-45deg,
|
||||
rgb(200,200,200) 0%,
|
||||
rgb(255,255,255) 100%
|
||||
);
|
||||
box-shadow: 0 20px 20px -10px rgba(0,0,0,0.55);
|
||||
color: #444;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.more_menu.show .wrapper {
|
||||
display: block;
|
||||
top: 44px;
|
||||
}
|
||||
|
||||
.more_menu ul {
|
||||
@@ -698,11 +681,19 @@ body > .spinner, .mask{
|
||||
border-bottom: 1px solid rgba(255,255,255,0.2);
|
||||
box-shadow: none;
|
||||
font-weight: normal;
|
||||
font-size: 11px;
|
||||
text-transform: uppercase;
|
||||
font-size: 1.2em;
|
||||
letter-spacing: 1px;
|
||||
padding: 3px 0;
|
||||
color: #000;
|
||||
padding: 2px 10px;
|
||||
color: #444;
|
||||
}
|
||||
.more_menu .wrapper li:first-child a { padding-top: 5px; }
|
||||
.more_menu .wrapper li:last-child a { padding-bottom: 5px; }
|
||||
|
||||
.more_menu .wrapper li .separator {
|
||||
border-bottom: 1px solid rgba(0,0,0,.1);
|
||||
display: block;
|
||||
height: 1;
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
.more_menu .wrapper li:last-child a {
|
||||
|
||||
Reference in new issue
Block a user