SinTan1729/chhoto-url
SinTan1729/chhoto-url
1
0
Fork 0
mirror of https://github.com/SinTan1729/chhoto-url synced 2025-03-14 05:04:40 -05:00
Code Issues Releases Activity

new: Automatic dark mode support

Browse source
This commit is contained in:
Sayantan Santra 2025-03-03 18:10:53 -06:00
parent 1ae00eb3a8
commit babf3d8911
Signed by: SinTan1729
GPG key ID: 0538DD402EA50898
2 changed files with 44 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
resources/static/script.js
View file

@ -129,10 +129,10 @@ const copyShortUrl = async (link) => {
const site = await getSiteUrl();
try {
navigator.clipboard.writeText(`${site}/${link}`);
showAlert(`Short URL ${link} was copied to clipboard!`, "green");
showAlert(`Short URL ${link} was copied to clipboard!`, "light-dark(green, #72ff72)");
} catch (e) {
console.log(e);
showAlert(`Could not copy short URL to clipboard, please do it manually: <a href=${site}/${link}>${site}/${link}</a>`, "red");
showAlert(`Could not copy short URL to clipboard, please do it manually: <a href=${site}/${link}>${site}/${link}</a>`, "light-dark(red, #ff1a1a)");
}
}
@ -213,7 +213,7 @@ const submitForm = () => {
})
.then(text => {
if (!ok) {
showAlert(text, "red");
showAlert(text, "light-dark(red, #ff1a1a)");
}
else {
copyShortUrl(text);
@ -238,7 +238,7 @@ const submitLogin = () => {
} else {
const wrongPassBox = document.getElementById("wrong-pass");
wrongPassBox.innerHTML = "Wrong password!";
wrongPassBox.style.color = "red";
wrongPassBox.style.color = "light-dark(red, #ff1a1a)";
password.focus();
}
})

40
resources/static/styles.css
View file

@ -6,6 +6,33 @@
src: url('/assets/Montserrat-VF.woff2');
}
:root {
color-scheme: light dark;
}
body {
color: light-dark(black, #e8e6e3);
background-color: light-dark(white, #181a1b);
}
.pure-button {
background-color: light-dark(#0078e7, #0060b9);
}
input {
border-color: light-dark(#cccccc, #3e4446) !important;
box-shadow: light-dark(#dddddd, #2b2f31) 0px 1px 3px inset !important;
}
::placeholder {
color: light-dark(#757575, #636061);
}
legend {
color: light-dark(#333333, #c8c3bc) !important;
border-bottom-color: light-dark(#e5e5e5 ,#373c3e) !important;
}
* {
font-family: Montserrat;
}
@ -23,6 +50,19 @@ table tr td div {
overflow: auto;
}
.pure-table {
border-color: light-dark(black, #867d6e);
}
.pure-table caption {
color: light-dark(black, #e8e6e3);
}
.pure-table thead {
color: light-dark(black, #e8e6e3);
background-color: light-dark(#e0e0e0, #2a2d2f);
}
.pure-table td {
border-left: none;
}