themes initialized! many new partials and scss integrations across most templates; core.settings contains COMPRESS test fallback; apps.dashboard.views updated for new alerts and styling
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
This commit is contained in:
Disco DeDisco
129
src/static_src/scss/_base.scss
Normal file
129
src/static_src/scss/_base.scss
Normal file
@@ -0,0 +1,129 @@
|
||||
body {
|
||||
background-color: rgba(var(--priUser), 1);
|
||||
color: rgba(var(--secUser), 1);
|
||||
font-family: Georgia, serif;
|
||||
min-height: 100vh;
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
font-weight: 700;
|
||||
color: rgba(var(--terUser), 1);
|
||||
|
||||
&:hover {
|
||||
color: rgba(var(--ninUser), 1);
|
||||
text-shadow: 0 0 0.5rem rgba(var(--terUser), 1);
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
padding: 1rem;
|
||||
|
||||
.navbar {
|
||||
padding: 0.75rem 0;
|
||||
border-bottom: 0.1rem solid rgba(var(--secUser), 0.4);
|
||||
|
||||
.container-fluid {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
margin-right: auto;
|
||||
|
||||
h1 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-text,
|
||||
.navbar-link {
|
||||
color: rgba(var(--quaUser), 1);
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
}
|
||||
|
||||
.input-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
|
||||
.form-control {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.form-control {
|
||||
background-color: rgba(var(--priUser), 1);
|
||||
color: rgba(var(--secUser), 1);
|
||||
border: 0.1rem solid rgba(var(--secUser), 0.5);
|
||||
--_pad-v: 0.5rem;
|
||||
padding: var(--_pad-v) 0.75rem;
|
||||
border-radius: calc((var(--_pad-v) * 2 + 1em) / 3);
|
||||
width: 100%;
|
||||
font-family: inherit;
|
||||
|
||||
&.is-invalid {
|
||||
border-color: rgba(var(--priRd), 1);
|
||||
}
|
||||
|
||||
&.form-control-lg {
|
||||
--_pad-v: 0.75rem;
|
||||
padding: var(--_pad-v) 1rem;
|
||||
font-size: 1.125rem;
|
||||
}
|
||||
|
||||
&.is-invalid ~ .invalid-feedback {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.invalid-feedback {
|
||||
display: none;
|
||||
color: rgba(var(--priRd), 1);
|
||||
font-size: 0.875rem;
|
||||
margin-top: 0.25rem;
|
||||
}
|
||||
|
||||
.alert {
|
||||
padding: 0.75rem 1rem;
|
||||
margin: 0.75rem 0;
|
||||
border-radius: 0.5rem;
|
||||
border: 0.1rem solid rgba(var(--priYl), 0.5);
|
||||
color: rgba(var(--priYl), 1);
|
||||
|
||||
&.alert-success {
|
||||
border-color: rgba(var(--priGn), 0.5);
|
||||
color: rgba(var(--priGn), 1);
|
||||
}
|
||||
|
||||
&.alert-warning {
|
||||
border-color: rgba(var(--priOr), 0.5);
|
||||
color: rgba(var(--priOr), 1);
|
||||
}
|
||||
}
|
||||
|
||||
.row {
|
||||
padding: 2rem 0;
|
||||
|
||||
.col-md-12 {
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.col-lg-6 {
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
|
||||
h2 {
|
||||
font-size: 2.5rem;
|
||||
color: rgba(var(--quaUser), 1);
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
233
src/static_src/scss/_button-pad.scss
Normal file
233
src/static_src/scss/_button-pad.scss
Normal file
@@ -0,0 +1,233 @@
|
||||
.btn {
|
||||
min-width: 2rem;
|
||||
min-height: 2rem;
|
||||
text-shadow: 0 0 0.25rem rgba(0, 0, 0, 0.5);
|
||||
border: 0.15rem solid rgba(var(--priUser), 1);
|
||||
border-radius: 50%;
|
||||
font-weight: 700;
|
||||
font-size: 0.63rem;
|
||||
text-transform: uppercase;
|
||||
margin: 0.25rem;
|
||||
flex-shrink: 0;
|
||||
|
||||
&:hover,
|
||||
&:active {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&:active {
|
||||
font-size: 0.61rem;
|
||||
border: 0.18rem solid rgba(var(--priUser), 1);
|
||||
}
|
||||
|
||||
&.btn-cancel {
|
||||
color: rgba(var(--priOr), 1);
|
||||
border-color: rgba(var(--priOr), 1);
|
||||
background-color: rgba(var(--terOr), 1);
|
||||
box-shadow:
|
||||
0.1rem 0.1rem 0.12rem rgba(var(--terOr), 0.25),
|
||||
0.12rem 0.12rem 0.25rem rgba(0, 0, 0, 0.25),
|
||||
0.25rem 0.25rem 0.25rem rgba(var(--terOr), 0.12)
|
||||
;
|
||||
|
||||
&:hover {
|
||||
text-shadow:
|
||||
0.1rem 0.1rem 0.1rem rgba(0, 0, 0, 0.25),
|
||||
0 0 1rem rgba(var(--priOr), 1)
|
||||
;
|
||||
box-shadow:
|
||||
0.12rem 0.12rem 0.5rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.5rem rgba(var(--priOr), 0.12)
|
||||
;
|
||||
}
|
||||
|
||||
&:active {
|
||||
text-shadow:
|
||||
-0.1rem -0.1rem 0.25rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.12rem rgba(var(--priOr), 1)
|
||||
;
|
||||
box-shadow:
|
||||
-0.1rem -0.1rem 0.12rem rgba(var(--terOr), 0.25),
|
||||
-0.1rem -0.1rem 0.12rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.5rem rgba(var(--priOr), 0.12)
|
||||
;
|
||||
}
|
||||
}
|
||||
|
||||
&.btn-caution {
|
||||
color: rgba(var(--priYl), 1);
|
||||
border-color: rgba(var(--priYl), 1);
|
||||
background-color: rgba(var(--terYl), 1);
|
||||
box-shadow:
|
||||
0.1rem 0.1rem 0.12rem rgba(var(--terYl), 0.25),
|
||||
0.12rem 0.12rem 0.25rem rgba(0, 0, 0, 0.25),
|
||||
0.25rem 0.25rem 0.25rem rgba(var(--terYl), 0.12)
|
||||
;
|
||||
|
||||
&:hover {
|
||||
text-shadow:
|
||||
0.1rem 0.1rem 0.1rem rgba(0, 0, 0, 0.25),
|
||||
0 0 1rem rgba(var(--priYl), 1)
|
||||
;
|
||||
box-shadow:
|
||||
0.12rem 0.12rem 0.5rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.5rem rgba(var(--priYl), 0.12)
|
||||
;
|
||||
}
|
||||
|
||||
&:active {
|
||||
border: 0.18rem solid rgba(var(--priYl), 1);
|
||||
text-shadow:
|
||||
-0.1rem -0.1rem 0.25rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.12rem rgba(var(--priYl), 1)
|
||||
;
|
||||
box-shadow:
|
||||
-0.1rem -0.1rem 0.12rem rgba(var(--terYl), 0.25),
|
||||
-0.1rem -0.1rem 0.12rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.5rem rgba(var(--priYl), 0.12)
|
||||
;
|
||||
}
|
||||
}
|
||||
|
||||
&.btn-confirm {
|
||||
color: rgba(var(--priGn), 1);
|
||||
border-color: rgba(var(--priGn), 1);
|
||||
background-color: rgba(var(--terGn), 1);
|
||||
box-shadow:
|
||||
0.1rem 0.1rem 0.12rem rgba(var(--terGn), 0.25),
|
||||
0.12rem 0.12rem 0.25rem rgba(0, 0, 0, 0.25),
|
||||
0.25rem 0.25rem 0.25rem rgba(var(--terGn), 0.12)
|
||||
;
|
||||
|
||||
&:hover {
|
||||
text-shadow:
|
||||
0.1rem 0.1rem 0.1rem rgba(0, 0, 0, 0.25),
|
||||
0 0 1rem rgba(var(--priGn), 1)
|
||||
;
|
||||
box-shadow:
|
||||
0.12rem 0.12rem 0.5rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.5rem rgba(var(--priGn), 0.12)
|
||||
;
|
||||
}
|
||||
|
||||
&:active {
|
||||
border: 0.18rem solid rgba(var(--priGn), 1);
|
||||
text-shadow:
|
||||
-0.1rem -0.1rem 0.25rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.12rem rgba(var(--priGn), 1)
|
||||
;
|
||||
box-shadow:
|
||||
-0.1rem -0.1rem 0.12rem rgba(var(--terGn), 0.25),
|
||||
-0.1rem -0.1rem 0.12rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.5rem rgba(var(--priGn), 0.12)
|
||||
;
|
||||
}
|
||||
}
|
||||
|
||||
&.btn-danger {
|
||||
color: rgba(var(--priRd), 1);
|
||||
background-color: rgba(var(--terRd), 1);
|
||||
border-color: rgba(var(--priRd), 1);
|
||||
box-shadow:
|
||||
0.1rem 0.1rem 0.12rem rgba(var(--terRd), 0.25),
|
||||
0.12rem 0.12rem 0.25rem rgba(0, 0, 0, 0.25),
|
||||
0.25rem 0.25rem 0.25rem rgba(var(--terRd), 0.12)
|
||||
;
|
||||
|
||||
&:hover {
|
||||
text-shadow:
|
||||
0.1rem 0.1rem 0.1rem rgba(0, 0, 0, 0.25),
|
||||
0 0 1rem rgba(var(--priRd), 1)
|
||||
;
|
||||
box-shadow:
|
||||
0.12rem 0.12rem 0.5rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.5rem rgba(var(--priRd), 0.12)
|
||||
;
|
||||
}
|
||||
|
||||
&:active {
|
||||
text-shadow:
|
||||
-0.1rem -0.1rem 0.25rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.12rem rgba(var(--priRd), 1)
|
||||
;
|
||||
box-shadow:
|
||||
-0.1rem -0.1rem 0.12rem rgba(var(--terRd), 0.25),
|
||||
-0.1rem -0.1rem 0.12rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.5rem rgba(var(--priRd), 0.12)
|
||||
;
|
||||
}
|
||||
|
||||
&.stop-player {
|
||||
width: 4rem;
|
||||
height: 4rem;
|
||||
font-size: 0.9rem;
|
||||
border: 0.2rem solid rgba(var(--priRd), 1);
|
||||
box-shadow:
|
||||
0.1rem 0.1rem 0.25rem rgba(var(--terRd), 0.5),
|
||||
0.25rem 0.25rem 1rem rgba(0, 0, 0, 0.5),
|
||||
0.5rem 0.5rem 0.5rem rgba(var(--terRd), 0.25)
|
||||
;
|
||||
|
||||
&:hover {
|
||||
text-shadow:
|
||||
0.1rem 0.1rem 0.1rem rgba(0, 0, 0, 0.5),
|
||||
0 0 1rem rgba(var(--priRd), 1)
|
||||
;
|
||||
box-shadow:
|
||||
0.25rem 0.25rem 1rem rgba(0, 0, 0, 0.5),
|
||||
0 0 1rem rgba(var(--priRd), 0.25)
|
||||
;
|
||||
}
|
||||
|
||||
&:active {
|
||||
font-size: 0.88rem;
|
||||
border: 0.25rem solid rgba(var(--priRd), 1);
|
||||
text-shadow:
|
||||
-0.1rem -0.1rem 0.5rem rgba(0, 0, 0, 0.5),
|
||||
0 0 0.25rem rgba(var(--priRd), 1)
|
||||
;
|
||||
box-shadow:
|
||||
-0.1rem -0.1rem 0.25rem rgba(var(--terRd), 0.5),
|
||||
-0.1rem -0.1rem 0.25rem rgba(0, 0, 0, 0.5),
|
||||
0 0 1rem rgba(var(--priRd), 0.25)
|
||||
;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.btn-disabled {
|
||||
cursor: default !important;
|
||||
font-size: 1.2rem;
|
||||
color: rgba(var(--secUser), 0.25);
|
||||
background-color: rgba(var(--priUser), 1);
|
||||
border-color: rgba(var(--secUser), 0.25);
|
||||
box-shadow:
|
||||
0.1rem 0.1rem 0.12rem rgba(var(--priUser), 0.5),
|
||||
0.12rem 0.12rem 0.25rem rgba(0, 0, 0, 0.25),
|
||||
0.25rem 0.25rem 0.25rem rgba(var(--secUser), 0.12)
|
||||
;
|
||||
|
||||
&:hover {
|
||||
text-shadow:
|
||||
0.1rem 0.1rem 0.1rem rgba(0, 0, 0, 0.25),
|
||||
0 0 1rem rgba(var(--priUser), 1)
|
||||
;
|
||||
box-shadow:
|
||||
0.12rem 0.12rem 0.5rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.5rem rgba(var(--priUser), 0.12)
|
||||
;
|
||||
}
|
||||
|
||||
&:active {
|
||||
text-shadow:
|
||||
-0.1rem -0.1rem 0.25rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.12rem rgba(var(--priUser), 1)
|
||||
;
|
||||
box-shadow:
|
||||
-0.1rem -0.1rem 0.12rem rgba(var(--priUser), 0.75),
|
||||
-0.1rem -0.1rem 0.12rem rgba(0, 0, 0, 0.25),
|
||||
0 0 0.5rem rgba(var(--secUser), 0.12)
|
||||
;
|
||||
}
|
||||
}
|
||||
}
|
||||
37
src/static_src/scss/_theme-picker.scss
Normal file
37
src/static_src/scss/_theme-picker.scss
Normal file
@@ -0,0 +1,37 @@
|
||||
.theme-picker {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.theme-picker-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.swatch {
|
||||
width: 4rem;
|
||||
height: 4rem;
|
||||
border-radius: 0.5rem;
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
rgba(var(--priUser), 1) 0%,
|
||||
rgba(var(--priUser), 1) 33%,
|
||||
rgba(var(--secUser), 1) 33%,
|
||||
rgba(var(--secUser), 1) 66%,
|
||||
rgba(var(--terUser), 1) 66%,
|
||||
rgba(var(--terUser), 1) 100%
|
||||
);
|
||||
border: 0.15rem solid rgba(var(--secUser), 0.5);
|
||||
|
||||
&.active {
|
||||
border: 0.2rem solid rgba(var(--ninUser), 1);
|
||||
box-shadow: 0 0 0.5rem rgba(var(--ninUser), 0.5);
|
||||
}
|
||||
|
||||
&.locked {
|
||||
opacity: 0.5;
|
||||
filter: saturate(0.4);
|
||||
}
|
||||
}
|
||||
@@ -1,4 +1,8 @@
|
||||
@import 'rootvars';
|
||||
@import 'base';
|
||||
@import 'button-pad';
|
||||
@import 'theme-picker';
|
||||
|
||||
|
||||
input,
|
||||
textarea,
|
||||
|
||||
Reference in New Issue
Block a user