├── README.md ├── index.html └── stylesheets └── styles.css /README.md: -------------------------------------------------------------------------------- 1 | #Martin theme 2 | 3 | Showcase your project in style with Martin, a bold, timeless theme for GitHub pages! Named for the punchcutter William Martin, apprentice to John Baskerville. This work is licensed under a [Creative Commons Attribution-ShareAlike 3.0 Unported License](http://creativecommons.org/licenses/by-sa/3.0/). Check out the [live demo](http://house.github.io/martin/). 4 | 5 | ![Martin theme preview](https://f.cloud.github.com/assets/306877/1145554/bddcfe0a-1e1d-11e3-998c-171657eb1054.png) 6 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Martin Theme by Allison House 7 | 8 | 9 | 12 | 13 | 14 |
15 | 16 |
17 |
github.com/house
18 |
19 | Fork on GitHub 20 | • Download ZIP 21 |
22 |
23 |

Martin

24 |

Showcase your project in style with this bold, timeless theme for GitHub pages.

25 |
26 |
27 |
28 |

About Martin

29 |

Martin is a GitHub pages theme by Allison House, named for the punchcutter William Martin. To use it, just fork this project and replace my content with your own. This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 Unported License.

30 |

Style examples

31 |

Blockquote

32 |

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

33 |
34 |

You know, there are some words I've known since I was a schoolboy. "With the first link, the chain is forged. The first speech censored, the first thought forbidden, the first freedom denied, chains us all irrevocably." Those words were uttered by Judge Aaron Satie as wisdom and warning. The first time any man's freedom is trodden on, we're all damaged.

35 |

— Jean-Luc Picard, Star Trek: The Next Generation

36 |
37 |

Morbi a mi vel tortor feugiat tempor in et arcu. Etiam vitae aliquet neque, quis vestibulum urna.

38 |

Table

39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 |
WhiskeyTangoFoxtrot
Apple1a
Blueberry2b
Banana3c
49 |

Lists

50 | 51 |
    52 |
  1. Item 1
    2. 53 |
  2. Item 2
    3. 54 |
  3. Item 3
    4. 55 |
56 | 61 | 62 |

Code

63 | 
pre, code {
64 |   display: block;
65 |   line-height: 1.833em;
66 |   }
67 |

Headings

68 |

Here is a headline

69 |

This is the <h3>. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

70 |

Here is another headline

71 |

This is the <h4>. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

72 |
If you need it, here is another
73 |

This is the <h5>. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

74 |
And here's the last one
75 |

This is the <h6>. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

