From 8b91483498426006fad64b0b3645809dfbefc0ec Mon Sep 17 00:00:00 2001 From: Ryan Tomayko Date: Sat, 15 Sep 2007 07:50:41 -0400 Subject: [PATCH] make handbookish theme line up on a baseline grid --- stylesheets/handbookish-manpage.css | 23 +++++--- stylesheets/handbookish.css | 82 ++++++++++++++++++++++++----- 2 files changed, 83 insertions(+), 22 deletions(-) diff --git a/stylesheets/handbookish-manpage.css b/stylesheets/handbookish-manpage.css index ecc39d7..7475a75 100644 --- a/stylesheets/handbookish-manpage.css +++ b/stylesheets/handbookish-manpage.css @@ -4,24 +4,31 @@ body { color:#555; } tt { - font-family: 'Lucida Console', 'Bitstream Vera Sans Mono', 'Courier New', monospace; - font-size:1.0769em; + font-family:'Lucida Console', 'Bitstream Vera Sans Mono', 'Courier New', monospace; font-weight:bold; + font-size:100%; /* overrides base stylesheet */ } em { - font-style:normal ; + font-style:normal; color:#222; } dt { font-weight:bold; color:#000 } h1 { - padding-top: 0.5em; - padding-bottom: 0.5em; - border-top: 2px solid silver; - border-bottom: 2px solid silver; + font-size:1.714em; /* 24px */ + line-height:1.666; /* 40px */ + margin:1.666em 0; /* 40px */ + padding: 0.3333em 0; /* 8px */ + border-bottom:0.08333em solid #999; /* 2px */ + border-top:0.08333em solid #999; /* 2px */ + text-align:center; } h2 { - border-style: none; + font-size:1.142em; /* 16px */ + line-height:1.25; /* 20px baseline */ + margin:1.25em 0; /* 20px */ + border-bottom:0; + border-top:0; } div.sectionbody { margin-left: 5%; diff --git a/stylesheets/handbookish.css b/stylesheets/handbookish.css index 285245d..a489e9b 100644 --- a/stylesheets/handbookish.css +++ b/stylesheets/handbookish.css @@ -4,31 +4,47 @@ body { margin:2.85em; /* 40px margins */ max-width:51.42857em; /* 720px max width */ font-family: 'Lucida Grande', 'Verdana', 'Helvetica', sans-serif; + color:#222; } em { font-style: italic } strong { font-weight: bold } tt { color:#007A00 } +dt { font-weight:bold } h1, h2, h3, h4, h5 { font-family: Verdana, Helvetica, sans-serif ; color:#900 ; } -h1 { - font-size: 2.285em; /* 32px */ - line-height: 1.25; /* 40px */ - border-bottom:0.0625em solid #fff; /* 2px border */ - margin:0.5625em 0; /* 18px */ +h1 { + font-size:2.857em; /* 40px */ + line-height:1.5; /* 60px */ + border-bottom:0.05em; /* 2px; */ + margin:0.5em 0; /* 20px */ } h2 { - font-size: 1.714em; /* 24px */ - line-height: 1.666; /* 40px */ + font-size:2.285em; /* 32px */ + line-height:1.25; /* 40px */ + border-bottom:0.0625em solid #fff; /* 2px border */ + margin:0.906em 0; /* 29px margin */ +} + +h3 { + font-size:1.714em; /* 24px */ + line-height:1.666; /* 40px */ border-bottom:0.0833em solid #fff; /* 2px border */ margin:0.75em 0; /* 18px */ } +h4 { + font-size:1.142em; /* 16px */ + line-height:1.25; /* 20px */ + border-bottom:0; + margin:1.25em 0; /* 20px */ +} + pre { font-size:1.1666em; line-height:1.333; @@ -36,14 +52,21 @@ pre { pre tt { color:#000 } -p, ul, ol { +p, ul, ol, dl { margin:1.4285em 0; /* 20px */ } +dl { + margin-left:2.857em; +} -.admonitionblock { - margin:1.4285em; +.title, .sidebar-title { + font-weight: bold; + margin-bottom:0; } + +.admonitionblock { margin:1.4285em; } + .admonitionblock td.icon { width:2.857em; /* 40px */ padding-right:1.4285em; @@ -55,11 +78,42 @@ p, ul, ol { padding: 0.7142em; /* 10px */ } -.listingblock .content pre { - margin:0 +.listingblock .content pre { margin:0 } +.literalblock .content { margin-left:2.8568em; } + +.verseblock .content { white-space: pre } + +.sidebarblock .sidebar-content { + border: 1px solid silver; + background: #FFFFEE; + padding: 0 1.428em; /* 20px */ + color:#222; +} +.sidebar-title { + margin: 1.125em 0; } -.literalblock .content { - margin-left:2.8568em; +.quoteblock-content { + font-style:normal; + color:#555; + margin-left:2.857em; +} +.quoteblock-content .attribution { + font-style: normal; + text-align:right; + color:#000; +} + +.exampleblock-content *:first-child { margin-top:0 } +.exampleblock-content { + border-left:2px solid silver; + padding-left:0.712em; } +#footer { + font-size:0.857em; /* 12px */ + line-height:1.666; /* 20px */ + margin-top:3.333em; /* 40px */ + border-top:1px solid silver; + color:#555; +}