43 lines
705 B
CSS
43 lines
705 B
CSS
|
|
/* Custom Cursor */
|
||
|
|
#cursor-dot,
|
||
|
|
#cursor-dot-outline,
|
||
|
|
#cursor-circle {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
left: 50%;
|
||
|
|
z-index: 99999;
|
||
|
|
transform: translate(-50%, -50%);
|
||
|
|
transition: opacity 0.15s ease-in-out, transform 0.15s ease-in-out;
|
||
|
|
border-radius: 50%;
|
||
|
|
pointer-events: none;
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
#cursor-dot {
|
||
|
|
width: 14px;
|
||
|
|
height: 14px;
|
||
|
|
background-color: white;
|
||
|
|
}
|
||
|
|
|
||
|
|
#cursor-circle {
|
||
|
|
width: 50px;
|
||
|
|
height: 50px;
|
||
|
|
border-width: 3px;
|
||
|
|
border-style: solid;
|
||
|
|
border-color: var(--color-primary);
|
||
|
|
}
|
||
|
|
|
||
|
|
#cursor-dot-outline {
|
||
|
|
width: 13px;
|
||
|
|
height: 13px;
|
||
|
|
background-color: white;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (pointer: coarse) {
|
||
|
|
#cursor-dot,
|
||
|
|
#cursor-dot-outline,
|
||
|
|
#cursor-circle {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
}
|