feat: group and filter items by list in "on page" section

This commit is contained in:
2026-02-11 11:15:29 +03:00
parent 05209cd049
commit 068013486a
23 changed files with 853 additions and 227 deletions

View File

@@ -93,8 +93,8 @@ button:disabled {
.switch-wrapper {
position: relative;
display: inline-block;
width: 40px;
height: 22px;
width: 42px;
height: 24px;
cursor: pointer;
flex-shrink: 0;
}
@@ -114,30 +114,46 @@ button:disabled {
right: 0;
bottom: 0;
background-color: var(--input-border);
transition: 0.3s;
border-radius: 11px;
border-radius: 9999px;
box-shadow: var(--switch-track-shadow);
transition: background-color 0.25s ease, box-shadow 0.2s ease;
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
}
.switch-slider:before {
position: absolute;
content: "";
height: 16px;
width: 16px;
left: 2px;
bottom: 2px;
background-color: white;
transition: 0.3s;
width: 18px;
height: 18px;
left: 3px;
top: 3px;
background-color: var(--switch-thumb);
border-radius: 50%;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.04);
transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
}
.switch-input:checked + .switch-slider {
background-color: var(--accent);
box-shadow: var(--switch-track-shadow);
}
.switch-input:checked + .switch-slider:before {
transform: translateX(18px);
}
.switch-wrapper:hover .switch-slider:before {
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.22), 0 0 0 1px rgba(0, 0, 0, 0.04);
}
.switch-input:focus-visible + .switch-slider {
outline: 2px solid var(--accent);
outline-offset: 2px;
}
/* Switch Toggle (Checkbox Style) */
input[type="checkbox"].switch {