Mirrors/cobalt
1
0
Fork 0
mirror of https://github.com/wukko/cobalt.git synced 2025-02-28 05:58:48 +01:00
Code Issues Projects Releases Packages Wiki Activity

web/DonateOptionsCard: faster scrolling, hover state for custom value

Browse source
This commit is contained in:
wukko 2025-02-27 18:15:51 +06:00
parent f5b9f59e43
commit 238295888c
No known key found for this signature in database
GPG key ID: 3E30B3F26C7B4AA2
1 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
web/src/components/donate/DonateOptionsCard.svelte
View file

@ -85,7 +85,7 @@
const scroll = (direction: "left" | "right") => { const scroll = (direction: "left" | "right") => {
const currentPos = donateList.scrollLeft; const currentPos = donateList.scrollLeft;
const maxPos = donateList.scrollWidth - donateList.getBoundingClientRect().width; const maxPos = donateList.scrollWidth - donateList.getBoundingClientRect().width;
const newPos = direction === "left" ? currentPos - 150 : currentPos + 150; const newPos = direction === "left" ? currentPos - 250 : currentPos + 250;
donateList.scroll({ donateList.scroll({
left: newPos, left: newPos,
@ -285,10 +285,17 @@
width: 100%; width: 100%;
border-radius: 12px; border-radius: 12px;
color: var(--white); color: var(--white);
background-color: rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.05);
display: flex; display: flex;
align-items: center; align-items: center;
gap: 4px; gap: 4px;
}
@media (hover: hover) {
#input-container:hover {
background: rgba(255, 255, 255, 0.1);
}
} }
#input-dollar-sign { #input-dollar-sign {
@ -336,7 +343,6 @@
#donation-custom-submit { #donation-custom-submit {
color: var(--white); color: var(--white);
background-color: rgba(255, 255, 255, 0.1);
aspect-ratio: 1/1; aspect-ratio: 1/1;
padding: 0px 10px; padding: 0px 10px;
} }