Implement starry night theme
This commit is contained in:
parent
7c80a3b363
commit
97cbfd4541
BIN
assets/img/banner-cloud.png
Normal file
BIN
assets/img/banner-cloud.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 187 KiB |
BIN
assets/img/bg-beach3.png
Normal file
BIN
assets/img/bg-beach3.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.0 MiB |
BIN
assets/img/bg-space.png
Normal file
BIN
assets/img/bg-space.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 245 KiB |
BIN
assets/img/space-2.png
Normal file
BIN
assets/img/space-2.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.9 MiB |
BIN
assets/img/tiny-bar-space.png
Normal file
BIN
assets/img/tiny-bar-space.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 78 KiB |
10
assets/img/xbazzi-ascii.txt
Normal file
10
assets/img/xbazzi-ascii.txt
Normal file
@ -0,0 +1,10 @@
|
||||
|
||||
|
||||
██╗ ██╗██████╗ █████╗ ███████╗███████╗██╗ ██████╗ ██████╗ ███╗ ███╗
|
||||
╚██╗██╔╝██╔══██╗██╔══██╗╚══███╔╝╚══███╔╝██║ ██╔════╝██╔═══██╗████╗ ████║
|
||||
╚███╔╝ ██████╔╝███████║ ███╔╝ ███╔╝ ██║ ██║ ██║ ██║██╔████╔██║
|
||||
██╔██╗ ██╔══██╗██╔══██║ ███╔╝ ███╔╝ ██║ ██║ ██║ ██║██║╚██╔╝██║
|
||||
██╔╝ ██╗██████╔╝██║ ██║███████╗███████╗██║██╗╚██████╗╚██████╔╝██║ ╚═╝ ██║
|
||||
╚═╝ ╚═╝╚═════╝ ╚═╝ ╚═╝╚══════╝╚══════╝╚═╝╚═╝ ╚═════╝ ╚═════╝ ╚═╝ ╚═╝
|
||||
|
||||
|
@ -8,11 +8,11 @@
|
||||
--background: rgba(150, 150, 150, 0.95);
|
||||
--main-color:#bf00ff;
|
||||
--main-color-dk:#441261;
|
||||
--accent-1: #0000ff;
|
||||
--accent-1: #8d0081;
|
||||
--accent-2:#00FFFF;
|
||||
--content-spacing:5px;
|
||||
--background-img:url('../img/beach-night-bg.webp');
|
||||
--banner:url('../img/bg_ascii2.png');
|
||||
--background-img:url('../img/bg-beach3.png');
|
||||
--banner:url('../img/banner-cloud.png');
|
||||
--banner-footer: url('../img/tiny-bar-green.png');
|
||||
--titleBars:url('../img/tiny-bar-green.png');
|
||||
--text-color: white;
|
||||
@ -96,30 +96,34 @@ body::before {
|
||||
aside {
|
||||
font-weight: bold;
|
||||
width: 25%;
|
||||
margin: 5px; /* Add some space around the text */
|
||||
height: 10%;
|
||||
margin-left:var(--content-spacing);
|
||||
border-left:var(--border);
|
||||
background-color: var(--background);
|
||||
}
|
||||
.sidebar-title {
|
||||
|
||||
.sidebar-title {
|
||||
padding: 3px 10px; /* Adjust top/bottom and left/right padding as needed */
|
||||
background-image:var(--titleBars);
|
||||
font-weight:bold;
|
||||
font-size: 25px;
|
||||
font-size: 20px;
|
||||
border:var(--border);
|
||||
color: var(--title-text-color);
|
||||
text-shadow: var(--text-shadow-custom);
|
||||
}
|
||||
|
||||
.title {
|
||||
background-image:var(--titleBars);
|
||||
background-size: 100% 100%;
|
||||
padding: 5px;
|
||||
padding: 3px 10px; /* Adjust top/bottom and left/right padding as needed */
|
||||
font-weight: bold;
|
||||
font-size: 25px;
|
||||
font-size: 20px;
|
||||
border: var(--border);
|
||||
color: var(--title-text-color);
|
||||
text-shadow: var(--text-shadow-custom);
|
||||
/*position: sticky;*/
|
||||
background-image: var(--titleBars);
|
||||
background-size: 100% 100%;
|
||||
/* Remove text-indent if it's not needed */
|
||||
/* Ensure padding does not prevent text from reaching the ends */
|
||||
box-sizing: border-box; /* Ensures padding is included in the element's total width and height */
|
||||
}
|
||||
|
||||
.navclass {
|
||||
@ -153,7 +157,7 @@ nav ul li a {
|
||||
padding:25px;
|
||||
opacity: 1;
|
||||
background-color: var(--background);
|
||||
font-size: 20px;
|
||||
font-size: 10;
|
||||
}
|
||||
|
||||
footer {
|
||||
|
@ -19,8 +19,8 @@
|
||||
|
||||
<main>
|
||||
<div class="wrapper">
|
||||
<div class="title">
|
||||
Home "datacenter" is what Americans needed, but didn't deserve.
|
||||
<div class="title">
|
||||
Home "datacenter" is what Americans needed, but diddfn't deserve.
|
||||
</div>
|
||||
<div class="content">
|
||||
<p>
|
||||
|
14
index.html
14
index.html
@ -19,7 +19,7 @@
|
||||
|
||||
<main>
|
||||
<div class="wrapper">
|
||||
<div class="title"> <span class="fa-solid fa-user"></span> whoami</div>
|
||||
<div class="title"><span class="fa-solid fa-user"></span> whoami</div>
|
||||
<div class="contentDaddy">
|
||||
<div class="content">
|
||||
<p>
|
||||
@ -28,7 +28,7 @@
|
||||
software-defined networking, and serverless architectures.
|
||||
</p>
|
||||
</div>
|
||||
<div class="title"> <span class="fa-solid fa-wrench"></span> updates
|
||||
<div class="title"><span class="fa-solid fa-wrench"></span> updates
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="update">01/10/2024: Generated the cool bg image with DALL-E.</p>
|
||||
@ -38,21 +38,17 @@
|
||||
datacenter project.</p>
|
||||
</div>
|
||||
|
||||
<div class="title"> <span class="fa-solid fa-commenting"></span> blog </div>
|
||||
<div class="title"><span class="fa-solid fa-lightbulb"></span> projects </div>
|
||||
<div class="content">
|
||||
<p class="blog"><a href='./homenetwork.html'>
|
||||
Home "datacenter" is what Americans needed,
|
||||
but didn't deserve.
|
||||
</a></p>
|
||||
<p class="blog"><a href='./juniperfanmod.html'>
|
||||
Bribing a loud enterprise switch with Noctua fans.
|
||||
Home datacenter
|
||||
</a></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
<aside>
|
||||
<div class="sidebar-title"> Navigation</div>
|
||||
<div class="sidebar-title">Navigation</div>
|
||||
<div class="navclass">
|
||||
<nav id="nav">
|
||||
<ul>
|
||||
|
Loading…
x
Reference in New Issue
Block a user