Change style of Aside component

This commit is contained in:
Korbs 2024-12-12 18:46:07 -05:00
parent 3c9c62bca9
commit 060330a8a4
2 changed files with 15 additions and 10 deletions

View file

@ -1,7 +1,7 @@
{ {
"name": "butterflyvu", "name": "butterflyvu",
"type": "module", "type": "module",
"version": "0.1.61", "version": "0.1.62",
"license": "GPL-3.0-only", "license": "GPL-3.0-only",
"author": { "author": {
"name": "SudoVanilla" "name": "SudoVanilla"

View file

@ -245,36 +245,41 @@ header {
} }
.aside { .aside {
border-left: 6px transparent solid;
padding-left: 24px;
padding-top: 12px; padding-top: 12px;
padding-bottom: 12px; padding-bottom: 12px;
&#aside-Note { &#aside-Note {
color: var(--aside-note); color: var(--aside-note);
border-color: var(--aside-note); h2 {background: var(--aside-note);}
svg {stroke: var(--aside-note);} svg {stroke: var(--aside-note);}
} }
&#aside-Warning { &#aside-Warning {
color: var(--aside-warning); color: var(--aside-warning);
border-color: var(--aside-warning); h2 {background: var(--aside-warning);}
svg {stroke: var(--aside-warning);} svg {stroke: var(--aside-warning);}
} }
&#aside-Dangerous { &#aside-Dangerous {
color: var(--aside-dangerous); color: var(--aside-dangerous);
border-color: var(--aside-dangerous); h2 {background: var(--aside-dangerous);}
svg {stroke: var(--aside-dangerous);} svg {stroke: var(--aside-dangerous);}
} }
&#aside-Successful { &#aside-Successful {
color: var(--aside-successful); color: var(--aside-successful);
border-color: var(--aside-successful); h2 {background: var(--aside-successful); svg {stroke: rgb(0, 0, 0) !important;}}
svg {stroke: var(--aside-successful);} svg {stroke: var(--aside-successful);}
} }
h2 { h2 {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 12px; gap: 6px;
font-size: 24px; width: fit-content;
padding-bottom: 6px; border-radius: 3rem;
font-size: 12px;
padding: 4px 12px 4px 8px;
margin-bottom: 6px;
color: black;
svg {
width: 16px;
}
} }
* { * {
margin: 0px; margin: 0px;