list optimization
All checks were successful
Deploy Sokko G / deploy (push) Successful in 7s

This commit is contained in:
Shinuwa 2026-07-24 17:29:08 +02:00
parent 8b9171d4f9
commit ef5f977f8a
15 changed files with 3571 additions and 272 deletions

View file

@ -778,12 +778,26 @@ textarea:focus {
font-size: var(--font-size-sm);
}
.checklist-section.is-collapsed .checklist-section-header h3 {
.checklist-gender-symbol {
display: inline-block;
margin-left: 3px;
color: currentColor;
font-family: "Segoe UI Symbol", "Noto Sans Symbols 2", "Noto Sans Symbols", "Apple Symbols", sans-serif;
font-size: 1.18em;
font-weight: 900;
line-height: 1;
text-shadow:
0 0 0 currentColor,
0 0 4px rgba(246, 196, 83, 0.22);
transform: translateY(1px);
}
.checklist-section.is-complete .checklist-section-header h3 {
color: var(--color-text-muted);
text-decoration: line-through;
}
.checklist-section-header span {
.checklist-section-header > div > span {
flex: 0 0 auto;
padding: 3px 9px;
border: 1px solid rgba(246, 196, 83, 0.22);
@ -794,53 +808,38 @@ textarea:focus {
font-weight: 800;
}
.checklist-hide-toggle {
.checklist-complete-mode-button {
display: inline-grid;
grid-template-columns: 18px 34px;
width: fit-content;
width: 36px;
min-width: 36px;
min-height: 34px;
align-items: center;
gap: 8px;
padding: 0 6px 0 10px;
place-items: center;
padding: 0;
border: 1px solid rgba(165, 180, 252, 0.12);
border-radius: var(--radius-pill);
border-radius: 0;
background: rgba(5, 7, 17, 0.24);
color: var(--color-text-secondary);
font-size: var(--font-size-sm);
font-size: var(--font-size-xs);
font-weight: 800;
}
.checklist-hide-toggle .ui-icon {
.checklist-complete-mode-button:first-child {
border-radius: var(--radius-pill) 0 0 var(--radius-pill);
}
.checklist-complete-mode-button:last-child {
border-radius: 0 var(--radius-pill) var(--radius-pill) 0;
}
.checklist-complete-mode-button + .checklist-complete-mode-button {
margin-left: -1px;
}
.checklist-complete-mode-button .ui-icon {
width: 16px;
height: 16px;
}
.checklist-hide-toggle i {
position: relative;
display: block;
width: 34px;
height: 18px;
border: 1px solid rgba(165, 180, 252, 0.18);
border-radius: var(--radius-pill);
background: rgba(7, 10, 24, 0.72);
}
.checklist-hide-toggle i::before {
content: "";
position: absolute;
top: 50%;
left: 3px;
width: 12px;
height: 12px;
border-radius: 50%;
background: var(--color-text-muted);
transform: translateY(-50%);
transition:
left var(--duration-fast) var(--ease-standard),
background-color var(--duration-fast) var(--ease-standard),
box-shadow var(--duration-fast) var(--ease-standard);
}
.checklist-section-collapse-button {
display: inline-grid;
width: 30px;
@ -1230,8 +1229,8 @@ textarea:focus {
.module-scroll-button.active,
.calculator-scroll-toggle:hover,
.calculator-scroll-toggle.active,
.checklist-hide-toggle:hover,
.checklist-hide-toggle.active {
.checklist-complete-mode-button:hover,
.checklist-complete-mode-button.active {
border-color: rgba(196, 181, 253, 0.32);
background:
linear-gradient(135deg, rgba(31, 37, 68, 0.94), rgba(18, 22, 44, 0.96)) padding-box,
@ -1286,23 +1285,22 @@ textarea:focus {
.module-scroll-button.active,
.calculator-scroll-toggle.active,
.checklist-hide-toggle.active {
.checklist-complete-mode-button.active {
border-color: rgba(246, 196, 83, 0.34);
background:
linear-gradient(135deg, rgba(72, 43, 160, 0.82), rgba(45, 52, 146, 0.8)) padding-box,
linear-gradient(135deg, rgba(246, 196, 83, 0.58), rgba(139, 92, 246, 0.32)) border-box;
color: var(--color-text-primary);
}
.module-scroll-button.active i,
.calculator-scroll-toggle.active i,
.checklist-hide-toggle.active i {
.calculator-scroll-toggle.active i {
border-color: rgba(246, 196, 83, 0.36);
background: rgba(246, 196, 83, 0.12);
}
.module-scroll-button.active i::before,
.calculator-scroll-toggle.active i::before,
.checklist-hide-toggle.active i::before {
.calculator-scroll-toggle.active i::before {
left: 17px;
background: var(--color-accent-gold);
box-shadow: 0 0 10px rgba(246, 196, 83, 0.28);