[UI] Left panel theme now looks like it should

This commit is contained in:
rainydaysavings 2020-08-14 02:50:58 +01:00 committed by Hugo Sales
parent 8fe12f48b5
commit e9a0528275
Signed by: someonewithpc
GPG Key ID: 7D0C7EAFC9D835A0
6 changed files with 22 additions and 30 deletions

View File

@ -4,7 +4,7 @@
width: var(--nav-size); width: var(--nav-size);
height: calc(100vh - (3 * var(--unit-size))); height: calc(100vh - (3 * var(--unit-size)));
position: fixed; position: fixed;
background-color: rgba(0, 0, 0, 0.40); background-color: var(--bg5);
margin-top: calc(3 * var(--main-size)); margin-top: calc(3 * var(--main-size));
} }
.navbar .left-nav { .navbar .left-nav {
@ -31,7 +31,7 @@
} }
.navbar a { .navbar a {
display: block; display: block;
color: #91B9D0; color: var(--accent);
font-size: var(--medium-size); font-size: var(--medium-size);
} }
.navbar .left-nav a { .navbar .left-nav a {
@ -44,11 +44,11 @@
margin-top: var(--unit-size); margin-top: var(--unit-size);
} }
.navbar a:hover { .navbar a:hover {
color: #F6F6F6; color: var(--fg);
transition: all 0.8s ease; transition: all 0.8s ease;
} }
.navbar a:focus { .navbar a:focus {
color: #F6F6F6; color: var(--fg);
transition: all 0.8s ease; transition: all 0.8s ease;
} }
@ -71,7 +71,7 @@
.profile { .profile {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
background-color: rgba(0, 0, 0, 0.20); background-color: var(--bg4);
padding: var(--unit-size); padding: var(--unit-size);
font-size: var(--small-size); font-size: var(--small-size);
margin-bottom: var(--unit-size); margin-bottom: var(--unit-size);
@ -104,7 +104,7 @@
} }
.info .tags i { .info .tags i {
color: #91B9D0; color: var(--accent);
} }
.info .tags i:last-child { .info .tags i:last-child {

View File

@ -4,11 +4,7 @@
width: var(--nav-size); width: var(--nav-size);
height: calc(100vh - (3 * var(--unit-size))); height: calc(100vh - (3 * var(--unit-size)));
position: fixed; position: fixed;
background: rgb(51,61,71); background: var(--bg1);
background: -moz-linear-gradient(80deg, rgba(51,61,71,1) 0%, rgba(39,46,54,1) 90%);
background: -webkit-linear-gradient(80deg, rgba(51,61,71,1) 0%, rgba(39,46,54,1) 90%);
background: linear-gradient(80deg, rgba(51,61,71,1) 0%, rgba(39,46,54,1) 90%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#333d47",endColorstr="#272e36",GradientType=1);
margin-top: calc(3 * var(--main-size)); margin-top: calc(3 * var(--main-size));
} }
.navbar .left-nav { .navbar .left-nav {
@ -35,7 +31,7 @@
} }
.navbar a { .navbar a {
display: block; display: block;
color: #91B9D0; color: var(--accent);
font-size: var(--medium-size); font-size: var(--medium-size);
} }
.navbar .left-nav a { .navbar .left-nav a {
@ -48,11 +44,11 @@
margin-top: var(--unit-size); margin-top: var(--unit-size);
} }
.navbar a:hover { .navbar a:hover {
color: #F6F6F6; color: var(--fg);
transition: all 0.8s ease; transition: all 0.8s ease;
} }
.navbar a:focus { .navbar a:focus {
color: #F6F6F6; color: var(--fg);
transition: all 0.8s ease; transition: all 0.8s ease;
} }
@ -84,7 +80,7 @@
.profile { .profile {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
background-color: rgba(0, 0, 0, 0.20); background-color: var(--bg2);
padding: var(--unit-size); padding: var(--unit-size);
font-size: var(--small-size); font-size: var(--small-size);
margin-bottom: var(--unit-size); margin-bottom: var(--unit-size);
@ -117,7 +113,7 @@
} }
.info .tags i { .info .tags i {
color: #91B9D0; color: var(--accent);
} }
.info .tags i:last-child { .info .tags i:last-child {

View File

@ -4,11 +4,7 @@
width: var(--nav-size); width: var(--nav-size);
height: calc(100vh - (3 * var(--unit-size))); height: calc(100vh - (3 * var(--unit-size)));
position: fixed; position: fixed;
background: rgb(51,61,71); background: var(--bg1);
background: -moz-linear-gradient(80deg, rgba(51,61,71,1) 0%, rgba(39,46,54,1) 90%);
background: -webkit-linear-gradient(80deg, rgba(51,61,71,1) 0%, rgba(39,46,54,1) 90%);
background: linear-gradient(80deg, rgba(51,61,71,1) 0%, rgba(39,46,54,1) 90%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#333d47",endColorstr="#272e36",GradientType=1);
margin-top: calc(3 * var(--main-size)); margin-top: calc(3 * var(--main-size));
} }
.navbar .left-nav { .navbar .left-nav {
@ -35,7 +31,7 @@
} }
.navbar a { .navbar a {
display: block; display: block;
color: #91B9D0; color: var(--accent);
font-size: var(--medium-size); font-size: var(--medium-size);
} }
.navbar .left-nav a { .navbar .left-nav a {
@ -48,11 +44,11 @@
margin-top: var(--unit-size); margin-top: var(--unit-size);
} }
.navbar a:hover { .navbar a:hover {
color: #F6F6F6; color: var(--fg);
transition: all 0.8s ease; transition: all 0.8s ease;
} }
.navbar a:focus { .navbar a:focus {
color: #F6F6F6; color: var(--fg);
transition: all 0.8s ease; transition: all 0.8s ease;
} }
@ -84,7 +80,7 @@
.profile { .profile {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
background-color: rgba(0, 0, 0, 0.20); background-color: var(--bg2);
padding: var(--unit-size); padding: var(--unit-size);
font-size: var(--small-size); font-size: var(--small-size);
margin-bottom: var(--unit-size); margin-bottom: var(--unit-size);
@ -117,7 +113,7 @@
} }
.info .tags i { .info .tags i {
color: #91B9D0; color: var(--accent);
} }
.info .tags i:last-child { .info .tags i:last-child {

View File

@ -12,7 +12,7 @@
.set-nav { .set-nav {
order: 1; order: 1;
display: flex; display: flex;
justify-content: space-between; justify-content: space-evenly;
flex-wrap: wrap; flex-wrap: wrap;
width: 100%; width: 100%;
background-color: var(--bg5); background-color: var(--bg5);

View File

@ -12,7 +12,7 @@
.set-nav { .set-nav {
order: 1; order: 1;
display: flex; display: flex;
justify-content: space-between; justify-content: space-evenly;
flex-wrap: wrap; flex-wrap: wrap;
width: 100%; width: 100%;
background-color: var(--bg5); background-color: var(--bg5);
@ -24,7 +24,7 @@
.set-nav ul { .set-nav ul {
display: flex; display: flex;
align-items: stretch; align-items: stretch;
justify-content: space-evenly; justify-content: space-around;
width: 100%; width: 100%;
margin-left: var(--side-margin); margin-left: var(--side-margin);
margin-right: var(--side-margin); margin-right: var(--side-margin);

View File

@ -24,7 +24,7 @@
.set-nav ul { .set-nav ul {
display: flex; display: flex;
align-items: stretch; align-items: stretch;
justify-content: space-evenly; justify-content: space-around;
width: 100%; width: 100%;
margin-left: var(--side-margin); margin-left: var(--side-margin);
margin-right: var(--side-margin); margin-right: var(--side-margin);