script-note/index.css at main · baska-pro/script-note · GitHub

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
@import "tailwindcss";
@custom-variant dark (&:where(.dark, .dark *));

:root {
  --bg-app: #f8fafc;
  --bg-card: #ffffff;
  --bg-hover: #f1f5f9;
  --text-main: #0f172a;
  --text-muted: #64748b;
  --border-color: #e2e8f0;
  --input-bg: #f8fafc;
}

body.theme-dark {
  --bg-app: #0f172a;
  --bg-card: #1e293b;
  --bg-hover: #334155;
  --text-main: #f1f5f9;
  --text-muted: #94a3b8;
  --border-color: #334155;
  --input-bg: #172033;
}

body.theme-sepia {
  --bg-app: #f4ecd8;
  --bg-card: #fdf6e3;
  --bg-hover: #eaddc5;
  --text-main: #433422;
  --text-muted: #786350;
  --border-color: #dcc5a6;
  --input-bg: #f8efd9;
}

html, body, #root { min-height: 100%; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--bg-app);
  color: var(--text-main);
  transition: background-color .2s ease, color .2s ease;
}
button, input, textarea, select { font: inherit; }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 2px solid #ef4444;
  outline-offset: 2px;
}
.code-font { font-family: "Cascadia Code", "SFMono-Regular", Consolas, "Liberation Mono", monospace; font-variant-ligatures: normal; }

.editor-high-contrast .token.comment,
.editor-high-contrast .token.prolog,
.editor-high-contrast .token.doctype,
.editor-high-contrast .token.cdata { color: #6a9955 !important; }
.editor-high-contrast .token.punctuation { color: #d4d4d4 !important; }
.editor-high-contrast .token.property,
.editor-high-contrast .token.tag,
.editor-high-contrast .token.boolean,
.editor-high-contrast .token.number,
.editor-high-contrast .token.constant,
.editor-high-contrast .token.symbol,
.editor-high-contrast .token.deleted { color: #b5cea8 !important; }
.editor-high-contrast .token.selector,
.editor-high-contrast .token.attr-name,
.editor-high-contrast .token.string,
.editor-high-contrast .token.char,
.editor-high-contrast .token.builtin,
.editor-high-contrast .token.inserted { color: #ce9178 !important; }
.editor-high-contrast .token.operator,
.editor-high-contrast .token.entity,
.editor-high-contrast .token.url { color: #d4d4d4 !important; }
.editor-high-contrast .token.atrule,
.editor-high-contrast .token.attr-value,
.editor-high-contrast .token.keyword { color: #c586c0 !important; }
.editor-high-contrast .token.function,
.editor-high-contrast .token.class-name { color: #dcdcaa !important; }
.editor-high-contrast .token.regex,
.editor-high-contrast .token.important,
.editor-high-contrast .token.variable { color: #d16969 !important; }
pre[class*="language-"], code[class*="language-"] {
  margin: 0 !important; padding: 0 !important; background: transparent !important;
  font-family: "Cascadia Code", "SFMono-Regular", Consolas, monospace !important;
  text-shadow: none !important;
}

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-color); border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

.no-scrollbar { scrollbar-width: none; }
.no-scrollbar::-webkit-scrollbar { display: none; }

.animate-in { animation-duration: .22s; animation-fill-mode: both; }
.fade-in { animation-name: sn-fade; }
.zoom-in-95 { animation-name: sn-zoom; }
.slide-in-from-bottom-4 { animation-name: sn-slide-bottom; }
.slide-in-from-bottom-5 { animation-name: sn-slide-bottom; }
.slide-in-from-top-1, .slide-in-from-top-2 { animation-name: sn-slide-top; }
.slide-in-from-right { animation-name: sn-slide-right; }
.scale-in-center { animation: sn-scale .18s ease-out both; }
@keyframes sn-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes sn-zoom { from { opacity: 0; transform: scale(.97); } to { opacity: 1; transform: scale(1); } }
@keyframes sn-slide-bottom { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes sn-slide-top { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes sn-slide-right { from { opacity: 0; transform: translateX(18px); } to { opacity: 1; transform: translateX(0); } }
@keyframes sn-scale { from { opacity: 0; transform: scale(.96); } to { opacity: 1; transform: scale(1); } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .001ms !important; transition-duration: .001ms !important; }
}