codymaster 4.1.4 → 4.3.0

package/skills/cm-ux-master/output/fila/components/button/component.tsx

@@ -0,0 +1,53 @@
+"use client";
+
+import React from "react";
+import { cn } from "@/lib/utils";
+
+// Generated by UX Master Component Generator v4
+// Timestamp: 2026-02-26T00:48:30.884499
+// Source: https://templates.envytheme.com/fila/project-management.html
+
+export interface ButtonProps {
+  variant?: string;
+  size?: string;
+  disabled?: boolean;
+  loading?: boolean;
+  children: React.ReactNode;
+}
+
+export const Button = React.forwardRef<
+  HTMLBUTTONElement,
+  ButtonProps
+>((variant, size, disabled, loading, children, className, ...props}, ref) => {
+  return (
+    <BUTTON
+      ref={ref}
+      className={cn(
+        "inline-flex items-center justify-center
+        font-medium transition-colors
+        focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2
+        disabled:pointer-events-none disabled:opacity-50"
+        "  // Size: sm
+          "h-8 px-3 text-sm": size === "sm",
+          // Size: md (default)
+          "h-10 px-4 text-base": size === "md",
+          // Size: lg
+          "h-12 px-6 text-lg": size === "lg",
+          // Variant: primary
+          "text-white hover:opacity-90": variant === "primary",
+          // Variant: secondary
+          "bg-secondary text-secondary-foreground hover:bg-secondary/90": variant === "secondary",
+          // Variant: outline
+          "border border-input bg-background hover:bg-accent hover:text-accent-foreground": variant === "outline",
+          // Variant: ghost
+          "hover:bg-accent hover:text-accent-foreground": variant === "ghost",,
+        className
+      )}}
+      {...props}
+    >
+      {children}
+    </BUTTON>
+  );
+}});
+
+Button.displayName = "Button";

package/skills/cm-ux-master/output/fila/components/button/index.ts

@@ -0,0 +1 @@
+export { Button, type ButtonProps } from "./button";

package/skills/cm-ux-master/output/fila/components/card/component.tsx

@@ -0,0 +1,35 @@
+"use client";
+
+import React from "react";
+import { cn } from "@/lib/utils";
+
+// Generated by UX Master Component Generator v4
+// Timestamp: 2026-02-26T00:48:30.884518
+// Source: https://templates.envytheme.com/fila/project-management.html
+
+export interface CardProps {
+  variant?: string;
+  padding?: string;
+  children: React.ReactNode;
+}
+
+export const Card = React.forwardRef<
+  HTMLDivElement,
+  CardProps
+>((variant, padding, children, className, ...props}, ref) => {
+  return (
+    <Div
+      ref={ref}
+      className={cn(
+        "rounded-lg border bg-card text-card-foreground shadow-sm
+        transition-shadow hover:shadow-md",
+        className
+      )}}
+      {...props}
+    >
+      {children}
+    </Div>
+  );
+}});
+
+Card.displayName = "Card";

package/skills/cm-ux-master/output/fila/components/card/index.ts

@@ -0,0 +1 @@
+export { Card, type CardProps } from "./card";

package/skills/cm-ux-master/output/fila/components/input/component.tsx

@@ -0,0 +1,41 @@
+"use client";
+
+import React from "react";
+import { cn } from "@/lib/utils";
+
+// Generated by UX Master Component Generator v4
+// Timestamp: 2026-02-26T00:48:30.884527
+// Source: https://templates.envytheme.com/fila/project-management.html
+
+export interface InputProps {
+  variant?: string;
+  size?: string;
+  disabled?: boolean;
+  placeholder?: string;
+  value?: string;
+  onChange?: (value: string) => void;
+}
+
+export const Input = React.forwardRef<
+  HTMLINPUTElement,
+  InputProps
+>((variant, size, disabled, placeholder, value, onChange, className, ...props}, ref) => {
+  return (
+    <INPUT
+      ref={ref}
+      className={cn(
+        "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2
+        text-sm ring-offset-background
+        placeholder:text-muted-foreground
+        focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring
+        disabled:cursor-not-allowed disabled:opacity-50",
+        className
+      )}}
+      {...props}
+    >
+      {children}
+    </INPUT>
+  );
+}});
+
+Input.displayName = "Input";

package/skills/cm-ux-master/output/fila/components/input/index.ts

@@ -0,0 +1 @@
+export { Input, type InputProps } from "./input";

package/skills/cm-ux-master/output/fila/design-system.css

@@ -0,0 +1,151 @@
+/**
+ * Fila Design System
+ * Generated by UX Master Design System Indexer v4
+ * Timestamp: 2026-02-26T00:35:32.506002
+ * Specification: Semi Design (DouyinFE/semi-design)
+ */
+
+:root {
+
+  /* Brand Colors */
+  --semi-color-primary: #0F79F3;
+  --semi-color-primary-active: #0C60C2;
+  --semi-color-primary-disabled: #9FC9FA;
+  --semi-color-primary-hover: #0D6CDA;
+  --semi-color-primary-light-active: #C3DDFC;
+  --semi-color-primary-light-default: #E2EEFD;
+  --semi-color-primary-light-hover: #D3E6FC;
+
+  /* Semantic Colors */
+  --semi-color-danger: #FDEBF3;
+  --semi-color-danger-active: #CABCC2;
+  --semi-color-danger-disabled: #FEF7FA;
+  --semi-color-danger-hover: #E3D3DA;
+  --semi-color-danger-light-active: #FEFAFC;
+  --semi-color-danger-light-default: #FEFCFD;
+  --semi-color-danger-light-hover: #FEFBFC;
+  --semi-color-info: #F6F5FE;
+  --semi-color-info-active: #C4C4CB;
+  --semi-color-info-disabled: #FBFBFE;
+  --semi-color-info-hover: #DDDCE4;
+  --semi-color-info-light-active: #FCFCFE;
+  --semi-color-info-light-default: #FDFDFE;
+  --semi-color-info-light-hover: #FDFDFE;
+  --semi-color-success: #EAFBF2;
+  --semi-color-success-active: #BBC8C1;
+  --semi-color-success-disabled: #F6FDF9;
+  --semi-color-success-hover: #D2E1D9;
+  --semi-color-success-light-active: #F9FEFB;
+  --semi-color-success-light-default: #FCFEFD;
+  --semi-color-success-light-hover: #FBFEFC;
+  --semi-color-warning: #FFB264;
+  --semi-color-warning-active: #CC8E50;
+  --semi-color-warning-disabled: #FFE0C1;
+  --semi-color-warning-hover: #E5A05A;
+  --semi-color-warning-light-active: #FFEBD8;
+  --semi-color-warning-light-default: #FFF5EC;
+  --semi-color-warning-light-hover: #FFF1E3;
+
+  /* Neutral Scale */
+  --semi-color-neutral-100: #F7F7F7;
+  --semi-color-neutral-200: #F7F7F7;
+  --semi-color-neutral-300: #F6F5FE;
+  --semi-color-neutral-400: #F4F6FC;
+  --semi-color-neutral-50: #FFFFFF;
+  --semi-color-neutral-500: #F4F6FC;
+  --semi-color-neutral-600: #EFF3F9;
+  --semi-color-neutral-700: #E7EFFD;
+  --semi-color-neutral-800: #E7EFFD;
+  --semi-color-neutral-900: #919AA3;
+
+  /* Background Colors */
+  --semi-color-bg-0: #EFF3F9;
+  --semi-color-bg-1: #FFFFFF;
+  --semi-color-bg-3: #FFFFFF;
+
+  /* Fill Colors */
+  --semi-color-fill-0: rgba(247, 247, 247, 0.05);
+  --semi-color-fill-1: rgba(247, 247, 247, 0.1);
+  --semi-color-fill-2: rgba(247, 247, 247, 0.15);
+
+  /* Text Colors */
+  --semi-color-text-0: #919AA3;
+  --semi-color-text-1: #475569;
+
+  /* Border & Radius */
+  --border-radius-circle: 50%;
+  --border-radius-full: 100px;
+  --border-radius-lg: 50%;
+  --border-radius-md: 2px;
+  --border-radius-sm: 3px;
+  --border-radius-xs: 10px;
+  --border-thickness: 0;
+  --border-thickness-control: 1px;
+  --border-thickness-control-focus: 1px;
+  --semi-color-border: #F7F7F7;
+
+  /* Shadows */
+  --semi-color-shadow: rgba(0, 0, 0, 0.04);
+  --shadow-elevated: 0 0 1px rgba(0, 0, 0, 0.3), 0 4px 14px rgba(0, 0, 0, 0.1);
+  --shadow-lg: 0 0 1px rgba(0, 0, 0, 0.3), 0 8px 24px rgba(0, 0, 0, 0.12);
+  --shadow-sm: 0 0 1px rgba(0, 0, 0, 0.1);
+
+  /* Typography */
+  --semi-font-family-regular: Outfit, sans-serif;
+  --semi-font-size-header-1: 18px;
+  --semi-font-size-header-2: 26px;
+  --semi-font-size-header-3: 17px;
+  --semi-font-size-header-4: 16px;
+  --semi-font-size-header-5: 18px;
+  --semi-font-size-regular: 14.08px;
+  --semi-font-weight-bold: 700;
+  --semi-font-weight-light: 200;
+  --semi-font-weight-medium: 500;
+  --semi-font-weight-regular: 400;
+  --semi-font-weight-semibold: 600;
+  --semi-line-height-regular: 21.12px;
+
+  /* Spacing */
+  --spacing-base: 14px;
+  --spacing-base-loose: 18px;
+  --spacing-base-tight: 12px;
+  --spacing-extra-loose: 30px;
+  --spacing-extra-tight: 4px;
+  --spacing-loose: 22px;
+  --spacing-none: 1px;
+  --spacing-super-loose: 40px;
+  --spacing-super-tight: 1px;
+  --spacing-tight: 8px;
+
+  /* Sizing */
+  --semi-height-control-default: 32px;
+  --semi-height-control-large: 40px;
+  --semi-height-control-small: 24px;
+  --semi-width-icon-extra-large: 24px;
+  --semi-width-icon-extra-small: 8px;
+  --semi-width-icon-large: 20px;
+  --semi-width-icon-medium: 16px;
+  --semi-width-icon-small: 12px;
+
+  /* Other */
+  --semi-color-black: #000000;
+  --semi-color-disabled-bg: #F7F7F7;
+  --semi-color-disabled-text: #F4F6FC;
+  --semi-color-link: #919AA3;
+  --semi-color-overlay-bg: rgba(0, 0, 0, 0.6);
+  --semi-color-white: #FFFFFF;
+}
+
+
+/* Dark Mode */
+[data-theme="dark"], .dark {
+  --semi-color-bg-0: #16161A;
+  --semi-color-bg-1: #1E1E23;
+  --semi-color-bg-2: #232329;
+  --semi-color-bg-3: #2A2A32;
+  --semi-color-bg-4: #32323A;
+  --semi-color-text-0: #F9F9F9;
+  --semi-color-text-1: #E6E8EA;
+  --semi-color-text-2: #BBBFC4;
+  --semi-color-text-3: #8F959E;
+}