Fix button overlap: Add spacing and styling for visibility-toggle
- Add gap: 4px to section-title to prevent button overlap - Style visibility-toggle button with blue color (vs red for Clear All) - Show/Hide both buttons on hover (previously only Clear All) - Add hover effects for both buttons
This commit is contained in:
@ -115,14 +115,17 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
gap: 4px;
|
||||||
}
|
}
|
||||||
.section-title button.clear-all {
|
.section-title button.clear-all,
|
||||||
|
.section-title button.visibility-toggle {
|
||||||
display: none;
|
display: none;
|
||||||
margin-left: auto;
|
|
||||||
}
|
}
|
||||||
.section-title:hover button.clear-all {
|
.section-title:hover button.clear-all,
|
||||||
|
.section-title:hover button.visibility-toggle {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
.visibility-toggle,
|
||||||
.clear-all {
|
.clear-all {
|
||||||
background: var(--tv-red);
|
background: var(--tv-red);
|
||||||
border: none;
|
border: none;
|
||||||
@ -132,6 +135,10 @@
|
|||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
.visibility-toggle {
|
||||||
|
background: var(--tv-blue);
|
||||||
|
}
|
||||||
|
.visibility-toggle:hover,
|
||||||
.clear-all:hover {
|
.clear-all:hover {
|
||||||
opacity: 0.9;
|
opacity: 0.9;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user