nishiki/hugo-theme-relearn
1
0
Fork 0
mirror of https://github.com/McShelby/hugo-theme-relearn.git synced 2024-11-23 15:57:57 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

variant: neon with glowing color boxes

Browse source
This commit is contained in:
Sören Weber 2022-02-23 10:56:17 +01:00
parent c48d564776
commit d5e2798fa2
No known key found for this signature in database
GPG key ID: 07D17FF580AE7589
2 changed files with 47 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
static/css/theme-neon.css
View file

@ -151,17 +151,6 @@ body h6 {
0 0 10px var(--INTERNAL-MAIN-TITLES-H5-color); 0 0 10px var(--INTERNAL-MAIN-TITLES-H5-color);
} }
body div.box.transparent > .box-label {
color: #fff;
text-shadow:
0 0 1px #fff,
0 0 2px #fff,
0 0 8px #808080,
0 0 4px var(--INTERNAL-MAIN-TITLES-TEXT-color),
0 0 8px var(--INTERNAL-MAIN-TITLES-TEXT-color),
0 0 10px var(--INTERNAL-MAIN-TITLES-TEXT-color);
}
body #sidebar ul li.active > a { body #sidebar ul li.active > a {
color: #fff; color: #fff;
text-shadow: text-shadow:
@ -186,3 +175,26 @@ body #sidebar a:hover {
body .anchor { body .anchor {
text-shadow: none; text-shadow: none;
} }
body div.box {
box-shadow:
0 0 1px #fff,
0 0 2px #fff,
0 0 4px #808080,
0 0 4px var(--VARIABLE-BOX-color),
0 0 8px var(--VARIABLE-BOX-color);
}
body div.box > .box-label {
text-shadow:
0 0 1px #fff,
0 0 2px #fff,
0 0 4px #808080,
0 0 4px var(--VARIABLE-BOX-CAPTION-color),
0 0 8px var(--VARIABLE-BOX-CAPTION-color);
}
body div.box.transparent {
box-shadow: none;
}

24
static/css/theme.css
View file

@ -450,6 +450,9 @@ blockquote cite {
/* colored boxes */ /* colored boxes */
div.box { div.box {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NEUTRAL-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color);
--VARIABLE-BOX-CAPTION-color: var(--INTERNAL-BOX-CAPTION-color);
background-color: #808080; /* var(--INTERNAL-BOX-NEUTRAL-color) */ background-color: #808080; /* var(--INTERNAL-BOX-NEUTRAL-color) */
-webkit-print-color-adjust: exact; -webkit-print-color-adjust: exact;
color-adjust: exact; color-adjust: exact;
@ -486,6 +489,8 @@ div.box > .box-content > :last-child {
} }
div.box.info { div.box.info {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-INFO-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-INFO-TEXT-color);
background-color: rgba( 48, 117, 229, 1 ); /* var(--INTERNAL-BOX-INFO-color) */ background-color: rgba( 48, 117, 229, 1 ); /* var(--INTERNAL-BOX-INFO-color) */
} }
@ -500,6 +505,8 @@ div.box.info > .box-content {
} }
div.box.warning { div.box.warning {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-WARNING-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-WARNING-TEXT-color);
background-color: rgba( 224, 62, 62, 1 ); /* var(--INTERNAL-BOX-WARNING-color) */ background-color: rgba( 224, 62, 62, 1 ); /* var(--INTERNAL-BOX-WARNING-color) */
} }
@ -514,6 +521,8 @@ div.box.warning > .box-content {
} }
div.box.note { div.box.note {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NOTE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NOTE-TEXT-color);
background-color: rgba( 237, 153, 9, 1 ); /* var(--INTERNAL-BOX-NOTE-color) */ background-color: rgba( 237, 153, 9, 1 ); /* var(--INTERNAL-BOX-NOTE-color) */
} }
@ -528,6 +537,8 @@ div.box.note > .box-content {
} }
div.box.tip { div.box.tip {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-TIP-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-TIP-TEXT-color);
background-color: rgba( 42, 178, 24, 1 ); /* var(--INTERNAL-BOX-TIP-color) */ background-color: rgba( 42, 178, 24, 1 ); /* var(--INTERNAL-BOX-TIP-color) */
} }
@ -542,6 +553,8 @@ div.box.tip > .box-content {
} }
div.box.blue { div.box.blue {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-BLUE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-BLUE-TEXT-color);
background-color: rgba( 48, 117, 229, 1 ); /* var(--INTERNAL-BOX-BLUE-color) */ background-color: rgba( 48, 117, 229, 1 ); /* var(--INTERNAL-BOX-BLUE-color) */
} }
@ -550,6 +563,8 @@ div.box.blue > .box-content {
} }
div.box.green { div.box.green {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-GREEN-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-GREEN-TEXT-color);
background-color: rgba( 42, 178, 24, 1 ); /* var(--INTERNAL-BOX-GREEN-color) */ background-color: rgba( 42, 178, 24, 1 ); /* var(--INTERNAL-BOX-GREEN-color) */
} }
@ -558,6 +573,8 @@ div.box.green > .box-content {
} }
div.box.grey { div.box.grey {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-GREY-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-GREY-TEXT-color);
background-color: #808080; /* var(--INTERNAL-BOX-GREY-color) */ background-color: #808080; /* var(--INTERNAL-BOX-GREY-color) */
} }
@ -566,6 +583,8 @@ div.box.grey > .box-content {
} }
div.box.orange { div.box.orange {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-ORANGE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-WARNING-ORANGE-color);
background-color: rgba( 237, 153, 9, 1 ); /* var(--INTERNAL-BOX-ORANGE-color) */ background-color: rgba( 237, 153, 9, 1 ); /* var(--INTERNAL-BOX-ORANGE-color) */
} }
@ -574,6 +593,8 @@ div.box.orange > .box-content {
} }
div.box.red { div.box.red {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-RED-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-RED-TEXT-color);
background-color: rgba( 224, 62, 62, 1 ); /* var(--INTERNAL-BOX-RED-color) */ background-color: rgba( 224, 62, 62, 1 ); /* var(--INTERNAL-BOX-RED-color) */
} }
@ -582,6 +603,9 @@ div.box.red > .box-content {
} }
div.box.transparent { div.box.transparent {
--VARIABLE-BOX-color: transparent;
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-MAIN-TEXT-color);
--VARIABLE-BOX-CAPTION-color: var(--INTERNAL-MAIN-TITLES-TEXT-color);
background-color: transparent; background-color: transparent;
} }