External/OpenCut
1
0
Fork 0
mirror of https://github.com/OpenCut-app/OpenCut.git synced 2026-07-13 21:52:53 +02:00
Code Issues Packages Projects Releases Wiki Activity

update usage (icons + size-)

Browse Source
This commit is contained in:
Maze Winther
2026-01-23 21:25:51 +01:00
parent c6deceaa89
commit cd0a8d020e
58 changed files with 209 additions and 200 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/app/blog/page.tsx
+1 -1
View File
@@ -60,7 +60,7 @@ function AuthorList({ authors }: { authors: Author[] }) {
<div className="flex items-center gap-2">
{authors.map((author) => (
<div key={author.id} className="flex items-center gap-2">
<Avatar className="h-6 w-6 shadow-sm">
<Avatar className="size-6 shadow-sm">
<AvatarImage src={author.image} alt={author.name} />
<AvatarFallback className="text-xs">
{author.name.charAt(0).toUpperCase()}
apps/web/src/app/contributors/page.tsx
+9 -9
View File
@@ -1,4 +1,4 @@
import { GithubIcon } from "@opencut/ui/icons";
import { OcGithubIcon } from "@opencut/ui/icons";
import { ExternalLink } from "lucide-react";
import type { Metadata } from "next";
import Link from "next/link";
@@ -101,7 +101,7 @@ export default async function ContributorsPage() {
function StatItem({ value, label }: { value: number; label: string }) {
return (
<div className="flex items-center gap-2">
<div className="bg-foreground h-2 w-2 rounded-full" />
<div className="bg-foreground size-2 rounded-full" />
<span className="font-medium">{value}</span>
<span className="text-muted-foreground">{label}</span>
</div>
@@ -187,7 +187,7 @@ function AllContributorsSection({
className="opacity-100 transition-opacity hover:opacity-70"
>
<div className="flex flex-col items-center gap-2 p-2">
<Avatar className="h-16 w-16">
<Avatar className="size-16">
<AvatarImage
src={contributor.avatar_url}
alt={`${contributor.login}'s avatar`}
@@ -214,8 +214,8 @@ function EmptyState() {
return (
<div className="flex flex-col gap-8 py-20 text-center">
<div className="flex flex-col gap-6">
<div className="bg-muted/50 mx-auto flex h-20 w-20 items-center justify-center rounded-full">
<GithubIcon className="text-muted-foreground h-8 w-8" />
<div className="bg-muted/50 mx-auto flex size-20 items-center justify-center rounded-full">
<OcGithubIcon className="text-muted-foreground size-8" />
</div>
<div className="flex flex-col gap-3">
<h3 className="text-xl font-medium">No contributors found</h3>
@@ -231,9 +231,9 @@ function EmptyState() {
rel="noopener noreferrer"
>
<Button variant="outline" className="gap-2">
<GithubIcon className="h-4 w-4" />
<OcGithubIcon />
View on GitHub
<ExternalLink className="h-4 w-4" />
<ExternalLink />
</Button>
</Link>
</div>
@@ -259,8 +259,8 @@ function ExternalToolsSection() {
>
<Card className="h-full">
<CardContent className="flex h-full flex-col gap-4 p-6 text-center">
<div className="bg-muted/50 mx-auto flex h-12 w-12 items-center justify-center rounded-full">
<tool.icon className="h-6 w-6" />
<div className="bg-muted/50 mx-auto flex size-12 items-center justify-center rounded-full">
<tool.icon className="size-6" />
</div>
<div className="flex flex-1 flex-col gap-2">
<h3 className="text-lg font-semibold">{tool.name}</h3>
apps/web/src/app/editor/[project_id]/page.tsx
+2 -2
View File
@@ -40,7 +40,7 @@ function EditorLayout() {
return (
<ResizablePanelGroup
direction="vertical"
className="h-full w-full gap-[0.18rem]"
className="size-full gap-[0.18rem]"
onLayout={(sizes) => {
setPanel("mainContent", sizes[0] ?? panels.mainContent);
setPanel("timeline", sizes[1] ?? panels.timeline);
@@ -54,7 +54,7 @@ function EditorLayout() {
>
<ResizablePanelGroup
direction="horizontal"
className="h-full w-full gap-[0.19rem] px-3"
className="size-full gap-[0.19rem] px-3"
onLayout={(sizes) => {
setPanel("tools", sizes[0] ?? panels.tools);
setPanel("preview", sizes[1] ?? panels.preview);
apps/web/src/app/projects/page-legacy.tsx
+7 -7
View File
@@ -171,7 +171,7 @@ export default function ProjectsPage() {
size="sm"
onClick={handleCancelSelection}
>
<X className="size-4!" />
<X />
Cancel
</Button>
{selectedProjects.size > 0 && (
@@ -180,7 +180,7 @@ export default function ProjectsPage() {
size="sm"
onClick={() => setIsBulkDeleteDialogOpen(true)}
>
<Trash2 className="size-4!" />
<Trash2 />
Delete ({selectedProjects.size})
</Button>
)}
@@ -210,7 +210,7 @@ export default function ProjectsPage() {
{isSelectionMode ? (
<div className="flex items-center gap-2">
<Button variant="outline" onClick={handleCancelSelection}>
<X className="size-4!" />
<X />
Cancel
</Button>
<Button
@@ -218,7 +218,7 @@ export default function ProjectsPage() {
disabled={selectedProjects.size === 0}
onClick={() => setIsBulkDeleteDialogOpen(true)}
>
<Trash2 className="size-4!" />
<Trash2 />
Delete {selectedProjects.size} projects
</Button>
</div>
@@ -429,7 +429,7 @@ function ProjectCard({
className="object-cover"
/>
) : (
<div className="bg-muted/50 flex h-full w-full items-center justify-center">
<div className="bg-muted/50 flex size-full items-center justify-center">
<Video className="text-muted-foreground size-12 shrink-0" />
</div>
)}
@@ -562,7 +562,7 @@ function ProjectsLoader() {
<div className="flex flex-col gap-1.5 px-0 pt-5">
<Skeleton className="bg-muted/50 h-4 w-3/4" />
<div className="flex items-center gap-1.5">
<Skeleton className="bg-muted/50 h-4 w-4" />
<Skeleton className="bg-muted/50 size-4" />
<Skeleton className="bg-muted/50 h-4 w-24" />
</div>
</div>
@@ -575,7 +575,7 @@ function ProjectsLoader() {
function CreateButton({ onClick }: { onClick?: () => void }) {
return (
<Button className="flex" onClick={onClick}>
<Plus className="size-4!" />
<Plus />
<span className="text-sm font-medium">New project</span>
</Button>
);
apps/web/src/app/projects/page.tsx
+9 -9
View File
@@ -110,7 +110,7 @@ export default function ProjectsPage() {
href="/projects"
className="flex items-center gap-3 rounded-2xl bg-blue-50/50 px-4 py-3 text-sm font-medium text-[#00A3FF]"
>
<LayoutGrid className="h-5 w-5" />
<LayoutGrid className="size-5" />
Projects
</a>
<div className="px-4 pt-6 pb-2">
@@ -122,14 +122,14 @@ export default function ProjectsPage() {
href="/projects"
className="flex items-center gap-3 rounded-2xl px-4 py-3 text-sm font-medium text-slate-500 hover:bg-slate-50 hover:text-slate-900"
>
<Folder className="h-5 w-5 text-slate-400" />
<Folder className="size-5 text-slate-400" />
Marketing
</a>
<a
href="/projects"
className="flex items-center gap-3 rounded-2xl px-4 py-3 text-sm font-medium text-slate-500 hover:bg-slate-50 hover:text-slate-900"
>
<Folder className="h-5 w-5 text-slate-400" />
<Folder className="size-5 text-slate-400" />
Social media
</a>
</nav>
@@ -143,7 +143,7 @@ export default function ProjectsPage() {
<div className="flex items-center gap-4">
<div className="group relative">
<Search className="absolute top-1/2 left-3.5 h-4 w-4 -translate-y-1/2 text-slate-400" />
<Search className="absolute top-1/2 left-3.5 size-4 -translate-y-1/2 text-slate-400" />
<input
type="text"
placeholder="Search..."
@@ -157,7 +157,7 @@ export default function ProjectsPage() {
className="rounded-full bg-slate-100 p-2 text-slate-900"
aria-label="Grid view"
>
<LayoutGrid className="h-4 w-4" aria-hidden="true">
<LayoutGrid className="size-4" aria-hidden="true">
<title>Grid view</title>
</LayoutGrid>
</button>
@@ -166,7 +166,7 @@ export default function ProjectsPage() {
className="rounded-full p-2 text-slate-400 hover:text-slate-600"
aria-label="List view"
>
<List className="h-4 w-4" aria-hidden="true">
<List className="size-4" aria-hidden="true">
<title>List view</title>
</List>
</button>
@@ -176,7 +176,7 @@ export default function ProjectsPage() {
type="button"
className="flex items-center gap-2 rounded-full bg-[#00A3FF] px-5 py-2.5 text-sm font-semibold text-white hover:bg-[#008BE0] active:scale-95"
>
<Plus className="h-4 w-4" />
<Plus className="size-4" />
New project
</button>
</div>
@@ -226,7 +226,7 @@ export default function ProjectsPage() {
<div className="project-select-wrapper absolute top-4 left-4 z-20">
<input
type="checkbox"
className="custom-checkbox project-select h-6 w-6 cursor-pointer shadow-md"
className="custom-checkbox project-select size-6 cursor-pointer shadow-md"
checked={isSelected}
onChange={({ currentTarget }) => {
toggleProjectSelection({
@@ -243,7 +243,7 @@ export default function ProjectsPage() {
className="rounded-full bg-white/90 p-2 text-slate-600 backdrop-blur-sm hover:bg-white hover:text-[#00A3FF]"
aria-label="Project menu"
>
<MoreHorizontal className="h-4 w-4" aria-hidden="true">
<MoreHorizontal className="size-4" aria-hidden="true">
<title>Project menu</title>
</MoreHorizontal>
</button>
apps/web/src/app/sponsors/page.tsx
+2 -2
View File
@@ -51,7 +51,7 @@ function SponsorCard({ sponsor }: { sponsor: Sponsor }) {
href={sponsor.url}
target="_blank"
rel="noopener noreferrer"
className="h-full w-full"
className="size-full"
>
<Card className="h-full">
<CardContent className="flex h-full flex-col justify-center gap-8 p-8">
@@ -67,7 +67,7 @@ function SponsorCard({ sponsor }: { sponsor: Sponsor }) {
<h3 className="text-xl font-semibold group-hover:underline">
{sponsor.name}
</h3>
<ExternalLink className="text-muted-foreground h-4 w-4" />
<ExternalLink className="text-muted-foreground size-4" />
</div>
<p className="text-muted-foreground">{sponsor.description}</p>
</div>