dark/light mode transition

This commit is contained in:
2019-02-09 17:50:24 +03:00
parent f19e2c30f9
commit ee5ebc6905
2 changed files with 22 additions and 6 deletions

View File

@@ -3,6 +3,7 @@
display: flex;
flex-direction: column;
.separator {
transition: 0.3s;
margin: 2rem 0;
width: 100%;
border-bottom: 1px $light-gray1 dashed;
@@ -22,15 +23,13 @@
padding: 0rem;
overflow: hidden;
h4 {
transition: 0.3s;
padding: 1rem;
padding-bottom: 1.5rem;
border-bottom: 1px $light-gray2 solid;
box-shadow: 0 0 5px $light-gray3;
.bp3-dark {
box-shadow: 0 0 5px $dark-gray5;
}
}
.textPreview {
transition: 0.3s;
padding: 0.5rem;
color: $dark-gray5;
}
@@ -41,15 +40,17 @@
.bp3-dark {
#overview {
.separator {
transition: 0.3s;
border-bottom: 1px $dark-gray5 dashed;
}
.list {
.card {
h4 {
transition: 0.3s;
border-bottom: 1px $dark-gray2 solid;
box-shadow: 0 0 5px $dark-gray3;
}
.textPreview {
transition: 0.3s;
color: $light-gray1;
}
}

View File

@@ -15,8 +15,23 @@
max-height: 100%;
}
#mainContainer.bp3-dark {
#mainContainer {
transition: 0.3s;
#MainScreen {
transition: 0.3s;
}
.bp3-navbar {
transition: 0.3s;
}
}
#mainContainer.bp3-dark {
transition: 0.3s;
#MainScreen {
transition: 0.3s;
background: $dark-gray2;
}
.bp3-navbar {
transition: 0.3s;
}
}