@mgks/docmd 0.2.0 → 0.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/css/welcome.css +6 -66
- package/config.js +10 -5
- package/docs/configuration.md +11 -5
- package/docs/content/custom-containers.md +24 -0
- package/docs/content/no-style-example.md +2 -0
- package/docs/content/no-style-pages.md +52 -28
- package/docs/index.md +49 -18
- package/docs/plugins/seo.md +80 -33
- package/package.json +13 -7
- package/src/assets/css/docmd-main.css +5 -1167
- package/src/assets/css/docmd-theme-retro.css +3 -806
- package/src/assets/css/docmd-theme-ruby.css +7 -617
- package/src/assets/css/docmd-theme-sky.css +7 -650
- package/src/assets/js/docmd-image-lightbox.js +5 -1
- package/src/assets/js/docmd-main.js +89 -29
- package/src/commands/build.js +62 -120
- package/src/commands/dev.js +2 -1
- package/src/commands/init.js +4 -0
- package/src/core/config-loader.js +2 -0
- package/src/core/file-processor.js +130 -97
- package/src/core/html-generator.js +31 -12
- package/src/core/icon-renderer.js +3 -2
- package/src/plugins/analytics.js +5 -1
- package/src/plugins/seo.js +114 -66
- package/src/plugins/sitemap.js +6 -0
- package/src/templates/layout.ejs +8 -2
- package/src/templates/no-style.ejs +23 -6
- package/src/templates/partials/theme-init.js +26 -0
|
@@ -1,812 +1,9 @@
|
|
|
1
|
+
/* Source file from the docmd project — https://github.com/mgks/docmd */
|
|
2
|
+
|
|
1
3
|
/*
|
|
2
4
|
* docmd Retro Theme
|
|
3
5
|
* Inspired by 1980s-90s computing aesthetics
|
|
4
6
|
* Features: Neon colors, scanlines, terminal styling, glow effects
|
|
5
7
|
*/
|
|
6
8
|
|
|
7
|
-
:root {
|
|
8
|
-
/* Dark Mode Colors (Default) */
|
|
9
|
-
--retro-primary: #0a0a0a; /* Deep terminal black */
|
|
10
|
-
--retro-secondary: #1a1a1a; /* Dark charcoal */
|
|
11
|
-
--retro-bg-light: #0f0f0f; /* Slightly lighter black */
|
|
12
|
-
--retro-text: #00ff41; /* Classic phosphor green */
|
|
13
|
-
--retro-text-secondary: #ffb000; /* Amber yellow */
|
|
14
|
-
--retro-text-muted: #888888; /* Muted gray */
|
|
15
|
-
|
|
16
|
-
/* Accent Colors - Neon Palette */
|
|
17
|
-
--retro-accent: #00ffff; /* Neon cyan */
|
|
18
|
-
--retro-danger: #ff1493; /* Hot pink */
|
|
19
|
-
--retro-warning: #ffb000; /* Amber */
|
|
20
|
-
--retro-success: #00ff41; /* Phosphor green */
|
|
21
|
-
--retro-info: #0066ff; /* Electric blue */
|
|
22
|
-
|
|
23
|
-
/* Borders and Effects */
|
|
24
|
-
--retro-border: #333333;
|
|
25
|
-
--retro-border-bright: #00ffff;
|
|
26
|
-
--retro-glow: 0 0 10px currentColor;
|
|
27
|
-
--retro-glow-soft: 0 0 5px currentColor;
|
|
28
|
-
--retro-shadow: 0 0 20px rgba(0, 255, 255, 0.3);
|
|
29
|
-
|
|
30
|
-
/* Typography */
|
|
31
|
-
--retro-font-family: 'Fira Code', 'Courier New', 'Consolas', monospace;
|
|
32
|
-
--retro-font-family-alt: 'Share Tech Mono', 'Courier New', monospace;
|
|
33
|
-
|
|
34
|
-
/* Spacing */
|
|
35
|
-
--retro-spacing: 1rem;
|
|
36
|
-
--retro-spacing-small: 0.5rem;
|
|
37
|
-
--retro-spacing-large: 2rem;
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
/* Light Mode Colors */
|
|
41
|
-
body[data-theme="light"] {
|
|
42
|
-
--retro-primary: #f0f0f0; /* Light gray background */
|
|
43
|
-
--retro-secondary: #e0e0e0; /* Lighter gray */
|
|
44
|
-
--retro-bg-light: #f5f5f5; /* Very light gray */
|
|
45
|
-
--retro-text: #2d5d2d; /* Dark green text */
|
|
46
|
-
--retro-text-secondary: #8b4500; /* Dark amber */
|
|
47
|
-
--retro-text-muted: #666666; /* Muted dark gray */
|
|
48
|
-
|
|
49
|
-
/* Accent Colors for Light Mode */
|
|
50
|
-
--retro-accent: #006666; /* Dark cyan */
|
|
51
|
-
--retro-danger: #b71c42; /* Dark pink */
|
|
52
|
-
--retro-warning: #b8860b; /* Dark amber */
|
|
53
|
-
--retro-success: #228b22; /* Dark green */
|
|
54
|
-
--retro-info: #4169e1; /* Royal blue */
|
|
55
|
-
|
|
56
|
-
/* Borders and Effects for Light Mode */
|
|
57
|
-
--retro-border: #cccccc;
|
|
58
|
-
--retro-border-bright: #006666;
|
|
59
|
-
--retro-glow: 0 0 5px currentColor;
|
|
60
|
-
--retro-glow-soft: 0 0 3px currentColor;
|
|
61
|
-
--retro-shadow: 0 0 15px rgba(0, 102, 102, 0.2);
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
/* Global Styles */
|
|
65
|
-
* {
|
|
66
|
-
box-sizing: border-box;
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
body {
|
|
70
|
-
font-family: var(--retro-font-family);
|
|
71
|
-
background: var(--retro-primary);
|
|
72
|
-
color: var(--retro-text);
|
|
73
|
-
line-height: 1.6;
|
|
74
|
-
margin: 0;
|
|
75
|
-
padding: 0;
|
|
76
|
-
min-height: 100vh;
|
|
77
|
-
position: relative;
|
|
78
|
-
overflow-x: hidden;
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
/* Scanline Effect */
|
|
82
|
-
body::before {
|
|
83
|
-
content: '';
|
|
84
|
-
position: fixed;
|
|
85
|
-
top: 0;
|
|
86
|
-
left: 0;
|
|
87
|
-
width: 100%;
|
|
88
|
-
height: 100%;
|
|
89
|
-
background: linear-gradient(
|
|
90
|
-
transparent 50%,
|
|
91
|
-
rgba(0, 255, 65, 0.03) 50%
|
|
92
|
-
);
|
|
93
|
-
background-size: 100% 4px;
|
|
94
|
-
pointer-events: none;
|
|
95
|
-
z-index: 1000;
|
|
96
|
-
animation: scanlines 0.1s linear infinite;
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
/* Light mode scanlines */
|
|
100
|
-
body[data-theme="light"]::before {
|
|
101
|
-
background: linear-gradient(
|
|
102
|
-
transparent 50%,
|
|
103
|
-
rgba(45, 93, 45, 0.02) 50%
|
|
104
|
-
);
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
/* Light mode page header adjustments */
|
|
108
|
-
body[data-theme="light"] .page-header {
|
|
109
|
-
box-shadow: 0 2px 10px rgba(0, 102, 102, 0.2);
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
body[data-theme="light"] .page-header::after {
|
|
113
|
-
background: linear-gradient(90deg, transparent, var(--retro-accent), transparent);
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
@keyframes scanlines {
|
|
117
|
-
0% { transform: translateY(0); }
|
|
118
|
-
100% { transform: translateY(4px); }
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
/* CRT Flicker Effect */
|
|
122
|
-
@keyframes flicker {
|
|
123
|
-
0%, 100% { opacity: 1; }
|
|
124
|
-
98% { opacity: 0.98; }
|
|
125
|
-
99% { opacity: 0.99; }
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
.page-container {
|
|
129
|
-
animation: flicker 3s infinite;
|
|
130
|
-
}
|
|
131
|
-
|
|
132
|
-
/* Typography */
|
|
133
|
-
h1, h2, h3, h4, h5, h6 {
|
|
134
|
-
color: var(--retro-accent);
|
|
135
|
-
font-family: var(--retro-font-family);
|
|
136
|
-
text-transform: uppercase;
|
|
137
|
-
letter-spacing: 2px;
|
|
138
|
-
text-shadow: var(--retro-glow-soft);
|
|
139
|
-
margin: var(--retro-spacing-large) 0 var(--retro-spacing);
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
h1 {
|
|
143
|
-
font-size: 2.5rem;
|
|
144
|
-
border-bottom: 2px solid var(--retro-accent);
|
|
145
|
-
padding-bottom: 0.5rem;
|
|
146
|
-
animation: glow-pulse 2s ease-in-out infinite alternate;
|
|
147
|
-
}
|
|
148
|
-
|
|
149
|
-
@keyframes glow-pulse {
|
|
150
|
-
from { text-shadow: 0 0 5px var(--retro-accent); }
|
|
151
|
-
to { text-shadow: 0 0 15px var(--retro-accent), 0 0 25px var(--retro-accent); }
|
|
152
|
-
}
|
|
153
|
-
|
|
154
|
-
h2 {
|
|
155
|
-
font-size: 2rem;
|
|
156
|
-
color: var(--retro-text-secondary);
|
|
157
|
-
}
|
|
158
|
-
|
|
159
|
-
h3 {
|
|
160
|
-
font-size: 1.5rem;
|
|
161
|
-
color: var(--retro-text);
|
|
162
|
-
}
|
|
163
|
-
|
|
164
|
-
p {
|
|
165
|
-
margin: var(--retro-spacing) 0;
|
|
166
|
-
text-shadow: 0 0 2px currentColor;
|
|
167
|
-
}
|
|
168
|
-
|
|
169
|
-
a {
|
|
170
|
-
color: var(--retro-accent);
|
|
171
|
-
text-decoration: none;
|
|
172
|
-
position: relative;
|
|
173
|
-
text-shadow: var(--retro-glow-soft);
|
|
174
|
-
transition: all 0.3s ease;
|
|
175
|
-
}
|
|
176
|
-
|
|
177
|
-
a:hover {
|
|
178
|
-
color: var(--retro-danger);
|
|
179
|
-
text-shadow: var(--retro-glow);
|
|
180
|
-
}
|
|
181
|
-
|
|
182
|
-
/* Only add > to content links, not logo or special elements */
|
|
183
|
-
.page-content a:before,
|
|
184
|
-
.sidebar-nav a:before {
|
|
185
|
-
content: '>';
|
|
186
|
-
margin-right: 0.25rem;
|
|
187
|
-
animation: blink 1s infinite;
|
|
188
|
-
}
|
|
189
|
-
|
|
190
|
-
/* Don't add > to logo, buttons, or nav items */
|
|
191
|
-
.page-header a:before,
|
|
192
|
-
.docmd-button:before,
|
|
193
|
-
.page-nav a:before {
|
|
194
|
-
display: none;
|
|
195
|
-
}
|
|
196
|
-
|
|
197
|
-
@keyframes blink {
|
|
198
|
-
0%, 50% { opacity: 1; }
|
|
199
|
-
51%, 100% { opacity: 0; }
|
|
200
|
-
}
|
|
201
|
-
|
|
202
|
-
/* Code Styling */
|
|
203
|
-
code {
|
|
204
|
-
background: var(--retro-secondary);
|
|
205
|
-
color: var(--retro-text-secondary);
|
|
206
|
-
padding: 0.2rem 0.4rem;
|
|
207
|
-
border-radius: 3px;
|
|
208
|
-
font-family: var(--retro-font-family);
|
|
209
|
-
border: 1px solid var(--retro-border);
|
|
210
|
-
box-shadow: inset 0 0 5px rgba(0, 255, 65, 0.2);
|
|
211
|
-
}
|
|
212
|
-
|
|
213
|
-
pre {
|
|
214
|
-
background: var(--retro-secondary) !important;
|
|
215
|
-
color: var(--retro-text) !important;
|
|
216
|
-
padding: var(--retro-spacing);
|
|
217
|
-
border-radius: 8px;
|
|
218
|
-
border: 1px solid var(--retro-border-bright);
|
|
219
|
-
box-shadow: var(--retro-shadow);
|
|
220
|
-
overflow-x: auto;
|
|
221
|
-
position: relative;
|
|
222
|
-
padding-top: 2rem;
|
|
223
|
-
|
|
224
|
-
}
|
|
225
|
-
|
|
226
|
-
/* Force code block background in light mode */
|
|
227
|
-
body[data-theme="light"] pre {
|
|
228
|
-
background: var(--retro-secondary) !important;
|
|
229
|
-
color: var(--retro-text) !important;
|
|
230
|
-
}
|
|
231
|
-
|
|
232
|
-
body[data-theme="light"] code {
|
|
233
|
-
background: var(--retro-secondary) !important;
|
|
234
|
-
color: var(--retro-text-secondary) !important;
|
|
235
|
-
box-shadow: inset 0 0 5px rgba(45, 93, 45, 0.2);
|
|
236
|
-
}
|
|
237
|
-
|
|
238
|
-
pre::before {
|
|
239
|
-
content: '[TERMINAL]';
|
|
240
|
-
position: absolute;
|
|
241
|
-
top: 5px;
|
|
242
|
-
left: 5px;
|
|
243
|
-
background: var(--retro-primary);
|
|
244
|
-
color: var(--retro-accent);
|
|
245
|
-
padding: 0.2rem 0.5rem;
|
|
246
|
-
font-size: 0.7rem;
|
|
247
|
-
border: 1px solid var(--retro-border-bright);
|
|
248
|
-
border-radius: 3px;
|
|
249
|
-
|
|
250
|
-
}
|
|
251
|
-
|
|
252
|
-
/* Layout Components */
|
|
253
|
-
.page-header {
|
|
254
|
-
background: linear-gradient(45deg, var(--retro-secondary), var(--retro-bg-light));
|
|
255
|
-
border-bottom: 2px solid var(--retro-border-bright);
|
|
256
|
-
padding: var(--retro-spacing);
|
|
257
|
-
box-shadow: 0 2px 10px rgba(0, 255, 255, 0.3);
|
|
258
|
-
position: relative;
|
|
259
|
-
}
|
|
260
|
-
|
|
261
|
-
.page-header::after {
|
|
262
|
-
content: '';
|
|
263
|
-
position: absolute;
|
|
264
|
-
bottom: -2px;
|
|
265
|
-
left: 0;
|
|
266
|
-
width: 100%;
|
|
267
|
-
height: 2px;
|
|
268
|
-
background: linear-gradient(90deg, transparent, var(--retro-accent), transparent);
|
|
269
|
-
animation: scan 2s ease-in-out infinite;
|
|
270
|
-
}
|
|
271
|
-
|
|
272
|
-
@keyframes scan {
|
|
273
|
-
0%, 100% { transform: scaleX(0); }
|
|
274
|
-
50% { transform: scaleX(1); }
|
|
275
|
-
}
|
|
276
|
-
|
|
277
|
-
.sidebar {
|
|
278
|
-
background: var(--retro-secondary);
|
|
279
|
-
border-right: 2px solid var(--retro-border-bright);
|
|
280
|
-
box-shadow: 2px 0 10px rgba(0, 255, 255, 0.2);
|
|
281
|
-
}
|
|
282
|
-
|
|
283
|
-
.sidebar-nav a {
|
|
284
|
-
display: block;
|
|
285
|
-
padding: 0.75rem var(--retro-spacing);
|
|
286
|
-
border-bottom: 1px solid var(--retro-border);
|
|
287
|
-
transition: all 0.3s ease;
|
|
288
|
-
font-family: var(--retro-font-family);
|
|
289
|
-
}
|
|
290
|
-
|
|
291
|
-
.sidebar-nav a:hover,
|
|
292
|
-
.sidebar-nav a.active {
|
|
293
|
-
background: var(--retro-bg-light);
|
|
294
|
-
border-left: 4px solid var(--retro-accent);
|
|
295
|
-
box-shadow: inset 0 0 10px rgba(0, 255, 255, 0.2);
|
|
296
|
-
}
|
|
297
|
-
|
|
298
|
-
/* Ensure sidebar text is readable in light mode */
|
|
299
|
-
body[data-theme="light"] .sidebar-nav a {
|
|
300
|
-
color: var(--retro-text);
|
|
301
|
-
}
|
|
302
|
-
|
|
303
|
-
body[data-theme="light"] .sidebar-nav a:hover,
|
|
304
|
-
body[data-theme="light"] .sidebar-nav a.active {
|
|
305
|
-
background: var(--retro-bg-light);
|
|
306
|
-
border-left: 4px solid var(--retro-accent);
|
|
307
|
-
box-shadow: inset 0 0 10px rgba(0, 102, 102, 0.2);
|
|
308
|
-
}
|
|
309
|
-
|
|
310
|
-
/* Buttons */
|
|
311
|
-
.docmd-button,
|
|
312
|
-
button,
|
|
313
|
-
.btn {
|
|
314
|
-
background: linear-gradient(145deg, var(--retro-secondary), var(--retro-bg-light));
|
|
315
|
-
color: var(--retro-accent);
|
|
316
|
-
border: 2px solid var(--retro-border-bright);
|
|
317
|
-
padding: 0.75rem 1.5rem;
|
|
318
|
-
font-family: var(--retro-font-family);
|
|
319
|
-
font-weight: bold;
|
|
320
|
-
text-transform: uppercase;
|
|
321
|
-
letter-spacing: 1px;
|
|
322
|
-
cursor: pointer;
|
|
323
|
-
transition: all 0.3s ease;
|
|
324
|
-
position: relative;
|
|
325
|
-
text-decoration: none;
|
|
326
|
-
display: inline-block;
|
|
327
|
-
box-shadow: 0 4px 15px rgba(0, 255, 255, 0.3);
|
|
328
|
-
}
|
|
329
|
-
|
|
330
|
-
.docmd-button:hover,
|
|
331
|
-
button:hover,
|
|
332
|
-
.btn:hover {
|
|
333
|
-
background: linear-gradient(145deg, var(--retro-bg-light), var(--retro-secondary));
|
|
334
|
-
color: var(--retro-danger);
|
|
335
|
-
box-shadow: 0 6px 20px rgba(255, 20, 147, 0.4);
|
|
336
|
-
transform: translateY(-2px);
|
|
337
|
-
}
|
|
338
|
-
|
|
339
|
-
.docmd-button:active,
|
|
340
|
-
button:active,
|
|
341
|
-
.btn:active {
|
|
342
|
-
transform: translateY(0);
|
|
343
|
-
box-shadow: 0 2px 10px rgba(0, 255, 255, 0.5);
|
|
344
|
-
}
|
|
345
|
-
|
|
346
|
-
/* Container Styles */
|
|
347
|
-
.docmd-container {
|
|
348
|
-
background: var(--retro-secondary);
|
|
349
|
-
border: 2px solid var(--retro-border);
|
|
350
|
-
border-radius: 8px;
|
|
351
|
-
padding: var(--retro-spacing);
|
|
352
|
-
margin: var(--retro-spacing) 0;
|
|
353
|
-
position: relative;
|
|
354
|
-
box-shadow: var(--retro-shadow);
|
|
355
|
-
}
|
|
356
|
-
|
|
357
|
-
.docmd-container::before {
|
|
358
|
-
content: attr(data-type);
|
|
359
|
-
position: absolute;
|
|
360
|
-
top: -15px;
|
|
361
|
-
left: 5px;
|
|
362
|
-
background: var(--retro-primary);
|
|
363
|
-
color: var(--retro-accent);
|
|
364
|
-
padding: 0.25rem 0.75rem;
|
|
365
|
-
border: 1px solid var(--retro-border-bright);
|
|
366
|
-
border-radius: 3px;
|
|
367
|
-
font-size: 0.8rem;
|
|
368
|
-
text-transform: uppercase;
|
|
369
|
-
letter-spacing: 1px;
|
|
370
|
-
|
|
371
|
-
}
|
|
372
|
-
|
|
373
|
-
/* Callout Containers */
|
|
374
|
-
.docmd-container.callout.info {
|
|
375
|
-
border-color: var(--retro-info);
|
|
376
|
-
box-shadow: 0 0 15px rgba(0, 102, 255, 0.3);
|
|
377
|
-
}
|
|
378
|
-
|
|
379
|
-
.docmd-container.callout.warning {
|
|
380
|
-
border-color: var(--retro-warning);
|
|
381
|
-
box-shadow: 0 0 15px rgba(255, 176, 0, 0.3);
|
|
382
|
-
}
|
|
383
|
-
|
|
384
|
-
.docmd-container.callout.danger {
|
|
385
|
-
border-color: var(--retro-danger);
|
|
386
|
-
box-shadow: 0 0 15px rgba(255, 20, 147, 0.3);
|
|
387
|
-
}
|
|
388
|
-
|
|
389
|
-
.docmd-container.callout.tip {
|
|
390
|
-
border-color: var(--retro-success);
|
|
391
|
-
box-shadow: 0 0 15px rgba(0, 255, 65, 0.3);
|
|
392
|
-
}
|
|
393
|
-
|
|
394
|
-
.docmd-container.callout.success {
|
|
395
|
-
border-color: var(--retro-success);
|
|
396
|
-
box-shadow: 0 0 15px rgba(0, 255, 65, 0.3);
|
|
397
|
-
}
|
|
398
|
-
|
|
399
|
-
/* Callout Titles with Retro Auto Emojis */
|
|
400
|
-
.callout-title {
|
|
401
|
-
font-weight: bold;
|
|
402
|
-
margin-bottom: 0.75em;
|
|
403
|
-
display: flex;
|
|
404
|
-
align-items: center;
|
|
405
|
-
text-transform: uppercase;
|
|
406
|
-
letter-spacing: 1px;
|
|
407
|
-
text-shadow: var(--retro-glow-soft);
|
|
408
|
-
}
|
|
409
|
-
|
|
410
|
-
.callout-title::before {
|
|
411
|
-
margin-right: 0.5rem;
|
|
412
|
-
font-size: 1.2em;
|
|
413
|
-
text-shadow: none;
|
|
414
|
-
}
|
|
415
|
-
|
|
416
|
-
.callout-info .callout-title::before {
|
|
417
|
-
content: "🖥️";
|
|
418
|
-
}
|
|
419
|
-
|
|
420
|
-
.callout-warning .callout-title::before {
|
|
421
|
-
content: "⚠️";
|
|
422
|
-
}
|
|
423
|
-
|
|
424
|
-
.callout-tip .callout-title::before {
|
|
425
|
-
content: "💾";
|
|
426
|
-
}
|
|
427
|
-
|
|
428
|
-
.callout-danger .callout-title::before {
|
|
429
|
-
content: "🚨";
|
|
430
|
-
}
|
|
431
|
-
|
|
432
|
-
.callout-success .callout-title::before {
|
|
433
|
-
content: "✅";
|
|
434
|
-
}
|
|
435
|
-
|
|
436
|
-
/* Card Containers */
|
|
437
|
-
.docmd-container.card {
|
|
438
|
-
background: linear-gradient(145deg, var(--retro-secondary), var(--retro-bg-light));
|
|
439
|
-
border: 1px solid var(--retro-border-bright);
|
|
440
|
-
box-shadow:
|
|
441
|
-
0 4px 15px rgba(0, 255, 255, 0.2),
|
|
442
|
-
inset 0 0 10px rgba(0, 255, 65, 0.1);
|
|
443
|
-
}
|
|
444
|
-
|
|
445
|
-
/* Tabs Container - Retro Style */
|
|
446
|
-
.docmd-tabs {
|
|
447
|
-
border: 2px solid var(--retro-border-bright);
|
|
448
|
-
border-radius: 8px;
|
|
449
|
-
overflow: hidden;
|
|
450
|
-
background: var(--retro-secondary);
|
|
451
|
-
box-shadow: var(--retro-shadow);
|
|
452
|
-
position: relative;
|
|
453
|
-
}
|
|
454
|
-
|
|
455
|
-
.docmd-tabs::before {
|
|
456
|
-
content: '[TABS]';
|
|
457
|
-
position: absolute;
|
|
458
|
-
top: -12px;
|
|
459
|
-
left: 20px;
|
|
460
|
-
background: var(--retro-primary);
|
|
461
|
-
color: var(--retro-accent);
|
|
462
|
-
padding: 0.25rem 0.75rem;
|
|
463
|
-
border: 1px solid var(--retro-border-bright);
|
|
464
|
-
border-radius: 3px;
|
|
465
|
-
font-size: 0.7rem;
|
|
466
|
-
text-transform: uppercase;
|
|
467
|
-
z-index: 1;
|
|
468
|
-
}
|
|
469
|
-
|
|
470
|
-
.docmd-tabs-nav {
|
|
471
|
-
background: linear-gradient(90deg, var(--retro-bg-light), var(--retro-secondary));
|
|
472
|
-
display: flex;
|
|
473
|
-
border-bottom: 2px solid var(--retro-border-bright);
|
|
474
|
-
}
|
|
475
|
-
|
|
476
|
-
.docmd-tabs-nav-item {
|
|
477
|
-
padding: 1rem 1.5rem;
|
|
478
|
-
cursor: pointer;
|
|
479
|
-
color: var(--retro-text-secondary);
|
|
480
|
-
font-weight: bold;
|
|
481
|
-
border-right: 1px solid var(--retro-border);
|
|
482
|
-
transition: all 0.3s ease;
|
|
483
|
-
position: relative;
|
|
484
|
-
text-transform: uppercase;
|
|
485
|
-
letter-spacing: 1px;
|
|
486
|
-
font-family: var(--retro-font-family);
|
|
487
|
-
}
|
|
488
|
-
|
|
489
|
-
.docmd-tabs-nav-item:last-child {
|
|
490
|
-
border-right: none;
|
|
491
|
-
}
|
|
492
|
-
|
|
493
|
-
.docmd-tabs-nav-item:hover {
|
|
494
|
-
background: var(--retro-bg-light);
|
|
495
|
-
color: var(--retro-accent);
|
|
496
|
-
box-shadow: inset 0 0 10px rgba(0, 255, 255, 0.2);
|
|
497
|
-
}
|
|
498
|
-
|
|
499
|
-
.docmd-tabs-nav-item.active {
|
|
500
|
-
background: var(--retro-primary);
|
|
501
|
-
color: var(--retro-accent);
|
|
502
|
-
border-bottom: 2px solid var(--retro-accent);
|
|
503
|
-
box-shadow: 0 0 15px rgba(0, 255, 255, 0.5);
|
|
504
|
-
}
|
|
505
|
-
|
|
506
|
-
.docmd-tabs-nav-item.active::after {
|
|
507
|
-
content: '_';
|
|
508
|
-
animation: blink 1s infinite;
|
|
509
|
-
margin-left: 0.25rem;
|
|
510
|
-
}
|
|
511
|
-
|
|
512
|
-
.docmd-tab-pane {
|
|
513
|
-
display: none;
|
|
514
|
-
padding: var(--retro-spacing-large);
|
|
515
|
-
animation: fadeInCRT 0.5s ease;
|
|
516
|
-
}
|
|
517
|
-
|
|
518
|
-
.docmd-tab-pane.active {
|
|
519
|
-
display: block;
|
|
520
|
-
}
|
|
521
|
-
|
|
522
|
-
@keyframes fadeInCRT {
|
|
523
|
-
0% {
|
|
524
|
-
opacity: 0;
|
|
525
|
-
transform: scaleY(0.1) scaleX(1);
|
|
526
|
-
filter: brightness(2);
|
|
527
|
-
}
|
|
528
|
-
50% {
|
|
529
|
-
opacity: 0.5;
|
|
530
|
-
transform: scaleY(0.5) scaleX(1);
|
|
531
|
-
}
|
|
532
|
-
100% {
|
|
533
|
-
opacity: 1;
|
|
534
|
-
transform: scaleY(1) scaleX(1);
|
|
535
|
-
filter: brightness(1);
|
|
536
|
-
}
|
|
537
|
-
}
|
|
538
|
-
|
|
539
|
-
/* Steps Container - Retro Style */
|
|
540
|
-
.docmd-container.steps {
|
|
541
|
-
background: linear-gradient(145deg, var(--retro-secondary), var(--retro-bg-light));
|
|
542
|
-
border: 2px solid var(--retro-border-bright);
|
|
543
|
-
border-radius: 8px;
|
|
544
|
-
padding: var(--retro-spacing-large);
|
|
545
|
-
position: relative;
|
|
546
|
-
box-shadow: var(--retro-shadow);
|
|
547
|
-
}
|
|
548
|
-
|
|
549
|
-
.docmd-container.steps::before {
|
|
550
|
-
content: '[SEQUENCE]';
|
|
551
|
-
position: absolute;
|
|
552
|
-
top: -12px;
|
|
553
|
-
left: 20px;
|
|
554
|
-
background: var(--retro-primary);
|
|
555
|
-
color: var(--retro-text-secondary);
|
|
556
|
-
padding: 0.25rem 0.75rem;
|
|
557
|
-
border: 1px solid var(--retro-border-bright);
|
|
558
|
-
border-radius: 3px;
|
|
559
|
-
font-size: 0.7rem;
|
|
560
|
-
text-transform: uppercase;
|
|
561
|
-
letter-spacing: 1px;
|
|
562
|
-
}
|
|
563
|
-
|
|
564
|
-
.docmd-container.steps ol.steps-list {
|
|
565
|
-
counter-reset: step-counter;
|
|
566
|
-
list-style: none;
|
|
567
|
-
padding-left: 0;
|
|
568
|
-
}
|
|
569
|
-
|
|
570
|
-
.docmd-container.steps ol.steps-list > li.step-item {
|
|
571
|
-
counter-increment: step-counter;
|
|
572
|
-
position: relative;
|
|
573
|
-
padding: var(--retro-spacing) 0 var(--retro-spacing) 4rem;
|
|
574
|
-
border-bottom: 1px solid var(--retro-border);
|
|
575
|
-
margin-bottom: var(--retro-spacing);
|
|
576
|
-
}
|
|
577
|
-
|
|
578
|
-
.docmd-container.steps ol.steps-list > li.step-item:last-child {
|
|
579
|
-
border-bottom: none;
|
|
580
|
-
margin-bottom: 0;
|
|
581
|
-
}
|
|
582
|
-
|
|
583
|
-
.docmd-container.steps ol.steps-list > li.step-item::before {
|
|
584
|
-
content: counter(step-counter);
|
|
585
|
-
position: absolute;
|
|
586
|
-
left: 0;
|
|
587
|
-
top: var(--retro-spacing);
|
|
588
|
-
width: 2.5rem;
|
|
589
|
-
height: 2.5rem;
|
|
590
|
-
background: linear-gradient(145deg, var(--retro-accent), var(--retro-info));
|
|
591
|
-
color: var(--retro-primary);
|
|
592
|
-
border: 2px solid var(--retro-border-bright);
|
|
593
|
-
border-radius: 4px;
|
|
594
|
-
display: flex;
|
|
595
|
-
align-items: center;
|
|
596
|
-
justify-content: center;
|
|
597
|
-
font-weight: bold;
|
|
598
|
-
font-size: 1.2rem;
|
|
599
|
-
text-shadow: none;
|
|
600
|
-
box-shadow:
|
|
601
|
-
0 0 10px rgba(0, 255, 255, 0.5),
|
|
602
|
-
inset 0 0 5px rgba(0, 0, 0, 0.3);
|
|
603
|
-
animation: pulse-glow 2s ease-in-out infinite;
|
|
604
|
-
}
|
|
605
|
-
|
|
606
|
-
@keyframes pulse-glow {
|
|
607
|
-
0%, 100% { box-shadow: 0 0 10px rgba(0, 255, 255, 0.5), inset 0 0 5px rgba(0, 0, 0, 0.3); }
|
|
608
|
-
50% { box-shadow: 0 0 20px rgba(0, 255, 255, 0.8), inset 0 0 10px rgba(0, 0, 0, 0.5); }
|
|
609
|
-
}
|
|
610
|
-
|
|
611
|
-
.docmd-container.steps ol.steps-list > li.step-item::after {
|
|
612
|
-
content: '';
|
|
613
|
-
position: absolute;
|
|
614
|
-
left: 1.2rem;
|
|
615
|
-
top: 4rem;
|
|
616
|
-
bottom: -1rem;
|
|
617
|
-
width: 2px;
|
|
618
|
-
background: linear-gradient(180deg, var(--retro-accent), transparent);
|
|
619
|
-
box-shadow: 0 0 3px var(--retro-accent);
|
|
620
|
-
}
|
|
621
|
-
|
|
622
|
-
.docmd-container.steps ol.steps-list > li.step-item:last-child::after {
|
|
623
|
-
display: none;
|
|
624
|
-
}
|
|
625
|
-
|
|
626
|
-
/* Ensure regular lists inside steps maintain default styling */
|
|
627
|
-
.docmd-container.steps ul,
|
|
628
|
-
.docmd-container.steps ol:not(.steps-list) {
|
|
629
|
-
list-style: initial;
|
|
630
|
-
padding-left: 2rem;
|
|
631
|
-
margin: var(--retro-spacing) 0;
|
|
632
|
-
}
|
|
633
|
-
|
|
634
|
-
.docmd-container.steps ul li,
|
|
635
|
-
.docmd-container.steps ol:not(.steps-list) li {
|
|
636
|
-
padding: 0.25rem 0;
|
|
637
|
-
border: none;
|
|
638
|
-
margin: 0;
|
|
639
|
-
}
|
|
640
|
-
|
|
641
|
-
.docmd-container.steps ul li::before,
|
|
642
|
-
.docmd-container.steps ol:not(.steps-list) li::before {
|
|
643
|
-
display: none;
|
|
644
|
-
}
|
|
645
|
-
.logo-link img{border:0;box-shadow:none }
|
|
646
|
-
/* Images */
|
|
647
|
-
img {
|
|
648
|
-
max-width: 100%;
|
|
649
|
-
height: auto;
|
|
650
|
-
border: 1px solid var(--retro-border);
|
|
651
|
-
border-radius: 4px;
|
|
652
|
-
box-shadow: 0 0 10px rgba(0, 255, 255, 0.3);
|
|
653
|
-
filter: brightness(0.9) contrast(1.1);
|
|
654
|
-
|
|
655
|
-
}
|
|
656
|
-
|
|
657
|
-
/* Tables */
|
|
658
|
-
table {
|
|
659
|
-
width: 100%;
|
|
660
|
-
border-collapse: collapse;
|
|
661
|
-
background: var(--retro-secondary);
|
|
662
|
-
border: 2px solid var(--retro-border-bright);
|
|
663
|
-
border-radius: 8px;
|
|
664
|
-
overflow: hidden;
|
|
665
|
-
box-shadow: var(--retro-shadow);
|
|
666
|
-
}
|
|
667
|
-
|
|
668
|
-
th {
|
|
669
|
-
background: linear-gradient(145deg, var(--retro-bg-light), var(--retro-secondary));
|
|
670
|
-
color: var(--retro-accent);
|
|
671
|
-
padding: var(--retro-spacing);
|
|
672
|
-
text-transform: uppercase;
|
|
673
|
-
letter-spacing: 1px;
|
|
674
|
-
border-bottom: 2px solid var(--retro-border-bright);
|
|
675
|
-
}
|
|
676
|
-
|
|
677
|
-
td {
|
|
678
|
-
padding: var(--retro-spacing);
|
|
679
|
-
border-bottom: 1px solid var(--retro-border);
|
|
680
|
-
}
|
|
681
|
-
|
|
682
|
-
tr:hover {
|
|
683
|
-
background: var(--retro-bg-light);
|
|
684
|
-
box-shadow: inset 0 0 10px rgba(0, 255, 65, 0.1);
|
|
685
|
-
}
|
|
686
|
-
|
|
687
|
-
/* Light mode table adjustments */
|
|
688
|
-
body[data-theme="light"] tr:hover {
|
|
689
|
-
box-shadow: inset 0 0 10px rgba(45, 93, 45, 0.1);
|
|
690
|
-
}
|
|
691
|
-
|
|
692
|
-
/* Responsive Design */
|
|
693
|
-
@media (max-width: 768px) {
|
|
694
|
-
body::before {
|
|
695
|
-
background-size: 100% 2px;
|
|
696
|
-
}
|
|
697
|
-
|
|
698
|
-
@keyframes scanlines {
|
|
699
|
-
0% { transform: translateY(0); }
|
|
700
|
-
100% { transform: translateY(2px); }
|
|
701
|
-
}
|
|
702
|
-
|
|
703
|
-
h1 {
|
|
704
|
-
font-size: 2rem;
|
|
705
|
-
}
|
|
706
|
-
|
|
707
|
-
.docmd-tabs-nav {
|
|
708
|
-
flex-direction: column;
|
|
709
|
-
}
|
|
710
|
-
|
|
711
|
-
.docmd-tabs-nav-item {
|
|
712
|
-
border-right: none;
|
|
713
|
-
border-bottom: 1px solid var(--retro-border);
|
|
714
|
-
}
|
|
715
|
-
|
|
716
|
-
.docmd-container.steps ol.steps-list > li.step-item {
|
|
717
|
-
padding-left: 3rem;
|
|
718
|
-
}
|
|
719
|
-
|
|
720
|
-
.docmd-container.steps ol.steps-list > li.step-item::before {
|
|
721
|
-
width: 2rem;
|
|
722
|
-
height: 2rem;
|
|
723
|
-
font-size: 1rem;
|
|
724
|
-
}
|
|
725
|
-
|
|
726
|
-
.docmd-container.steps ol.steps-list > li.step-item::after {
|
|
727
|
-
left: 1rem;
|
|
728
|
-
}
|
|
729
|
-
}
|
|
730
|
-
|
|
731
|
-
/* Theme Toggle Button - Retro Style */
|
|
732
|
-
.theme-toggle-button {
|
|
733
|
-
background: var(--retro-secondary);
|
|
734
|
-
border: 2px solid var(--retro-accent);
|
|
735
|
-
color: var(--retro-accent);
|
|
736
|
-
padding: 0.5rem;
|
|
737
|
-
border-radius: 4px;
|
|
738
|
-
cursor: pointer;
|
|
739
|
-
transition: all 0.3s ease;
|
|
740
|
-
font-family: var(--retro-font-family);
|
|
741
|
-
text-transform: uppercase;
|
|
742
|
-
font-size: 0.8rem;
|
|
743
|
-
letter-spacing: 1px;
|
|
744
|
-
box-shadow: 0 0 10px rgba(0, 255, 255, 0.3);
|
|
745
|
-
}
|
|
746
|
-
|
|
747
|
-
.theme-toggle-button:hover {
|
|
748
|
-
background: var(--retro-accent);
|
|
749
|
-
color: var(--retro-primary);
|
|
750
|
-
box-shadow: 0 0 15px rgba(0, 255, 255, 0.6);
|
|
751
|
-
}
|
|
752
|
-
|
|
753
|
-
/* Theme toggle in light mode */
|
|
754
|
-
body[data-theme="light"] .theme-toggle-button {
|
|
755
|
-
box-shadow: 0 0 10px rgba(0, 102, 102, 0.3);
|
|
756
|
-
}
|
|
757
|
-
|
|
758
|
-
body[data-theme="light"] .theme-toggle-button:hover {
|
|
759
|
-
box-shadow: 0 0 15px rgba(0, 102, 102, 0.6);
|
|
760
|
-
}
|
|
761
|
-
|
|
762
|
-
/* Special Retro Elements */
|
|
763
|
-
.terminal-cursor::after {
|
|
764
|
-
content: '█';
|
|
765
|
-
animation: blink 1s infinite;
|
|
766
|
-
color: var(--retro-accent);
|
|
767
|
-
}
|
|
768
|
-
|
|
769
|
-
.retro-divider {
|
|
770
|
-
height: 2px;
|
|
771
|
-
background: linear-gradient(90deg,
|
|
772
|
-
transparent,
|
|
773
|
-
var(--retro-accent),
|
|
774
|
-
var(--retro-danger),
|
|
775
|
-
var(--retro-accent),
|
|
776
|
-
transparent
|
|
777
|
-
);
|
|
778
|
-
margin: var(--retro-spacing-large) 0;
|
|
779
|
-
animation: scan 3s ease-in-out infinite;
|
|
780
|
-
}
|
|
781
|
-
|
|
782
|
-
/* Accessibility */
|
|
783
|
-
@media (prefers-reduced-motion: reduce) {
|
|
784
|
-
*,
|
|
785
|
-
*::before,
|
|
786
|
-
*::after {
|
|
787
|
-
animation-duration: 0.01ms !important;
|
|
788
|
-
animation-iteration-count: 1 !important;
|
|
789
|
-
transition-duration: 0.01ms !important;
|
|
790
|
-
}
|
|
791
|
-
|
|
792
|
-
body::before {
|
|
793
|
-
display: none;
|
|
794
|
-
}
|
|
795
|
-
}
|
|
796
|
-
|
|
797
|
-
/* Print Styles */
|
|
798
|
-
@media print {
|
|
799
|
-
body::before {
|
|
800
|
-
display: none;
|
|
801
|
-
}
|
|
802
|
-
|
|
803
|
-
.docmd-container {
|
|
804
|
-
box-shadow: none;
|
|
805
|
-
border: 1px solid #000;
|
|
806
|
-
}
|
|
807
|
-
|
|
808
|
-
* {
|
|
809
|
-
text-shadow: none !important;
|
|
810
|
-
box-shadow: none !important;
|
|
811
|
-
}
|
|
812
|
-
}
|
|
9
|
+
a,h1,h2,h3,h4,h5,h6{color:var(--retro-accent)}a,body{position:relative}html[data-theme=light] pre,pre{color:var(--retro-text)!important;background:var(--retro-secondary)!important}html[data-theme=light] code,html[data-theme=light] pre,pre{background:var(--retro-secondary)!important}body,pre::before{background:var(--retro-primary)}.page-header::after,html[data-theme=light] .page-header::after{background:linear-gradient(90deg,transparent,var(--retro-accent),transparent)}.btn,.docmd-button,.docmd-tabs-nav-item,.theme-toggle-button,button{cursor:pointer;transition:.3s;font-family:var(--retro-font-family)}.btn,.docmd-button,.docmd-tabs-nav-item,.sidebar-nav a,.theme-toggle-button,body,button,code,h1,h2,h3,h4,h5,h6{font-family:var(--retro-font-family)}:root{--retro-primary:#0a0a0a;--retro-secondary:#1a1a1a;--retro-bg-light:#0f0f0f;--retro-text:#00ff41;--retro-text-secondary:#ffb000;--retro-text-muted:#888888;--retro-accent:#00ffff;--retro-danger:#ff1493;--retro-warning:#ffb000;--retro-success:#00ff41;--retro-info:#0066ff;--retro-border:#333333;--retro-border-bright:#00ffff;--retro-glow:0 0 10px currentColor;--retro-glow-soft:0 0 5px currentColor;--retro-shadow:0 0 20px rgba(0, 255, 255, 0.3);--retro-font-family:'Fira Code','Courier New','Consolas',monospace;--retro-font-family-alt:'Share Tech Mono','Courier New',monospace;--retro-spacing:1rem;--retro-spacing-small:0.5rem;--retro-spacing-large:2rem}html[data-theme=light]{--retro-primary:#f0f0f0;--retro-secondary:#e0e0e0;--retro-bg-light:#f5f5f5;--retro-text:#2d5d2d;--retro-text-secondary:#8b4500;--retro-text-muted:#666666;--retro-accent:#006666;--retro-danger:#b71c42;--retro-warning:#b8860b;--retro-success:#228b22;--retro-info:#4169e1;--retro-border:#cccccc;--retro-border-bright:#006666;--retro-glow:0 0 5px currentColor;--retro-glow-soft:0 0 3px currentColor;--retro-shadow:0 0 15px rgba(0, 102, 102, 0.2)}*{box-sizing:border-box}body{color:var(--retro-text);line-height:1.6;margin:0;padding:0;min-height:100vh;overflow-x:hidden}body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(transparent 50%,rgba(0,255,65,.03) 50%);background-size:100% 4px;pointer-events:none;z-index:1000;animation:.1s linear infinite scanlines}html[data-theme=light]::before{background:linear-gradient(transparent 50%,rgba(45,93,45,.02) 50%)}html[data-theme=light] .page-header{box-shadow:0 2px 10px rgba(0,102,102,.2)}@keyframes scanlines{0%{transform:translateY(0)}100%{transform:translateY(4px)}}@keyframes flicker{0%,100%{opacity:1}98%{opacity:.98}99%{opacity:.99}}.page-container{animation:3s infinite flicker}h1,h2,h3,h4,h5,h6{text-transform:uppercase;letter-spacing:2px;text-shadow:var(--retro-glow-soft);margin:var(--retro-spacing-large) 0 var(--retro-spacing)}code,h2{color:var(--retro-text-secondary)}h1{font-size:2.5rem;border-bottom:2px solid var(--retro-accent);padding-bottom:.5rem;animation:2s ease-in-out infinite alternate glow-pulse}@keyframes glow-pulse{from{text-shadow:0 0 5px var(--retro-accent)}to{text-shadow:0 0 15px var(--retro-accent),0 0 25px var(--retro-accent)}}h2{font-size:2rem}h3,html[data-theme=light] .sidebar-nav a{color:var(--retro-text)}h3{font-size:1.5rem}p{margin:var(--retro-spacing) 0;text-shadow:0 0 2px currentColor}.callout-title,a{text-shadow:var(--retro-glow-soft)}a{text-decoration:none;transition:.3s}a:hover{color:var(--retro-danger);text-shadow:var(--retro-glow)}.page-content a:before,.sidebar-nav a:before{content:'>';margin-right:.25rem;animation:1s infinite blink}.docmd-button:before,.docmd-container.steps ol.steps-list>li.step-item:last-child::after,.docmd-container.steps ol:not(.steps-list) li::before,.docmd-container.steps ul li::before,.page-header a:before,.page-nav a:before{display:none}@keyframes blink{0%,50%{opacity:1}100%,51%{opacity:0}}code{background:var(--retro-secondary);padding:.2rem .4rem;border-radius:3px;border:1px solid var(--retro-border);box-shadow:inset 0 0 5px rgba(0,255,65,.2)}.page-header,pre{padding:var(--retro-spacing);position:relative}pre{border-radius:8px;border:1px solid var(--retro-border-bright);box-shadow:var(--retro-shadow);overflow-x:auto;padding-top:2rem}.docmd-container::before,pre::before{position:absolute;border:1px solid var(--retro-border-bright)}html[data-theme=light] code{color:var(--retro-text-secondary)!important;box-shadow:inset 0 0 5px rgba(45,93,45,.2)}pre::before{content:'[TERMINAL]';top:5px;left:5px;color:var(--retro-accent);padding:.2rem .5rem;font-size:.7rem;border-radius:3px}.page-header{background:linear-gradient(45deg,var(--retro-secondary),var(--retro-bg-light));border-bottom:2px solid var(--retro-border-bright);box-shadow:0 2px 10px rgba(0,255,255,.3)}.page-header::after{content:'';position:absolute;bottom:-2px;left:0;width:100%;height:2px;animation:2s ease-in-out infinite scan}@keyframes scan{0%,100%{transform:scaleX(0)}50%{transform:scaleX(1)}}.sidebar{background:var(--retro-secondary);border-right:2px solid var(--retro-border-bright);box-shadow:2px 0 10px rgba(0,255,255,.2)}.sidebar-nav a{display:block;padding:.75rem var(--retro-spacing);border-bottom:1px solid var(--retro-border);transition:.3s}.sidebar-nav a.active,.sidebar-nav a:hover{background:var(--retro-bg-light);border-left:4px solid var(--retro-accent);box-shadow:inset 0 0 10px rgba(0,255,255,.2)}html[data-theme=light] .sidebar-nav a.active,html[data-theme=light] .sidebar-nav a:hover{background:var(--retro-bg-light);border-left:4px solid var(--retro-accent);box-shadow:inset 0 0 10px rgba(0,102,102,.2)}.btn,.docmd-button,button{background:linear-gradient(145deg,var(--retro-secondary),var(--retro-bg-light));color:var(--retro-accent);border:2px solid var(--retro-border-bright);padding:.75rem 1.5rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;position:relative;text-decoration:none;display:inline-block;box-shadow:0 4px 15px rgba(0,255,255,.3)}.btn:hover,.docmd-button:hover,button:hover,th{background:linear-gradient(145deg,var(--retro-bg-light),var(--retro-secondary))}.docmd-container.steps::before,.docmd-tabs-nav-item{color:var(--retro-text-secondary);letter-spacing:1px}.docmd-container,td,th{padding:var(--retro-spacing)}.docmd-container,.docmd-tabs{background:var(--retro-secondary);box-shadow:var(--retro-shadow);position:relative}.btn:hover,.docmd-button:hover,button:hover{color:var(--retro-danger);box-shadow:0 6px 20px rgba(255,20,147,.4);transform:translateY(-2px)}.btn:active,.docmd-button:active,button:active{transform:translateY(0);box-shadow:0 2px 10px rgba(0,255,255,.5)}.docmd-container{border:2px solid var(--retro-border);border-radius:8px;margin:var(--retro-spacing) 0}.docmd-container::before{content:attr(data-type);top:-15px;left:5px;background:var(--retro-primary);color:var(--retro-accent);padding:.25rem .75rem;border-radius:3px;font-size:.8rem;text-transform:uppercase;letter-spacing:1px}.docmd-container.callout.info{border-color:var(--retro-info);box-shadow:0 0 15px rgba(0,102,255,.3)}.docmd-container.callout.warning{border-color:var(--retro-warning);box-shadow:0 0 15px rgba(255,176,0,.3)}.docmd-container.callout.danger{border-color:var(--retro-danger);box-shadow:0 0 15px rgba(255,20,147,.3)}.docmd-container.callout.success,.docmd-container.callout.tip{border-color:var(--retro-success);box-shadow:0 0 15px rgba(0,255,65,.3)}.docmd-tabs-nav,th{border-bottom:2px solid var(--retro-border-bright)}.callout-title{font-weight:700;margin-bottom:.75em;display:flex;align-items:center;text-transform:uppercase;letter-spacing:1px}.callout-title::before{margin-right:.5rem;font-size:1.2em;text-shadow:none}.docmd-container.steps::before,.docmd-tabs::before{top:-12px;left:20px;padding:.25rem .75rem;font-size:.7rem;position:absolute;text-transform:uppercase}.callout-info .callout-title::before{content:"🖥️"}.callout-warning .callout-title::before{content:"⚠️"}.callout-tip .callout-title::before{content:"💾"}.callout-danger .callout-title::before{content:"🚨"}.callout-success .callout-title::before{content:"✅"}.docmd-container.card{background:linear-gradient(145deg,var(--retro-secondary),var(--retro-bg-light));border:1px solid var(--retro-border-bright);box-shadow:0 4px 15px rgba(0,255,255,.2),inset 0 0 10px rgba(0,255,65,.1)}.docmd-tabs{border:2px solid var(--retro-border-bright);border-radius:8px;overflow:hidden}.theme-toggle-button,img{box-shadow:0 0 10px rgba(0,255,255,.3)}.docmd-tabs::before{content:'[TABS]';background:var(--retro-primary);color:var(--retro-accent);border:1px solid var(--retro-border-bright);border-radius:3px;z-index:1}.docmd-tabs-nav{background:linear-gradient(90deg,var(--retro-bg-light),var(--retro-secondary));display:flex}.theme-toggle-button,table{background:var(--retro-secondary)}.docmd-tabs-nav-item{padding:1rem 1.5rem;font-weight:700;border-right:1px solid var(--retro-border);position:relative;text-transform:uppercase}.docmd-tabs-nav-item:hover,.theme-toggle-button,th{color:var(--retro-accent)}.docmd-tabs-nav-item:last-child{border-right:none}.docmd-tabs-nav-item:hover{background:var(--retro-bg-light);box-shadow:inset 0 0 10px rgba(0,255,255,.2)}.docmd-tabs-nav-item.active{background:var(--retro-primary);color:var(--retro-accent);border-bottom:2px solid var(--retro-accent);box-shadow:0 0 15px rgba(0,255,255,.5)}.docmd-container.steps,table{box-shadow:var(--retro-shadow)}.docmd-tabs-nav-item.active::after{content:'_';animation:1s infinite blink;margin-left:.25rem}.docmd-tab-pane{display:none;padding:var(--retro-spacing-large);animation:.5s fadeInCRT}.docmd-tab-pane.active{display:block}@keyframes fadeInCRT{0%{opacity:0;transform:scaleY(.1) scaleX(1);filter:brightness(2)}50%{opacity:.5;transform:scaleY(.5) scaleX(1)}100%{opacity:1;transform:scaleY(1) scaleX(1);filter:brightness(1)}}.docmd-container.steps{background:linear-gradient(145deg,var(--retro-secondary),var(--retro-bg-light));border:2px solid var(--retro-border-bright);border-radius:8px;padding:var(--retro-spacing-large);position:relative}.docmd-container.steps::before{content:'[SEQUENCE]';background:var(--retro-primary);border:1px solid var(--retro-border-bright);border-radius:3px}.docmd-container.steps ol.steps-list{counter-reset:step-counter;list-style:none;padding-left:0}.docmd-container.steps ol.steps-list>li.step-item{counter-increment:step-counter;position:relative;padding:var(--retro-spacing) 0 var(--retro-spacing) 4rem;border-bottom:1px solid var(--retro-border);margin-bottom:var(--retro-spacing)}.docmd-container.steps ol.steps-list>li.step-item:last-child{border-bottom:none;margin-bottom:0}.docmd-container.steps ol.steps-list>li.step-item::before{content:counter(step-counter);position:absolute;left:0;top:var(--retro-spacing);width:2.5rem;height:2.5rem;background:linear-gradient(145deg,var(--retro-accent),var(--retro-info));color:var(--retro-primary);border:2px solid var(--retro-border-bright);border-radius:4px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem;text-shadow:none;box-shadow:0 0 10px rgba(0,255,255,.5),inset 0 0 5px rgba(0,0,0,.3);animation:2s ease-in-out infinite pulse-glow}@keyframes pulse-glow{0%,100%{box-shadow:0 0 10px rgba(0,255,255,.5),inset 0 0 5px rgba(0,0,0,.3)}50%{box-shadow:0 0 20px rgba(0,255,255,.8),inset 0 0 10px rgba(0,0,0,.5)}}.docmd-container.steps ol.steps-list>li.step-item::after{content:'';position:absolute;left:1.2rem;top:4rem;bottom:-1rem;width:2px;background:linear-gradient(180deg,var(--retro-accent),transparent);box-shadow:0 0 3px var(--retro-accent)}.docmd-container.steps ol:not(.steps-list),.docmd-container.steps ul{list-style:initial;padding-left:2rem;margin:var(--retro-spacing) 0}.docmd-container.steps ol:not(.steps-list) li,.docmd-container.steps ul li{padding:.25rem 0;border:none;margin:0}.logo-link img{border:0;box-shadow:none}img{max-width:100%;height:auto;border:1px solid var(--retro-border);border-radius:4px;filter:brightness(.9) contrast(1.1)}table{width:100%;border-collapse:collapse;border:2px solid var(--retro-border-bright);border-radius:8px;overflow:hidden}th{text-transform:uppercase;letter-spacing:1px}td{border-bottom:1px solid var(--retro-border)}tr:hover{background:var(--retro-bg-light);box-shadow:inset 0 0 10px rgba(0,255,65,.1)}html[data-theme=light] tr:hover{box-shadow:inset 0 0 10px rgba(45,93,45,.1)}@media (max-width:768px){body::before{background-size:100% 2px}@keyframes scanlines{0%{transform:translateY(0)}100%{transform:translateY(2px)}}h1{font-size:2rem}.docmd-tabs-nav{flex-direction:column}.docmd-tabs-nav-item{border-right:none;border-bottom:1px solid var(--retro-border)}.docmd-container.steps ol.steps-list>li.step-item{padding-left:3rem}.docmd-container.steps ol.steps-list>li.step-item::before{width:2rem;height:2rem;font-size:1rem}.docmd-container.steps ol.steps-list>li.step-item::after{left:1rem}}.theme-toggle-button{border:2px solid var(--retro-accent);padding:.5rem;border-radius:4px;text-transform:uppercase;font-size:.8rem;letter-spacing:1px}.theme-toggle-button:hover{background:var(--retro-accent);color:var(--retro-primary);box-shadow:0 0 15px rgba(0,255,255,.6)}html[data-theme=light] .theme-toggle-button{box-shadow:0 0 10px rgba(0,102,102,.3)}html[data-theme=light] .theme-toggle-button:hover{box-shadow:0 0 15px rgba(0,102,102,.6)}.terminal-cursor::after{content:'█';animation:1s infinite blink;color:var(--retro-accent)}.retro-divider{height:2px;background:linear-gradient(90deg,transparent,var(--retro-accent),var(--retro-danger),var(--retro-accent),transparent);margin:var(--retro-spacing-large) 0;animation:3s ease-in-out infinite scan}@media (prefers-reduced-motion:reduce){*,::after,::before{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important}body::before{display:none}}@media print{body::before{display:none}.docmd-container{box-shadow:none;border:1px solid #000}*{text-shadow:none!important;box-shadow:none!important}}
|