Hugging Face's logo

Spaces:
adsurkasur
/
qr-maker
Running

App Files Community
qr-maker
File size: 2,998 Bytes
ccac56b
54bb0b3
ccac56b
 
 
54bb0b3
 
 
 
 
 
 
 
ccac56b
54bb0b3
ccac56b
54bb0b3
ccac56b
54bb0b3
 
 
 
 
 
 
 
 
 
 
ccac56b
54bb0b3
 
 
 
 
 
 
 
 
 
 
ccac56b
 
54bb0b3
 
 
 
 
ccac56b
54bb0b3
 
 
 
 
 
 
 
 
 
 
ccac56b
 
54bb0b3
 
 
 
 
ccac56b
 
 
54bb0b3
ccac56b
 
 
 
 
54bb0b3
 
 
 
 
 
ccac56b
54bb0b3
 
 
ccac56b
54bb0b3
ccac56b
 
 
 
54bb0b3
 
 
 
 
ccac56b
54bb0b3
ccac56b
 
 
 
54bb0b3
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
 
/* ========================================
   BASE STYLES - Modern Clean Design System
   ======================================== */

:root {
    /* Modern Color Palette */
    --color-primary: #6366f1;
    --color-primary-light: #818cf8;
    --color-primary-dark: #4f46e5;
    --color-accent: #8b5cf6;
    
    --color-success: #22c55e;
    --color-success-light: #4ade80;
    --color-error: #ef4444;
    --color-warning: #f59e0b;
    
    /* Neutral Palette */
    --color-white: #ffffff;
    --color-black: #0f0f0f;
    --color-gray-50: #fafafa;
    --color-gray-100: #f4f4f5;
    --color-gray-200: #e4e4e7;
    --color-gray-300: #d4d4d8;
    --color-gray-400: #a1a1aa;
    --color-gray-500: #71717a;
    --color-gray-600: #52525b;
    --color-gray-700: #3f3f46;
    --color-gray-800: #27272a;
    --color-gray-900: #18181b;
    
    /* Spacing Scale */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;
    --space-12: 48px;
    --space-16: 64px;
    
    /* Border Radius */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-full: 9999px;
    
    /* Shadows - Softer, more modern */
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.08);
    --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.12);
    --shadow-glow: 0 0 40px rgba(99, 102, 241, 0.15);
    
    /* Typography */
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    --font-mono: 'SF Mono', 'Fira Code', 'Consolas', monospace;
    
    /* Transitions */
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --duration-fast: 150ms;
    --duration-normal: 250ms;
    --duration-slow: 400ms;
}

/* Reset */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

body {
    font-family: var(--font-sans);
    background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #6366f1 100%);
    background-attachment: fixed;
    min-height: 100vh;
    padding: var(--space-6);
    color: var(--color-gray-700);
    line-height: 1.6;
}

/* Selection */
::selection {
    background: var(--color-primary);
    color: var(--color-white);
}

/* Focus States */
:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--color-gray-100);
}

::-webkit-scrollbar-thumb {
    background: var(--color-gray-300);
    border-radius: var(--radius-full);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--color-gray-400);
}