mirror of
https://github.com/System-End/YSWS-Catalog.git
synced 2026-04-19 23:23:02 +00:00
Unify hover animations for filter and sort buttons
This commit is contained in:
parent
0796432467
commit
bcd03640fb
1 changed files with 7 additions and 37 deletions
44
styles.css
44
styles.css
|
|
@ -767,27 +767,10 @@ td {
|
|||
overflow: hidden;
|
||||
}
|
||||
|
||||
.filter-btn::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 120%;
|
||||
height: 120%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
transform: translate(-50%, -50%) scale(0);
|
||||
border-radius: 50%;
|
||||
transition: transform 0.5s ease;
|
||||
}
|
||||
|
||||
.filter-btn:hover::after {
|
||||
transform: translate(-50%, -50%) scale(1);
|
||||
}
|
||||
|
||||
.filter-btn:hover {
|
||||
transform: none;
|
||||
box-shadow: none;
|
||||
background: var(--smoke);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
||||
background: rgba(236, 55, 80, 0.1);
|
||||
}
|
||||
|
||||
.filter-btn.active {
|
||||
|
|
@ -803,23 +786,9 @@ td {
|
|||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.filter-btn.user-filter::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: linear-gradient(90deg,
|
||||
rgba(255, 255, 255, 0) 0%,
|
||||
rgba(255, 255, 255, 0.1) 50%,
|
||||
rgba(255, 255, 255, 0) 100%);
|
||||
transform: translateX(-100%);
|
||||
transition: transform 0.8s ease;
|
||||
}
|
||||
|
||||
.filter-btn.user-filter:hover::before {
|
||||
transform: translateX(100%);
|
||||
.filter-btn.user-filter:hover {
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 12px rgba(236, 55, 80, 0.15);
|
||||
}
|
||||
|
||||
.category-section.hidden {
|
||||
|
|
@ -1867,6 +1836,7 @@ body.modal-open {
|
|||
.filter-btn:hover, .sort-btn:hover {
|
||||
background: rgba(236, 55, 80, 0.1);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 12px rgba(236, 55, 80, 0.15);
|
||||
}
|
||||
|
||||
.filter-btn.active, .sort-btn.active {
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue