🎨 Refactor of stylesheets, making way for new changes

This commit is contained in:
Alicia Sykes 2021-06-20 16:59:43 +01:00
parent 01af5fb5b4
commit 77bf770c02
4 changed files with 32 additions and 19 deletions

View File

@ -26,6 +26,7 @@ html[data-theme='thebe'] {
html[data-theme='dracula'] {
--font-headings: 'Allerta Stencil', sans-serif;
--primary: #6272a4;
--background: #44475a;
--background-darker: #282a36;
--item-group-background: #282a36;
@ -34,7 +35,7 @@ html[data-theme='dracula'] {
--item-shadow: none;
--item-hover-shadow: none;
--settings-text-color: #98ace9;
--primary: #6272a4;
--config-settings-color: #98ace9;
.collapsable:nth-child(1n) { background: #8be9fd; .item { border: 1px solid #8be9fd; color: #8be9fd; }}
.collapsable:nth-child(2n) { background: #50fa7b; .item { border: 1px solid #50fa7b; color: #50fa7b; }}
.collapsable:nth-child(3n) { background: #ffb86c; .item { border: 1px solid #ffb86c; color: #ffb86c; }}

View File

@ -4,6 +4,7 @@
--outline-color: none;
--curve-factor: 5px; // Border radius for most components
--curve-factor-navbar: 16px; // Border radius for header
--curve-factor-small: 2px; // Subtle border radius for util components
--dimming-factor: 0.7; // Opacity for semi-transparent components
/* Basic Page Components */

View File

@ -13,3 +13,32 @@ html {
cursor: pointer;
}
}
/* Overriding styles for the modal component */
.vm--modal, .dashy-modal {
box-shadow: 0 40px 70px -2px hsl(0deg 0% 0% / 60%), 1px 1px 6px var(--primary) !important;
min-width: 300px;
min-height: 500px;
}
.vm--overlay {
background: #00000080;
}
/* Overiding styles for the global toast component */
.toast-message {
background: var(--toast-background) !important;
color: var(--toast-color) !important;
border: 1px solid var(--toast-color) !important;
border-radius: var(--curve-factor) !important;
font-size: 1.25rem !important;
}
.toast-error {
background: var(--danger) !important;
color: var(--white) !important;
font-size: 1.25rem !important;
}
.toast-success {
background: var(--success) !important;
color: var(--white) !important;
font-size: 1.25rem !important;
}

View File

@ -37,21 +37,3 @@
.horizontal-center { margin: 0 auto; }
.border-box { box-sizing: border-box; }
/* Overiding styles for the global toast component */
.toast-message {
background: var(--toast-background) !important;
color: var(--toast-color) !important;
border: 1px solid var(--toast-color) !important;
border-radius: var(--curve-factor) !important;
font-size: 1.25rem !important;
}
.toast-error {
background: var(--danger) !important;
color: var(--white) !important;
font-size: 1.25rem !important;
}
.toast-success {
background: var(--success) !important;
color: var(--white) !important;
font-size: 1.25rem !important;
}