Merge lp:~franku/widelands-website/css_changes into lp:widelands-website

[kaputtnik]

This branch contains changes to font-size and line height and changes them from fixed to relative. This will pay attention to font related settings of a browser. See https://wl.widelands.org/forum/topic/1797/ for the main reason. Some other css changes are also included. In detail:

* changed fixed font-size to relative font sizes.
* changed fixed line-height to relative line-height
* add more space between two paragraphs
* Border of tables in forum gets better visibility (dark gray instead of black)
* top and bottom margins of headers are now the same in forum and wiki
* removed small code in template "/wiki/view.html" because a link to "Create this article?" is already shown
* removed poll.css because it's unused (the css-styles for displaying polls are all done in the javascript code)
* removed general shadowing of fonts, instead adding a new class "shaded" which could be used where it is needed
* small corrections of colors, where i feel it would look better (f.e.text shadow)

I tried to get as close to the current state while changing the values.

The stylesheets for the developers documentation is untouched, because i couldn't verify the results yet.

Some disadvantages of the font-size changes:

1.Text in codeblocks are mostly displayed smaller than with fixed font-size, depending on the browser a user uses. Thats because each browser has his own font-settings for codeblocks. In firefox they are much smaller than in chrome. If needed we could set a fixed font-size for codeblocks.

2.Bold formatted texts looks a little bit blurry. I noticed it f.e. on the "Latest Post" block on the right. That's because the translation of relative values into pixels results mostly in something like "14.234 pixel" which most displays couldn't display. See http://www.w3.org/Style/Examples/007/units.de.html#font-size for an explanation.

Please ask for screenshots if you are unsure about some things.

[GunChleoc (gunchleoc)]

I haven't found the time to try to resolve my local website deployment problems. Code LGTM though.

Maybe you could create a screenshot to post on the forums for people to give feedback?

[kaputtnik (franku)]

Please wait with merging, there are some changes and i will update the branch soon.

[lp:~franku/widelands-website/css_changes]

399. By kaputtnik on 2015-09-20

shodow_reverted

[kaputtnik (franku)]

Uodated... damn, there is unused code. I have to update again :-S

[lp:~franku/widelands-website/css_changes]

400. By kaputtnik on 2015-09-20

removed unused code

[kaputtnik (franku)]

Updated.

Changes to text-shadow are reverted, so text-shadow is like the current state.

Additional changes: The menu entries are font-size dependent in width. So if someone changes the font size in his browser, the width of the entries gets adjusted too.

I provide screenshots in the forum topic https://wl.widelands.org/forum/topic/1797/

[lp:~franku/widelands-website/css_changes]

401. By kaputtnik on 2015-09-20

adjusted font-size for codeblocks

[SirVer (sirver)]

Merged and deployed! Thanks.

review: Approve

[kaputtnik (franku)]

Thanks, all works as suspected :-)

I think no one would notice the changes... but if there are any unwanted changes, please report in the forum topic: https://wl.widelands.org/forum/topic/1797/

=== modified file 'README.txt'
--- README.txt	2012-12-19 20:31:27 +0000
+++ README.txt	2015-09-20 16:32:14 +0000
@@ -62,6 +62,18 @@
 
    $ ln -s local_urls.py.sample local_urls.py
    $ ln -s local_settings.py.sample local_settings.py
+   
+There has to be some corrections to get into the admin pages:
+
+Either copy the folders "media" and "templates"
+
+   from: ~/wlwebsite/django/contrib/admin
+   to:   ~/wlwebsite/lib/python2.7/site-packages/django/contrib/admin/
+   
+or create symlinks:
+
+   $ ln -s ~/wlwebsite/django/contrib/admin/templates/ ~/wlwebsite/lib/python2.7/site-packages/django/contrib/admin/templates
+   $ ln -s ~/wlwebsite/django/contrib/admin/media/ ~/wlwebsite/lib/python2.7/site-packages/django/contrib/admin/media
 
 Setting up the database
 ^^^^^^^^^^^^^^^^^^^^^^^
 
=== modified file 'media/css/base.css'
--- media/css/base.css	2015-01-08 21:40:25 +0000
+++ media/css/base.css	2015-09-20 16:32:14 +0000
@@ -9,10 +9,10 @@
 	background-color: #e9c78a;
 	background-image: url("../img/parchment.png");
 	font-family: sans-serif;
