Customize profile page for dododidi
This commit is contained in:
Charlotte Meinicke
parent
db9653b9ce
commit
0ea523bd06
146
index.html
146
index.html
|
|
@ -1,120 +1,34 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
<title>Welcome!</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<meta http-equiv="Content-Style-Type" content="text/css">
|
||||
<title></title>
|
||||
<meta name="Generator" content="Cocoa HTML Writer">
|
||||
<meta name="CocoaVersion" content="2685.1">
|
||||
<style type="text/css">
|
||||
p.p3 {margin: 0.0px 0.0px 12.0px 0.0px; text-align: center; font: 12.0px 'Songti SC'; -webkit-text-stroke: #000000; background-color: #ffff0b}
|
||||
p.p4 {margin: 0.0px 0.0px 0.0px 0.0px; text-align: center; font: 12.0px 'Songti SC'; background-color: #ffff0b}
|
||||
p.p5 {margin: 0.0px 0.0px 0.0px 0.0px; text-align: center; font: 12.0px 'Courier New'; -webkit-text-stroke: #000000; background-color: #ffffff; min-height: 14.0px}
|
||||
p.p6 {margin: 0.0px 0.0px 12.0px 0.0px; text-align: center; font: 140.0px Arial; background-color: #ffffff}
|
||||
p.p7 {margin: 0.0px 0.0px 0.0px 0.0px; text-align: center; font: 12.0px Arial; -webkit-text-stroke: #000000}
|
||||
span.s1 {font-kerning: none; background-color: #ffff0b}
|
||||
span.s2 {font-kerning: none}
|
||||
span.s3 {font: 12.0px 'Courier New'; font-kerning: none; background-color: #ffffff; -webkit-text-stroke: 0px #000000}
|
||||
span.s4 {font-kerning: none; -webkit-text-stroke: 0px #000000}
|
||||
span.s5 {font: 12.0px 'Courier New'; font-kerning: none; background-color: #ffffff}
|
||||
span.s6 {font-kerning: none; background-color: #ffffff}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<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>
|
||||
<h1 style="margin: 0.0px 0.0px 16.1px 0.0px; text-align: center; font: 24.0px Zapfino; -webkit-text-stroke: #000000"><span class="s1">WELCOME TO dodo</span></h1>
|
||||
<h1 style="margin: 0.0px 0.0px 16.1px 0.0px; text-align: center; font: 12.0px 'Courier New'; -webkit-text-stroke: #000000; background-color: #ffffff; min-height: 14.0px"><span class="s2"></span><br></h1>
|
||||
<p class="p3"><span class="s2">★ <span class="Apple-converted-space"> </span></span><span class="s3">/\_/\</span><span class="s2"> <span class="Apple-converted-space"> </span></span><span class="s4">★</span><span class="s2"><span class="Apple-converted-space"> </span></span><span class="s5"> <span class="Apple-converted-space"> </span></span></p>
|
||||
<p class="p4"><span class="s3"><span class="Apple-converted-space"> </span></span><span class="s2">★ <span class="Apple-converted-space"> </span></span><span class="s3">( o.o )</span><span class="s2"><span class="Apple-converted-space"> </span>★<span class="Apple-converted-space"> </span></span><span class="s3"> <span class="Apple-converted-space"> </span></span></p>
|
||||
<p class="p4"><span class="s3"><span class="Apple-converted-space"> </span></span><span class="s2">★ <span class="Apple-converted-space"> </span></span><span class="s3">> ^ <</span><span class="s2"> <span class="Apple-converted-space"> </span>★<span class="Apple-converted-space"> </span></span><span class="s5"> <span class="Apple-converted-space"> </span></span></p>
|
||||
<p class="p5"><span class="s2"><span class="Apple-converted-space"> </span></span></p>
|
||||
<p class="p5"><span class="s2"><span class="Apple-converted-space"> </span></span></p>
|
||||
<p class="p6"><span class="s2"><b>🦤</b><b></b></span></p>
|
||||
<p class="p7"><span class="s6">Hi, I’m <b>dodo — </b>I’m into <b>dodos — </b>Right now I’m thinking about: <b>dodos ))<span class="Apple-converted-space"> </span></b><b></b></span></p>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Reference in a new issue