Skip to content

Commit

Permalink
Merge branch 'manawiki:main' into main
Browse files Browse the repository at this point in the history
  • Loading branch information
xHomu authored Mar 7, 2024
2 parents a78a3c2 + daf4ce0 commit dfe1174
Show file tree
Hide file tree
Showing 11 changed files with 180 additions and 182 deletions.
6 changes: 3 additions & 3 deletions app/components/Headers.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ export const H2 = ({ text }: { text: string | undefined }) => {
>
<div
className="pattern-dots absolute left-0
top-0 -z-0 h-full
top-0 -z-0 h-full dark:text-zinc-100
w-full pattern-bg-white pattern-zinc-400 pattern-opacity-10
pattern-size-4 dark:pattern-zinc-500 dark:pattern-bg-bg3Dark"
/>
Expand All @@ -28,11 +28,11 @@ export const H2Plain = ({
<h2
className={clsx(
className,
"flex items-center gap-3 py-2 font-header text-xl scroll-mt-32 laptop:scroll-mt-16",
"flex items-center dark:text-zinc-100 gap-3 mt-6 mb-2 font-header text-2xl scroll-mt-32 laptop:scroll-mt-16",
)}
>
<div className="flex-none">{text}</div>
<div className="h-0.5 w-full rounded-full bg-zinc-100 dark:bg-dark400" />
<div className="h-1 w-full rounded-full bg-zinc-100 dark:bg-dark400" />
</h2>
);
};
10 changes: 4 additions & 6 deletions app/components/Table.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -148,7 +148,7 @@ interface TableHeaderProps extends React.ComponentPropsWithoutRef<"th"> {
}

export function TableHeader({ className, center, ...props }: TableHeaderProps) {
let { bleed, grid, framed } = useContext(TableContext);
let { grid, framed } = useContext(TableContext);

return (
<th
Expand All @@ -157,9 +157,8 @@ export function TableHeader({ className, center, ...props }: TableHeaderProps) {
className,
center && "text-center",
framed && "bg-zinc-50 dark:bg-dark400",
"border-b border-color-sub font-semibold px-4 py-2.5 first:pl-[var(--gutter,theme(spacing.2))] last:pr-[var(--gutter,theme(spacing.2))]",
"border-b border-color-sub font-semibold px-3 py-2.5",
grid && "border-l border-color-sub first:border-l-0",
!bleed && "tablet:first:pl-2 tablet:last:pr-2",
)}
/>
);
Expand All @@ -177,7 +176,7 @@ export function TableCell({
bold,
...props
}: TableCellProps) {
let { bleed, dense, grid, striped, framed } = useContext(TableContext);
let { dense, grid, striped, framed } = useContext(TableContext);
let { href, target, title } = useContext(TableRowContext);
let [cellRef, setCellRef] = useState<HTMLElement | null>(null);

Expand All @@ -189,11 +188,10 @@ export function TableCell({
className,
center && "text-center",
bold && "font-bold",
"relative px-4 first:pl-[var(--gutter,theme(spacing.2))] last:pr-[var(--gutter,theme(spacing.2))]",
"relative px-3",
!striped && !framed && "border-b border-color",
grid && "border-l border-color-sub first:border-l-0",
dense ? "py-2.5" : "py-4",
!bleed && "tablet:first:pl-2 tablet:last:pr-2",
)}
>
{href && (
Expand Down
12 changes: 4 additions & 8 deletions app/routes/_editor+/core/components/EditorBlocks.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -145,13 +145,14 @@ export function EditorBlocks({
return (
<h2
id={id}
className="flex items-center gap-3 py-2 font-header text-xl scroll-mt-32 laptop:scroll-mt-16"
className="flex items-center dark:text-zinc-100 gap-3 mt-6 mb-2 font-header text-2xl
scroll-mt-32 laptop:scroll-mt-16"
{...attributes}
>
<div className="min-w-[10px] flex-none">{children}</div>
<div
contentEditable={false}
className="h-0.5 w-full rounded-full bg-zinc-100 dark:bg-dark400"
className="h-1 w-full rounded-full bg-zinc-100 dark:bg-dark400"
/>
</h2>
);
Expand All @@ -160,12 +161,7 @@ export function EditorBlocks({
//@ts-ignore
const id = urlSlug(element?.children[0]?.text ?? undefined);
return (
<h3
id={id}
className="font-header text-lg mt-3 mb-1.5
scroll-mt-44 laptop:scroll-mt-52"
{...attributes}
>
<h3 id={id} {...attributes}>
{children}
</h3>
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -135,7 +135,10 @@ export function SubSectionTabs({
{tabs?.map((section) => {
return (
<div key={section.id}>
<H2Plain text={section?.name} />
<H2Plain
text={section?.name}
className="text-xl dark:text-zinc-300"
/>
<SubSection
customData={customData}
//@ts-ignore
Expand Down
2 changes: 1 addition & 1 deletion app/routes/_site+/c_+/_components/CollectionHeader.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -164,7 +164,7 @@ export function CollectionHeader({
</div>
</div>
</div>
<section className="border-b border-zinc-200/50 dark:border-darkBorder max-tablet:px-3 pb-1 [clip-path:inset(0px_-10px_-10px_-10px)] relative z-10">
<section className="border-b border-zinc-200/50 dark:border-darkBorder shadow-sm max-tablet:px-3 pb-1 [clip-path:inset(0px_-10px_-10px_-10px)] relative z-10">
<div
className="mx-auto max-w-[728px] flex items-center border-t max-tablet:mr-5
py-2.5 border-zinc-200/50 dark:border-zinc-700/40 overflow-auto"
Expand Down
8 changes: 4 additions & 4 deletions app/routes/_site+/p+/components/PostTableOfContents.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -86,14 +86,14 @@ export function PostTableOfContents({
)}
{row.type == "h3" && (
<div className="pb-1 pl-0.5 -ml-[3px]">
<div className="group py-1 flex items-center relative hover:underline dark:decoration-zinc-500 decoration-zinc-300">
<div className="group flex w-full items-center relative hover:underline dark:decoration-zinc-500 decoration-zinc-300">
<div
className="w-[5px] h-4 group-hover:bg-zinc-300 -ml-[1px]
bg-zinc-200 dark:bg-dark500 rounded-r-sm dark:group-hover:bg-dark500"
className="w-[4px] h-4 group-hover:bg-zinc-300 -ml-[1px]
bg-zinc-200 dark:bg-dark450 rounded-r-sm dark:group-hover:bg-dark500"
/>
<Link
to={`#${row.slug}`}
className="font-semibold text-xs pl-[19px] text-1"
className="font-semibold text-sm rounded-lg pl-2.5 mx-3 dark:hover:bg-dark400 hover:bg-zinc-100 text-1 w-full py-1 block"
>
{row.name}
</Link>
Expand Down
8 changes: 4 additions & 4 deletions app/routes/_site+/settings+/components/PermissionTable.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,9 +12,9 @@ import { TextLink } from "~/components/Text";

export function PermissionTable() {
return (
<div className="tablet:px-3">
<H2Plain text="Permissions" className="!text-base pl-0.5" />
<Table grid dense framed>
<>
<H2Plain text="Permissions" className="!text-lg pl-0.5 !mt-6" />
<Table grid framed>
<TableHead>
<TableRow>
<TableHeader>Permission</TableHeader>
Expand Down Expand Up @@ -315,6 +315,6 @@ export function PermissionTable() {
</TableRow>
</TableBody>
</Table>
</div>
</>
);
}
192 changes: 94 additions & 98 deletions app/routes/_site+/settings+/team.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -92,106 +92,102 @@ export default function Members() {
const { team, applications, user } = useLoaderData<typeof loader>();
return (
<div className="space-y-3">
<div className="tablet:px-3 pb-5">
<H2Plain text="Team members" className="!text-base pl-0.5" />
<Table framed dense>
<TableBody>
{team.map((member) => (
<TableRow key={member.id}>
<TableCell className="w-full">
<div className="flex items-center gap-3">
<Avatar
src={member?.avatar?.url}
initials={member?.username.charAt(0)}
className="size-6"
/>
<div>{member.username}</div>
</div>
</TableCell>
<TableCell className="text-zinc-500 text-right">
<RoleBadge role={member.role} />
</TableCell>
<RoleActions currentUser={user} member={member} />
</TableRow>
))}
</TableBody>
</Table>
</div>
<div className="tablet:px-3 pb-5">
<H2Plain text="Applications" className="!text-base pl-0.5" />
<Suspense fallback={<DotLoader />}>
<Await resolve={applications}>
{(applications) => (
<>
{applications.length > 0 ? (
<Table framed dense>
<TableHead>
<TableRow>
<TableHeader>User</TableHeader>
<TableHeader>Submitted</TableHeader>

<TableHeader>Status</TableHeader>
<TableHeader className="relative w-0">
<span className="sr-only">View</span>
</TableHeader>
</TableRow>
</TableHead>
<TableBody>
{applications.map((application) => (
<TableRow key={application.id}>
<TableCell className="w-full">
<div className="flex items-center gap-3">
<Avatar
src={
application.createdBy?.avatar
?.url
}
// @ts-ignore
initials={application?.createdBy?.username.charAt(
0,
)}
className="size-6"
/>
<div>
{application.createdBy.username}
</div>
</div>
</TableCell>
<TableCell>
{new Date(
application.createdAt as string,
).toLocaleTimeString("en-US", {
month: "short",
day: "numeric",
timeZone: "America/Los_Angeles",
})}
</TableCell>
<TableCell>
<ApplicationStatus
status={application.status}
/>
</TableCell>
<TableCell>
<ApplicationViewer
application={
application as SiteApplication
<H2Plain text="Team members" className="!text-lg pl-0.5 !mt-0" />
<Table framed dense>
<TableBody>
{team.map((member) => (
<TableRow key={member.id}>
<TableCell className="w-full">
<div className="flex items-center gap-3">
<Avatar
src={member?.avatar?.url}
initials={member?.username.charAt(0)}
className="size-6"
/>
<div>{member.username}</div>
</div>
</TableCell>
<TableCell className="text-zinc-500 text-right">
<RoleBadge role={member.role} />
</TableCell>
<RoleActions currentUser={user} member={member} />
</TableRow>
))}
</TableBody>
</Table>
<H2Plain text="Applications" className="!text-lg pl-0.5 !mt-6" />
<Suspense fallback={<DotLoader />}>
<Await resolve={applications}>
{(applications) => (
<>
{applications.length > 0 ? (
<Table framed dense>
<TableHead>
<TableRow>
<TableHeader>User</TableHeader>
<TableHeader>Submitted</TableHeader>

<TableHeader>Status</TableHeader>
<TableHeader className="relative w-0">
<span className="sr-only">View</span>
</TableHeader>
</TableRow>
</TableHead>
<TableBody>
{applications.map((application) => (
<TableRow key={application.id}>
<TableCell className="w-full">
<div className="flex items-center gap-3">
<Avatar
src={
application.createdBy?.avatar
?.url
}
// @ts-ignore
initials={application?.createdBy?.username.charAt(
0,
)}
className="size-6"
/>
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
) : (
<Text className="border-y tablet:border border-color-sub p-4 tablet:rounded-lg -mx-3 shadow-1 shadow-sm">
No applications to review...
</Text>
)}
</>
)}
</Await>
</Suspense>
</div>
<div>
{application.createdBy.username}
</div>
</div>
</TableCell>
<TableCell>
{new Date(
application.createdAt as string,
).toLocaleTimeString("en-US", {
month: "short",
day: "numeric",
timeZone: "America/Los_Angeles",
})}
</TableCell>
<TableCell>
<ApplicationStatus
status={application.status}
/>
</TableCell>
<TableCell>
<ApplicationViewer
application={
application as SiteApplication
}
/>
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
) : (
<Text className="border-y tablet:border border-color-sub p-4 tablet:rounded-lg -mx-3 shadow-1 shadow-sm">
No applications to review...
</Text>
)}
</>
)}
</Await>
</Suspense>
<PermissionTable />
</div>
);
Expand Down
2 changes: 1 addition & 1 deletion app/styles/global.css
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@
@apply border-[#ededed] dark:border-zinc-700;
}
h3 {
@apply font-header text-lg mt-3 mb-1.5 scroll-mt-44 laptop:scroll-mt-52;
@apply font-header dark:text-zinc-100 text-lg mt-4 mb-0.5 scroll-mt-32 laptop:scroll-mt-20;
}
/* table {
@apply border-collapse;
Expand Down
Loading

0 comments on commit dfe1174

Please sign in to comment.