-	font-size: 14px;
-	line-height: 20px;
+	font-size: 0.88em;
+	line-height: 1.4em;
 	color: #ffffee;
-	text-shadow: #000000 1px 1px 0px;
+    text-shadow: 1px 1px 0px #000000;
 }
 
 /*+++++++++++++++++++++++++*/
@@ -84,6 +84,7 @@
 
 code {
 	background-image: url("../img/black50.png");
+	font-size: 14px;
 }
 /*No double background*/
 pre > code {
@@ -100,17 +101,16 @@
 	background-image: url("../img/black50.png");
 	outline: none;
 	color: #ffffff;
-	text-shadow: #000000 1px 1px 0px;
 	vertical-align: middle;
 	cursor: pointer;
 	font-family: inherit;
-	font-size: 12px;
+	font-size: 0.85em;
 	font-weight: bold;
 }
 
 textarea {
 	font-weight: normal;
-	font-size: 14px;
+	font-size: 0.9em;
 }
 
 input:hover, button:hover, textarea:hover {
@@ -129,13 +129,18 @@
 	font-weight: normal;
 }
 
+/* different margin for headers where text could be written */
+div.blogEntry h1, h2, h3, h4, h5, h6 {
+	margin: 0.8em 0em 0.5em 0em;
+}
+
 svg {
 	text-shadow: none;
 }
 
 td {
 	vertical-align: top;
-	line-height: 20px;
+	line-height: 1.4em;
 }
 
 .posLeft {
@@ -174,7 +179,7 @@
 	color: #ffffee;
 }
 .small {
-	font-size: 12px;
+	font-size: 0.83em;
 }
 
 a.small {
@@ -271,11 +276,12 @@
 	margin: 0px;
 	padding: 0px;
 	list-style-type: none;
-	line-height: 18px;
+	line-height: 1.5em;
 }
 
 div.loginBox h4 {
 	margin-bottom: 5px;
+	margin-top: 0px;
 }
 
 div.loginBox input {
@@ -325,6 +331,7 @@
 	border-radius: 4px;
 }
 
