styles structure
This commit is contained in:
parent
a652971a27
commit
189f1fe4bf
11 changed files with 10 additions and 10 deletions
|
|
@ -1,787 +0,0 @@
|
|||
/* ╭────────────────────────╮
|
||||
/ │ _ │
|
||||
/ │ | |__ __ _ ___ ___ │
|
||||
/ │ | '_ \ / _` / __|/ _ \ │
|
||||
/ │ | |_) | (_| \__ \ __/ │
|
||||
/ │ |_.__/ \__,_|___/\___| │
|
||||
/ ╰────────────────────────╯
|
||||
/ base - styling for regular/global html elements as well as the color schemes, and anything else that doesn't fit anywhere else */
|
||||
|
||||
/* ----------------------------------
|
||||
- background wallpaper, global font -
|
||||
---------------------------------- */
|
||||
|
||||
html {
|
||||
background: var(--background);
|
||||
background-repeat: repeat;
|
||||
background-size: auto;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: var(--font-family);
|
||||
font-size: 1.05rem;
|
||||
line-height: 1.45rem;
|
||||
text-transform: lowercase;
|
||||
margin: unset !important;
|
||||
}
|
||||
|
||||
bg-gradient {
|
||||
background: linear-gradient(color-mix(in srgb, var(--accent) 10%, var(--background)), color-mix(in srgb, var(--accent) 50%, var(--background)));
|
||||
background-repeat: repeat;
|
||||
inset: 0 !important;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
position: fixed;
|
||||
z-index: -10001;
|
||||
}
|
||||
|
||||
bg-image {
|
||||
display: block;
|
||||
position: fixed;
|
||||
animation: 80s linear infinite bg-move;
|
||||
opacity: .6;
|
||||
background-repeat: repeat;
|
||||
background-size: auto;
|
||||
background-image: url(/assets/bg.png);
|
||||
inset: 0 !important;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
z-index: -10000;
|
||||
}
|
||||
|
||||
content-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 3rem;
|
||||
margin-bottom: 4rem;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-top: 5rem;
|
||||
max-width: 60rem;
|
||||
|
||||
transition: opacity .5s, translate .5s;
|
||||
opacity: 1;
|
||||
translate: 0 0;
|
||||
@starting-style {
|
||||
opacity: 0;
|
||||
translate: 0 1rem;
|
||||
}
|
||||
|
||||
main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 60rem) {
|
||||
& {
|
||||
gap: 2rem !important;
|
||||
margin-bottom: 1rem;
|
||||
margin-top: 3.4rem;
|
||||
}
|
||||
|
||||
main {
|
||||
gap: 1.5rem !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* text formatting and config stuff */
|
||||
|
||||
/* headings */
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
border-bottom: .15rem solid var(--border);
|
||||
color: var(--foreground);
|
||||
margin-bottom: .8rem;
|
||||
margin-top: 1.5rem;
|
||||
padding-bottom: .2rem;
|
||||
transition: .2s;
|
||||
|
||||
& a {
|
||||
text-decoration-color: transparent;
|
||||
|
||||
&:hover {
|
||||
text-decoration-color: var(--accent);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
h1,
|
||||
h1 a {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
h2,
|
||||
h2 a {
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
|
||||
h3, h4,
|
||||
h3 a, h4 a {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
[accent] {
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
[link-color] {
|
||||
color: var(--link);
|
||||
}
|
||||
|
||||
/* information colors */
|
||||
[info] {
|
||||
color: var(--blue);
|
||||
}
|
||||
|
||||
[warning] {
|
||||
color: var(--warning);
|
||||
}
|
||||
|
||||
/* utility classes or whatever they call them */
|
||||
[t-center] {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* links should look good i think */
|
||||
a {
|
||||
color: var(--foreground);
|
||||
text-decoration-color: color-mix(in srgb, var(--accent) 60%, transparent);
|
||||
text-decoration-thickness: 0.1em;
|
||||
transition: 0.2s;
|
||||
|
||||
&:hover {
|
||||
color: var(--link);
|
||||
text-decoration-color: var(--accent);
|
||||
text-decoration-skip-ink: none;
|
||||
text-decoration-thickness: .3em;
|
||||
transition: 0.2s;
|
||||
}
|
||||
}
|
||||
|
||||
/* smol text */
|
||||
small,
|
||||
small a {
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
/* lists need some styling */
|
||||
ul {
|
||||
margin-left: -1.3rem;
|
||||
|
||||
li {
|
||||
margin-bottom: .5rem;
|
||||
&:last-of-type { margin-bottom: 0; }
|
||||
|
||||
&::marker {
|
||||
color: var(--accent);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* text with "title", little hover-over info tibblets */
|
||||
span[title] {
|
||||
cursor: help;
|
||||
text-decoration-color: color-mix(in srgb, var(--foreground) 40%, transparent);
|
||||
text-decoration-line: underline;
|
||||
text-decoration-style: dashed;
|
||||
text-decoration-thickness: 0.1em;
|
||||
transition: 0.2s;
|
||||
|
||||
&:hover {
|
||||
text-decoration-color: color-mix(in srgb, var(--foreground) 80%, transparent);
|
||||
text-decoration-skip-ink: none;
|
||||
transition: 0.2s;
|
||||
}
|
||||
}
|
||||
|
||||
/* code (enforced monospace) */
|
||||
.code {
|
||||
font-family: 'JetBrains Mono', monospace, 'Segoe UI', Tahoma, Geneva, Verdana, system-ui, sans-serif !important;
|
||||
}
|
||||
|
||||
/* caption styled text */
|
||||
.caption {
|
||||
font-size: small;
|
||||
opacity: .8;
|
||||
|
||||
.section {
|
||||
font-size: smaller;
|
||||
opacity: .9;
|
||||
}
|
||||
}
|
||||
|
||||
/* styled details elements */
|
||||
details {
|
||||
&[styled] {
|
||||
background-color: light-dark(color-mix(in srgb, var(--accent) 5%, transparent), color-mix(in srgb, var(--accent) 3%, transparent));
|
||||
border-radius: .8rem .4rem .8rem .4rem;
|
||||
border: .13rem solid var(--accent);
|
||||
margin-bottom: 1rem;
|
||||
|
||||
summary {
|
||||
background: linear-gradient(color-mix(in srgb, var(--accent) 2%, transparent), color-mix(in srgb, var(--accent) 14%, transparent));
|
||||
border-bottom: unset;
|
||||
cursor: pointer;
|
||||
padding: .45rem;
|
||||
|
||||
icon-tabler[arrow-autofit-height] {
|
||||
float: right;
|
||||
}
|
||||
|
||||
&::marker {
|
||||
content: "";
|
||||
}
|
||||
}
|
||||
|
||||
details-content {
|
||||
display: block;
|
||||
padding: .8rem;
|
||||
|
||||
p:first-of-type { margin-top: 0; }
|
||||
p:last-of-type { margin-bottom: 0; }
|
||||
}
|
||||
|
||||
&[open] {
|
||||
summary {
|
||||
border-bottom: .1rem solid var(--accent);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* more minimal "content warning" styled details elements */
|
||||
details.cw {
|
||||
summary {
|
||||
span {
|
||||
color: var(--yellow);
|
||||
padding-right: .6rem;
|
||||
transform: translateY(.1rem);
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.tabler--chevron-down:last-of-type {
|
||||
margin-left: .5rem;
|
||||
}
|
||||
|
||||
background: color-mix(in srgb, var(--yellow) 5%, var(--background));
|
||||
border-radius: .4rem;
|
||||
border: .1rem solid var(--yellow);
|
||||
cursor: pointer;
|
||||
padding: .3rem;
|
||||
transform: 0.2s;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
section {
|
||||
background-color: color-mix(in srgb, var(--background) 95%, white);
|
||||
border-radius: .4rem;
|
||||
border: .1rem solid var(--border);
|
||||
margin-top: .7rem;
|
||||
padding: .4rem;
|
||||
text-align: start !important;
|
||||
|
||||
ul {
|
||||
margin: 0 0 0 -.5rem;
|
||||
}
|
||||
|
||||
p:first-of-type {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
p:last-of-type {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
overflow: clip;
|
||||
}
|
||||
|
||||
details.cw[open] {
|
||||
.tabler--chevron-down:last-of-type {
|
||||
transform: 0.2s;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
|
||||
/* badge text styling */
|
||||
.badge {
|
||||
border-radius: .2rem;
|
||||
border: .1rem solid var(--accent);
|
||||
color: var(--link);
|
||||
font-size: .8rem;
|
||||
font-weight: normal;
|
||||
padding: .15rem;
|
||||
}
|
||||
|
||||
/* card styling */
|
||||
card-container {
|
||||
display: grid;
|
||||
gap: 1.2rem;
|
||||
grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr));
|
||||
|
||||
card-entry {
|
||||
background-color: var(--background-secondary);
|
||||
border-radius: 1rem;
|
||||
border: .15rem solid var(--border);
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
height: auto;
|
||||
padding: .6rem;
|
||||
width: auto;
|
||||
|
||||
h3 {
|
||||
border-bottom: unset;
|
||||
margin-bottom: 1rem;
|
||||
margin-top: 0;
|
||||
|
||||
[icon] {
|
||||
height: 1.4rem;
|
||||
transition: .3s;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
span[status] {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
float: right;
|
||||
|
||||
icon-tabler {
|
||||
margin-left: .3rem;
|
||||
&[lock] {
|
||||
color: var(--link);
|
||||
}
|
||||
&[device-desktop-cog] {
|
||||
color: var(--blue);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
h3 {
|
||||
[icon] {
|
||||
margin-right: .4rem;
|
||||
transform: rotate(15deg) scale(2.5) translateX(-.1rem) translateY(-.2rem);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
margin-top: 0;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
&[advise-against] {
|
||||
opacity: .7;
|
||||
transition: 1s;
|
||||
border-color: color-mix(in srgb, var(--warning) 30%, transparent);
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
buttons-container {
|
||||
margin-top: auto;
|
||||
|
||||
img {
|
||||
align-self: center;
|
||||
border-radius: 10rem;
|
||||
height: 1.3rem;
|
||||
vertical-align: middle;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
a {
|
||||
icon-tabler {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
&:has(img[src^="https://compliance"]) {
|
||||
align-self: center;
|
||||
font-size: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* notice/section cards */
|
||||
[notice-card] {
|
||||
--n-bg: var(--accent);
|
||||
border-radius: 1rem;
|
||||
border: .15rem solid color-mix(in srgb, var(--yellow) 20%, transparent);
|
||||
margin-bottom: .8rem;
|
||||
padding: .5rem;
|
||||
|
||||
h3 {
|
||||
color: var(--link);
|
||||
margin-top: 0;
|
||||
}
|
||||
p, ul { &:last-of-type { margin-bottom: 0; } }
|
||||
|
||||
&[important] {
|
||||
--n-bg: var(--yellow);
|
||||
background-color: color-mix(in srgb, var(--n-bg) 15%, transparent);
|
||||
}
|
||||
}
|
||||
|
||||
/* Dashed border */
|
||||
hr[dashed] {
|
||||
border: .1rem dashed var(--border);
|
||||
}
|
||||
|
||||
/* Dotted border */
|
||||
hr[dotted] {
|
||||
border: .1rem dotted var(--border);
|
||||
}
|
||||
|
||||
/* Solid border */
|
||||
hr[solid] {
|
||||
border: .1rem solid var(--border);
|
||||
}
|
||||
|
||||
/* Rounded border */
|
||||
hr[rounded] {
|
||||
border: .2rem solid var(--border);
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
/* text formatting, like github kinda */
|
||||
.info-box {
|
||||
padding: .5rem;
|
||||
border: .1rem solid;
|
||||
border-radius: .4rem;
|
||||
|
||||
&.info {
|
||||
background-color: color-mix(in srgb, var(--blue) 8%, transparent);
|
||||
border-color: var(--blue);
|
||||
.icon { color: var(--blue); }
|
||||
}
|
||||
|
||||
&.warn {
|
||||
background-color: color-mix(in srgb, var(--orange) 8%, transparent);
|
||||
border-color: var(--orange);
|
||||
.icon { color: var(--orange); }
|
||||
}
|
||||
}
|
||||
|
||||
/* audio */
|
||||
audio {
|
||||
border-radius: 3rem;
|
||||
}
|
||||
|
||||
/* button link styling */
|
||||
.button {
|
||||
background-color: color-mix(in srgb, var(--accent) 25%, transparent);
|
||||
border-radius: 1rem;
|
||||
color: var(--foreground);
|
||||
padding: .4rem;
|
||||
text-decoration: none;
|
||||
text-shadow: none;
|
||||
transition: all .2s;
|
||||
white-space: nowrap;
|
||||
line-height: 3rem;
|
||||
|
||||
.icon {
|
||||
transform: scale(1.13) translateY(.7rem);
|
||||
}
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
background-color: var(--accent);
|
||||
color: var(--foreground);
|
||||
transition: all .2s;
|
||||
}
|
||||
|
||||
.button-container {
|
||||
margin-bottom: unset !important;
|
||||
}
|
||||
|
||||
/* focus styling */
|
||||
*:focus-visible {
|
||||
outline: .4rem solid var(--ui-purple) !important;
|
||||
border-radius: .2rem;
|
||||
z-index: 999999 !important;
|
||||
}
|
||||
|
||||
/* image-button grid */
|
||||
imgbtn-grid {
|
||||
align-items: normal;
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
font-size: 0 !important;
|
||||
gap: 5px;
|
||||
justify-content: center;
|
||||
line-height: 0;
|
||||
margin-inline: auto;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: .8rem;
|
||||
}
|
||||
|
||||
img {
|
||||
height: 31px;
|
||||
image-rendering: crisp-edges !important;
|
||||
margin: unset !important;
|
||||
transition: transform 0.2s;
|
||||
width: 88px;
|
||||
}
|
||||
|
||||
.generic {
|
||||
align-content: center;
|
||||
background-color: color-mix(in srgb, var(--background) 90%, white);
|
||||
border: solid .15rem;
|
||||
box-sizing: border-box;
|
||||
color: var(--foreground);
|
||||
font-size: .95rem !important;
|
||||
height: 31px;
|
||||
text-align: center;
|
||||
transition: transform 0.2s;
|
||||
width: 88px;
|
||||
}
|
||||
|
||||
.generic:hover, img:hover {
|
||||
transform: scale(2);
|
||||
}
|
||||
}
|
||||
|
||||
/* no forced uncapitalization */
|
||||
[no-uncap] {
|
||||
text-transform: none !important;
|
||||
}
|
||||
|
||||
/* spoiler text */
|
||||
spoiler {
|
||||
filter: blur(.4rem) contrast(200%);
|
||||
transition: 0.2s;
|
||||
|
||||
&:hover {
|
||||
filter: unset !important;
|
||||
transition: 0.2s;
|
||||
}
|
||||
}
|
||||
|
||||
/* ------------------
|
||||
- nsfw toggle group -
|
||||
------------------ */
|
||||
|
||||
.nsfw-toggle-holder {
|
||||
background-color: color-mix(in srgb, var(--background) 95%, white);
|
||||
border-radius: 1rem;
|
||||
border: .2rem solid var(--border);
|
||||
color: var(--foreground);
|
||||
padding: .5rem;
|
||||
position: fixed;
|
||||
max-width: 30rem;
|
||||
margin-left: .4rem;
|
||||
z-index: 30;
|
||||
right: .4rem;
|
||||
top: 3rem;
|
||||
transition: 0.2s;
|
||||
|
||||
/* inital "shrunken" state */
|
||||
opacity: .5;
|
||||
scale: .75;
|
||||
transform-origin: top right;
|
||||
|
||||
|
||||
/* hide captions when unhovered */
|
||||
.caption {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
transition: 0.2s;
|
||||
|
||||
/* hovered "full" state */
|
||||
opacity: 1;
|
||||
scale: 1;
|
||||
|
||||
.caption {
|
||||
opacity: .9;
|
||||
display: unset;
|
||||
}
|
||||
}
|
||||
|
||||
.nsfw-toggle, .spoil-nsfw-toggle {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* hide the spoil option if nsfw itself is disabled */
|
||||
.spoil-nsfw-toggle {
|
||||
display: none;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
&:has(input[type="checkbox"]#view-nsfw-content:checked) .spoil-nsfw-toggle {
|
||||
display: inherit !important;
|
||||
}
|
||||
|
||||
/* shrink it even more if on a small display */
|
||||
@media screen and (max-width: 580px) {
|
||||
scale: .5;
|
||||
}
|
||||
}
|
||||
|
||||
/* _is-nsfw class for elements that are "nsfw" - will be hidden and spoiled by default */
|
||||
._is-nsfw {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* inverse to remove elements if they aren't nsfw while the option is toggled */
|
||||
._is-nsfw-inverse {
|
||||
display: inherit;
|
||||
}
|
||||
|
||||
/* show if enabled */
|
||||
html:has(input[type="checkbox"]#view-nsfw-content:checked) {
|
||||
._is-nsfw {
|
||||
display: inherit;
|
||||
}
|
||||
|
||||
._is-nsfw-inverse {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* blue/spoiler if enabled */
|
||||
html:has(input[type="checkbox"]#spoil-nsfw-content:checked) {
|
||||
._is-nsfw {
|
||||
filter: blur(.4rem) contrast(200%);
|
||||
transition: 0.2s;
|
||||
|
||||
&:hover {
|
||||
filter: unset !important;
|
||||
transition: 0.2s;
|
||||
}
|
||||
}
|
||||
|
||||
/* _always-show to ignore the "spoiler" option */
|
||||
._always-show {
|
||||
filter: unset !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* alt text popup */
|
||||
|
||||
.alt-popup {
|
||||
position: fixed;
|
||||
background-color: color-mix(in srgb, var(--background) 85%, transparent);
|
||||
backdrop-filter: blur(.5rem);
|
||||
color: var(--foreground);
|
||||
padding: .5rem;
|
||||
border: solid .01rem var(--accent);
|
||||
border-radius: .5rem;
|
||||
font-size: 1rem;
|
||||
max-width: 30rem;
|
||||
z-index: 1000;
|
||||
pointer-events: none;
|
||||
opacity: 0;
|
||||
transition: opacity 0.4s;
|
||||
}
|
||||
|
||||
/* widgets */
|
||||
|
||||
buttons-container {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
gap: .4rem;
|
||||
|
||||
[button] {
|
||||
background: light-dark(color-mix(in srgb,var(--accent)60%,transparent), color-mix(in srgb,var(--accent)25%,transparent));
|
||||
padding: .2rem .5rem;
|
||||
border-radius: 10rem;
|
||||
transition: .2s;
|
||||
text-decoration: none !important;
|
||||
|
||||
&:hover {
|
||||
background: var(--accent);
|
||||
color: light-dark(var(--foreground), var(--background));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
radio-button-group {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
gap: .4rem;
|
||||
|
||||
label {
|
||||
border-radius: .4rem;
|
||||
border: .13rem solid var(--border);
|
||||
cursor: pointer;
|
||||
padding: .2rem;
|
||||
width: fit-content;
|
||||
word-break: break-word;
|
||||
|
||||
&:has(input:checked) {
|
||||
border-color: var(--accent);
|
||||
background-color: color-mix(in srgb, var(--accent) 15%, var(--background));
|
||||
}
|
||||
|
||||
&:hover, &:focus-visible {
|
||||
background: var(--hover);
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
/* allows screen readers to still access these - see https://lyra.horse/blog/2025/08/you-dont-need-js */
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
checkbox-button-group {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
gap: .5rem;
|
||||
|
||||
label {
|
||||
border-radius: .4rem;
|
||||
border: .13rem solid var(--border);
|
||||
cursor: pointer;
|
||||
margin-right: .3rem;
|
||||
padding: .2rem;
|
||||
width: fit-content;
|
||||
word-break: break-word;
|
||||
|
||||
&::before {
|
||||
background: var(--border);
|
||||
border-radius: 10rem;
|
||||
content: '';
|
||||
display: inline-flex;
|
||||
height: 1rem;
|
||||
margin-bottom: -.15rem;
|
||||
margin-left: .2rem;
|
||||
margin-right: .3rem;
|
||||
position: relative;
|
||||
transition: .2s;
|
||||
width: 1rem;
|
||||
}
|
||||
|
||||
&:has(input:checked) {
|
||||
border-color: var(--accent);
|
||||
background-color: color-mix(in srgb, var(--accent) 15%, var(--background));
|
||||
|
||||
&::before {
|
||||
background: var(--accent);
|
||||
}
|
||||
}
|
||||
|
||||
&:hover, &:focus-visible {
|
||||
background: var(--hover);
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
/* allows screen readers to still access these - see https://lyra.horse/blog/2025/08/you-dont-need-js */
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue