mirror of
https://github.com/McShelby/hugo-theme-relearn.git
synced 2024-11-23 07:47:54 +00:00
variant: neon with glowing color boxes
This commit is contained in:
parent
c48d564776
commit
d5e2798fa2
2 changed files with 47 additions and 11 deletions
|
@ -151,17 +151,6 @@ body h6 {
|
|||
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 {
|
||||
color: #fff;
|
||||
text-shadow:
|
||||
|
@ -186,3 +175,26 @@ body #sidebar a:hover {
|
|||
body .anchor {
|
||||
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;
|
||||
}
|
||||
|
||||
|
|
|
@ -450,6 +450,9 @@ blockquote cite {
|
|||
/* colored boxes */
|
||||
|
||||
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) */
|
||||
-webkit-print-color-adjust: exact;
|
||||
color-adjust: exact;
|
||||
|
@ -486,6 +489,8 @@ div.box > .box-content > :last-child {
|
|||
}
|
||||
|
||||
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) */
|
||||
}
|
||||
|
||||
|
@ -500,6 +505,8 @@ div.box.info > .box-content {
|
|||
}
|
||||
|
||||
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) */
|
||||
}
|
||||
|
||||
|
@ -514,6 +521,8 @@ div.box.warning > .box-content {
|
|||
}
|
||||
|
||||
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) */
|
||||
}
|
||||
|
||||
|
@ -528,6 +537,8 @@ div.box.note > .box-content {
|
|||
}
|
||||
|
||||
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) */
|
||||
}
|
||||
|
||||
|
@ -542,6 +553,8 @@ div.box.tip > .box-content {
|
|||
}
|
||||
|
||||
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) */
|
||||
}
|
||||
|
||||
|
@ -550,6 +563,8 @@ div.box.blue > .box-content {
|
|||
}
|
||||
|
||||
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) */
|
||||
}
|
||||
|
||||
|
@ -558,6 +573,8 @@ div.box.green > .box-content {
|
|||
}
|
||||
|
||||
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) */
|
||||
}
|
||||
|
||||
|
@ -566,6 +583,8 @@ div.box.grey > .box-content {
|
|||
}
|
||||
|
||||
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) */
|
||||
}
|
||||
|
||||
|
@ -574,6 +593,8 @@ div.box.orange > .box-content {
|
|||
}
|
||||
|
||||
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) */
|
||||
}
|
||||
|
||||
|
@ -582,6 +603,9 @@ div.box.red > .box-content {
|
|||
}
|
||||
|
||||
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;
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue