initial state: muzick music player + recommendation engine

2026-07-14 01:35:52 +04:00
commit 737bf19fd1
196 changed files with 32431 additions and 0 deletions
@@ -0,0 +1,84 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
+  theme: {
+    extend: {
+      fontFamily: {
+        sans: ['Geist', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'sans-serif'],
+        mono: ['Geist Mono', 'ui-monospace', 'SFMono-Regular', 'Menlo', 'monospace'],
+      },
+      fontSize: {
+        '2xs': ['11px', '14px'],
+        xs: ['12px', '16px'],
+        sm: ['14px', '20px'],
+        base: ['16px', '24px'],
+        lg: ['18px', '26px'],
+        xl: ['24px', '32px'],
+        '2xl': ['32px', '40px'],
+      },
+      colors: {
+        bg0: 'var(--ethos-bg0)',
+        bg1: 'var(--ethos-bg1)',
+        bg2: 'var(--ethos-bg2)',
+        surface0: 'var(--ethos-surface0)',
+        surface1: 'var(--ethos-surface1)',
+        surface2: 'var(--ethos-surface2)',
+        border: 'var(--ethos-border)',
+        text: 'var(--ethos-text)',
+        secondary: 'var(--ethos-secondary)',
+        muted: 'var(--ethos-muted)',
+        disabled: 'var(--ethos-disabled)',
+        accent: 'var(--ethos-accent)',
+        'accent-h': 'var(--ethos-accent-hover)',
+        green: 'var(--ethos-green)',
+        amber: 'var(--ethos-amber)',
+        red: 'var(--ethos-red)',
+        purple: 'var(--ethos-purple)',
+        cyan: 'var(--ethos-cyan)',
+        orange: 'var(--ethos-orange)',
+        'on-accent': 'var(--ethos-on-accent)',
+      },
+      borderRadius: {
+        DEFAULT: '8px',
+        sm: '4px',
+        md: '8px',
+        lg: '12px',
+        xl: '16px',
+        full: '9999px',
+      },
+      spacing: {
+        0.5: '4px',
+        1: '8px',
+        1.5: '12px',
+        2: '16px',
+        2.5: '20px',
+        3: '24px',
+        4: '32px',
+        5: '40px',
+        6: '48px',
+        7: '56px',
+        8: '64px',
+      },
+      animation: {
+        'fade-in': 'fadeIn 150ms ease both',
+        'rise': 'rise 150ms ease both',
+        'slide-in': 'slideIn 150ms ease both',
+      },
+      keyframes: {
+        fadeIn: {
+          '0%': { opacity: '0' },
+          '100%': { opacity: '1' },
+        },
+        rise: {
+          '0%': { opacity: '0', transform: 'translateY(6px)' },
+          '100%': { opacity: '1', transform: 'translateY(0)' },
+        },
+        slideIn: {
+          '0%': { opacity: '0', transform: 'translateX(8px)' },
+          '100%': { opacity: '1', transform: 'translateX(0)' },
+        },
+      },
+    },
+  },
+  plugins: [],
+};