spdniloy commited on
Commit
b3c8be9
·
verified ·
1 Parent(s): 85c65cc

Upload styles/globals.css with huggingface_hub

Browse files
Files changed (1) hide show
  1. styles/globals.css +139 -0
styles/globals.css ADDED
@@ -0,0 +1,139 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ @tailwind base;
2
+ @tailwind components;
3
+ @tailwind utilities;
4
+
5
+ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
6
+
7
+ @layer base {
8
+ html {
9
+ font-family: 'Inter', system-ui, -apple-system, sans-serif;
10
+ -webkit-font-smoothing: antialiased;
11
+ -moz-osx-font-smoothing: grayscale;
12
+ }
13
+
14
+ body {
15
+ @apply bg-neutral-50 text-neutral-800;
16
+ }
17
+ }
18
+
19
+ @layer components {
20
+ .btn-primary {
21
+ @apply px-4 py-2 bg-primary-600 text-white rounded-lg font-medium
22
+ hover:bg-primary-700 transition-all duration-200
23
+ focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2
24
+ disabled:opacity-50 disabled:cursor-not-allowed;
25
+ }
26
+
27
+ .btn-secondary {
28
+ @apply px-4 py-2 bg-neutral-100 text-neutral-700 rounded-lg font-medium
29
+ hover:bg-neutral-200 transition-all duration-200
30
+ focus:outline-none focus:ring-2 focus:ring-neutral-400 focus:ring-offset-2
31
+ disabled:opacity-50 disabled:cursor-not-allowed;
32
+ }
33
+
34
+ .btn-success {
35
+ @apply px-4 py-2 bg-income-light text-income-dark rounded-lg font-medium
36
+ border border-income-DEFAULT/30
37
+ hover:bg-income-DEFAULT hover:text-white transition-all duration-200
38
+ focus:outline-none focus:ring-2 focus:ring-income-DEFAULT focus:ring-offset-2;
39
+ }
40
+
41
+ .btn-danger {
42
+ @apply px-4 py-2 bg-expense-light text-expense-dark rounded-lg font-medium
43
+ border border-expense-DEFAULT/30
44
+ hover:bg-expense-DEFAULT hover:text-white transition-all duration-200
45
+ focus:outline-none focus:ring-2 focus:ring-expense-DEFAULT focus:ring-offset-2;
46
+ }
47
+
48
+ .card {
49
+ @apply bg-white rounded-xl shadow-sm border border-neutral-100
50
+ transition-shadow duration-200 hover:shadow-md;
51
+ }
52
+
53
+ .input-field {
54
+ @apply w-full px-4 py-2.5 border border-neutral-200 rounded-lg
55
+ text-neutral-800 placeholder-neutral-400
56
+ focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent
57
+ transition-all duration-200;
58
+ }
59
+
60
+ .label {
61
+ @apply block text-sm font-medium text-neutral-700 mb-1.5;
62
+ }
63
+
64
+ .stat-card {
65
+ @apply card p-6 flex flex-col;
66
+ }
67
+
68
+ .stat-value {
69
+ @apply text-2xl font-semibold text-neutral-900;
70
+ }
71
+
72
+ .stat-label {
73
+ @apply text-sm text-neutral-500 mt-1;
74
+ }
75
+
76
+ .table-header {
77
+ @apply px-4 py-3 text-left text-xs font-semibold text-neutral-500 uppercase tracking-wider;
78
+ }
79
+
80
+ .table-cell {
81
+ @apply px-4 py-3 text-sm text-neutral-700;
82
+ }
83
+ }
84
+
85
+ @layer utilities {
86
+ .text-balance {
87
+ text-wrap: balance;
88
+ }
89
+ }
90
+
91
+ /* Smooth scroll behavior */
92
+ html {
93
+ scroll-behavior: smooth;
94
+ }
95
+
96
+ /* Custom scrollbar */
97
+ ::-webkit-scrollbar {
98
+ width: 8px;
99
+ height: 8px;
100
+ }
101
+
102
+ ::-webkit-scrollbar-track {
103
+ @apply bg-neutral-100 rounded-full;
104
+ }
105
+
106
+ ::-webkit-scrollbar-thumb {
107
+ @apply bg-neutral-300 rounded-full hover:bg-neutral-400;
108
+ }
109
+
110
+ /* Animation keyframes */
111
+ @keyframes fadeIn {
112
+ from {
113
+ opacity: 0;
114
+ transform: translateY(10px);
115
+ }
116
+ to {
117
+ opacity: 1;
118
+ transform: translateY(0);
119
+ }
120
+ }
121
+
122
+ @keyframes slideIn {
123
+ from {
124
+ opacity: 0;
125
+ transform: translateX(-10px);
126
+ }
127
+ to {
128
+ opacity: 1;
129
+ transform: translateX(0);
130
+ }
131
+ }
132
+
133
+ .animate-fadeIn {
134
+ animation: fadeIn 0.3s ease-out forwards;
135
+ }
136
+
137
+ .animate-slideIn {
138
+ animation: slideIn 0.3s ease-out forwards;
139
+ }