Super simple template index.html
This commit is contained in:
parent
74acd6c385
commit
6e48fd8eac
3 changed files with 130 additions and 0 deletions
61
www/index.html
Normal file
61
www/index.html
Normal file
|
|
@ -0,0 +1,61 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Do butterflies cry when they're sad?</title>
|
||||
<style>
|
||||
html, body {
|
||||
height: 100%;
|
||||
}
|
||||
body {
|
||||
background-color: #fff;
|
||||
background: radial-gradient(circle at center, #fff 0%, #f8f8f8 75%, #ebebeb 100%);
|
||||
color: #222;
|
||||
font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
main {
|
||||
padding: 1rem;
|
||||
text-align: center;
|
||||
}
|
||||
h1 {
|
||||
font-size: 2.5rem;
|
||||
line-height: 1.1;
|
||||
margin: 0;
|
||||
}
|
||||
@media screen and (max-width: 480px) {
|
||||
h1 {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
}
|
||||
h1::after {
|
||||
content: "";
|
||||
background-color: #ffe800;
|
||||
background: repeating-linear-gradient(45deg, #ffe800, #ffe800 0.5rem, #222 0.5rem, #222 1.0rem);
|
||||
display: block;
|
||||
height: 0.5rem;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
p {
|
||||
margin: 1rem 0 0 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<h1>dobutterfliescry.net</h1>
|
||||
<p>Do butterflies cry when they're sad?</p>
|
||||
<p>(ilovem)</p>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
9
www/index.html.bak
Normal file
9
www/index.html.bak
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>MITTENS NOW!!</title>
|
||||
</head>
|
||||
<body>
|
||||
<p>Give me your mittens!</p>
|
||||
</body>
|
||||
</html>
|
||||
60
www/wdym.html
Normal file
60
www/wdym.html
Normal file
|
|
@ -0,0 +1,60 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>example.com</title>
|
||||
<style>
|
||||
html, body {
|
||||
height: 100%;
|
||||
}
|
||||
body {
|
||||
background-color: #fff;
|
||||
background: radial-gradient(circle at center, #fff 0%, #f8f8f8 75%, #ebebeb 100%);
|
||||
color: #222;
|
||||
font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
main {
|
||||
padding: 1rem;
|
||||
text-align: center;
|
||||
}
|
||||
h1 {
|
||||
font-size: 2.5rem;
|
||||
line-height: 1.1;
|
||||
margin: 0;
|
||||
}
|
||||
@media screen and (max-width: 480px) {
|
||||
h1 {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
}
|
||||
h1::after {
|
||||
content: "";
|
||||
background-color: #ffe800;
|
||||
background: repeating-linear-gradient(45deg, #ffe800, #ffe800 0.5rem, #222 0.5rem, #222 1.0rem);
|
||||
display: block;
|
||||
height: 0.5rem;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
p {
|
||||
margin: 1rem 0 0 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<h1>dobutterfliescry.net</h1>
|
||||
<p>Huh wdym?</p>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue