Clean up CSS a little, add confirm do hide button

This commit is contained in:
John Stephani 2025-12-24 21:53:18 -06:00
parent 43d680f155
commit cdae48c98c
1 changed files with 17 additions and 16 deletions

View File

@ -9,6 +9,7 @@
--dark: #2c2c2c; --dark: #2c2c2c;
--darker: #171717; --darker: #171717;
--light: #bfbfbf; --light: #bfbfbf;
--confirm: #970000;
} }
html { html {
height: 100%; height: 100%;
@ -21,7 +22,6 @@
} }
img, video { img, video {
max-width: 100%; max-width: 100%;
max-height: 100vh;
width: auto; width: auto;
height: auto; height: auto;
} }
@ -54,7 +54,6 @@
} }
div.post { div.post {
width: 70vw; width: 70vw;
margin-left: 20px;
} }
.container { .container {
display: flex; display: flex;
@ -65,7 +64,8 @@
height: 100vh; height: 100vh;
flex-direction: column; flex-direction: column;
overflow-y: auto; overflow-y: auto;
padding: 5px padding: 5px;
margin-right: 20px;
} }
} }
/* phone */ /* phone */
@ -89,6 +89,7 @@
align-items: center; align-items: center;
padding-top: 5px; padding-top: 5px;
padding-bottom: 5px; padding-bottom: 5px;
margin-bottom: 10px;
} }
.content { .content {
align-items: center; align-items: center;
@ -106,9 +107,6 @@
background-color: var(--darker); background-color: var(--darker);
color: var(--light); color: var(--light);
} }
.content h1 {
margin-left: 20px;
}
.invert { .invert {
filter: invert(1); filter: invert(1);
transition: filter 0.3s; transition: filter 0.3s;
@ -133,6 +131,9 @@
font-size: 1.25rem; font-size: 1.25rem;
font-weight: bold; font-weight: bold;
} }
.button-wrapper button.confirm {
background-color: var(--confirm)
}
.button-wrapper button.gallery { .button-wrapper button.gallery {
padding: 5px; padding: 5px;
background-color: var(--darker); background-color: var(--darker);
@ -271,16 +272,16 @@
// main button code // main button code
function hide(button, permalink){ function hide(button, permalink){
const div = button.closest('.post'); if (button.classList.contains('confirm')) {
div.scrollTo({ div = button.closest('.post');
top: 0, div.remove();
behavior: 'smooth' try {
}); fetch('/hide' + permalink);
div.remove(); } catch (error) {
try { console.error('Could not hide', error);
fetch('/hide' + permalink); }
} catch (error) { } else {
console.error('Could hide', error); button.classList.add('confirm');
} }
} }