mirror of
https://github.com/cheeaun/phanpy.git
synced 2024-12-18 20:22:23 +03:00
Replace bull with round icon
This commit is contained in:
parent
339b66f42f
commit
5b8744ac55
3 changed files with 12 additions and 6 deletions
15
src/app.css
15
src/app.css
|
@ -1111,22 +1111,27 @@ button.carousel-dot {
|
||||||
backdrop-filter: blur(12px) invert(0.25);
|
backdrop-filter: blur(12px) invert(0.25);
|
||||||
}
|
}
|
||||||
button.carousel-dot {
|
button.carousel-dot {
|
||||||
font-weight: bold;
|
|
||||||
backdrop-filter: none !important;
|
backdrop-filter: none !important;
|
||||||
transition: all 0.2s;
|
|
||||||
}
|
}
|
||||||
button.carousel-dot[disabled] {
|
button.carousel-dot[disabled] {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
button.carousel-dot:not(.active) {
|
button.carousel-dot .icon {
|
||||||
|
transition: all 0.2s;
|
||||||
|
transform: scale(0.5);
|
||||||
|
}
|
||||||
|
button.carousel-dot:not(.active) .icon {
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
}
|
}
|
||||||
button.carousel-dot:not(.active):is(:hover, :focus) {
|
button.carousel-dot:not(.active):is(:hover, :focus) .icon {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
button.carousel-dot:is(.active, [disabled].active) {
|
button.carousel-dot:is(.active, [disabled].active) {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
transform: scale(2.2) translateY(-0.5px);
|
}
|
||||||
|
button.carousel-dot:is(.active, [disabled].active) .icon {
|
||||||
|
opacity: 1;
|
||||||
|
transform: scale(1);
|
||||||
}
|
}
|
||||||
@media (hover: hover) {
|
@media (hover: hover) {
|
||||||
.carousel-top-controls {
|
.carousel-top-controls {
|
||||||
|
|
|
@ -88,6 +88,7 @@ const ICONS = {
|
||||||
layout5: () => import('@iconify-icons/mingcute/layout-5-line'),
|
layout5: () => import('@iconify-icons/mingcute/layout-5-line'),
|
||||||
announce: () => import('@iconify-icons/mingcute/announcement-line'),
|
announce: () => import('@iconify-icons/mingcute/announcement-line'),
|
||||||
alert: () => import('@iconify-icons/mingcute/alert-line'),
|
alert: () => import('@iconify-icons/mingcute/alert-line'),
|
||||||
|
round: () => import('@iconify-icons/mingcute/round-fill'),
|
||||||
};
|
};
|
||||||
|
|
||||||
function Icon({
|
function Icon({
|
||||||
|
|
|
@ -180,7 +180,7 @@ function MediaModal({
|
||||||
carouselRef.current.focus();
|
carouselRef.current.focus();
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
•
|
<Icon icon="round" size="s" />
|
||||||
</button>
|
</button>
|
||||||
))}
|
))}
|
||||||
</span>
|
</span>
|
||||||
|
|
Loading…
Reference in a new issue