├── README.md ├── chapter1 ├── images │ ├── w.png │ ├── point.png │ └── sample.jpg ├── styles.css └── index.html └── .gitignore /README.md: -------------------------------------------------------------------------------- 1 | class 2 | ===== 3 | 4 | class -------------------------------------------------------------------------------- /chapter1/images/w.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lyric/class/master/chapter1/images/w.png -------------------------------------------------------------------------------- /chapter1/images/point.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lyric/class/master/chapter1/images/point.png -------------------------------------------------------------------------------- /chapter1/images/sample.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lyric/class/master/chapter1/images/sample.jpg -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | *.gem 2 | *.rbc 3 | .bundle 4 | .config 5 | coverage 6 | InstalledFiles 7 | lib/bundler/man 8 | pkg 9 | rdoc 10 | spec/reports 11 | test/tmp 12 | test/version_tmp 13 | tmp 14 | 15 | # YARD artifacts 16 | .yardoc 17 | _yardoc 18 | doc/ 19 | -------------------------------------------------------------------------------- /chapter1/styles.css: -------------------------------------------------------------------------------- 1 | /* Desktop, fixed width CSS */ 2 | 3 | /* Reset */ 4 | * { 5 | margin: 0; 6 | padding: 0; 7 | } 8 | 9 | /** 10 | * Color, typography and basic layout 11 | * Colors: 12 | * - #f9f3e9 -> light cream (background) 13 | * - #594846 -> Dark brown (body text, rules) 14 | * - #42628F -> Dark blue (link text) 15 | * - #7b96bc -> Medium-light blue (navigation and footer background) 16 | */ 17 | body { 18 | background: #f9f3e9; 19 | color: #594846; 20 | font: "Adobe Caslon Pro", Georgia, "Times New Roman", serif; 21 | } 22 | a, a:visited { 23 | color: #42628F; 24 | } 25 | p { 26 | margin: 0.5em 0.25em; 27 | } 28 | h1 { 29 | font-size: 1.75em; 30 | border: solid #594846; 31 | border-width: 2px 0; 32 | padding: 0.25em; 33 | text-align: center; 34 | font-variant: small-caps; 35 | } 36 | h2 { 37 | text-align: center; 38 | font-variant: small-caps; 39 | } 40 | dl { 41 | margin: 0 0.5em; 42 | } 43 | dt { 44 | font-weight: bold; 45 | margin: 0.5em 1em 0.5em 0; 46 | border-bottom: 1px dashed #7b96bc; 47 | } 48 | .intro { 49 | font-size: 1.15em; 50 | line-height: 1.3em; 51 | text-align: justify; 52 | margin: 0.5em; 53 | font-weight: bold; 54 | } 55 | .navigation { 56 | background-color:#7b96bc; 57 | border-bottom: 2px solid #594846; 58 | } 59 | .navigation ul li { 60 | text-align: center; 61 | display: block; 62 | float: left; 63 | padding: 0.25em 0; 64 | } 65 | .navigation li a { 66 | color: #f9f3e9; 67 | font-variant: small-caps; 68 | text-decoration: none; 69 | } 70 | .header p { 71 | margin-left: -1000px; 72 | } 73 | #points ul { 74 | list-style-image: url('images/point.png'); 75 | margin: 0.5em 0 1em 0.5em; 76 | padding-left: 1em; 77 | } 78 | #points ul li { 79 | margin: 0.5em 1em; 80 | } 81 | .footer { 82 | background-color: #7b96bc; 83 | color: #f9f3e9; 84 | text-align: center; 85 | padding: .5em 0; 86 | font-style: italic; 87 | } 88 | 89 | /* Structure */ 90 | body, .header, .navigation, .footer { 91 | width: 960px; 92 | } 93 | .header, .navigation, .footer { 94 | clear: both; 95 | } 96 | .column { 97 | margin: 10px 10px 0 0; 98 | } 99 | .navigation { 100 | min-height: 25px; 101 | } 102 | .navigation ul li { 103 | width: 320px; /* 960/3 */ 104 | } 105 | .header { 106 | background:url(images/w.png) no-repeat; 107 | height: 200px; 108 | } 109 | #visit { 110 | width: 240px; 111 | float: left; 112 | } 113 | #points { 114 | width: 240px; 115 | float: right; 116 | } 117 | #main { 118 | margin: 10px 260px 0 250px; 119 | width: 460px; 120 | } -------------------------------------------------------------------------------- /chapter1/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | The Splendid Walrus: Public House and Spirits 6 | 7 | 8 | 9 |
10 | 15 |
16 |

[The splendid walrus surveys his domain!]

17 |

The Splendid Walrus: Public House & Spirits

18 |
19 |

Visit Us!

20 |
21 |
Location
22 |
1543 SW Pretend Street
23 | Portland, OR 97201 [Map]
24 | 25 |
Hours
26 |
27 |
28 |
M-F
29 |
Until midnight
30 |
Sa-Su
31 |
Until 1AM*

*At least

32 |
33 |
34 |
Call us
35 |
+1 (503) 555-1212
36 |
37 |

38 | 39 |

40 |
41 |
42 |

The Splendid Walrus pub is the place in downtown Portland, Ore., to do all of these things:

43 | 50 | 51 |
52 |
53 |

This month's special

54 | 55 |

25% off Jazz Hands Vodka: locally-made vodka bliss.

56 |

Jazz Hands Vodka is the newest product from local distiller Awesomesauce. Bright and vivid, it's the perfect warm-weather treat. We've concocted some pretty wonderful custom cocktails to highlight it (try the White Devil or the Regret). Or you can go classic with our ultra-fresh Lemon Drop (made with organic citrus).

57 | Tastes wonderful 58 |
59 |
60 |

See you soon! Love, The Splendid Walrus

61 |
62 | 63 | --------------------------------------------------------------------------------