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
@pogseal
pogseal authored Nov 22, 2024
2 parents 045295e + 0737ce9 commit 8b1ae78
Show file tree
Hide file tree
Showing 8 changed files with 324 additions and 53 deletions.
4 changes: 2 additions & 2 deletions app/routes/_auth+/join.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,8 +63,8 @@ const JoinFormSchema = z.object({
username: z
.string()
.regex(
new RegExp(/^[a-z0-9]+(-[a-z0-9]+)*$/),
"Username contains invalid characters",
/^[a-z0-9]+(-[a-z0-9]+)*$/,
"Username can only contain lowercase letters, numbers, and hyphens. Hyphens cannot be at the start or end, and cannot be consecutive.",
)
.min(3, "Username must be at least 3 characters long")
.max(24, "Username cannot be more than 24 characters long")
Expand Down
35 changes: 25 additions & 10 deletions app/routes/_comments+/components/Comments.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,29 @@ export function Comments({
<Suspense fallback={<Loading />}>
<Await resolve={comments} errorElement={<Loading />}>
{(comments) => (
<div className="max-tablet:px-3 mx-auto max-w-[728px] laptop:w-[728px] py-6 laptop:pb-40 border-t-2 border-color-sub pt-5 mt-5">
<div className="max-tablet:px-3 mx-auto max-w-[728px] laptop:w-[728px] py-6 laptop:pb-40 pt-5">
<div className="flex items-center gap-3 pt-2 pb-4">
<div className="text-base font-header flex items-center gap-1 flex-none">
{totalComments > 0 ? (
<>
<span className="font-bold">
{totalComments}
</span>
<span className="text-1">
{`Comment${totalComments > 1 ? "s" : ""}`}
</span>
</>
) : (
<>
<Icon name="message-circle" size={16} />
<span className="text-1">
Start a discussion
</span>
</>
)}
</div>
<span className="text-1 h-0.5 w-full dark:bg-zinc-700 bg-zinc-200/70 rounded-full" />
</div>
<LoggedOut>
<div>
<div className="mb-3 text-sm">
Expand All @@ -73,15 +95,7 @@ export function Comments({
parentId={parentId}
siteId={siteId}
/>
{totalComments > 0 && (
<div className="flex items-center gap-3 pt-2 pb-4">
<div className="text-base font-header flex items-center gap-1">
<span className="font-bold">{totalComments}</span>
<span className="text-1">Comments</span>
</div>
<span className="text-1 h-0.5 w-full dark:bg-zinc-700 bg-zinc-200/70 rounded-full" />
</div>
)}

{comments && comments.length > 0
? comments.map((comment, index) => (
<CommentRow
Expand Down Expand Up @@ -149,6 +163,7 @@ function CommentRow({
return (
<>
<div
id={comment.id}
className={clsx(
isNested
? `relative before:content-[''] before:absolute before:left-3
Expand Down
11 changes: 9 additions & 2 deletions app/routes/_site+/_components/Column-4.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Fragment } from "react";
import { Fragment, useState } from "react";

import { Tab, TabGroup, TabList, TabPanel, TabPanels } from "@headlessui/react";
import { Link, useLoaderData } from "@remix-run/react";
Expand All @@ -19,6 +19,8 @@ import { useTheme } from "~/utils/client-hints";
import { Contributors } from "./Contributors";
import { AdUnit } from "./RampUnit";
import { DarkModeToggle } from "../action+/theme-toggle";
import { SideMenu } from "./sidemenu/SideMenu";
import { ViewSideMenu } from "./sidemenu/ViewSideMenu";

function AboutSection({
site,
Expand Down Expand Up @@ -92,6 +94,8 @@ export function ColumnFour() {
groupedTrendingPages.push(trendingPages.slice(i, i + 10));
}

const [editMode, setEditMode] = useState(false);

return (
<section className="relative laptop:z-50 laptop:block">
{site.enableAds ? (
Expand Down Expand Up @@ -336,7 +340,10 @@ export function ColumnFour() {
</div>
)}
</LoggedOut>
<div className="max-laptop:py-4 border-t border-color laptop:h-[54px] justify-center bg-zinc-50 laptop:bg-white dark:bg-bg2Dark flex items-center px-3.5 laptop:w-[333px] z-40 laptop:fixed bottom-0 right-0">
<div className="tablet:hidden z-10 relative border-t border-color bg-2 pb-3">
<ViewSideMenu site={site} />
</div>
<div className="max-laptop:py-4 border-t border-color laptop:h-[54px] justify-center bg-white dark:bg-bg3Dark flex items-center px-3.5 laptop:w-[333px] z-40 laptop:fixed bottom-0 right-0">
<div className="justify-between flex items-center max-laptop:max-w-[728px] w-full gap-3">
{!site.isWhiteLabel && (
<Link
Expand Down
73 changes: 40 additions & 33 deletions app/routes/_site+/_components/PrimaryMenu.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -159,41 +159,48 @@ export function PrimaryMenu({
</div>
)}
</NavLink>
<Tooltip placement="right">
<TooltipTrigger>
<div
className={clsx(
!isSidebar && "p-1.5",
"hover:dark:bg-dark350 text-left hover:bg-zinc-200/40 text-1 flex items-center gap-3 max-desktop:justify-center desktop:p-1.5 rounded-lg relative group cursor-help",
)}
>
<div className="flex items-center gap-3 w-full max-desktop:justify-center">
<div
className={clsx(
isSidebar && "max-desktop:size-8 size-6",
"dark:bg-dark450 bg-zinc-200/50 rounded-md size-6 flex items-center justify-center dark:group-hover:bg-purple-900 group-hover:bg-purple-200",
)}
>
<Icon
name="message-circle"
title="Community"
size={12}
className="dark:text-zinc-300 text-zinc-500 group-hover:dark:text-purple-300 group-hover:text-purple-500"
/>
</div>
<div
className={clsx(
isSidebar && "max-desktop:hidden",
"flex-grow font-semibold text-sm dark:text-zinc-600 text-zinc-300",
)}
>
Community
</div>
<NavLink
// prefetch="intent"
className={({ isActive }) =>
clsx(
isActive
? "bg-zinc-200/40 dark:bg-dark350"
: "hover:dark:bg-dark350 hover:bg-zinc-200/40 text-1",
!isSidebar && "p-1.5",
"flex items-center gap-3 max-desktop:justify-center desktop:p-1.5 rounded-lg relative group",
)
}
to="/community"
>
{({ isActive }) => (
<div className="flex items-center gap-3 w-full max-desktop:justify-center">
<div
className={clsx(
isActive
? "dark:bg-purple-900 bg-purple-200"
: "dark:bg-dark450 bg-zinc-200/50",
isSidebar && "max-desktop:size-8 size-6",
"dark:bg-dark450 bg-zinc-200/50 rounded-md size-6 flex items-center justify-center dark:group-hover:bg-purple-900 group-hover:bg-purple-200",
)}
>
<Icon
name="message-circle"
title="Community"
size={12}
className="dark:text-zinc-300 text-zinc-500 group-hover:dark:text-purple-300 group-hover:text-purple-500"
/>
</div>
<div
className={clsx(
isSidebar && "max-desktop:hidden",
"flex-grow font-semibold text-sm",
)}
>
Community
</div>
</div>
</TooltipTrigger>
<TooltipContent>Coming Soon</TooltipContent>
</Tooltip>
)}
</NavLink>
</div>
);
}
Loading

0 comments on commit 8b1ae78

Please sign in to comment.