hrk/braids
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

update html

Browse source
This commit is contained in:
Heerko 2026-01-15 12:58:33 +01:00
parent 4cbac9c351
commit db9653b9ce
1 changed files with 114 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

119
index.html
View file

@ -1,11 +1,120 @@
<!DOCTYPE html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1" />
<title>Braids</title> <title>Welcome!</title>
</head> </head>
<body> <body>
<h1>Braids</h1> <div class="wrap">
<div class="box highlight center">
<h1>WELCOME TO MY PAGE</h1>
<p class="blink spaced">★ Under Construction ★</p>
</div>
<div class="center">
<div class="pre ascii">
/\_/\
( o.o )
> ^ <
</div>
</div>
<div class="box">
<h2>About me</h2>
<p>Hi, I’m <strong>CHANGE ME</strong>.</p>
<p>I’m into <strong>CHANGE ME</strong>.</p>
<p>Right now I’m thinking about: <strong>CHANGE ME</strong>.</p>
<p>
If you want to see something I like, click
<a href="https://example.com">CHANGE ME (your link)</a>.
</p>
</div>
</div>
<style>
/*
Everything below this comment is CSS, this determines how the page looks.
Edit only if you want. Colors are easy to change, so you could just try it out.
Theres a list here: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/named-color
*/
body {
margin: 0;
font-family: Arial, Helvetica, sans-serif;
color: black;
/* striped background */
background:
repeating-linear-gradient(45deg,
yellow 0px,
yellow 14px,
pink 14px,
pink 28px);
}
.wrap {
max-width: 760px;
margin: 0 auto;
padding: 16px;
}
.box {
background: white;
border: 3px solid black;
padding: 12px;
margin: 12px 0;
}
.highlight {
background: yellow;
font-family: fantasy;
}
.footer {
background: skyblue;
}
.center {
text-align: center;
}
/* .spaced { margin: 8px 0; } */
.blink {
animation: blink 1s steps(2, start) infinite;
font-weight: bold;
}
@keyframes blink {
to {
visibility: hidden;
}
}
.ascii {
font-family: "Courier New", Courier, monospace;
}
.pre {
line-height: 1.2;
margin: 10px 0 0;
white-space: pre;
display: inline-block;
background: white;
border: 10px dotted red;
border-radius: 50%;
padding: 10px;
}
</style>
</body> </body>
</html> </html>