From f403654c101ab4a81f27bdb1f89d48ff1539f838 Mon Sep 17 00:00:00 2001 From: Eric Schulte Date: Wed, 12 Sep 2012 19:33:25 -0600 Subject: [PATCH 1/2] use css media queries to adjust for narrow browsers --- index.org | 2 +- org.css | 58 +++++++++++++++++++++++++++++++++++++++++++++++++++------- 2 files changed, 52 insertions(+), 8 deletions(-) diff --git a/index.org b/index.org index da7d65e..215acf3 100644 --- a/index.org +++ b/index.org @@ -22,7 +22,7 @@ is maintained by Bastien Guerry sin :CUSTOM_ID: intro :END: -#+ATTR_HTML: style="float: right;" width="500px" +#+ATTR_HTML: id="main-image" [[file:img/main.jpg]] Stable version *7.9.1* (sept. 2012) --- [[http://orgmode.org/org-7.9.1.tar.gz][tar.gz]] or [[http://orgmode.org/org-7.9.1.zip][zip]] diff --git a/org.css b/org.css index 84a90a6..da192fb 100644 --- a/org.css +++ b/org.css @@ -3,6 +3,39 @@ html { font: 300 .9em/1.6em "Droid Serif", "Open Sans", Cambria, Georgia, "DejaVu Serif", serif; } +@media(min-width:1000px){ + #main-image { + float: right; + width: 500px; + } + body { + padding: 20px; + margin-left: 50px; + margin-right: 30px; + } +} + +@media(min-width:800px) and (max-width:1000px){ + #main-image { + float: right; + width: 450px; + } +} + +@media(min-width:850px) and (max-width:1000px){ + body { + padding: 10px; + margin-left: 25px; + margin-right: 15px; + } +} + +@media(max-width:800px){ + #main-image { + display: none; + } +} + #searchgmane { margin-left: 10pt; } @@ -27,12 +60,6 @@ html { text-align: right; } -body { - padding: 20px; - margin-left: 50px; - margin-right: 30px; -} - a { text-decoration: none; color: #537d7b @@ -112,8 +139,25 @@ h2 { padding-left: 5px; } +@media(max-width:800px){ + code{ + font-size: 85%; + } +} + +@media(min-width:800px) and (max-width:900px){ + code{ + font-size: 75%; + } +} + +@media(min-width:900px){ + code{ + font-size: 85%; + } +} + code { - font-size: 85%; background-color: #eeeeee; padding: 1pt; margin-right: 1pt; -- 1.7.12