This commit is contained in:
McShelby 2022-12-01 00:38:08 +00:00
parent d90bf0d188
commit 272f927ec5
332 changed files with 11621 additions and 9084 deletions

View file

@ -54,6 +54,17 @@
margin-left: 1em;
}
.badge > .badge-title {
border-right: 0;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.badge.badge-with-title > .badge-content {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
/* set default colors as in variant.css for IE11 */
body {
background-color: #ffffff; /* var(--MAIN-BG-color) */
@ -481,6 +492,80 @@
border-bottom-color: #ffffff !important; /* var(--MAIN-BG-color) */
}
.badge > * {
border-color: rgba( 16, 16, 16, 1 ); /* var(--BOX-TEXT-color) */
}
.badge > .badge-title {
background-color: rgba( 16, 16, 16, 1 ); /* var(--BOX-TEXT-color) */
color: rgba( 255, 255, 255, .833 ); /* var(--BOX-BG-color) */
}
.badge > .badge-content {
background-color: rgba( 128, 128, 128, 1 ); /* var(--INTERNAL-BOX-NEUTRAL-color) */
color: rgba( 255, 255, 255, 1 ); /* var(--BOX-CAPTION-color) */
}
.badge.info > .badge-content {
background-color: rgba( 48, 117, 229, 1 ); /* var(--INTERNAL-BOX-INFO-color) */
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-INFO-TEXT-color) */
}
.badge.warning > .badge-content {
background-color: rgba( 224, 62, 62, 1 ); /* var(--INTERNAL-BOX-WARNING-color) */
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-WARNING-TEXT-color) */
}
.badge.note > .badge-content {
background-color: rgba( 237, 153, 9, 1 ); /* var(--INTERNAL-BOX-NOTE-color) */
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-NOTE-TEXT-color) */
}
.badge.tip > .badge-content {
background-color: rgba( 42, 178, 24, 1 ); /* var(--INTERNAL-BOX-TIP-color) */
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-TIP-TEXT-color) */
}
.badge.primary > .badge-content {
background-color: #7dc903; /* var(--INTERNAL-PRIMARY-color) */
color: #101010; /* var(--INTERNAL-MAIN-TEXT-color) */
}
.badge.secondary > .badge-content {
background-color: #486ac9; /* var(--INTERNAL-SECONDARY-color) */
color: #101010; /* var(--INTERNAL-MAIN-TEXT-color) */
}
.badge.blue > .badge-content {
background-color: rgba( 48, 117, 229, 1 ); /* var(--INTERNAL-BOX-BLUE-color) */
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-BLUE-TEXT-color) */
}
.badge.green > .badge-content {
background-color: rgba( 42, 178, 24, 1 ); /* var(--INTERNAL-BOX-GREEN-color) */
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-GREEN-TEXT-color) */
}
.badge.grey > .badge-content {
background-color: rgba( 128, 128, 128, 1 ); /* var(--INTERNAL-BOX-GREY-color) */
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-GREY-TEXT-color) */
}
.badge.orange > .badge-content {
background-color: rgba( 237, 153, 9, 1 ); /* var(--INTERNAL-BOX-ORANGE-color) */
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-ORANGE-TEXT-color) */
}
.badge.red > .badge-content {
background-color: rgba( 224, 62, 62, 1 ); /* var(--INTERNAL-BOX-RED-color) */
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-RED-TEXT-color) */
}
.badge.transparent > .badge-content {
background-color: transparent;
color: #4a4a4a; /* var(--MAIN-TITLES-TEXT-color) */
}
/* set further styles to fix broken stuff in IE11 */
/* turn off animiation in IE because this causes the menu

View file

@ -56,7 +56,7 @@
--BOX-BG-color: rgba( 20, 20, 20, 1 ); /* background color of colored boxes */
--BOX-TEXT-color: initial; /* text color of colored box content */
/* optional base colors for colored boxes as in attachments and notice shortcode */
/* optional base colors for colored boxes as in attachments, badges, buttons and notice shortcode */
--BOX-BLUE-color: rgba( 48, 117, 229, 1 ); /* background color of blue boxes */
--BOX-BLUE-TEXT-color: var( --BOX-BLUE-color ); /* text color of blue boxes */
--BOX-GREEN-color: rgba( 42, 178, 24, 1 ); /* background color of green boxes */
@ -223,6 +223,7 @@ body .anchor {
text-shadow: none;
}
body .badge,
body .btn,
body div.box {
box-shadow:
@ -232,6 +233,7 @@ body div.box {
0 0 4px var(--VARIABLE-BOX-color);
}
body .badge > .badge-content,
body .btn,
body .btn > *,
body div.box > .box-label {
@ -242,10 +244,12 @@ body div.box > .box-label {
0 0 4px var(--VARIABLE-BOX-CAPTION-color);
}
body .badge.cstyle:not(.transparent),
body .btn.cstyle {
--VARIABLE-BOX-TEXT-color: var(--VARIABLE-BOX-CAPTION-color);
}
body .badge.cstyle.transparent,
body .btn.cstyle.transparent {
--VARIABLE-BOX-BG-color: var(--INTERNAL-BOX-BG-color);
}

View file

@ -447,13 +447,16 @@ blockquote cite {
/* colored boxes */
div.box {
.cstyle {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NEUTRAL-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;
}
div.box {
margin: 1.5rem 0;
}
@ -1207,13 +1210,7 @@ option {
}
.btn {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NEUTRAL-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);
border-radius: 4px;
-webkit-print-color-adjust: exact;
color-adjust: exact;
cursor: pointer;
display: inline-block;
font-size: .9rem;
@ -1618,3 +1615,32 @@ input[type="search"]::-webkit-search-results-decoration { display: none; }
font-weight: 300;
margin-top: .66rem;
}
.badge {
border-radius: 3px;
display: inline-block;
font-size: 80%;
font-weight: 500;
vertical-align: middle;
}
.badge > * {
border-radius: 3px;
border-style: solid;
border-width: 1px;
display: inline-block;
padding: 0 .25rem
}
.badge > .badge-title {
border-inline-end: 0;
border-start-end-radius: 0;
border-end-end-radius: 0;
filter: contrast(2);
opacity: .75;
}
.badge.badge-with-title > .badge-content {
border-start-start-radius: 0;
border-end-start-radius: 0;
}

View file

@ -416,3 +416,21 @@ pre .copy-to-clipboard-button:hover {
background-color: var(--INTERNAL-MAIN-BG-color) !important;
border-bottom-color: var(--INTERNAL-MAIN-BG-color) !important;
}
.badge > * {
border-color: var(--VARIABLE-BOX-TEXT-color);
}
.badge > .badge-title {
background-color: var(--VARIABLE-BOX-TEXT-color);
color: var(--VARIABLE-BOX-BG-color);
}
.badge > .badge-content {
background-color: var(--VARIABLE-BOX-color);
color: var(--VARIABLE-BOX-CAPTION-color);
}
.badge.cstyle.transparent{
--VARIABLE-BOX-BG-color: var(--INTERNAL-BOX-BG-color);
}