Re: [O] patch for orgweb for better resolution in narrow browsers
Hi Eric, I've finally manage to applied this change, a real enhancement for handling various screen sizes. Thanks a lot! -- Bastien
Re: [O] patch for orgweb for better resolution in narrow browsers
Bastien b...@altern.org writes: Hi Eric, I've finally manage to applied this change, a real enhancement for handling various screen sizes. Thanks a lot! Yup, looks much improved on my system now. Thanks, -- Eric Schulte http://cs.unm.edu/~eschulte
Re: [O] patch for orgweb for better resolution in narrow browsers
Hi Eric,
Eric Schulte eric.schu...@gmx.com 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?
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,
--
Bastien
Re: [O] patch for orgweb for better resolution in narrow browsers
Bastien b...@altern.org writes:
Hi Eric,
Eric Schulte eric.schu...@gmx.com 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.
From f403654c101ab4a81f27bdb1f89d48ff1539f838 Mon Sep 17 00:00:00 2001
From: Eric Schulte eric.schu...@gmx.com
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 a href=http://lumiere.ens.fr/~guerry/;Bastien Guerry/a 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: #ee;
padding: 1pt;
margin-right: 1pt;
--
1.7.12
From 852bcb92ee34761e9c6037b91afcc740737e17d7 Mon Sep 17 00:00:00 2001
From: Eric Schulte eric.schu...@gmx.com
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
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
[O] patch for orgweb for better resolution in narrow browsers
Hi,
I just recently noticed the new web site, I think it looks great!
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.
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.
Thanks,
From f403654c101ab4a81f27bdb1f89d48ff1539f838 Mon Sep 17 00:00:00 2001
From: Eric Schulte eric.schu...@gmx.com
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 a href=http://lumiere.ens.fr/~guerry/;Bastien Guerry/a 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: #ee;
padding: 1pt;
margin-right: 1pt;
--
1.7.12
From 852bcb92ee34761e9c6037b91afcc740737e17d7 Mon Sep 17 00:00:00 2001
From: Eric Schulte eric.schu...@gmx.com
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
Footnotes:
[1] FWIW I think that this assumption of wide browser windows is endemic
recently on the web. Apparently most web designers full-screen
their browser window.
[2] http://cs.unm.edu/~eschulte/data/orgmode.png
--
Eric Schulte
http://cs.unm.edu/~eschulte
