Compare commits
No commits in common. "e37281a666c97eba7c967cd4d5ca93f9e3e1849a" and "10bd0ca9d43054b23538f4c3362616651f3bd889" have entirely different histories.
e37281a666
...
10bd0ca9d4
43
index.html
43
index.html
|
@ -4,8 +4,42 @@
|
|||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>The Trees of Kortirion</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<link rel="stylesheet" href="./style.css" />
|
||||
<style>
|
||||
body {
|
||||
counter-reset: section;
|
||||
margin: 5rem 0;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2 {
|
||||
text-align: center;
|
||||
font-size: 1em;
|
||||
font-weight: normal;
|
||||
font-style: italic;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
h2::before {
|
||||
counter-increment: section;
|
||||
content: counter(section, upper-roman);
|
||||
display: block;
|
||||
font-style: normal;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
.section {
|
||||
width: 36rem;
|
||||
margin: 2rem auto;
|
||||
}
|
||||
|
||||
.verse {
|
||||
margin-left: 6rem;
|
||||
}
|
||||
|
||||
.line-indented {
|
||||
margin-left: 1em;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
@ -84,11 +118,10 @@
|
|||
<span class="line">A whisper in the trees - afar they hear,</span><br />
|
||||
<span class="line line-indented">Piercing the heart of summer’s tangled dream,</span><br />
|
||||
<span class="line">Chill music that a herald piper plays</span><br />
|
||||
<span class="line">Foreseeing winter and the leafless days.</span><br />
|
||||
<span class="line">FOreseeing winter and the leafless days.</span><br />
|
||||
<span class="line line-indented">The late flowers trembling on the ruined walls</span><br />
|
||||
<span class="line">Already stoop to hear that elven-flute.</span><br />
|
||||
<span class="line line-indented">Through the wood’s sunny aisles and tree-propped
|
||||
halls</span><br />
|
||||
<span class="line line-indented">Through the wood’s sunny aisles and tree-propped halls</span><br />
|
||||
<span class="line">Winding amid the green with clear cold note</span><br />
|
||||
<span class="line">Like a thin strand of silver glass remote.</span>
|
||||
</p>
|
||||
|
|
43
style.css
43
style.css
|
@ -1,43 +0,0 @@
|
|||
body {
|
||||
counter-reset: section;
|
||||
margin: 5rem 1rem;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2 {
|
||||
text-align: center;
|
||||
font-size: 1em;
|
||||
font-weight: normal;
|
||||
font-style: italic;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
h2::before {
|
||||
counter-increment: section;
|
||||
content: counter(section, upper-roman);
|
||||
display: block;
|
||||
font-style: normal;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
.section {
|
||||
max-width: 36rem;
|
||||
margin: 2rem auto;
|
||||
}
|
||||
|
||||
.verse {
|
||||
max-width: 30rem;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.line-indented {
|
||||
padding-left: 1em;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 32rem) {
|
||||
.line {
|
||||
display: inline-block;
|
||||
margin-left: 2em;
|
||||
text-indent: -2em;
|
||||
}
|
||||
}
|
Loading…
Reference in a new issue