134 lines
2.2 KiB
SCSS
134 lines
2.2 KiB
SCSS
.setting {
|
|
&.enabled {
|
|
--setting-color: var(--green);
|
|
--setting-color-alt: var(--dark-green);
|
|
}
|
|
|
|
&.disabled {
|
|
--setting-color: var(--red);
|
|
--setting-color-alt: var(--dark-red);
|
|
}
|
|
|
|
header {
|
|
border-bottom: 2px solid var(--setting-color);
|
|
display: flex;
|
|
margin-bottom: 8px;
|
|
padding-bottom: 8px;
|
|
|
|
h2 {
|
|
margin-right: auto;
|
|
}
|
|
|
|
button {
|
|
background-color: var(--setting-color);
|
|
color: var(--foreground);
|
|
border: none;
|
|
font-weight: bold;
|
|
min-width: 10rem;
|
|
padding: 4px 0;
|
|
|
|
&:hover {
|
|
background-color: var(--setting-color-alt);
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
}
|
|
|
|
.content {
|
|
br {
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
code {
|
|
background-color: var(--background-primary);
|
|
}
|
|
|
|
p {
|
|
line-height: 125%;
|
|
margin-bottom: 8px;
|
|
}
|
|
}
|
|
|
|
.info {
|
|
border: 1px solid var(--blue);
|
|
padding: 8px;
|
|
}
|
|
|
|
.divider {
|
|
border-top: 1px solid var(--blue);
|
|
margin: 16px 0;
|
|
}
|
|
|
|
.button {
|
|
@include button;
|
|
}
|
|
|
|
.import-export {
|
|
display: grid;
|
|
gap: 8px;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
margin-bottom: 8px;
|
|
|
|
p {
|
|
grid-column: 1 / 3;
|
|
margin: 0;
|
|
}
|
|
}
|
|
|
|
.misc-utilities .inner {
|
|
display: grid;
|
|
gap: 8px;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
}
|
|
|
|
.checkbox-list {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
list-style: none;
|
|
|
|
label {
|
|
cursor: pointer;
|
|
display: inline-flex;
|
|
user-select: none;
|
|
}
|
|
|
|
input {
|
|
cursor: pointer;
|
|
margin-right: 8px;
|
|
}
|
|
}
|
|
|
|
.user-label-values {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
list-style: square;
|
|
padding: 8px 8px 8px 24px;
|
|
}
|
|
|
|
.username-colors-controls {
|
|
display: grid;
|
|
gap: 8px;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
}
|
|
|
|
.username-colors-editor {
|
|
display: grid;
|
|
gap: 8px;
|
|
grid-template-columns: auto auto min-content;
|
|
margin-top: 8px;
|
|
|
|
input {
|
|
background-color: var(--background-primary);
|
|
border: 1px solid var(--blue);
|
|
color: var(--foreground);
|
|
padding: 8px;
|
|
}
|
|
|
|
.button {
|
|
min-width: 10rem;
|
|
}
|
|
}
|
|
}
|