mirror of
https://github.com/block/goose.git
synced 2026-07-17 12:56:20 +02:00
fix: Reduce clock size by 10% and remove circular border
- Reduced clock from 112px (w-28) to 96px (w-24) - 10% smaller - Removed circular border (border-2 border-text-muted/20) - Adjusted all clock elements proportionally: - Hour markers: transform origin 46px (from 52px) - Hour hand: h-9 (from h-10) - Minute hand: h-11 (from h-12) - Second hand: h-12 (from h-14) - Cleaner, minimalist appearance - Better fit in 160x140px widget tile
This commit is contained in:
@@ -190,17 +190,14 @@ export const CondensedNavigation: React.FC<CondensedNavigationProps> = ({
|
||||
|
||||
return (
|
||||
<div className="w-full h-full flex items-center justify-center">
|
||||
<div className="relative w-28 h-28">
|
||||
{/* Clock face */}
|
||||
<div className="absolute inset-0 rounded-full border-2 border-text-muted/20" />
|
||||
|
||||
<div className="relative w-24 h-24">
|
||||
{/* Hour markers */}
|
||||
{[...Array(12)].map((_, i) => (
|
||||
<div
|
||||
key={i}
|
||||
className="absolute w-1 h-3 bg-text-muted/40 top-2 left-1/2 -translate-x-1/2"
|
||||
style={{
|
||||
transformOrigin: '50% 52px',
|
||||
transformOrigin: '50% 46px',
|
||||
transform: `translateX(-50%) rotate(${i * 30}deg)`,
|
||||
}}
|
||||
/>
|
||||
@@ -208,7 +205,7 @@ export const CondensedNavigation: React.FC<CondensedNavigationProps> = ({
|
||||
|
||||
{/* Hour hand */}
|
||||
<div
|
||||
className="absolute w-1.5 h-10 bg-text-default rounded-full top-1/2 left-1/2 -translate-x-1/2 origin-bottom transition-transform duration-1000 ease-linear"
|
||||
className="absolute w-1.5 h-9 bg-text-default rounded-full top-1/2 left-1/2 -translate-x-1/2 origin-bottom transition-transform duration-1000 ease-linear"
|
||||
style={{
|
||||
transform: `translateX(-50%) translateY(-100%) rotate(${hourAngle}deg)`,
|
||||
}}
|
||||
@@ -216,7 +213,7 @@ export const CondensedNavigation: React.FC<CondensedNavigationProps> = ({
|
||||
|
||||
{/* Minute hand */}
|
||||
<div
|
||||
className="absolute w-1 h-12 bg-text-default rounded-full top-1/2 left-1/2 -translate-x-1/2 origin-bottom transition-transform duration-1000 ease-linear"
|
||||
className="absolute w-1 h-11 bg-text-default rounded-full top-1/2 left-1/2 -translate-x-1/2 origin-bottom transition-transform duration-1000 ease-linear"
|
||||
style={{
|
||||
transform: `translateX(-50%) translateY(-100%) rotate(${minuteAngle}deg)`,
|
||||
}}
|
||||
@@ -224,7 +221,7 @@ export const CondensedNavigation: React.FC<CondensedNavigationProps> = ({
|
||||
|
||||
{/* Second hand */}
|
||||
<div
|
||||
className="absolute w-0.5 h-14 bg-red-500 rounded-full top-1/2 left-1/2 -translate-x-1/2 origin-bottom transition-transform duration-1000 ease-linear"
|
||||
className="absolute w-0.5 h-12 bg-red-500 rounded-full top-1/2 left-1/2 -translate-x-1/2 origin-bottom transition-transform duration-1000 ease-linear"
|
||||
style={{
|
||||
transform: `translateX(-50%) translateY(-100%) rotate(${secondAngle}deg)`,
|
||||
}}
|
||||
|
||||
Reference in New Issue
Block a user