Skip to content

Commit 206a4e9

Browse files
committed
docs: add stories for SingleToggleGroup
1 parent b19e10d commit 206a4e9

File tree

2 files changed

+411
-4
lines changed

2 files changed

+411
-4
lines changed
Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
@use "../theme";
2+
3+
.iconButton {
4+
display: flex;
5+
align-items: center;
6+
gap: theme.spacing(2);
7+
}
8+
9+
.controlledContainer {
10+
display: flex;
11+
flex-direction: column;
12+
gap: theme.spacing(4);
13+
14+
> p {
15+
font-size: theme.font-size("sm");
16+
color: theme.color("paragraph");
17+
}
18+
}
19+
20+
.pricingContainer {
21+
display: flex;
22+
flex-direction: column;
23+
gap: theme.spacing(4);
24+
25+
> h3 {
26+
margin: 0;
27+
font-size: theme.font-size("lg");
28+
font-weight: 600;
29+
color: theme.color("heading");
30+
}
31+
}
32+
33+
.pricingDetails {
34+
padding: theme.spacing(4);
35+
background-color: theme.color("background", "secondary");
36+
border-radius: theme.border-radius("md");
37+
border: 1px solid theme.color("border");
38+
39+
> p {
40+
margin: 0;
41+
font-size: theme.font-size("sm");
42+
color: theme.color("paragraph");
43+
}
44+
}
45+
46+
.filterContainer {
47+
display: flex;
48+
flex-direction: column;
49+
gap: theme.spacing(4);
50+
51+
> p {
52+
font-size: theme.font-size("sm");
53+
color: theme.color("paragraph");
54+
}
55+
}
56+
57+
.statusOption {
58+
display: flex;
59+
align-items: center;
60+
gap: theme.spacing(2);
61+
}
62+
63+
.count {
64+
display: inline-flex;
65+
align-items: center;
66+
justify-content: center;
67+
min-width: 20px;
68+
height: 20px;
69+
padding: 0 theme.spacing(2);
70+
background-color: theme.color("background", "secondary");
71+
color: theme.color("muted");
72+
border-radius: theme.border-radius("full");
73+
font-size: theme.font-size("xs");
74+
font-weight: 500;
75+
line-height: 1;
76+
}

0 commit comments

Comments
 (0)