Hugging Face's logo

Spaces:
dev-jas
/
CodeMind
Running

App Files Community
CodeMind
File size: 3,620 Bytes 
80b95e8
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
123
124
125
126
127
128
129
130
131
132
133
 
@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --background: hsl(220, 13%, 9%);
  --foreground: hsl(220, 14%, 96%);
  --card: hsl(220, 13%, 11%);
  --card-foreground: hsl(220, 14%, 96%);
  --popover: hsl(220, 13%, 11%);
  --popover-foreground: hsl(220, 14%, 96%);
  --primary: hsl(210, 98%, 51%);
  --primary-foreground: hsl(220, 14%, 96%);
  --secondary: hsl(220, 13%, 15%);
  --secondary-foreground: hsl(220, 14%, 96%);
  --muted: hsl(220, 13%, 15%);
  --muted-foreground: hsl(220, 9%, 65%);
  --accent: hsl(210, 98%, 51%);
  --accent-foreground: hsl(220, 14%, 96%);
  --destructive: hsl(0, 84%, 60%);
  --destructive-foreground: hsl(220, 14%, 96%);
  --border: hsl(220, 13%, 18%);
  --input: hsl(220, 13%, 18%);
  --ring: hsl(210, 98%, 51%);
  --chart-1: hsl(210, 98%, 51%);
  --chart-2: hsl(159, 100%, 36%);
  --chart-3: hsl(42, 93%, 56%);
  --chart-4: hsl(147, 79%, 42%);
  --chart-5: hsl(341, 75%, 51%);
  --sidebar: hsl(220, 13%, 11%);
  --sidebar-foreground: hsl(220, 14%, 96%);
  --sidebar-primary: hsl(210, 98%, 51%);
  --sidebar-primary-foreground: hsl(220, 14%, 96%);
  --sidebar-accent: hsl(220, 13%, 15%);
  --sidebar-accent-foreground: hsl(210, 98%, 51%);
  --sidebar-border: hsl(220, 13%, 18%);
  --sidebar-ring: hsl(210, 98%, 51%);
  --font-sans: "Inter", "system-ui", "sans-serif";
  --font-serif: "Georgia", "serif";
  --font-mono: "JetBrains Mono", "Consolas", "monospace";
  --radius: 8px;
}

.dark {
  --background: hsl(220, 13%, 9%);
  --foreground: hsl(220, 14%, 96%);
  --card: hsl(220, 13%, 11%);
  --card-foreground: hsl(220, 14%, 96%);
  --popover: hsl(220, 13%, 11%);
  --popover-foreground: hsl(220, 14%, 96%);
  --primary: hsl(210, 98%, 51%);
  --primary-foreground: hsl(220, 14%, 96%);
  --secondary: hsl(220, 13%, 15%);
  --secondary-foreground: hsl(220, 14%, 96%);
  --muted: hsl(220, 13%, 15%);
  --muted-foreground: hsl(220, 9%, 65%);
  --accent: hsl(210, 98%, 51%);
  --accent-foreground: hsl(220, 14%, 96%);
  --destructive: hsl(0, 84%, 60%);
  --destructive-foreground: hsl(220, 14%, 96%);
  --border: hsl(220, 13%, 18%);
  --input: hsl(220, 13%, 18%);
  --ring: hsl(210, 98%, 51%);
  --chart-1: hsl(210, 98%, 51%);
  --chart-2: hsl(159, 100%, 36%);
  --chart-3: hsl(42, 93%, 56%);
  --chart-4: hsl(147, 79%, 42%);
  --chart-5: hsl(341, 75%, 51%);
  --sidebar: hsl(220, 13%, 11%);
  --sidebar-foreground: hsl(220, 14%, 96%);
  --sidebar-primary: hsl(210, 98%, 51%);
  --sidebar-primary-foreground: hsl(220, 14%, 96%);
  --sidebar-accent: hsl(220, 13%, 15%);
  --sidebar-accent-foreground: hsl(210, 98%, 51%);
  --sidebar-border: hsl(220, 13%, 18%);
  --sidebar-ring: hsl(210, 98%, 51%);
}

@layer base {
  * {
    @apply border-border;
  }

  body {
    @apply bg-background text-foreground font-sans antialiased;
    font-family: var(--font-sans);
  }

  html {
    scroll-behavior: smooth;
  }
}

@layer components {
  .syntax-highlight .keyword {
    color: hsl(210, 98%, 51%);
  }
  
  .syntax-highlight .string {
    color: hsl(42, 93%, 56%);
  }
  
  .syntax-highlight .comment {
    color: hsl(147, 79%, 42%);
    font-style: italic;
  }
  
  .syntax-highlight .function {
    color: hsl(341, 75%, 51%);
  }

  .gradient-border {
    position: relative;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    border-radius: var(--radius);
    padding: 1px;
  }
  
  .gradient-border > div {
    background: var(--card);
    border-radius: calc(var(--radius) - 1px);
  }

  .terminal-cursor {
    animation: cursor-blink 1s infinite;
  }

  @keyframes cursor-blink {
    0%, 50% { opacity: 1; }
    51%, 100% { opacity: 0; }
  }
}