the fancy black borders

This commit is contained in:
Lazy Hippopotamus
2024-03-05 12:31:37 -05:00
parent baf5c3f122
commit bd63034366
3 changed files with 61 additions and 8 deletions

9
README
View File

@@ -1,3 +1,6 @@
This is a Sitix (https://github.com/LinuxRocks2000/sitix-rewrite) project. To build it, run `sitix site` in the root directory. The output directory will contain the built site.
DO NOT RUN `sitix build site -o .`! I learned the hard way that recovering the files sitix will delete IS IMPOSSIBLE! And it'll even remove all your git stuff, which I was rather
mad about.
This is a Sitix (https://github.com/LinuxRocks2000/sitix-rewrite) project. To
build it, run `sitix site` in the root directory. The output directory will
contain the built site. DO NOT RUN `sitix build site -o .`! I learned the hard
way that recovering the files sitix will delete IS IMPOSSIBLE! And it'll even
remove all your git stuff, which I was rather mad about. Yes, I wrote sitix and
should understand all of its implications. What, you *don't* get tired?

View File

@@ -90,17 +90,29 @@
#shape {
height: calc(10vh + 3px);
width: 100vw;
background-color: var(--cream);
background-color: black;
clip-path: polygon(0% calc(100% - 3px), 0% 100%, 100% 100%, 100% calc(100% - 3px), 50% 0%);
position: absolute;
bottom: -1px;
}
#shape::after {
content: "";
display: inline-block;
width: 100%;
height: 100%;
position: absolute;
top: 3px;
left: 0px;
clip-path: inherit;
background-color: var(--cream);
}
#title {
font-size: 4em;
font-family: Lobster;
text-align: center;
background-color: var(--cream);
background-color: black;
color: black;
padding-top: 52px; /* TODO: make this less worsely */
position: sticky;
@@ -109,6 +121,19 @@
clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 50% calc(100% - 10vh), 0% 100%);
}
#title::after {
display: inline-block;
content: "";
width: 100vw;
height: 100%;
position: absolute;
top: -3px;
left: 0px;
z-index: -1;
background-color: var(--cream);
clip-path: inherit;
}
div#nav {
display: flex;
justify-content: center;

View File

@@ -1,6 +1,6 @@
@font-face {
font-family: Lobster;
src: url(Lobster-Regular.ttf);
src: url(res/Lobster-Regular.ttf);
}
* {
@@ -90,17 +90,29 @@
#shape {
height: calc(10vh + 3px);
width: 100vw;
background-color: var(--cream);
background-color: black;
clip-path: polygon(0% calc(100% - 3px), 0% 100%, 100% 100%, 100% calc(100% - 3px), 50% 0%);
position: absolute;
bottom: -1px;
}
#shape::after {
content: "";
display: inline-block;
width: 100%;
height: 100%;
position: absolute;
top: 3px;
left: 0px;
clip-path: inherit;
background-color: var(--cream);
}
#title {
font-size: 4em;
font-family: Lobster;
text-align: center;
background-color: var(--cream);
background-color: black;
color: black;
padding-top: 52px; /* TODO: make this less worsely */
position: sticky;
@@ -109,6 +121,19 @@
clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 50% calc(100% - 10vh), 0% 100%);
}
#title::after {
display: inline-block;
content: "";
width: 100vw;
height: 100%;
position: absolute;
top: -3px;
left: 0px;
z-index: -1;
background-color: var(--cream);
clip-path: inherit;
}
div#nav {
display: flex;
justify-content: center;