nikdoof/rustical
1
1
Fork 0
mirror of https://github.com/lennart-k/rustical.git synced 2025-12-13 20:32:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

frontend: refactor collection list to allow for dialogs

Browse Source
This commit is contained in:
Lennart
2025-07-07 11:22:20 +02:00
parent aa744fcea2
commit 0e68f1bdce
3 changed files with 37 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
crates/frontend/public/assets/style.css
View File

@@ -205,10 +205,21 @@ ul.collection-list {
li.collection-list-item {
list-style: none;
display: contents;
display: block;
position: relative;
background: color-mix(in srgb, var(--background-color), var(--dilute-color) 5%);
border: 2px solid var(--border-color);
border-radius: 12px;
margin: 12px 0;
box-shadow: 4px 2px 12px -6px black;
overflow: hidden;
a {
background: color-mix(in srgb, var(--background-color), var(--dilute-color) 5%);
position: absolute;
inset: 2px;
}
.inner {
display: grid;
min-height: 80px;
height: fit-content;
@@ -227,11 +238,15 @@ ul.collection-list {
text-decoration: none;
padding-left: 12px;
border: 2px solid var(--border-color);
border-radius: 12px;
margin: 12px 0;
box-shadow: 4px 2px 12px -6px black;
overflow: hidden;
position: relative;
z-index: 1;
pointer-events: none;
a,
button {
pointer-events: all;
cursor: pointer;
}
.title {
font-weight: bold;
@@ -283,10 +298,10 @@ ul.collection-list {
display: flex;
gap: 12px;
}
}
&:hover {
background: color-mix(in srgb, var(--background-color), var(--dilute-color) 10%);
}
&:hover {
background: color-mix(in srgb, var(--background-color), var(--dilute-color) 10%);
}
}
}