aboutsummaryrefslogtreecommitdiff
path: root/theme/static/styles.css
diff options
context:
space:
mode:
Diffstat (limited to 'theme/static/styles.css')
-rw-r--r--theme/static/styles.css308
1 files changed, 261 insertions, 47 deletions
diff --git a/theme/static/styles.css b/theme/static/styles.css
index 71acb7e..09fb2c3 100644
--- a/theme/static/styles.css
+++ b/theme/static/styles.css
@@ -1,81 +1,295 @@
+:root {
+ --bg: #0a0b10;
+ --green: #00ff9d;
+ --green-dim: rgba(0, 255, 157, 0.2);
+ --glass: rgba(0, 255, 157, 0.03);
+ --text: #c0fce6;
+ --font: "Lucida Console", "Monaco", "Consolas", monospace;
+ --emacs-blue: #51afef;
+ --emacs-bg: #1c1f24;
+}
+
+/* Base Terminal Environment */
+html, body {
+ height: 100%;
+ margin: 0;
+ padding: 0;
+ background-color: var(--bg);
+}
+
body {
- font-family: Menlo, Consolas, Monaco, Adwaita Mono, Liberation Mono, Lucida Console, monospace;
- font-size: 0.85rem;
+ color: var(--text);
+ font-family: var(--font);
line-height: 1.5;
- margin: 0 auto;
- max-width: 50em;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ overflow: hidden; /* Desktop keeps terminal-shell fixed */
}
-body {
- padding: 1rem;
+img {
+ max-width: 100%;
}
-footer {
- margin: 1rem 0;
+/* CRT Scanline Effect */
+.scanlines {
+ position: fixed;
+ top: 0; left: 0; width: 100%; height: 100%;
+ background: linear-gradient(
+ rgba(18, 16, 16, 0) 50%,
+ rgba(0, 0, 0, 0.15) 50%
+ );
+ background-size: 100% 4px;
+ z-index: 9999;
+ pointer-events: none;
}
-nav {
- align-items: center;
+.terminal-shell {
+ width: 95%;
+ max-width: 1000px;
+ height: 98vh;
display: flex;
- justify-content: space-around;
- margin: 1rem 0;
+ flex-direction: column;
+ padding: 10px 0;
+}
+
+main {
+ flex: 1;
+ overflow-y: auto;
+ margin: 10px 0;
+ scrollbar-width: thin;
+ scrollbar-color: var(--green) transparent;
+}
+
+/* Navigation & Header */
+.system-header {
+ border-bottom: 1px solid var(--green-dim);
+ padding-bottom: 0.5rem;
+ margin-bottom: 1.5rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ font-size: 0.8rem;
}
nav ul {
+ list-style: none;
display: flex;
- list-style-type: none;
+ gap: 1.5rem;
margin: 0;
padding: 0;
- width: 100%;
}
-nav ul li {
- height: 100%;
- margin-bottom: 0.5rem;
+nav a {
+ color: var(--green);
+ text-decoration: none;
+ text-transform: uppercase;
+}
+
+nav a:hover {
+ text-shadow: 0 0 8px var(--green);
+ background: var(--green-dim);
+}
+
+/* Content Pane (The Glass) */
+.glass-pane {
+ background: var(--glass);
+ backdrop-filter: blur(4px);
+ border: 1px solid var(--green-dim);
+ padding: 1.5rem;
+ min-height: 100%;
+ box-sizing: border-box;
+}
+
+/* Stylized Data Blocks */
+.sys-readout {
+ border: 1px solid var(--green-dim);
+ background: rgba(0, 0, 0, 0.3);
+ padding: 1rem;
+ margin-bottom: 2rem;
+ font-size: 0.85rem;
+ display: grid;
+ grid-template-columns: auto 1fr;
+ gap: 0.5rem 1rem;
+}
+
+.sys-readout b {
+ color: var(--green);
+ text-transform: uppercase;
+ opacity: 0.7;
+}
+
+/* Typography & Elements */
+h1, h2, h3 {
+ color: var(--green);
+ text-transform: uppercase;
+ letter-spacing: 2px;
+}
+
+a {
+ color: var(--green);
+ transition: 0.2s;
+ text-decoration-thickness: 1px;
+ text-underline-offset: 3px;
+}
+
+a:hover {
+ color: #fff;
+ text-shadow: 0 0 5px var(--green);
+}
+
+code {
+ background: var(--green-dim);
+ padding: 2px 4px;
+ color: #fff;
+}
+
+/* Blockquotes: Emacs Style */
+blockquote {
+ background: var(--emacs-bg);
+ border-left: 4px solid var(--emacs-blue);
+ margin: 1.5rem 0;
+ padding: 1rem;
+ color: #bbc2cf;
+ font-style: italic;
+ position: relative;
+}
+
+blockquote::before {
+ content: "/* COMMENT */";
+ position: absolute;
+ top: -10px;
+ right: 10px;
+ font-size: 0.6rem;
+ color: var(--emacs-blue);
+ background: var(--bg);
+ padding: 0 5px;
+}
+
+/* Blog List */
+.post {
+ margin: 0.5rem 0;
+ padding: 5px;
+ border-bottom: 1px dashed rgba(0, 255, 157, 0.1);
+}
+
+.post time {
+ color: var(--green);
+ opacity: 0.6;
+ font-size: 0.8rem;
margin-right: 1rem;
- text-align: center;
}
-img {
- max-width: 100%;
+.post a::before {
+ content: "DIR_ ";
+ font-size: 0.7rem;
+ opacity: 0.5;
}
+/* Code Blocks */
pre {
- border: 1px solid black;
- overflow: scroll;
- padding: 0.5rem;
+ background: var(--emacs-bg);
+ border: 1px solid #3e4451;
+ border-left: 4px solid var(--emacs-blue);
+ padding: 1rem;
+ overflow-x: auto;
+ position: relative;
+ margin: 1.5rem 0;
}
-:not(pre) > code {
- color: red;
+pre::before {
+ content: "-uuu:--- F1 buffer.txt All (1,0)";
+ display: block;
+ background: #282c34;
+ color: #bbc2cf;
+ font-size: 0.7rem;
+ margin: -1rem -1rem 1rem -1rem;
+ padding: 4px 10px;
+ border-bottom: 1px solid #3e4451;
+ opacity: 0.7;
}
-.skip-link {
- height: 1px;
- left: -10000px;
- overflow: hidden;
- position: absolute;
- top: auto;
- width: 1px;
+/* Tables */
+.table-wrapper {
+ width: 100%;
+ overflow-x: auto;
+ margin: 2rem 0;
}
-.skip-link:focus {
- height: auto;
- position: static;
- width: auto;
+table {
+ width: 100%;
+ border-collapse: collapse;
+ font-size: 0.85rem;
+ background: rgba(0, 0, 0, 0.2);
}
-@media (prefers-color-scheme: dark) {
- body {
- background-color: #000000;
- color: #dfdfdf;
- }
+th {
+ background: var(--green-dim);
+ color: var(--green);
+ text-transform: uppercase;
+ text-align: left;
+ padding: 12px;
+ border-bottom: 1px solid var(--green);
+}
+
+td {
+ padding: 10px;
+ border-bottom: 1px solid rgba(0, 255, 157, 0.1);
+ color: var(--text);
+ border-right: 1px solid rgba(0, 255, 157, 0.05);
+}
+
+table, thead, tbody, th, tr, td {
+ border: 1px solid var(--green-dim);
+}
- a {
- color: #67c0ff;
- }
+td:last-child { border-right: none; }
- pre {
- border-color: white;
- }
+/* Footer & Status Bar */
+footer {
+ margin-top: auto;
+ font-size: 0.7rem;
+}
+
+.system-log {
+ border-top: 2px solid var(--green);
+ background: linear-gradient(to bottom, rgba(0,255,157,0.05), transparent);
+ padding: 10px;
}
+
+.log-entry { font-size: 0.7rem; line-height: 1.4; color: var(--green); }
+
+.status-bar {
+ background: var(--green);
+ color: var(--bg);
+ padding: 4px 12px;
+ display: flex;
+ justify-content: space-between;
+ font-weight: bold;
+}
+
+/* Fix for Footer Link Visibility */
+.status-bar a {
+ color: #000; /* High contrast black on green bar */
+ text-decoration: underline;
+ font-weight: 900;
+}
+
+.status-bar a:hover {
+ background: #000;
+ color: var(--green);
+}
+
+.status-node::before {
+ content: "● NORMAL ";
+ background: #000;
+ color: var(--green);
+ padding: 0 8px;
+ margin-right: 10px;
+}
+
+@media (max-width: 600px) {
+ body { overflow-y: auto; }
+ .terminal-shell { height: auto; }
+ .system-header { flex-direction: column; gap: 1rem; }
+} \ No newline at end of file
generated by cgit v1.2.3 (git 2.39.1) at 2026-08-04 17:52:01 +0000