Ark/terminal.css
1
0
Fork 0
mirror of https://github.com/letieu/terminal.css.git synced 2026-03-15 02:04:30 -07:00
Code Issues Packages Projects Releases Wiki Activity

feat: implement theming system with persistence and add new themes

Browse Source
This commit is contained in:
letieu
2025-12-10 06:08:01 +07:00
parent db618b99fc
commit 2e91f3a1c1
16 changed files with 457 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
index.html
View File

@@ -6,16 +6,14 @@
<title>terminal.css - Terminal CSS Component Library</title>
<!-- terminal.css Components (Bulma-style) -->
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/gh/letieu/terminal.css@v0.0.3/index.css"
/>
<link rel="stylesheet" href="index.css" />
<link rel="stylesheet" href="themes/default.css" id="theme-switcher" />
<!-- Tailwind for layout (optional) -->
<script src="https://cdn.tailwindcss.com"></script>
<!-- terminal.css JavaScript -->
<script src="https://cdn.jsdelivr.net/gh/letieu/terminal.css@v0.0.3/index.js"></script>
<script src="index.js"></script>
</head>
<body class="min-h-screen p-0 md:p-8">
<!-- MAIN TERMINAL WINDOW -->
@@ -28,7 +26,22 @@
<div class="w-3 h-3 rounded-full bg-green-500"></div>
</div>
<div class="has-text-muted text-sm font-bold">dev@localhost:~/</div>
<div class="has-text-muted text-xs" style="opacity: 0.5">v0.0.3</div>
<div class="flex items-center gap-2">
<label for="theme-selector" class="has-text-muted text-xs">Theme:</label>
<select id="theme-selector" class="select" style="width: auto;">
<option value="default">Default</option>
<option value="dracula">Dracula</option>
<option value="light">Light</option>
<option value="gruvbox-dark">Gruvbox Dark</option>
<option value="gruvbox-light">Gruvbox Light</option>
<option value="ayu-dark">Ayu Dark</option>
<option value="ayu-light">Ayu Light</option>
<option value="rose-pine">Rosé Pine</option>
<option value="rose-pine-light">Rosé Pine Light</option>
<option value="catppuccin-mocha">Catppuccin Mocha</option>
<option value="catppuccin-latte">Catppuccin Latte</option>
</select>
</div>
</div>
<!-- BODY -->