Browse files

Example page

  • Loading branch information...
0 parents commit a223136fb08d8dc1d09f57fc66e3758f2ff3a5d2 @jakearchibald committed Dec 3, 2011
Showing with 153 additions and 0 deletions.
  1. +18 −0 css/base.css
  2. +135 −0 index.html
  3. 0 js/base.js
18 css/base.css
@@ -0,0 +1,18 @@
+body {
+ font: 1em/1.5 Cambria, Georgia, serif;
+ margin: 0 5%;
+}
+a {
+ color: #369;
+ text-decoration: none;
+}
+@media all and (min-width: 640px) {
+ [role="main"] {
+ width: 60%;
+ float: left;
+ }
+ [role="complementary"] {
+ width: 30%;
+ float: right;
+ }
+}
135 index.html
@@ -0,0 +1,135 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <title>Can’t Hug Every Cat</title>
+ <meta name="HandheldFriendly" content="True">
+ <meta name="MobileOptimized" content="320">
+ <meta name="viewport" content="height=device-height, width=device-width, initial-scale=1.0">
+ <meta http-equiv="cleartype" content="on">
+ <link rel="stylesheet" href="css/base.css">
+</head>
+<body>
+<div role="main">
+ <h1>
+ A Metaphysical Reflection Upon The Nature Of Multitudinous
+ Feline Affection
+ </h1>
+ <footer>
+ By
+ <a href="http://www.youtube.com/watch?v=sP4NMoJcFd4">
+ Debbie the Online Dater
+ </a>
+ </footer>
+ <p>
+ I love cats.<br>
+ I love every kind of cat.<br>
+ I just wanna hug all of them but I can’t;<br>
+ Can’t hug every cat,<br>
+ Can’t hug every cat.
+ </p>
+ <p>
+ So anyway I am a cat lover<br>
+ And I love to run.<br>
+ I’m sorry I’m thinking about cats again.<br>
+ I really love cats.
+ </p>
+ <p>
+ I’m thinking about cats again<br>
+ And again, and again and again and again.<br>
+ I think about how many don’t have a home<br>
+ And how I should have them.<br>
+ I think about how cute they are<br>
+ And how their ears and the whiskers and the nose.
+ </p>
+ <p>
+ I just love them.<br>
+ And I want them.<br>
+ And I want them in a basket.<br>
+ And I want little bow ties.<br>
+ I just love them.<br>
+ And I want them<br>
+ To be on a rainbow<br>
+ And in my bed<br>
+ And I just want us to roll around.
+ </p>
+ <p>Sorry I’m getting emotional.</p>
+ <p>
+ I love cats.<br>
+ I love every kind of cat.<br>
+ I just wanna hug all of them but I can’t;<br>
+ Can’t hug every cat,<br>
+ Can’t hug every cat.
+ </p>
+ <p>
+ So anyway I am a cat lover<br>
+ And I love to run.<br>
+ I’m sorry I’m thinking about cats again.<br>
+ I really love cats.<br>
+ But I can’t hug every cat;<br>
+ Can’t hug every cat,<br>
+ Can’t hug every cat.
+ </p>
+</div>
+
+<aside role="complementary">
+ <h1>My favourite cat videos</h1>
+ <article>
+ <a href="http://www.youtube.com/watch?v=fzzjgBAaWZw">
+ <h1>Stalking cat</h1>
+ </a>
+ <p>
+ This cat is like a horror movie, but it's not horrible
+ (which is where the word 'horror' comes from) because it's
+ just a cat. You've probably seen this, it's totally famous.
+ I hope this cat is single.
+ </p>
+ </article>
+ <article>
+ <a href="http://www.youtube.com/watch?v=J6AJzeZ4qSI">
+ <h1>Cat gets up, walks away</h1>
+ </a>
+ <p>
+ So, there's this cat, and he's (or she's, if it's not a he)
+ lying down, then he (or she, if it's not a he) suddenly
+ thinks "That's enough of lying down", so he (or she, if it's
+ not a he) gets up and totally walks away. Funny thing is
+ he (or she if it's not a he) walks on two legs, and cats
+ normally walk on four, whether they're a he or a she!
+ </p>
+ </article>
+ <article>
+ <a href="http://www.youtube.com/watch?v=J---aiyznGQ">
+ <h1>Cat plays keyboard like they usually wouldn't</h1>
+ </a>
+ <p>
+ People tell me this cat (or she if it's not a he) is dead.
+ This is <strong>not true</strong> as cats are immortal
+ right until the end of their lives. I like this video even
+ though I can't play the keyboard. LOL!
+ </p>
+ </article>
+ <article>
+ <a href="http://www.youtube.com/watch?v=xKExXjFAQz4">
+ <h1>Goat wears mask, scares other goats</h1>
+ </a>
+ <p>
+ Goats have a lot in common with cats (eg legs) but if you
+ look closely they are quite different. For example, goat's
+ cheese is quite nice whereas cat's cheese made me sick and
+ was difficult to make.
+ </p>
+ </article>
+ <article>
+ <a href="http://www.youtube.com/watch?v=u2LTd1wmTjo">
+ <h1>Cat gets angry and stands up</h1>
+ </a>
+ <p>
+ This cat shows us we should stand up to others,
+ even if it looks weird. This cat should win
+ the nobel peace prize for fighting.
+ </p>
+ </article>
+</aside>
+</body>
+</html>
0 js/base.js
No changes.

0 comments on commit a223136

Please sign in to comment.