Permalink
Browse files

add style

  • Loading branch information...
1 parent 466c73d commit 798f870f18167e93ad0fb6baa0ba8ce586cba606 @mnot mnot committed Apr 2, 2012
Showing with 339 additions and 0 deletions.
  1. +1 −0 _layouts/layout.html
  2. +338 −0 style.css
View
1 _layouts/layout.html
@@ -5,6 +5,7 @@
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="author" content="Your Name" />
<title>HTAPI - {{ page.title }}</title>
+ <link rel="STYLESHEET" href="/style.css" type="text/css" />
</head>
<body>
<header>
View
338 style.css
@@ -0,0 +1,338 @@
+
+/* main ---------------------- */
+
+body {
+ font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ font-size: 0.95em;
+ line-height: 1.4em;
+ color: #111;
+ text-rendering: optimizeLegibility;
+ -moz-font-feature-settings: "liga=1,kern=1";
+ -ms-font-feature-settings: "liga" 1, "kern" 1;
+ text-align: left;
+}
+h1, h2, h3, h4, h5, h6, pre {
+ font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ font-weight: normal;
+ -moz-font-feature-settings: "swsh=1,cswh=1,liga=1,kern=1";
+ -ms-font-feature-settings: "swsh" 1, "cswh" 1, "liga" 1, "kern" 1;
+}
+h1, .subtitle {
+ font-weight: normal;
+}
+.example, code, pre, .spec {
+ font-family: "Lucida Console", Courier, monospace;
+}
+
+/* blocks -------------- */
+
+body {
+ width: 820px;
+ padding: 0px 36px;
+ background-color: #fff;
+ margin: 72px auto;
+}
+
+
+p { margin-top: .5em; }
+
+blockquote p, blockquote {
+ margin-top: 0;
+ margin-bottom: .5em;
+ line-height: 1.4em;
+}
+
+
+/* width control ---------------- */
+
+#main {
+ max-width: 600px;
+}
+
+
+/* links -------------- */
+
+a:link, a:visited, a:active {
+ color: #303a86;
+ text-decoration: none;
+ background-color: transparent;
+}
+a:visited {
+ color: #606a86;
+}
+a:active {
+ color: #303a86;
+ background-color: #acf;
+}
+a.offsite:hover {
+ background-color: #99A;
+ color: white;
+ text-decoration: none;
+ border-bottom: none;
+ padding: 0.2em 0;
+}
+
+@media screen {
+ a[type="application/pdf"]:after {
+ content: " pdf";
+ vertical-align: super;
+ font-size: 0.75em;
+ }
+}
+
+img { max-width: 100%; }
+
+a img { border: none; }
+
+h1 [id]:hover:after
+, h2 [id]:hover:after
+, h3 [id]:hover:after
+, h4 [id]:hover:after {
+ content: " #" attr(id) " ";
+ font-size: 75%;
+ line-height: 75%;
+ color: #ccc;
+ text-decoration: none;
+}
+
+/* headings -------------- */
+
+h1, h2, h3, h4, h5, h6 {
+ color: #B50;
+ background-color: transparent;
+ text-transform: uppercase;
+ margin: 1em 0 0 0;
+ padding: 0;
+ line-height: 1em;
+ page-break-after: avoid;
+ page-break-inside: avoid;
+}
+
+h1 {
+ font-size: 3em;
+ margin-top: 24px;
+ color: #111;
+ display: inline-block;
+}
+h2 { font-size: 1.65em; }
+h3 { font-size: 1.2em; }
+h4 { font-size: 1em; }
+h5 { font-size: 1em; }
+
+h1 + p {margin-top: .5em; }
+
+h1 + .subtitle {
+ font-size: 0.85em;
+ line-height: 12pt;
+ text-align: left;
+ max-width: 178px;
+ display: inline-block;
+ margin-left: 0.5em;
+}
+
+
+
+/* tables -------------- */
+
+table.grid th {
+ font-weight: normal;
+ text-align: right;
+ color: white;
+ background-color: #333;
+ padding: 3px 6px;
+}
+
+table.grid td {
+ background-color: #d0dbe7;
+ padding: 3px 6px;
+}
+
+/* lists -------------- */
+
+ul {
+ list-style-type: disc;
+ margin: .5em 0;
+ padding-left: 1.5em;
+}
+p + ul, div + ul {
+ margin: -.5em 0 .5em 0;
+}
+
+/* inline lists */
+ul.inline { list-style-type: none; }
+ul.inline li { display: inline; margin-right: 1em; white-space: nowrap}
+ul.inline li:before { content: ''; }
+
+/* sep lists */
+ul.sep li {
+ list-style: none;
+ border-bottom: 1px #ccc dotted;
+ padding: 4pt 0pt;
+ text-indent: 0;
+}
+ul.sep li:last-of-type {
+ border-bottom: none;
+}
+ul.sep li:before { content: ''; }
+
+/* definition lists */
+dt { font-weight: bold; }
+dd { padding-bottom: .5em; }
+
+
+/* other redefinitions -------------- */
+
+
+acronym:hover, abbrev:hover { cursor: help; }
+abbrev[title], acronym[title], span[title] {
+ border-bottom: thin dotted;
+ cursor: help;
+}
+
+input[type='text'], textarea, select {
+ border-color: black;
+ border-style: solid;
+ border-width: 1px;
+ margin: 2px 1px;
+ padding: 1px;
+}
+
+b, strong {
+ font-weight: 500;
+}
+
+hr {
+ border-style: none;
+ background-color: #ddd;
+ padding: 1px;
+}
+
+
+blockquote {
+ border-style: solid;
+ border-color: #d2dcdf;
+ border-width: 0 0 0 .25em;
+ padding-left: .5em;
+ margin: 0.5em 1.5em;
+}
+
+q { quotes: '\201C' '\201D' '\2018' '\2019'; }
+q:before, q:after {
+ font-size: 2em;
+ line-height: 1px;
+ position: relative;
+ top: 8px;
+ opacity: .7;
+}
+q:before {
+ content: "\201C";
+ content: open-quote;
+}
+q:after {
+ content: "\201D";
+ content: close-quote;
+}
+
+
+
+
+/* text-based button */
+.textbutton, a.textbutton:link, a.textbutton:visited, a.textbutton:active, a.textbutton:hover {
+ border: 1px solid;
+ border-color: #FC9 #630 #330 #F96;
+ padding: 0 3px;
+ font: bold 10px verdana,sans-serif;
+ color: #fff;
+ background: #F60;
+ text-decoration: none;
+}
+
+
+.detail {
+ font-size: .9em;
+ page-break-inside: avoid;
+}
+
+.warning {
+ background-color: #F60;
+ border: #C30 solid 1px;
+ padding: 3px;
+ text-align: center;
+}
+
+.version {
+ text-align: right;
+ font-style: italic;
+ font-size: .9em;
+ margin: 0pt;
+ padding-top: 12px;
+ color: #999;
+}
+
+.date {
+ font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ margin: .5em 0 -1em 0;
+ color: #333;
+ font-weight: bold;
+}
+
+.example {
+ font-size: .9em;
+ line-height: 1.25em;
+ background: #d2dcdf;
+ margin: 0.25em;
+ padding: .5em 1em;
+ overflow: auto;
+}
+
+.spec {
+ font-size: .9em;
+ margin-left: 1.2em;
+ margin-right: 1.2em;
+ overflow: auto;
+}
+
+
+
+
+
+/* print -------------- */
+
+@media print {
+ html {
+ width: 100%;
+ margin: 0;
+ padding: 0;
+ }
+ body {
+/* margin: 24pt; */
+ font: 12pt/14pt Palatino Linotype, palatino, Book Antiqua, serif;
+ }
+ #main {
+ width: 100%;
+ }
+ .callout {
+ width: 30%;
+ font-size: 1.1em;
+ font-weight: 600;
+ margin: 0.25em 0em 0.25em 2em;
+ }
+ .example, .spec {
+ overflow: visible;
+ }
+ form, .navtop, .navigation, a.textbutton, .imgnav, .ad1, #sidebar {
+ display: none;
+ }
+}
+
+
+/* iPhone, Wii, etc... */
+@media screen and (max-device-width: 900px) {
+ #main {
+ max-width: 900px;
+ }
+ body {
+ font-size: 1.2em;
+ line-height: 1.4em;
+ }
+}

0 comments on commit 798f870

Please sign in to comment.