Change dog page styling

This commit is contained in:
Case Duckworth 2021-02-20 16:05:30 -06:00
parent 2a77bf5063
commit e02f3d4962
2 changed files with 139 additions and 132 deletions

View File

@ -2,47 +2,50 @@ dogs
<style>
.pagetitle { display: none; }
body {
background: cornflowerblue;
}
figure {
padding: 1ch;
border: 4px outset #aa9;
text-align: center;
background: #eed;
}
img {
max-width: 90%;
}
.aka li {
font: italic 1.5rem/1.5 serif;
display: inline-block;
}
.aka::before {
content: "A.K.A."
}
.aka li::after {
content: "; ";
}
.aka li:last-of-type::after {
content: "";
}
.pagetitle { display: none; }
body {
background: cornflowerblue;
}
figure {
padding: 1ch;
border: 4px outset #aa9;
text-align: center;
background: #eed;
max-width: 18rem;
float:left;
}
section { clear: both; }
img {
max-width: 90%;
}
.aka li {
font: italic 1.5rem/1.5 serif;
display: inline-block;
}
.aka::before {
content: "A.K.A."
}
.aka li::after {
content: "; ";
}
.aka li:last-of-type::after {
content: "";
}
</style>
<section id="stormy" >
<header>
<h1>Stormageddon, Dark Lord of All</h1>
<ul class="aka" >
<li>Stormy</li>
<li>Sterms ma germs</li>
<li>Ms. Geddum (if you're nasty)</li>
</ul>
</header>
<header>
<h1>Stormageddon, Dark Lord of All</h1>
<ul class="aka" >
<li>Stormy</li>
<li>Sterms ma germs</li>
<li>Ms. Geddum (if you're nasty)</li>
</ul>
</header>
Stormy is our original good girl, our O.G.G.
Stormy is our original good girl, our O.G.G.
She is eight years old and still as regal as ever.
She loves car rides, snuggles on the couch, licking faces,
and barking. A lot. She also loves pets from anyone and everyone!
@ -51,47 +54,47 @@ dogs
thunderstorms, fireworks, and dogs playing in a way
she does not approve of.
<figure>
<img src="https://dogs.acdw.net/stormy-car.jpeg" >
<figcaption>Her Highness in her favorite place to go for rides.</figcaption>
</figure>
<figure>
<img src="https://dogs.acdw.net/stormy-floor.jpeg" >
<figcaption>She is always vigilant, even when in repose.</figcaption>
</figure>
<figure>
<img src="https://dogs.acdw.net/stormy-panda.jpg" >
<figcaption>Sometimes she thinks she is a panda. She is not.</figcaption>
</figure>
<figure>
<img src="https://dogs.acdw.net/stormy-car.jpeg" >
<figcaption>Her Highness in her favorite place to go for rides.</figcaption>
</figure>
<figure>
<img src="https://dogs.acdw.net/stormy-floor.jpeg" >
<figcaption>She is always vigilant, even when in repose.</figcaption>
</figure>
<figure>
<img src="https://dogs.acdw.net/stormy-panda.jpg" >
<figcaption>Sometimes she thinks she is a panda. She is not.</figcaption>
</figure>
<figure>
<img alt="Stormy on the couch making a dumb face."
src="https://dogs.acdw.net/stormy-couch-derp.jpg"/>
<img alt="Stormy smiling on the couch."
src="https://dogs.acdw.net/stormy-couch-smile-alone.jpg" />
<figcaption>
Stormy makes a dumb face most of the time.</figcaption>
</figure>
<figure>
<img alt="Stormy on the couch making a dumb face."
src="https://dogs.acdw.net/stormy-couch-derp.jpg"/>
<img alt="Stormy smiling on the couch."
src="https://dogs.acdw.net/stormy-couch-smile-alone.jpg" />
<figcaption>
Stormy makes a dumb face most of the time.</figcaption>
</figure>
<figure>
<img alt="Stormy clipping her nails with her teeth."
src="https://dogs.acdw.net/stormy-toenail-cronch.jpg"/>
<figcaption>She also clips her own nails.</figcaption>
</figure>
<figure>
<img alt="Stormy clipping her nails with her teeth."
src="https://dogs.acdw.net/stormy-toenail-cronch.jpg"/>
<figcaption>She also clips her own nails.</figcaption>
</figure>
</section>
<section id="stella" >
<header>
<h1>Stellanor</h1>
<ul class="aka">
<li>Stella</li>
<li>Stel-la-la</li>
<li>Stelth Fightor</li>
</ul>
</header>
<header>
<h1>Stellanor</h1>
<ul class="aka">
<li>Stella</li>
<li>Stel-la-la</li>
<li>Stelth Fightor</li>
</ul>
</header>
Stella is our foster-fail.
Stella is our foster-fail.
We got her about three years ago and she is three and a half.
She really likes to run and jump and run some more.
She also likes playing, trying to eat the water hose,
@ -101,77 +104,77 @@ dogs
the vacuum cleaner, weird balloons, people walking on the porch,
and squirrels -- or she wants to eat those. Could be either one.
<figure>
<img src="https://dogs.acdw.net/stella-bed.jpeg" >
<figcaption>Stella loves to lounge and relax.</figcaption>
</figure>
<figure>
<img src="https://dogs.acdw.net/stella-on-run.jpeg" >
<figcaption>But she also loves a good strenuous run.</figcaption>
</figure>
<figure>
<img src="https://dogs.acdw.net/stella-bed.jpeg" >
<figcaption>Stella loves to lounge and relax.</figcaption>
</figure>
<figure>
<img src="https://dogs.acdw.net/stella-on-run.jpeg" >
<figcaption>But she also loves a good strenuous run.</figcaption>
</figure>
<figure>
<img alt="Stella looking up and to the left."
src="https://dogs.acdw.net/stella-attention.jpg"/>
<figcaption>Stella pays attention</figcaption>
</figure>
<figure>
<img alt="Stella looking up and to the left."
src="https://dogs.acdw.net/stella-attention.jpg"/>
<figcaption>Stella pays attention</figcaption>
</figure>
<figure>
<img alt="Stella sleeping on a blue and yellow blanket."
src="https://dogs.acdw.net/stella-blanket-sleep.jpg"/>
<figcaption>Stella sleeps</figcaption>
</figure>
<figure>
<img alt="Stella sleeping on a blue and yellow blanket."
src="https://dogs.acdw.net/stella-blanket-sleep.jpg"/>
<figcaption>Stella sleeps</figcaption>
</figure>
<figure>
<img alt="Stella sleeping, tongue out, on a couch."
src="https://dogs.acdw.net/stella-blep-out.jpg"/>
<figcaption>Stella's tongue is too big for her mouth.</figcaption>
</figure>
<figure>
<img alt="Stella sleeping, tongue out, on a couch."
src="https://dogs.acdw.net/stella-blep-out.jpg"/>
<figcaption>Stella's tongue is too big for her mouth.</figcaption>
</figure>
<figure>
<img alt="Closeup of Stella under her jaw."
src="https://dogs.acdw.net/stella-closeup-neckfolds.jpg"/>
<figcaption>Stella has neck folds.</figcaption>
</figure>
<figure>
<img alt="Closeup of Stella under her jaw."
src="https://dogs.acdw.net/stella-closeup-neckfolds.jpg"/>
<figcaption>Stella has neck folds.</figcaption>
</figure>
<figure>
<img alt="Stella on the couch, feet out, asleep."
src="https://dogs.acdw.net/stella-couch-sleep-feet.jpg"/>
<figcaption>Stella sleeps like this.</figcaption>
</figure>
<figure>
<img alt="Stella on the couch, feet out, asleep."
src="https://dogs.acdw.net/stella-couch-sleep-feet.jpg"/>
<figcaption>Stella sleeps like this.</figcaption>
</figure>
</section>
<section id="both">
<header><h1>More pictures of the both of them</h1></header>
<figure>
<img src="https://dogs.acdw.net/both-gate.jpg">
<figcaption>
Stella and Stormy greet me when I come home,
if the door's open (or, for that matter, if it isn't).
</figcaption>
</figure>
<figure>
<img src="https://dogs.acdw.net/both-albumcover.jpg">
<figcaption>
Here's the cover to their forthcoming debut album.
</figcaption>
</figure>
<header><h1>More pictures of the both of them</h1></header>
<figure>
<img src="https://dogs.acdw.net/both-gate.jpg">
<figcaption>
Stella and Stormy greet me when I come home,
if the door's open (or, for that matter, if it isn't).
</figcaption>
</figure>
<figure>
<img src="https://dogs.acdw.net/both-albumcover.jpg">
<figcaption>
Here's the cover to their forthcoming debut album.
</figcaption>
</figure>
</section>
<section id="sheep">
<header>
<h1>May-Bell</h1>
</header>
<figure>
<img src="https://dogs.acdw.net/may-bell.jpg">
<figcaption>
Our sweet soft girl. Stormy has competition.
</figcaption>
</figure>
<p>
May-Bell is a sheep given us by our good friend,
<a href="https://tomasino.is/sheep">tomasino</a>.
She's soft and fluffy and a sweetie.
</p>
<header>
<h1>May-Bell</h1>
</header>
<figure>
<img src="https://dogs.acdw.net/may-bell.jpg">
<figcaption>
Our sweet soft girl. Stormy has competition.
</figcaption>
</figure>
<p>
May-Bell is a sheep given us by our good friend,
<a href="https://tomasino.is/sheep">tomasino</a>.
She's soft and fluffy and a sweetie.
</p>
</section>

View File

@ -33,6 +33,10 @@ main > :last-child::after {
background: white;
}
#main-last-child {
clear: both;
}
body>header{ top:0; }
body>footer{ bottom: 0; }