13hannes11/hugo-coder-timeline
1
0
Fork 0
mirror of https://github.com/13hannes11/hugo-coder-timeline.git synced 2024-09-04 00:50:58 +02:00
Code Issues Projects Releases Wiki Activity

Add inverted variables option (#110)

Browse Source 
* add inverted variables option

* create inverted styles

* add missed styles

* add myself as contributor
This commit is contained in:
Abner Campanha
2018-11-12 09:42:52 -02:00
committed by Luiz F. A. de Prá
parent 55c424f4d1
commit 720f7518a6
9 changed files with 156 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
assets/scss/_base_inverted.scss Normal file
View File

@@ -0,0 +1,39 @@
body.inverted {
color: $fg-color-inverted;
background-color: $bg-color-inverted;
a {
color: $link-color-inverted;
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: $alt-fg-color-inverted;
}
code {
background-color: $alt-bg-color-inverted;
color: $fg-color-inverted;
}
pre {
code {
background-color: inherit;
color: inherit;
}
}
blockquote {
border-left: 2px solid $alt-bg-color-inverted;
}
table td, table th {
border: 2px solid $alt-fg-color-inverted;
}
}

36
assets/scss/_content_inverted.scss Normal file
View File

@@ -0,0 +1,36 @@
body.inverted {
.content {
.list {
ul {
li {
a {
color: $fg-color-inverted;
&:hover,
&:focus {
color: $link-color-inverted
}
}
}
}
}
.centered {
.about {
ul {
li {
a {
color: $fg-color-inverted;
&:hover,
&:focus {
color: $link-color-inverted;
}
}
}
}
}
}
}
}

7
assets/scss/_footer_inverted.scss Normal file
View File

@@ -0,0 +1,7 @@
body.inverted {
.footer {
a {
color: $link-color-inverted;
}
}
}

45
assets/scss/_navigation_inverted.scss Normal file
View File

@@ -0,0 +1,45 @@
body.inverted {
.navigation {
a, span {
color: $fg-color-inverted;
}
a {
&:hover,
&:focus {
color: $link-color-inverted;
}
}
.navigation-list {
@media only screen and (max-device-width : 768px) {
background-color: $bg-color-inverted;
border-top: solid 2px $alt-bg-color-inverted;
border-bottom: solid 2px $alt-bg-color-inverted;
}
.menu-separator {
@media only screen and (max-device-width : 768px) {
border-top: 2px solid $fg-color-inverted;
}
}
}
#menu-toggle {
@media only screen and (max-device-width : 768px) {
&:checked + label {
color: $alt-bg-color-inverted;
}
}
}
.menu-button {
display: none;
@media only screen and (max-device-width : 768px) {
color: $fg-color-inverted;
&:hover,
&:focus {
color: $link-color-inverted;
}
}
}
}
}

7
assets/scss/_variables.scss
View File

@@ -9,3 +9,10 @@ $fg-color: #212121 !default;
$alt-bg-color: #E0E0E0 !default;
$alt-fg-color: #000 !default;
$link-color: #1565c0 !default;
// Colors inverted
$bg-color-inverted: #212121 !default;
$fg-color-inverted: #fafafa !default;
$alt-bg-color-inverted: #424242 !default;
$alt-fg-color-inverted: #fafafa !default;
$link-color-inverted: #f44336 !default;

5
assets/scss/coder-inverted.scss Normal file
View File

@@ -0,0 +1,5 @@
@import "variables";
@import "base_inverted";
@import "content_inverted";
@import "navigation_inverted";
@import "footer_inverted";