mirror of
https://github.com/aljazceru/landscape-template.git
synced 2025-12-30 04:24:26 +01:00
style: vote btn overlay bug on chrome
This commit is contained in:
@@ -2,7 +2,7 @@ import { MdLocalFireDepartment } from 'react-icons/md'
|
||||
import Button from 'src/Components/Button/Button'
|
||||
import { useAppSelector, usePressHolder } from 'src/utils/hooks'
|
||||
import { ComponentProps, useRef, useState } from 'react'
|
||||
import styles from './styles.module.css'
|
||||
import styles from './styles.module.scss'
|
||||
import { random, randomItem, numberFormatter } from 'src/utils/helperFunctions'
|
||||
import { useDebouncedCallback, useThrottledCallback } from '@react-hookz/web'
|
||||
|
||||
@@ -183,6 +183,7 @@ export default function VoteButton({
|
||||
${fillType === 'radial' && styles.color_overlay__radial}
|
||||
`}
|
||||
>
|
||||
<div></div>
|
||||
</div>
|
||||
<div className={`
|
||||
relative z-10
|
||||
@@ -201,15 +202,7 @@ export default function VoteButton({
|
||||
>+{increment.value}</span>)}
|
||||
|
||||
<div className="relative z-50">
|
||||
<MdLocalFireDepartment className={styles.spark}
|
||||
style={{
|
||||
opacity: 1,
|
||||
scale: 1,
|
||||
top: 0,
|
||||
left: 0,
|
||||
color: 'green'
|
||||
}}
|
||||
/>
|
||||
|
||||
{sparks.map(spark =>
|
||||
<div
|
||||
key={spark.id}
|
||||
|
||||
@@ -71,7 +71,7 @@
|
||||
transition: all 0.1s;
|
||||
}
|
||||
|
||||
.color_overlay::before {
|
||||
.color_overlay > div {
|
||||
content: "";
|
||||
background: var(--bg-color);
|
||||
width: 100%;
|
||||
@@ -79,30 +79,24 @@
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.color_overlay__background::before {
|
||||
.color_overlay__background > div {
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.color_overlay__leftRight::before {
|
||||
.color_overlay__leftRight > div {
|
||||
top: 0;
|
||||
right: 100%;
|
||||
transform: translateX(var(--offset));
|
||||
}
|
||||
|
||||
.color_overlay__upDown::before {
|
||||
.color_overlay__upDown > div {
|
||||
top: 100%;
|
||||
right: 0;
|
||||
transform: translateY(calc(-1 * var(--offset)));
|
||||
}
|
||||
|
||||
@property --offset {
|
||||
syntax: "<number>"; /* <- defined as type number for the transition to work */
|
||||
initial-value: 0%;
|
||||
inherits: false;
|
||||
}
|
||||
|
||||
.color_overlay__radial::before {
|
||||
.color_overlay__radial > div {
|
||||
top: 0;
|
||||
right: 0;
|
||||
background: radial-gradient(
|
||||
Reference in New Issue
Block a user