From mboxrd@z Thu Jan 1 00:00:00 1970 From: Eric Schulte Subject: Re: patch for orgweb for better resolution in narrow browsers Date: Thu, 13 Sep 2012 08:17:09 -0600 Message-ID: <87bohanh22.fsf@gmx.com> References: <87vcfiqzqn.fsf@gmx.com> <87ipbifmld.fsf@altern.org> Mime-Version: 1.0 Content-Type: multipart/mixed; boundary="=-=-=" Return-path: Received: from eggs.gnu.org ([208.118.235.92]:36700) by lists.gnu.org with esmtp (Exim 4.71) (envelope-from ) id 1TCAM3-0002Ke-AM for emacs-orgmode@gnu.org; Thu, 13 Sep 2012 10:25:20 -0400 Received: from Debian-exim by eggs.gnu.org with spam-scanned (Exim 4.71) (envelope-from ) id 1TCALx-0006uz-Kt for emacs-orgmode@gnu.org; Thu, 13 Sep 2012 10:25:19 -0400 Received: from mailout-eu.gmx.com ([213.165.64.42]:46615) by eggs.gnu.org with smtp (Exim 4.71) (envelope-from ) id 1TCALx-0006tH-AM for emacs-orgmode@gnu.org; Thu, 13 Sep 2012 10:25:13 -0400 In-Reply-To: <87ipbifmld.fsf@altern.org> (Bastien's message of "Thu, 13 Sep 2012 08:44:46 +0200") List-Id: "General discussions about Org-mode." List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , Errors-To: emacs-orgmode-bounces+geo-emacs-orgmode=m.gmane.org@gnu.org Sender: emacs-orgmode-bounces+geo-emacs-orgmode=m.gmane.org@gnu.org To: Bastien Cc: Org Mode Mailing List --=-=-= Content-Type: text/plain Bastien writes: > Hi Eric, > > Eric Schulte writes: > >> I just recently noticed the new web site, I think it looks great! > > Thanks! > >> However when the browser window is not very wide (>1000px) the elements >> overflow in an unappealing manner [1]. As an example of how the page >> looks in my browser see the attached [2], it's not egregious but it is >> less than ideal and gets worse as the screen gets narrower. >> >> Attached please find a patch to the orgweb repo which adds a couple of >> css @media queries to shrink images and remove wide margins on smaller >> screens. Additionally I'm attaching a patch which will ignore exported >> html files in this repo. > > For some reason, I cannot apply the patch -- as if the email was in > HTML (but I don't see it as HTML... weird.) > > Could you send it again as a simple attachment? > Re-attaching as attachments rather than inline. I suspect the problem is related to windows newline characters which are present in the patches. --=-=-= Content-Type: text/x-patch Content-Disposition: attachment; filename=0001-use-css-media-queries-to-adjust-for-narrow-browsers.patch Content-Transfer-Encoding: 8bit >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 --=-=-= Content-Type: text/x-patch Content-Disposition: attachment; filename=0002-ignore-exported-HTML-files-in-the-base-of-this-repo.patch >From 852bcb92ee34761e9c6037b91afcc740737e17d7 Mon Sep 17 00:00:00 2001 From: Eric Schulte Date: Wed, 12 Sep 2012 22:45:31 -0600 Subject: [PATCH 2/2] ignore exported HTML files in the base of this repo --- .gitignore | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.gitignore b/.gitignore index f03a78c..be1b1a2 100644 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,4 @@ pub old +*.html +!preamble.html -- 1.7.12 --=-=-= Content-Type: text/plain Thanks, > >> As another minor note which is unfortunately beyond my web abilities to >> address, with very narrow screens the quote pop-up can make the >> "download and install" link unreachable. > > Maybe we can simply #quote {display:none;} for narrow screens. > > PS: I'm about to leave right now and we be back later tonight. > > Thanks, -- Eric Schulte http://cs.unm.edu/~eschulte --=-=-=--