format css and js files with prettier

This commit is contained in:
emma 2025-02-10 06:52:25 -05:00
parent 7d4c77d187
commit 961679d419
3 changed files with 355 additions and 315 deletions

View File

@ -30,7 +30,8 @@ enlargeImg.forEach((img) => {
div.append(image);
let paragraph = document.createElement("p");
paragraph.textContent = "Click anywhere on the image or the black background to close. You can also press the x key on your keyboard.";
paragraph.textContent =
"Click anywhere on the image or the black background to close. You can also press the x key on your keyboard.";
paragraph.style.color = "#FFFFFF";
div.append(paragraph);
// hide current page contents

View File

@ -1,9 +1,9 @@
:root {
--pagebg: #232c2f;
--pagecolor: #DB7093;
--button-border-color: #DB7093;
--button-color: #FFB6C1;
--border: #DB7093;
--pagecolor: #db7093;
--button-border-color: #db7093;
--button-color: #ffb6c1;
--border: #db7093;
}
@media (prefers-color-scheme: dark) {
@ -15,7 +15,7 @@
--pagebg: #f1dac4;
}
input[type=submit] {
input[type="submit"] {
color: #f1dac4;
}
}
@ -27,9 +27,12 @@ ul.pages {
text-align: center;
}
ul.pages li { display:inline; }
ul.pages li {
display: inline;
}
ul.pages li a, ul.pages li.active {
ul.pages li a,
ul.pages li.active {
font-size: 1.2rem;
border: 1px solid var(--border);
padding: 5px;
@ -69,7 +72,9 @@ ul.pages li.active {
border-bottom: 2px solid var(--border);
}
h1, h3, p {
h1,
h3,
p {
margin: 0.5rem;
}
@ -77,7 +82,8 @@ main {
margin-top: 0.5rem;
}
input[type="text"], textarea {
input[type="text"],
textarea {
width: 30vw;
margin-bottom: 0.5rem;
}

View File

@ -9,30 +9,32 @@
}
:root {
--text-color: #0C0C0C;
--text-color: #0c0c0c;
--background-color: #ffd4de;
--body-background-color: #ffcccc;
--scroll-gutter: #eb76ff88;
--scroll-bar: #ffa8ec88;
--link-hover: #FF1493;
--link-visited: #8A2BE2;
--link-color: #4B0082;
--border-color: #DB7093;
--bi-pride-pink-light: #D60270;
--bi-pride-purple-light: #9B4F96;
--bi-pride-blue-light: #0038A8;
--link-hover: #ff1493;
--link-visited: #8a2be2;
--link-color: #4b0082;
--border-color: #db7093;
--bi-pride-pink-light: #d60270;
--bi-pride-purple-light: #9b4f96;
--bi-pride-blue-light: #0038a8;
--disability-pride-black-light: #595959;
--disability-pride-red-light: #CF7280;
--disability-pride-yellow-light: #EEDE77;
--disability-pride-white-light: #E8E8E8;
--disability-pride-blue-light: #7BC2E0;
--disability-pride-green-light: #3BB07D;
--trans-pride-blue-light: #5BCEFA;
--trans-pride-pink-light: #F5A9B8;
--trans-pride-white-light: #FFFFFF;
--disability-pride-red-light: #cf7280;
--disability-pride-yellow-light: #eede77;
--disability-pride-white-light: #e8e8e8;
--disability-pride-blue-light: #7bc2e0;
--disability-pride-green-light: #3bb07d;
--trans-pride-blue-light: #5bcefa;
--trans-pride-pink-light: #f5a9b8;
--trans-pride-white-light: #ffffff;
}
*, *::before, *::after {
*,
*::before,
*::after {
margin: 0;
padding: 0;
box-sizing: border-box;
@ -57,11 +59,21 @@ body {
color: var(--text-color);
}
h1, h2, h3, h4, h5, h6, p, ul, figcaption, details {
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
figcaption,
details {
margin: 0.5rem;
}
main, nav {
main,
nav {
padding-bottom: 0.5rem;
font-family: system-ui;
letter-spacing: 0.05rem;
@ -92,7 +104,12 @@ header {
border-bottom: 10px solid;
border-image-slice: 1;
border-width: 5px;
border-image-source: linear-gradient(to right, var(--bi-pride-pink-light) 0 33%, var(--bi-pride-purple-light) 33% 66%, var(--bi-pride-blue-light) 66%);
border-image-source: linear-gradient(
to right,
var(--bi-pride-pink-light) 0 33%,
var(--bi-pride-purple-light) 33% 66%,
var(--bi-pride-blue-light) 66%
);
font-size: 1.4rem;
margin-top: 0.43rem;
}
@ -108,13 +125,23 @@ footer {
border-top: 10px solid;
border-image-slice: 1;
border-width: 5px;
border-image-source: linear-gradient(to right, var(--disability-pride-black-light) 0 35%, var(--disability-pride-red-light) 35% 41%, var(--disability-pride-yellow-light) 41% 47%, var(--disability-pride-white-light) 47% 53%, var(--disability-pride-blue-light) 53% 59%, var(--disability-pride-green-light) 59% 65%, var(--disability-pride-black-light) 65% 71%);
border-image-source: linear-gradient(
to right,
var(--disability-pride-black-light) 0 35%,
var(--disability-pride-red-light) 35% 41%,
var(--disability-pride-yellow-light) 41% 47%,
var(--disability-pride-white-light) 47% 53%,
var(--disability-pride-blue-light) 53% 59%,
var(--disability-pride-green-light) 59% 65%,
var(--disability-pride-black-light) 65% 71%
);
font-family: system-ui;
font-size: 1.3rem;
letter-spacing: 0.05rem;
}
header, footer {
header,
footer {
display: flex;
justify-content: center;
align-items: center;
@ -135,7 +162,14 @@ nav {
border-right: 10px solid;
border-image-slice: 1;
border-width: 5px;
border-image-source: linear-gradient(to bottom, var(--trans-pride-blue-light) 0 20%, var(--trans-pride-pink-light) 20% 40%, var(--trans-pride-white-light) 40% 60%, var(--trans-pride-pink-light) 60% 80%, var(--trans-pride-blue-light) 80%);
border-image-source: linear-gradient(
to bottom,
var(--trans-pride-blue-light) 0 20%,
var(--trans-pride-pink-light) 20% 40%,
var(--trans-pride-white-light) 40% 60%,
var(--trans-pride-pink-light) 60% 80%,
var(--trans-pride-blue-light) 80%
);
}
section {
@ -279,16 +313,14 @@ main section ul li {
.logo {
font-family: pacifico;
font-size: 1.35rem;
letter-spacing: .1rem;
letter-spacing: 0.1rem;
}
.motto {
font-family: lato-regular;
letter-spacing: .05rem;
letter-spacing: 0.05rem;
}
.status .statuslol_container .statuslol {
background: var(--background-color) !important;
}
@ -306,7 +338,8 @@ main section ul li {
border-radius: 5%;
}
.picrew-gallery, .picrew-gallery-header {
.picrew-gallery,
.picrew-gallery-header {
text-align: center;
}