terry/Arkie-Library-Frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: support mobile video previews

Browse Source
This commit is contained in:
TerryM
2026-06-01 16:35:40 +08:00
parent c53032155b
commit a968f47640
16 changed files with 275 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/pages/Categories/index.tsx
View File

@@ -5,6 +5,7 @@ import { CategoryIcon } from "../../components/CategoryIcon";
import { useSetPageTitle } from "../../components/PageTitleContext";
import { Skeleton } from "../../components/Skeleton";
import { langQuery, useI18n } from "../../i18n";
import { useLocalizedPath } from "../../useLocalizedPath";
import { cleanCategoryDisplayName } from "../../utils/categoryDisplay";
import { Reveal } from "../../motion";
@@ -32,6 +33,7 @@ function figmaCategoryRank(category: Category): number {
export function CategoriesPage() {
const { t, lang } = useI18n();
const lp = useLocalizedPath();
useSetPageTitle(t("categories"));
const [cats, setCats] = useState<Category[]>([]);
const [err, setErr] = useState<string | null>(null);
@@ -89,7 +91,7 @@ export function CategoriesPage() {
className="h-[88px]"
>
<Link
to={`/category/${encodeURIComponent(category.slug)}`}
to={lp(`/category/${encodeURIComponent(category.slug)}`)}
className="flex h-[88px] min-w-0 flex-col items-center justify-center gap-2 rounded-xl border border-[#27292E] bg-[#1D1E23] px-4 py-3 text-center outline-none transition hover:border-ark-gold/55 hover:bg-[#252630] focus-visible:ring-2 focus-visible:ring-ark-gold/80 focus-visible:ring-offset-2 focus-visible:ring-offset-ark-bg"
>
<CategoryIcon

6
src/pages/Home/index.tsx
View File

@@ -9,6 +9,7 @@ import { RecommendedCard } from "../../components/RecommendedCard";
import { SectionHeader } from "../../components/SectionHeader";
import { MessageBubble } from "../../components/messageStream/MessageBubble";
import { langQuery, useI18n } from "../../i18n";
import { useLocalizedPath } from "../../useLocalizedPath";
import { sourceLanguageQuery } from "../../i18nLanguages";
import { cleanCategoryDisplayName } from "../../utils/categoryDisplay";
import {
@@ -42,6 +43,7 @@ function figmaCategoryRank(category: Category): number {
export function Home() {
const { t, lang } = useI18n();
const lp = useLocalizedPath();
const { hash } = useLocation();
const [cats, setCats] = useState<Category[]>([]);
const [rec, setRec] = useState<PostBackedResource[]>([]);
@@ -298,7 +300,7 @@ export function Home() {
{page.map((c) => (
<Link
key={c.id}
to={`/category/${encodeURIComponent(c.slug)}`}
to={lp(`/category/${encodeURIComponent(c.slug)}`)}
className="flex h-[88px] min-w-0 flex-col items-center justify-center gap-2 rounded-xl border border-[#27292E] bg-[#1D1E23] px-4 py-3 text-center outline-none transition hover:border-ark-gold/55 hover:bg-[#252630] focus-visible:ring-2 focus-visible:ring-ark-gold/80 focus-visible:ring-offset-2 focus-visible:ring-offset-ark-bg"
>
<CategoryIcon
@@ -350,7 +352,7 @@ export function Home() {
{figmaOrderedCategories.map((c, index) => (
<Reveal key={c.id} delay={Math.min(index, 8) * 0.05}>
<Link
to={`/category/${encodeURIComponent(c.slug)}`}
to={lp(`/category/${encodeURIComponent(c.slug)}`)}
className="flex h-[88px] min-w-0 flex-col items-center justify-center gap-2 rounded-xl border border-[#27292E] bg-[#1D1E23] px-4 py-3 text-center outline-none transition hover:border-ark-gold/55 hover:bg-[#252630] focus-visible:ring-2 focus-visible:ring-ark-gold/80 focus-visible:ring-offset-2 focus-visible:ring-offset-ark-bg"
>
<CategoryIcon