nishiki/hugo-theme-relearn
1
0
Fork 0
mirror of https://github.com/McShelby/hugo-theme-relearn.git synced 2024-10-27 10:43:19 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

boxes: use introduces --VARIABLE-BOX-* variables

Browse source
This commit is contained in:
Sören Weber 2022-05-29 09:38:16 +02:00
parent 141ec1578c
commit 68b0ccfcf6
No known key found for this signature in database
GPG key ID: 07D17FF580AE7589
3 changed files with 38 additions and 132 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
static/css/ie.css
View file

@ -185,11 +185,16 @@
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-RED-TEXT-color) */
}
div.box.transparent {
background-color: transparent;
}
div.box.transparent > .box-label {
color: #4a4a4a; /* var(--MAIN-TITLES-TEXT-color) */
}
div.box.transparent > .box-content {
background-color: transparent;
color: #101010; /* var(--MAIN-TEXT-color) */
}

69
static/css/theme.css
View file

@ -457,8 +457,9 @@ blockquote cite {
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);
--VARIABLE-BOX-BG-color: var(--INTERNAL-BOX-BG-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color);
-webkit-print-color-adjust: exact;
color-adjust: exact;
margin: 1.5rem 0;
@ -484,72 +485,6 @@ div.box > .box-content > :last-child {
margin-bottom: 1rem;
}
div.box.info {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-INFO-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-INFO-TEXT-color);
}
div.box.warning {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-WARNING-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-WARNING-TEXT-color);
}
div.box.note {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NOTE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NOTE-TEXT-color);
}
div.box.tip {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-TIP-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-TIP-TEXT-color);
}
div.box.primary {
--VARIABLE-BOX-color: var(--INTERNAL-PRIMARY-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-MAIN-TEXT-color);
}
div.box.secondary {
--VARIABLE-BOX-color: var(--INTERNAL-SECONDARY-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-MAIN-TEXT-color);
}
div.box.blue {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-BLUE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-BLUE-TEXT-color);
}
div.box.green {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-GREEN-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-GREEN-TEXT-color);
}
div.box.grey {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-GREY-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-GREY-TEXT-color);
}
div.box.orange {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-ORANGE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-WARNING-ORANGE-color);
}
div.box.red {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-RED-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-RED-TEXT-color);
}
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;
}
div.box.transparent > .box-content {
background-color: transparent;
}
/* attachments shortcode */
div.attachments .box-content {

96
static/css/variant.css
View file

@ -194,112 +194,78 @@ h6 {
}
div.box {
background-color: var(--INTERNAL-BOX-NEUTRAL-color);
background-color: var(--VARIABLE-BOX-color);
}
div.box > .box-label {
color: var(--INTERNAL-BOX-CAPTION-color);
color: var(--VARIABLE-BOX-CAPTION-color);
}
div.box > .box-content {
background-color: var(--INTERNAL-BOX-BG-color);
color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color);
background-color: var(--VARIABLE-BOX-BG-color);
color: var(--VARIABLE-BOX-TEXT-color);
}
div.box.info {
background-color: var(--INTERNAL-BOX-INFO-color);
}
div.box.info > .box-content {
color: var(--INTERNAL-BOX-INFO-TEXT-color);
--VARIABLE-BOX-color: var(--INTERNAL-BOX-INFO-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-INFO-TEXT-color);
}
div.box.warning {
background-color: var(--INTERNAL-BOX-WARNING-color);
}
div.box.warning > .box-content {
color: var(--INTERNAL-BOX-WARNING-TEXT-color);
--VARIABLE-BOX-color: var(--INTERNAL-BOX-WARNING-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-WARNING-TEXT-color);
}
div.box.note {
background-color: var(--INTERNAL-BOX-NOTE-color);
}
div.box.note > .box-content {
color: var(--INTERNAL-BOX-NOTE-TEXT-color);
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NOTE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NOTE-TEXT-color);
}
div.box.tip {
background-color: var(--INTERNAL-BOX-TIP-color);
}
div.box.tip > .box-content {
color: var(--INTERNAL-BOX-TIP-TEXT-color);
--VARIABLE-BOX-color: var(--INTERNAL-BOX-TIP-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-TIP-TEXT-color);
}
div.box.primary {
background-color: var(--INTERNAL-PRIMARY-color);
}
div.box.primary > .box-content {
color: var(--INTERNAL-MAIN-TEXT-color);
--VARIABLE-BOX-color: var(--INTERNAL-PRIMARY-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-MAIN-TEXT-color);
}
div.box.secondary {
background-color: var(--INTERNAL-SECONDARY-color);
}
div.box.secondary > .box-content {
color: var(--INTERNAL-MAIN-TEXT-color);
--VARIABLE-BOX-color: var(--INTERNAL-SECONDARY-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-MAIN-TEXT-color);
}
div.box.blue {
background-color: var(--INTERNAL-BOX-BLUE-color);
}
div.box.blue > .box-content {
color: var(--INTERNAL-BOX-BLUE-TEXT-color);
--VARIABLE-BOX-color: var(--INTERNAL-BOX-BLUE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-BLUE-TEXT-color);
}
div.box.green {
background-color: var(--INTERNAL-BOX-GREEN-color);
}
div.box.green > .box-content {
color: var(--INTERNAL-BOX-GREEN-TEXT-color);
--VARIABLE-BOX-color: var(--INTERNAL-BOX-GREEN-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-GREEN-TEXT-color);
}
div.box.grey {
background-color: var(--INTERNAL-BOX-GREY-color);
}
div.box.grey > .box-content {
color: var(--INTERNAL-BOX-GREY-TEXT-color);
--VARIABLE-BOX-color: var(--INTERNAL-BOX-GREY-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-GREY-TEXT-color);
}
div.box.orange {
background-color: var(--INTERNAL-BOX-ORANGE-color);
}
div.box.orange > .box-content {
color: var(--INTERNAL-BOX-ORANGE-TEXT-color);
--VARIABLE-BOX-color: var(--INTERNAL-BOX-ORANGE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-WARNING-ORANGE-color);
}
div.box.red {
background-color: var(--INTERNAL-BOX-RED-color);
--VARIABLE-BOX-color: var(--INTERNAL-BOX-RED-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-RED-TEXT-color);
}
div.box.red > .box-content {
color: var(--INTERNAL-BOX-RED-TEXT-color);
}
div.box.transparent > .box-label {
color: var(--INTERNAL-MAIN-TITLES-TEXT-color);
}
div.box.transparent > .box-content {
color: var(--INTERNAL-MAIN-TEXT-color);
div.box.transparent {
--VARIABLE-BOX-color: transparent;
--VARIABLE-BOX-CAPTION-color: var(--INTERNAL-MAIN-TITLES-TEXT-color);
--VARIABLE-BOX-BG-color: transparent;
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-MAIN-TEXT-color);
}
code,