Skip to content

Commit 71571e7

Browse files
authored
styles: cleanup (#200)
1 parent 8093b13 commit 71571e7

8 files changed

+24
-24
lines changed

src/components/demos/button-demo.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<Button.Root
66
class="inline-flex h-12 items-center justify-center rounded-input bg-dark
77
px-[21px] text-[15px] font-semibold text-background shadow-mini
8-
transition-all hover:bg-dark/95 active:scale-98 "
8+
hover:bg-dark/95 active:scale-98 active:transition-all"
99
>
1010
Unlimited
1111
</Button.Root>

src/components/demos/calendar-demo.svelte

+4-4
Original file line numberDiff line numberDiff line change
@@ -16,13 +16,13 @@
1616
>
1717
<Calendar.Header class="flex items-center justify-between">
1818
<Calendar.PrevButton
19-
class="inline-flex items-center justify-center rounded-9px bg-background transition-all sq-10 hover:bg-muted active:scale-98"
19+
class="inline-flex items-center justify-center rounded-9px bg-background sq-10 hover:bg-muted active:scale-98 active:transition-all"
2020
>
2121
<CaretLeft class="sq-6" />
2222
</Calendar.PrevButton>
2323
<Calendar.Heading class="text-[15px] font-medium" />
2424
<Calendar.NextButton
25-
class="inline-flex items-center justify-center rounded-9px bg-background transition-all sq-10 hover:bg-muted active:scale-98"
25+
class="inline-flex items-center justify-center rounded-9px bg-background sq-10 hover:bg-muted active:scale-98 active:transition-all"
2626
>
2727
<CaretRight class="sq-6" />
2828
</Calendar.NextButton>
@@ -54,10 +54,10 @@
5454
<Calendar.Date
5555
{date}
5656
month={month.value}
57-
class="group relative inline-flex items-center justify-center whitespace-nowrap rounded-9px border border-transparent bg-transparent p-0 text-sm font-normal text-foreground transition-all sq-10 hover:border-foreground data-[disabled]:pointer-events-none data-[outside-month]:pointer-events-none data-[selected]:bg-foreground data-[selected]:font-medium data-[disabled]:text-foreground/30 data-[selected]:text-background data-[unavailable]:text-muted-foreground data-[unavailable]:line-through"
57+
class="group relative inline-flex items-center justify-center whitespace-nowrap rounded-9px border border-transparent bg-transparent p-0 text-sm font-normal text-foreground sq-10 hover:border-foreground data-[disabled]:pointer-events-none data-[outside-month]:pointer-events-none data-[selected]:bg-foreground data-[selected]:font-medium data-[disabled]:text-foreground/30 data-[selected]:text-background data-[unavailable]:text-muted-foreground data-[unavailable]:line-through"
5858
>
5959
<div
60-
class="absolute top-[5px] hidden rounded-full bg-foreground transition-all sq-1 group-data-[today]:block group-data-[selected]:bg-background"
60+
class="absolute top-[5px] hidden rounded-full bg-foreground sq-1 group-data-[today]:block group-data-[selected]:bg-background"
6161
/>
6262
{date.day}
6363
</Calendar.Date>

src/components/demos/context-menu-demo.svelte

+9-9
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
transition={flyAndScale}
2525
>
2626
<ContextMenu.Item
27-
class="flex h-10 select-none items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-medium outline-none transition-colors data-[highlighted]:bg-muted"
27+
class="flex h-10 select-none items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-medium outline-none !ring-0 !ring-transparent data-[highlighted]:bg-muted"
2828
>
2929
<div class="flex items-center">
3030
<PencilSimpleLine class="mr-2 text-foreground-alt sq-5" />
@@ -45,7 +45,7 @@
4545
</ContextMenu.Item>
4646
<ContextMenu.Sub>
4747
<ContextMenu.SubTrigger
48-
class="flex h-10 select-none items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-medium outline-none transition-colors data-[highlighted]:bg-muted data-[state=open]:bg-muted"
48+
class="flex h-10 select-none items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-medium outline-none !ring-0 !ring-transparent data-[highlighted]:bg-muted data-[state=open]:bg-muted"
4949
>
5050
<div class="flex items-center">
5151
<PlusCircle class="mr-2 text-foreground-alt sq-5" />
@@ -70,34 +70,34 @@
7070
sideOffset={10}
7171
>
7272
<ContextMenu.Item
73-
class="flex h-10 items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-normal outline-none transition-colors data-[highlighted]:bg-muted"
73+
class="flex h-10 items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-normal outline-none !ring-0 !ring-transparent data-[highlighted]:bg-muted"
7474
>
7575
Header
7676
</ContextMenu.Item>
7777
<ContextMenu.Item
78-
class="flex h-10 items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-normal outline-none transition-colors data-[highlighted]:bg-muted"
78+
class="flex h-10 items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-normal outline-none !ring-0 !ring-transparent data-[highlighted]:bg-muted"
7979
>
8080
Paragraph
8181
</ContextMenu.Item>
8282
<ContextMenu.Item
83-
class="flex h-10 items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-normal outline-none transition-colors data-[highlighted]:bg-muted"
83+
class="flex h-10 items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-normal outline-none !ring-0 !ring-transparent data-[highlighted]:bg-muted"
8484
>
8585
Codeblock
8686
</ContextMenu.Item>
8787
<ContextMenu.Item
88-
class="flex h-10 items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-normal outline-none transition-colors data-[highlighted]:bg-muted"
88+
class="flex h-10 items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-normal outline-none !ring-0 !ring-transparent data-[highlighted]:bg-muted"
8989
>
9090
List
9191
</ContextMenu.Item>
9292
<ContextMenu.Item
93-
class="flex h-10 items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-normal outline-none transition-colors data-[highlighted]:bg-muted"
93+
class="flex h-10 items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-normal outline-none !ring-0 !ring-transparent data-[highlighted]:bg-muted"
9494
>
9595
Task
9696
</ContextMenu.Item>
9797
</ContextMenu.SubContent>
9898
</ContextMenu.Sub>
9999
<ContextMenu.Item
100-
class="flex h-10 select-none items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-medium outline-none transition-colors data-[highlighted]:bg-muted"
100+
class="flex h-10 select-none items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-medium outline-none !ring-0 !ring-transparent data-[highlighted]:bg-muted"
101101
>
102102
<div class="flex items-center">
103103
<CopySimple class="mr-2 text-foreground-alt sq-5" />
@@ -118,7 +118,7 @@
118118
</ContextMenu.Item>
119119
<ContextMenu.Separator class="-mx-1 my-1 block h-px bg-muted" />
120120
<ContextMenu.Item
121-
class="flex h-10 select-none items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-medium outline-none transition-colors data-[highlighted]:bg-muted"
121+
class="flex h-10 select-none items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-medium outline-none !ring-0 !ring-transparent data-[highlighted]:bg-muted"
122122
>
123123
<div class="flex items-center">
124124
<Trash class="mr-2 text-foreground-alt sq-5" />

src/components/demos/dropdown-menu-demo.svelte

+6-6
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
class="flex h-10 select-none items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-medium outline-none transition-colors data-[highlighted]:bg-muted"
2828
>
2929
<div class="flex items-center">
30-
<UserCircle class="mr-2 text-foreground-alt sq-4" />
30+
<UserCircle class="mr-2 text-foreground-alt sq-5" />
3131
Profile
3232
</div>
3333
<div class="ml-auto flex items-center gap-px">
@@ -47,7 +47,7 @@
4747
class="flex h-10 select-none items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-medium outline-none transition-colors data-[highlighted]:bg-muted"
4848
>
4949
<div class="flex items-center">
50-
<Cardholder class="mr-2 text-foreground-alt sq-4" />
50+
<Cardholder class="mr-2 text-foreground-alt sq-5" />
5151
Billing
5252
</div>
5353
<div class="ml-auto flex items-center gap-px">
@@ -67,7 +67,7 @@
6767
class="flex h-10 select-none items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-medium outline-none transition-colors data-[highlighted]:bg-muted"
6868
>
6969
<div class="flex items-center">
70-
<GearSix class="mr-2 text-foreground-alt sq-4" />
70+
<GearSix class="mr-2 text-foreground-alt sq-5" />
7171
Settings
7272
</div>
7373
<div class="ml-auto flex items-center gap-px">
@@ -89,11 +89,11 @@
8989
class="flex h-10 select-none items-center rounded-button py-3 pl-3 pr-1.5 text-sm font-medium outline-none transition-colors data-[highlighted]:bg-muted data-[state=open]:bg-muted"
9090
>
9191
<div class="flex items-center">
92-
<UserCirclePlus class="mr-2 text-foreground-alt sq-4" />
92+
<UserCirclePlus class="mr-2 text-foreground-alt sq-5" />
9393
Invite users
9494
</div>
9595
<div class="ml-auto flex items-center gap-px">
96-
<CaretRight class="text-foreground-alt sq-4" />
96+
<CaretRight class="text-foreground-alt sq-5" />
9797
</div>
9898
</DropdownMenu.SubTrigger>
9999
<DropdownMenu.SubContent
@@ -113,7 +113,7 @@
113113
class="aspect-square h-full w-full"
114114
/>
115115
<Avatar.Fallback
116-
class="flex h-full w-full items-center justify-center rounded-full bg-muted text-xs"
116+
class="flex h-full w-full items-center justify-center rounded-full bg-muted text-xxs"
117117
>HJ</Avatar.Fallback
118118
>
119119
</Avatar.Root>

src/components/demos/select-demo.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
>
2828
{#each themes as theme}
2929
<Select.Item
30-
class="flex h-10 w-full select-none items-center rounded-button py-3 pl-5 pr-1.5 text-sm outline-none transition-all duration-75 data-[highlighted]:bg-muted/50 data-[selected]:bg-muted"
30+
class="flex h-10 w-full select-none items-center rounded-button py-3 pl-5 pr-1.5 text-sm outline-none transition-all duration-75 data-[highlighted]:bg-muted/50"
3131
value={theme.value}
3232
label={theme.label}
3333
>

src/components/demos/slider-demo.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
let value = [50];
55
</script>
66

7-
<div class="w-full md:max-w-[75%]">
7+
<div class="w-full md:max-w-[280px]">
88
<Slider.Root
99
bind:value
1010
class="relative flex w-full touch-none select-none items-center"

src/components/demos/toggle-demo.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
</script>
88

99
<div
10-
class="min-h-input flex h-full w-[176px] items-center gap-2 rounded-card-sm border border-muted bg-background py-1 pl-[18px] pr-1.5 shadow-mini"
10+
class="min-h-input flex h-full w-[176px] items-center gap-2 rounded-card-sm border border-border bg-background py-1 pl-[18px] pr-1.5 shadow-mini"
1111
>
1212
<div
1313
class="text-end font-alt text-[19px] tracking-[13.87px] {unlocked

src/components/demos/toggle-group-demo.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
<ToggleGroup.Root
99
bind:value
1010
type="multiple"
11-
class="flex h-input items-center gap-x-0.5 rounded-card-sm border border-muted bg-background px-[5px] py-1 shadow-mini"
11+
class="flex h-input items-center gap-x-0.5 rounded-card-sm border border-border bg-background px-[5px] py-1 shadow-mini"
1212
>
1313
<ToggleGroup.Item
1414
aria-label="toggle bold"

0 commit comments

Comments
 (0)