trianta/trianta.dev
1
0
Fork 0
Code Issues 13 Pull Requests Packages Projects Releases 4 Wiki Activity

css: move to new colorscheme

Browse Source
This commit is contained in:
trianta
2026-02-02 04:20:06 -06:00
parent 5edb887eec
commit 8751d5aa86
2 changed files with 70 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
default.css
+55 -16
View File
@@ -4,11 +4,56 @@
* background: #03001C * background: #03001C
*/ */
/* colors
@define-color fg #504945;
@define-color bg #fbf1c7;
@define-color imp #d79921;
@define-color fg #3c3836;
@define-color fg0 #282828;
@define-color fg1 #3c3836;
@define-color fg2 #504945;
@define-color fg3 #665c54;
@define-color fg4 #7c6f64;
@define-color bg #fbf1c7;
@define-color bg0 #fbf1c7;
@define-color bg0_h #f9f5d7;
@define-color bg0_s #f2e5bc;
@define-color bg1 #ebdbb2;
@define-color bg2 #d5c4a1;
@define-color bg3 #bdae93;
@define-color bg4 #a89984;
@define-color gray #7c6f64;
@define-color red #cc241d;
@define-color green #98971a;
@define-color yellow #d79921;
@define-color blue #458588;
@define-color purple #b16286;
@define-color aqua #689d6a;
@define-color orange #d65d0e;
@define-color peach #fe640b;
@define-color alt_gray #928374;
@define-color alt_red #9d0006;
@define-color alt_green #79740e;
@define-color alt_yellow #b57614;
@define-color alt_blue #076678;
@define-color alt_purple #8f3f71;
@define-color alt_aqua #427b58;
@define-color alt_orange #af3a03;
*/
body { body {
font-family: Arial, sans-serif; font-family: "Noto Sans Symbols", sans-serif;
font-weight: 800; font-optical-sizing: auto;
color: #06CDFF; font-weight: 400;
background: #03001C; color: #504945;
background: #fbf1c7;
line-height: 1.5; line-height: 1.5;
margin-inline: auto; margin-inline: auto;
margin: 0 auto; margin: 0 auto;
@@ -51,11 +96,9 @@ nav ul {
} }
.trianta { .trianta {
border: none !important; color: #d79921 !important;
color: #06CDFF !important;
font-size: 2.5rem !important; font-size: 2.5rem !important;
min-width: 12rem; min-width: 12rem;
margin: -1rem;
} }
.canvas { .canvas {
@@ -63,13 +106,12 @@ nav ul {
display: inline-block; display: inline-block;
width: 60rem; width: 60rem;
vertical-align: bottom; vertical-align: bottom;
border: solid 4px #06CDFF; border: solid 4px #d79921;
} }
.stats { .stats {
font-size: 18px; font-size: 18px;
display: inline-block; display: inline-block;
width: 12rem;
vertical-align: middle; vertical-align: middle;
} }
@@ -80,7 +122,7 @@ h1 {
} }
h2 { h2 {
border: solid 2px #06CDFF; border: solid 2px #d79921;
margin: auto; margin: auto;
padding: 8px; padding: 8px;
text-align: center; text-align: center;
@@ -94,14 +136,12 @@ h3 {
} }
p { p {
margin: 0px; margin: 1rem;
} }
a { a {
background-color: #03001C; border: solid 2px #d79921;
border: solid 2px #06CDFF;
border-radius: 12px; border-radius: 12px;
color: #06CDFF;
display: inline-block; display: inline-block;
margin: 6px; margin: 6px;
margin-top: 0px; margin-top: 0px;
@@ -126,8 +166,7 @@ a.button {
} }
a:visited { a:visited {
border: solid 2px #8200FF; border: solid 2px #d79921;
color: #8200FF;
} }
@keyframes hover { @keyframes hover {
index.html
+15 -14
View File
@@ -4,24 +4,25 @@
<meta charset="utf-8"/> <meta charset="utf-8"/>
<title>Trianta</title> <title>Trianta</title>
<link rel="stylesheet" href="/default.css" /> <link rel="stylesheet" href="/default.css" />
<style>
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Symbols:wght@100..900&display=swap');
</style>
</head> </head>
<body> <body>
<div class="inside"> <div class="inside">
<div>
<a href="/" class="trianta">TRIANTA</a>
<p>Function over form by design</p>
</div>
<div style="display: flex;"> <div style="display: flex;">
<nav class="column"> <a href="/" class="trianta">TRIANTA</a>
<ul> <div class="column">
<li><a href="https://www.github.com/trimutex">GitHub</a></li> <a href="https://www.github.com/trimutex" alt="GitHub"></a>
<li><a href="https://lab.trianta.dev/Trianta">Projects</a></li> <a href="https://lab.trianta.dev/Trianta" alt="Personal Projects"></a>
<li><a href="/completed">Completed</a></li> <a href="/completed" alt="Completed"></a>
<li><a href="/current">Current</a></li> <a href="/current" alt="Current"></a>
<li><a href="/other">Other</a></li> <a href="/other" alt="Other"></a>
<li><a href="/contact">Contact</a></li> <a href="/contact" alt="Contact">󰀄</a>
</ul> </div>
</nav> </div>
<p>Function over form by design</p>
<div style="display: flex;">
<div class="column gap"></div> <div class="column gap"></div>
<div class="column content"></div> <div class="column content"></div>
</div> </div>