76 | 77 |
78 | 81 |
82 | 83 | 84 | -------------------------------------------------------------------------------- /stylesheets/styles.css: -------------------------------------------------------------------------------- 1 | @import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,600italic,300,600); 2 | @import url(http://fonts.googleapis.com/css?family=Playfair+Display:900italic,900); 3 | 4 | 5 | /*-------------------------------- 6 | Typography 7 | --------------------------------*/ 8 | 9 | body { font: 200 18px/1.61em 'Open Sans', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif; color: #888; } 10 | a { text-decoration: none; color: inherit; border-bottom: 1px solid #ddd; } 11 | a:hover { border-bottom: 1px solid #222; } 12 | em { font-style: italic; } 13 | strong { font-weight: 600; } 14 | h1, h2, h3, 15 | h4, h5, h6 { font-family: 'Playfair Display', 'Didot LT STD', Garamond, serif; font-weight: 900; color: #222; margin: 1em 0;} 16 | h1 { font-size: 2em; line-height: 1.33em;} 17 | h2 { font-size: 1.55em; line-height: 1.25em; } 18 | h3 { font-size: 1.15em; } 19 | h4 { font-size: 1em; } 20 | h5 { font-size: 0.78em; } 21 | h6 { font-size: 0.67em; } 22 | h4, h5, h6 { text-transform: uppercase; letter-spacing: 0.15em; } 23 | p, ul, pre, table { margin: 0; margin-bottom: 1em; } 24 | code, pre { font-size: 0.9em; color: #222;} 25 | blockquote { border-left: 2px solid #222; color: #222; padding-left: 2em; margin: 0; } 26 | hr { border: 0; height: 2px; display: block; margin: 4em auto; background: #222; } 27 | table { width: 100%; } 28 | th, td { padding: 1em; text-align: center;} 29 | td { font-size: 0.88em; } 30 | th { 31 | border-bottom: 1px solid #222; 32 | font-weight: 100; 33 | text-transform: uppercase; 34 | letter-spacing: 0.2em; 35 | font-size: 0.7em; 36 | text-align: center; 37 | color: #222; 38 | } 39 | 40 | 41 | /*-------------------------------- 42 | Layout 43 | --------------------------------*/ 44 | 45 | body { 46 | background: #eee; 47 | margin: 0; 48 | } 49 | 50 | #wrapper { 51 | max-width: 650px; 52 | margin: 50px auto; 53 | padding: 60px 9%; 54 | margin-top: 50px; 55 | background: #fff 56 | } 57 | 58 | header, section, footer, a { 59 | transition: 0.2s; 60 | } 61 | 62 | header { 63 | clear: both; 64 | padding-bottom: 3em; 65 | padding-top: 1px; 66 | border-bottom: 3px solid #222; 67 | } 68 | 69 | header a { 70 | border-bottom: 1px solid #fff; 71 | } 72 | 73 | .byline { 74 | float: left; 75 | } 76 | 77 | .byline a { 78 | color: #888; 79 | text-align: center; 80 | font-size: 0.7em; 81 | text-transform: uppercase; 82 | letter-spacing: 0.1em; 83 | text-align: left; 84 | } 85 | 86 | .downloads { 87 | float: right; 88 | } 89 | 90 | .downloads a { 91 | margin: 0 1em; 92 | color: #888; 93 | text-align: center; 94 | font-size: 0.7em; 95 | text-transform: uppercase; 96 | letter-spacing: 0.1em; 97 | } 98 | 99 | .downloads a:last-child { 100 | margin-right: 0; 101 | } 102 | 103 | header hgroup { 104 | clear: both; 105 | border-top: 4px solid #222; 106 | margin-top: 3em; 107 | } 108 | 109 | header h1 { 110 | margin: 0; 111 | margin-top: 1px; 112 | padding-top: 1.5em; 113 | font-family: 'Playfair Display', "Didot LT STD", "Hoefler Text", Garamond, "Times New Roman", serif; 114 | line-height: 1.33em; 115 | font-style: italic; 116 | font-size: 5em; 117 | border-top: 1px solid #222; 118 | } 119 | 120 | .tagline { 121 | margin:0; 122 | margin-top: 1.25em; 123 | font-family: 'Playfair Display', "Didot LT STD", "Hoefler Text", Garamond, "Times New Roman", serif; 124 | line-height:1.5em; 125 | color: #222; 126 | } 127 | 128 | section { 129 | padding-top: 5em; 130 | padding-bottom: 4em; 131 | border-bottom: 4px solid #222; 132 | margin-top: 1px; 133 | } 134 | 135 | section h1:first-child { 136 | margin-top: 0; 137 | } 138 | 139 | footer { 140 | margin-top: 1px; 141 | padding-top: 3em; 142 | overflow: auto; 143 | text-align: center; 144 | font-size: 0.7em; 145 | text-transform: uppercase; 146 | letter-spacing: 0.1em; 147 | border-top: 1px solid #222; 148 | } 149 | 150 | @media print { 151 | body { font-size: 12px; } 152 | header { border: 0;padding: 0; margin: 0; text-align: center; } 153 | .downloads, .byline, footer { display: none; } 154 | header hgroup { border: 0; padding: 0; margin: 0; } 155 | header h1 { margin: 0; padding: 0; font-size: 3em; border: 0; } 156 | header h2 { border: 0; margin: 0; } 157 | .downloads, footer { display: none; } 158 | section { border: 0; } 159 | } 160 | 161 | @media screen and (max-width: 650px) { 162 | body { font-size: 16px; background: #fff; } 163 | #wrapper { margin: 0px; padding: 0; } 164 | .byline, .downloads {float: none; text-align: center; } 165 | .downloads a:first-child {margin-left: 0; } 166 | header { padding: 2em; } 167 | header hgroup { text-align: center; border: 0; margin: 0; } 168 | header h1 { font-size: 3em; border: 0; padding: 0; padding-top: 0.5em; } 169 | .tagline { border: 0; margin-top: 0.5em; } 170 | header div { border: 0; } 171 | section, footer { padding: 2em; } 172 | footer p { width: 100%; float: none; } 173 | footer p:last-child { text-align: left; } 174 | } 175 | --------------------------------------------------------------------------------