+
 div.columnModuleBox h4 {
 	color: #ffffee;
 	padding: 8px;
@@ -370,7 +377,7 @@
 	display: block;
 	padding: 8px;
 	border-top: 1px solid black;
-	font-size: 12px;
+	font-size: 0.8em;
 }
 
 div.columnModuleBox ul li:first-child {
 
=== modified file 'media/css/forum.css'
--- media/css/forum.css	2015-04-01 20:01:41 +0000
+++ media/css/forum.css	2015-09-20 16:32:14 +0000
@@ -54,7 +54,7 @@
 /******************/
 
 tr.spacer {
-	height: 10px;
+	height: 1em;
 	border: none;
 }
 
@@ -71,8 +71,8 @@
 
 .authorStats {
 	text-align: left;
-	font-size: 10px;
-	line-height: 12px;
+	font-size: 0.7em;
+	line-height: 1.1em;
 }
 
 /*****************/
@@ -94,7 +94,7 @@
 }
 
 div.blogEntry .post p {
-	margin-bottom: 4px;
+	margin-bottom: 0.5em;
 }
 
 .post blockquote {
@@ -114,12 +114,12 @@
 
 .post th {
 	padding: 0 1em 0 1em;
-	border: 1px solid black;
+	border: 1px solid #474444;
 }
 
 .post td {
 	padding: 0 1em 0 1em;
-	border: 1px solid black;
+	border: 1px solid #474444;
 }
 
 /*****************/
 
=== modified file 'media/css/help.css'
--- media/css/help.css	2012-05-19 19:55:15 +0000
+++ media/css/help.css	2015-09-20 16:32:14 +0000
@@ -11,7 +11,7 @@
 table.help th {
 	padding: 4px;
 	font-weight: normal;
-	font-size: 12px;
+	font-size: 0.8em;
 	text-align: left;
 }
 
 
=== modified file 'media/css/navigation.css'
--- media/css/navigation.css	2013-10-27 11:49:24 +0000
+++ media/css/navigation.css	2015-09-20 16:32:14 +0000
@@ -58,13 +58,12 @@
 
 ul.menu  li a {
 	display: block;
-	width: 120px;
+	width: 8.5em;
 	height: 50px;
-	line-height: 50px;
+	line-height: 3.5em;
 	float: left;
 	border-right: 1px solid black;
 	text-align: center;
-	vertical-align: middle;
 	color: #ffffff;
 	text-transform: uppercase;
 	font-weight: normal;
@@ -106,12 +105,12 @@
 
 ul.menu li ul li a {
 	display: block;
-	width: 255px;
+	width: 21.5em;
 	height: 20px;
-	line-height: 20px;
+	line-height: 1.7em;
 	padding: 4px;
 	text-align: left;
-	font-size: 12px;
+	font-size: 0.8em;
 	border: none;
 }
 
 
=== removed file 'media/css/poll.css'
--- media/css/poll.css	2009-03-28 13:38:44 +0000
+++ media/css/poll.css	1970-01-01 00:00:00 +0000
@@ -1,58 +0,0 @@
-
-.poll_plot {
-    text-align: center;
-    width: 100%;
-}
-
-.post_date { font-size: 90%;}
-
-.poll {
-    border: 1px solid rgb(9, 9, 9);
-    width: 100%;
-}
-
-.poll h3.title {
-    font-weight: bold;
-    font-size: 12px;
-    padding-left: 12px;
-    background-image: url('../img/Navbar.png');
-    background-repeat: repeat-x;
-    border-left: 0px solid #999999;
-    border-right: 0px solid #999999;
-    border-bottom: 0px solid #999999;
-    padding-top: 2px;
-    padding-bottom: 0px;
-    margin: 0px;
-}
-.poll .content {
- line-height: 120%;
- border: 0px;
- padding: 2px;
- padding-top: 5px;
- padding-left: 15px;
- background-color: #3F3F3F;
- background: url(../img/background-3F3F3F.png);
-}
-
-.poll .info_line {
-	 text-align: right;
-	 padding: 3px;
-	 margin: 0px;
-    background-color: #222222;
-	 background: url(../img/background-222.png);
-}
-	
-.poll .bottom_line {
-	 background-color: #222222;
-	 background: url(../img/background-222.png);
-    table-layout: fixed;
-}
-.poll .comments {
-	text-align: left;
-}
-.poll .admin {
-	text-align: center;
-}
-	
-	
-
 
=== modified file 'media/css/wiki.css'
--- media/css/wiki.css	2015-04-01 20:01:41 +0000
+++ media/css/wiki.css	2015-09-20 16:32:14 +0000
@@ -3,15 +3,15 @@
 	display: inline-block;
 	padding: 0px 8px;
 	background-image: url("../img/black20.png");
-	font-size: 12px;
+	font-size: 0.8em;
 	margin: 0em 0em 1em 1em;
-	line-height: 18px;
+	line-height: 1.5em;
 	float: right;
 	max-width: 20em;
 }
-
+		
 .toc ul {
-	padding-left: 20px;
+	padding-left: 1.8em;
 }
 
 /***********/
@@ -93,12 +93,8 @@
 	margin-top: 4px;	/*Correction for donatebox*/
 }
 
-h1, h2, h3, h4, h5, h6 {
-	margin: 1em 0em 0.5em 0em;
-}
-
 h1:first-child, h2:first-child {
-	margin-top: 0.5em;
+	margin-top: 0.2em !important;
 }
 
 
 
=== modified file 'templates/wiki/view.html'
--- templates/wiki/view.html	2012-09-10 10:13:04 +0000
+++ templates/wiki/view.html	2015-09-20 16:32:14 +0000
@@ -26,8 +26,6 @@
 			<a class="invertedColor" href="{% url wiki_observe article.title %}">{% trans "Observe" %}</a>
 			{% endif %}
 		{% endif %}
-	{% else %}
-		<a class="invertedColor" href="{% url wiki_edit article.title %}">{% trans "Create this article" %}</a>
 	{% endif %}
 </div>
 <h1>{{ article.title }}</h1>
 
=== modified file 'templates/wlpoll/base.html'
--- templates/wlpoll/base.html	2015-02-18 22:30:08 +0000
+++ templates/wlpoll/base.html	2015-09-20 16:32:14 +0000
@@ -6,7 +6,6 @@
 {% block extra_head %}
 {{block.super}}
 <link rel="stylesheet" type="text/css" media="all" href="{{ MEDIA_URL }}css/comments.css" />
-<link rel="stylesheet" type="text/css" media="all" href="{{ MEDIA_URL }}css/poll.css" />
 <script src="{{ MEDIA_URL }}js/highcharts_219/highcharts.js" type="text/javascript"></script>
 {% endblock %}