Skip to content

Commit 1b0e7f3

Browse files
irsyadadlirsyadadl
committed
lfg
1 parent a73b200 commit 1b0e7f3

File tree

13 files changed

+136
-127
lines changed

13 files changed

+136
-127
lines changed

‎app/(app)/themes/themes-list.ts‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ const themesList = {
2828
"--overlay": "0 0% 100%",
2929
"--overlay-fg": "239.93 9% 4%",
3030
"--muted": "240 4% 96%",
31-
"--muted-fg": "240 3.83% 46.08%",
31+
"--muted-fg": "240 4% 41%",
3232
"--accent": "216.77 100% 50%",
3333
"--accent-fg": "0 0% 100%",
3434
"--accent-subtle": "216.92 99% 97%",
@@ -119,7 +119,7 @@ const themesList = {
119119
"--info-fg": "0 0% 100%",
120120

121121
"--muted": "240 6% 90%",
122-
"--muted-fg": "240 3.83% 46.08%",
122+
"--muted-fg": "240 4% 41%",
123123

124124
"--danger": "0.01 72% 51%",
125125
"--danger-fg": "360 86% 97%",
@@ -648,7 +648,7 @@ const themesList = {
648648
"--overlay": "0 0% 100%",
649649
"--overlay-fg": "239.93 9% 4%",
650650
"--muted": "240 4% 96%",
651-
"--muted-fg": "240 3.83% 46.08%",
651+
"--muted-fg": "240 4% 41%",
652652
"--success": "161.17 91% 31%",
653653
"--success-fg": "151.77 82% 96%",
654654
"--info": "205.77 100% 50%",
@@ -721,7 +721,7 @@ const themesList = {
721721
"--overlay": "0 0% 100%",
722722
"--overlay-fg": "239.93 9% 4%",
723723
"--muted": "240 4% 96%",
724-
"--muted-fg": "240 3.83% 46.08%",
724+
"--muted-fg": "240 4% 41%",
725725
"--success": "161.17 91% 31%",
726726
"--success-fg": "151.77 82% 96%",
727727
"--info": "205.77 100% 50%",

‎bun.lockb‎

-8.7 KB
Binary file not shown.

‎components/aside.tsx‎

Lines changed: 98 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,11 @@ import React from "react"
55
import { type Docs, docs } from "#site/content"
66
import { goodTitle, sortDocs } from "@/resources/lib/utils"
77
import { LayoutGroup, motion } from "framer-motion"
8-
import { IconChevronLeft, IconCircleHalf, IconCube, IconHighlight, IconLayers } from "justd-icons"
8+
import { IconChevronRight, IconCircleHalf, IconCube, IconHighlight, IconLayers } from "justd-icons"
99
import { Link as NextLink } from "next-view-transitions"
1010
import type { LinkProps as NextLinkProps } from "next/link"
1111
import { usePathname } from "next/navigation"
12+
import { twJoin } from "tailwind-merge"
1213
import { tv } from "tailwind-variants"
1314
import { Badge, cn, Disclosure, DisclosureGroup } from "ui"
1415

@@ -56,11 +57,11 @@ const renderHierarchy = (node: HierarchyNode, defaultValues: string[]) => {
5657
hideIndicator
5758
allowsMultipleExpanded
5859
defaultExpandedKeys={["getting-started", "components"]}
59-
className="w-full [&_.dk32xd]:p-0 [&_.zwx3ai]:p-0 [&_.zwx3ai]:border-none"
60+
className="w-full [&_.dk32xd]:p-0 flex flex-col gap-y-0.5 [&_.zwx3ai]:p-0 [&_.zwx3ai]:border-none"
6061
>
6162
{filteredNodeEntries.map(([key, value]) => (
62-
<Disclosure key={key} id={key}>
63-
<Trigger className="[&_.jr131]:size-4 py-1.5 text-fg groud-data-[open]:text-muted-fg [&_.jr131]:text-primary [&_.jr131]:fill-primary/10 dark:[&_.jr131]:fill-primary/30">
63+
<Disclosure className={({ isExpanded }) => twJoin(isExpanded && "pb-0")} key={key} id={key}>
64+
<Trigger className="[&_.jr131]:size-4 pl-2.5 pr-1 text-fg groud-data-[open]:text-muted-fg [&_.jr131]:text-muted-fg [&_.jr131]:fill-muted-fg/10 dark:[&_.jr131]:fill-muted-fg/30">
6465
{key === "getting-started" ? (
6566
<IconLayers className="jr131" />
6667
) : key === "prologue" ? (
@@ -73,97 +74,98 @@ const renderHierarchy = (node: HierarchyNode, defaultValues: string[]) => {
7374
{goodTitle(key)}
7475
</Trigger>
7576
<Disclosure.Panel>
76-
{typeof value === "object" && "title" in value ? (
77-
<AsideLink href={`/${(value as Doc).slug}`}>
78-
{goodTitle((value as Doc).title)}
79-
</AsideLink>
80-
) : (
81-
<DisclosureGroup
82-
allowsMultipleExpanded
83-
hideBorder
84-
hideIndicator
85-
defaultExpandedKeys={defaultValues}
86-
className="w-full relative"
87-
>
88-
<div className="h-full absolute left-0 bg-zinc-200 dark:bg-zinc-800 w-px ml-4" />
89-
{Object.entries(value as HierarchyNode).map(([subKey, subValue]) =>
90-
typeof subValue === "object" && "title" in subValue ? (
91-
<AsideLink
92-
className="pl-[2rem] flex justify-between items-center"
93-
key={subKey}
94-
href={`/${subValue.slug}`}
95-
>
96-
{(subValue as Doc).title}
97-
{subValue.status && (
98-
<Badge
99-
intent={
100-
subValue?.status === "wip"
101-
? "warning"
102-
: subValue?.status === "alpha"
103-
? "danger"
104-
: subValue.status === "beta"
77+
<DisclosureGroup
78+
allowsMultipleExpanded
79+
hideBorder
80+
hideIndicator
81+
defaultExpandedKeys={defaultValues}
82+
className="w-full relative"
83+
>
84+
<div className="h-full absolute left-0 bg-zinc-200 dark:bg-zinc-800 w-px ml-4" />
85+
{Object.entries(value as HierarchyNode).map(([subKey, subValue]) =>
86+
typeof subValue === "object" && "title" in subValue ? (
87+
<AsideLink
88+
className="pl-[2.1rem] flex justify-between items-center"
89+
key={subKey}
90+
href={`/${subValue.slug}`}
91+
>
92+
{(subValue as Doc).title}
93+
{subValue.status && (
94+
<Badge
95+
intent={
96+
subValue?.status === "wip"
97+
? "warning"
98+
: subValue?.status === "alpha"
99+
? "danger"
100+
: subValue.status === "beta"
101+
? "warning"
102+
: subValue.status === "help"
105103
? "warning"
106-
: subValue.status === "help"
107-
? "warning"
108-
: subValue.status === "primitive"
109-
? "secondary"
110-
: "info"
111-
}
112-
className="uppercase h-5 text-[0.5rem]"
113-
>
114-
{subValue?.status as Doc["status"]}
115-
</Badge>
104+
: subValue.status === "primitive"
105+
? "secondary"
106+
: "info"
107+
}
108+
className="uppercase h-5 text-[0.5rem]"
109+
>
110+
{subValue?.status as Doc["status"]}
111+
</Badge>
112+
)}
113+
</AsideLink>
114+
) : (
115+
<Disclosure
116+
className={({ isExpanded }) => twJoin(isExpanded && "pb-0")}
117+
key={subKey}
118+
id={subKey}
119+
>
120+
{/* Trigger components: buttons, controls, etc. */}
121+
<Trigger className="[--trigger-padding-left:2.2rem] pl-[--trigger-padding-left] pr-1">
122+
{goodTitle(subKey)}
123+
</Trigger>
124+
<Disclosure.Panel>
125+
{Object.entries(subValue as HierarchyNode).map(([childKey, childValue]) =>
126+
typeof childValue === "object" && "title" in childValue ? (
127+
<AsideLink
128+
className={cn(
129+
"ml-[-0rem] flex justify-between h-9 items-center pl-[2.2rem] pr-2",
130+
defaultValues.length > 0 && "jf320s"
131+
)}
132+
key={childKey}
133+
href={`/${childValue.slug}`}
134+
indicatorClassName=""
135+
>
136+
{(childValue as Doc).title === "Disclosure Group aka Accordion"
137+
? "Disclosure Group"
138+
: (childValue as Doc).title === "Disclosure aka Collapsible"
139+
? "Disclosure"
140+
: goodTitle((childValue as Doc).title)}
141+
{childValue.status && (
142+
<Badge
143+
intent={
144+
childValue?.status === "wip"
145+
? "primary"
146+
: childValue.status === "beta"
147+
? "warning"
148+
: childValue.status === "alpha"
149+
? "primary"
150+
: childValue.status === "help"
151+
? "warning"
152+
: childValue.status === "primitive"
153+
? "secondary"
154+
: "info"
155+
}
156+
className="capitalize h-5 text-[0.65rem]"
157+
>
158+
{childValue?.status as Doc["status"]}
159+
</Badge>
160+
)}
161+
</AsideLink>
162+
) : null
116163
)}
117-
</AsideLink>
118-
) : (
119-
<Disclosure key={subKey} id={subKey}>
120-
<Trigger className="pl-[2rem]">{goodTitle(subKey)}</Trigger>
121-
<Disclosure.Panel>
122-
{Object.entries(subValue as HierarchyNode).map(([childKey, childValue]) =>
123-
typeof childValue === "object" && "title" in childValue ? (
124-
<AsideLink
125-
className={cn(
126-
"ml-[-0rem] flex justify-between items-center pl-[3rem]",
127-
defaultValues.length > 0 && "jf320s"
128-
)}
129-
key={childKey}
130-
href={`/${childValue.slug}`}
131-
indicatorClassName=""
132-
>
133-
{(childValue as Doc).title === "Disclosure Group aka Accordion"
134-
? "Disclosure Group"
135-
: (childValue as Doc).title === "Disclosure aka Collapsible"
136-
? "Disclosure"
137-
: goodTitle((childValue as Doc).title)}
138-
{childValue.status && (
139-
<Badge
140-
intent={
141-
childValue?.status === "wip"
142-
? "primary"
143-
: childValue.status === "beta"
144-
? "warning"
145-
: childValue.status === "alpha"
146-
? "primary"
147-
: childValue.status === "help"
148-
? "warning"
149-
: childValue.status === "primitive"
150-
? "secondary"
151-
: "info"
152-
}
153-
className="capitalize h-5 text-[0.65rem]"
154-
>
155-
{childValue?.status as Doc["status"]}
156-
</Badge>
157-
)}
158-
</AsideLink>
159-
) : null
160-
)}
161-
</Disclosure.Panel>
162-
</Disclosure>
163-
)
164-
)}
165-
</DisclosureGroup>
166-
)}
164+
</Disclosure.Panel>
165+
</Disclosure>
166+
)
167+
)}
168+
</DisclosureGroup>
167169
</Disclosure.Panel>
168170
</Disclosure>
169171
))}
@@ -208,12 +210,12 @@ const Trigger = ({ children, className }: { children: React.ReactNode; className
208210
return (
209211
<Disclosure.Trigger
210212
className={cn(
211-
"group py-2 hover:text-fg pressed:text-fg aria-expanded:text-fg text-muted-fg",
213+
"group hover:text-fg hover:bg-muted/60 py-1.5 pressed:text-fg aria-expanded:text-fg",
212214
className
213215
)}
214216
>
215217
{children}
216-
<IconChevronLeft className="ml-auto group-aria-expanded:-rotate-90 transition shrink-0 duration-300" />
218+
<IconChevronRight className="ml-auto group-aria-expanded:rotate-90 transition shrink-0 duration-300" />
217219
</Disclosure.Trigger>
218220
)
219221
}
@@ -226,7 +228,7 @@ interface AsideLinkProps extends NextLinkProps {
226228
}
227229

228230
const asideLinkStyles = tv({
229-
base: "relative block focus:outline-none focus-visible:bg-secondary/70 focus-visible:ring-inset focus-visible:ring-1 focus-visible:ring-primary rounded-md px-2.5 py-2 text-base transition-colors hover:bg-secondary/70 hover:text-fg lg:text-sm",
231+
base: "relative block group focus:outline-none focus-visible:bg-muted/50 focus-visible:ring-inset focus-visible:ring-1 focus-visible:ring-primary rounded-lg pl-2.5 h-9 text-base transition-colors hover:bg-muted/60 hover:text-fg lg:text-sm",
230232
variants: {
231233
isActive: {
232234
true: "font-medium text-fg",

‎components/hero.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export function Hero() {
1818
clipPath:
1919
"polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)"
2020
}}
21-
className="relative left-[calc(50%-11rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-gradient-to-tr from-lime-500 to-primary-500 opacity-10 dark:opacity-[0.17] sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]"
21+
className="relative left-[calc(50%-11rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-gradient-to-tr dark:from-sky-500 dark:to-primary-500 opacity-10 dark:opacity-[0.17] sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]"
2222
/>
2323
</div>
2424
<svg

‎components/table-of-contents.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -113,7 +113,7 @@ function TocLink({ item, activeId }: { item: TableOfContentsProps; activeId: str
113113
<Link
114114
className={cn(
115115
"outline-none block no-underline tracking-tight lg:text-[0.885rem] duration-200",
116-
item.url.split("#")[1] === activeId ? "text-fg" : "text-muted-fg/80"
116+
item.url.split("#")[1] === activeId ? "text-fg" : "text-muted-fg/90"
117117
)}
118118
href={item.url}
119119
>

‎components/take-current-url.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ export function TakeCurrentUrl() {
1313
const [copied, setCopied] = React.useState(false)
1414
const pathname = usePathname()
1515
const text = pathname.includes("/docs")
16-
? "https://getjustd.com/d/" + pathname.split("/").pop()
16+
? "https://getjustd.com/" + pathname.split("/").pop()
1717
: "https://getjustd.com" + pathname
1818
const handleCopy = async () => {
1919
if (navigator.clipboard && window.isSecureContext) {

‎components/ui/badge.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,14 @@ const badgeIntents = {
88
primary:
99
"bg-primary/10 dark:bg-primary/15 text-primary dark:text-primary group-hover:bg-primary/15 dark:group-hover:bg-primary/20",
1010
secondary:
11-
"bg-secondary/90 group-hover:bg-secondary dark:bg-secondary/90 dark:group-hover:bg-secondary text-secondary-fg",
11+
"bg-secondary group-hover:bg-muted dark:bg-secondary dark:group-hover:bg-muted text-secondary-fg",
1212
success:
1313
"bg-emerald-500/15 text-emerald-700 group-hover:bg-emerald-500/25 dark:bg-emerald-500/10 dark:text-emerald-400 dark:group-hover:bg-emerald-500/20",
14-
info: "bg-info/15 dark:bg-info/15 text-info group-hover:bg-info/15 dark:group-hover:bg-info/10",
14+
info: "bg-info/15 dark:bg-info/15 text-info group-hover:bg-info/20 dark:group-hover:bg-info/20",
1515
warning:
16-
"bg-warning/10 dark:bg-warning/15 text-warning-fg dark:text-warning group-hover:bg-warning/15 dark:group-hover:bg-warning/10",
16+
"bg-warning/10 dark:bg-warning/15 text-warning-fg dark:text-warning group-hover:bg-warning/15 dark:group-hover:bg-warning/20",
1717
danger:
18-
"bg-danger/10 dark:bg-danger/15 text-danger group-hover:bg-danger/15 dark:group-hover:bg-danger/10"
18+
"bg-danger/10 dark:bg-danger/15 text-danger group-hover:bg-danger/15 dark:group-hover:bg-danger/20"
1919
}
2020
const badgeShapes = {
2121
square: "rounded-md px-1.5",

‎components/ui/button.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ const buttonStyles = tv(
6464
medium:
6565
"h-10 px-[calc(theme(spacing.4)-1px)] py-[calc(theme(spacing.2)-1px)] text-base lg:text-sm/6",
6666
large:
67-
"h-10 sm:h-11 px-[calc(theme(spacing.4)-1px)] sm:px-[calc(theme(spacing.5)-1px)] py-[calc(theme(spacing[2.5])-1px)] text-base lg:text-base/7 sm:[&>[data-slot=icon]]:size-5",
67+
"h-10 [&>[data-slot=icon]]:mx-[-3px] sm:h-11 px-[calc(theme(spacing.4)-1px)] sm:px-[calc(theme(spacing.5)-1px)] py-[calc(theme(spacing[2.5])-1px)] text-base lg:text-base/7 sm:[&>[data-slot=icon]]:size-5",
6868
"square-petite": "size-9 shrink-0 [&_[data-slot=icon]]:text-current"
6969
},
7070
shape: {

‎components/ui/disclosure.tsx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -66,10 +66,6 @@ const disclosureStyles = tv({
6666
},
6767
isExpanded: {
6868
true: "pb-3"
69-
},
70-
hideBorder: {
71-
true: "[&>[slot=trigger]]:py-2",
72-
false: "[&>[slot=trigger]]:py-3"
7369
}
7470
},
7571
compoundVariants: [
@@ -82,13 +78,12 @@ const disclosureStyles = tv({
8278
})
8379

8480
const Disclosure = ({ className, ...props }: DisclosureProps) => {
85-
const { hideBorder } = React.useContext(DisclosureGroupContext)
8681
return (
8782
<DisclosurePrimitive
8883
data-slot="accordion-item"
8984
{...props}
9085
className={cr(className, (className, renderProps) =>
91-
disclosureStyles({ ...renderProps, hideBorder, className })
86+
disclosureStyles({ ...renderProps, className })
9287
)}
9388
>
9489
{props.children}
@@ -101,6 +96,10 @@ const accordionTriggerStyles = tv({
10196
"flex flex-1 group rounded-lg aria-expanded:text-fg text-muted-fg sm:text-sm items-center gap-x-2 font-medium"
10297
],
10398
variants: {
99+
hideBorder: {
100+
true: "py-2",
101+
false: "py-3"
102+
},
104103
isFocused: {
105104
true: "outline-none text-fg"
106105
},
@@ -114,14 +113,15 @@ const accordionTriggerStyles = tv({
114113
})
115114

116115
const Trigger = ({ className, ...props }: ButtonProps) => {
117-
const { hideIndicator } = React.useContext(DisclosureGroupContext)
116+
const { hideIndicator, hideBorder } = React.useContext(DisclosureGroupContext)
118117
return (
119118
<Button
120119
{...props}
121120
slot="trigger"
122121
className={cr(className, (className, renderProps) =>
123122
accordionTriggerStyles({
124123
...renderProps,
124+
hideBorder,
125125
className
126126
})
127127
)}

‎components/ui/text-field.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,7 @@ const TextField = ({
7575
{isRevealable ? (
7676
<ButtonPrimitive
7777
type="button"
78+
aria-label="Toggle password visibility"
7879
onPress={handleTogglePasswordVisibility}
7980
className="atrs relative [&>[data-slot=icon]]:text-muted-fg focus:outline-none focus-visible:ring-1 focus-visible:ring-primary rounded"
8081
>

0 commit comments

Comments
 (0)