X-Git-Url: https://git.m6w6.name/?a=blobdiff_plain;f=public%2Findex.css;h=c0204cdb3464ef6db258bceab1f50e84f737d12d;hb=687f5fcb8de9250739a01d5855faa868f593fb73;hp=40f17d2524b9ad7a75bb9a08f41307bb8f463f82;hpb=3c97d1ecf16c7dbf095a55ba40ce547fefbca604;p=mdref%2Fmdref diff --git a/public/index.css b/public/index.css index 40f17d2..c0204cd 100644 --- a/public/index.css +++ b/public/index.css @@ -1,22 +1,36 @@ -* { - font-size: 99.9%; +html { + font-size: 18px; +} +html, body{ + height: 100%; + min-height: 100%; } - body, code { - font-family: Inconsolata, Monospace, 'Courier New', Courier, monospace; + font-family: Inconsolata, 'Inconsolata Awesome', 'Andale Mono', Monaco, 'Courier New', Courier, monospace; } body { + line-height: 1.5; font-size: 1.1em; margin: 0; padding: 0; - padding-bottom: 5em; color: #3f3f3f; } -body>* { +div.page { + margin: auto; +/* max-width: 1200px; +*/ min-height: 100%; + padding-bottom: 5em; + box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.5); +} + +div.page>* { margin-left: 1em; } -body>ul, body>div>ul { +div.page>footer { + margin-left: 0; +} +div.page>ul, div.page>div>ul { margin-left: 2em; } @@ -28,32 +42,36 @@ body>ul, body>div>ul { width: auto; min-width: 200px; padding-right: 1em; + padding-bottom: 1em; + margin-bottom: 1em; } .sidebar>ul { } .sidebar ul { margin-left: 1em; margin-top: .5em; + margin-bottom: 0; padding: 0; list-style-type: none; } .sidebar .edit { display: block; - position: absolute; + position: relative; top: 2em; - right: 0.5em; + right: 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); text-decoration: none; font-weight: bold; text-shadow: 0 0 5px red; + float: right; } .sidebar .edit a { color: white !important; } -code { +code { border-radius: 2px; padding: 0px 2px 2px 2px; background: #f0f0f0; @@ -73,14 +91,21 @@ pre>code { display: inline-block; padding: 1em; min-width: 50%; + line-height: 1.2; } + pre>code, pre>code code { background: #333; color: #eee; } -p, pre, table { +p, pre, table, dl { margin: 1em 2em; + margin-left: 2em !important; +} + +pre>code, table, dl { + margin-bottom: 2em !important; } li>p { @@ -91,12 +116,30 @@ blockquote { border-top: 1px solid #800000; border-bottom: 1px solid #800000; background: #ffe4e1; - margin: 2em 0; + margin: 2em 0 !important; } ul { + margin-top: 1em; margin-bottom: 2em; } +ol { + list-style-type: none; +} +ol ul { + margin-top: 0; + margin-bottom: 0; +} +ol li { + margin-bottom: 0; +} +ol>li { + font-weight: bold; + margin-bottom: .5em; +} +ol>li>* { + font-weight: normal; +} li { margin-bottom: .5em; } @@ -110,6 +153,14 @@ a[href^="http:"]:after, a[href^="https:"]:after { content: " ⬈"; } +a.permalink { + position: relative; + top: 0; + right: 0; + color: #999999; + opacity: 0.25; +} + .var { color: #800000; } @@ -117,23 +168,30 @@ a[href^="http:"]:after, a[href^="https:"]:after { color: #2e8b57; } +h1, li h3, th, footer { + background: #708090; + color: #f5f5dc; +} + +h1, footer { + margin: 0; +/* max-width: 1200px; +*/ padding: 1em; +} + h1 { line-height: 1.5; + margin-left: 0 !important; + padding-left: 2em; } h1 code { font-weight: normal; font-size: .9em; line-height: 1.33; } - -footer, h1, li h3, th { - background: #708090; - color: #f5f5dc; -} - -footer, h1 { - margin: 0; - padding: 1em; +h1 a.permalink { + left: -.8em; + margin-right: -.6em; } li h3 { @@ -144,16 +202,16 @@ li h3 { margin: .5em 0 0 0; } -body>h3, body>div>h3 { +div.page>h3, div.page>div>h3 { margin-left: 1.25em; } -body>h4, body>div>h4 { +div.page>h4, div.page>div>h4 { margin-left: 1.5em; } -body>h5, body>div>h5 { +div.page>h5, div.page>div>h5 { margin-left: 1.75em; } -body>h6, body>div>h6 { +div.page>h6, div.page>div>h6 { margin-left: 2em; } @@ -164,11 +222,23 @@ h1 .constant, pre>code .consant, li h3 .constant { h1 .var, pre>code .var, li h3 .var { color: #f4a460; } - +h1 { + font-size: 125%; +} +h2 { + font-size: 120%; +} +h3 { + font-size: 110%; +} +h4 { + font-size: 100%; +} footer a, h1 a, pre>code a, li h3 a { color: #b0e0e6; } - +li h3 { +} li h3 a { text-decoration: none; } @@ -180,6 +250,18 @@ li h3 a:hover { margin-top: 8em; margin-right: 2em; } +#disqus_activator { + margin: auto; + width: 80%; + padding: 1em; + background-color: slategrey; + color: white; + font-size: 1em; + font-weight: bold; + border: 0; + border-radius: 2px; + box-shadow: 0 0 4px #999; +} footer { font-size: smaller; @@ -189,6 +271,11 @@ footer { bottom: 0; width: 100%; padding: 0; + transition: margin-bottom 2s ease 0.1s; +} +footer.hidden { + margin-bottom: -10em; + transition: margin-bottom 2s ease 0.1s; } footer ul { @@ -215,8 +302,16 @@ table { } th, td { padding: .4em; + border-bottom: 1px solid rgba(112, 128, 144, 0.1); +} +dt { + font-weight: bold; + margin-top: 1em; +} +dd { + line-height: 1.33; + margin-left: 1em; } - h1, footer, table, .sidebar, pre>code, li h3 { box-shadow: 0 0 4px #708090; }