diff options
Diffstat (limited to 'src/app/game/page.styles.ts')
| -rw-r--r-- | src/app/game/page.styles.ts | 14 |
1 files changed, 10 insertions, 4 deletions
diff --git a/src/app/game/page.styles.ts b/src/app/game/page.styles.ts index 1ced4cc..e8a2678 100644 --- a/src/app/game/page.styles.ts +++ b/src/app/game/page.styles.ts @@ -186,11 +186,14 @@ export const LineTimingBar = styled.div` overflow: hidden; `; -export const LineTimingFill = styled.div<{ $pct: number }>` +export const LineTimingFill = styled.div.attrs<{ $pct: number }>((props) => ({ + style: { + width: `${props.$pct}%`, + }, +}))<{ $pct: number }>` height: 100%; border-radius: 2px; background: #7c3aed; - width: ${({ $pct }) => $pct}%; transition: width 0.1s linear; `; @@ -313,11 +316,14 @@ export const ProgressWrap = styled.div` cursor: pointer; `; -export const ProgressFill = styled.div<{ $pct: number }>` +export const ProgressFill = styled.div.attrs<{ $pct: number }>((props) => ({ + style: { + width: `${props.$pct}%`, + }, +}))<{ $pct: number }>` height: 100%; background: #7c3aed; border-radius: 3px; - width: ${({ $pct }) => $pct}%; transition: width 0.3s linear; `; |
