From 18d9287aa9e396e253abf1f8c86a2804c3c64de3 Mon Sep 17 00:00:00 2001 From: Jef van Schendel Date: Sun, 3 Jul 2011 21:37:21 +0200 Subject: [PATCH] Switched over to 960_16_col. This may break a bunch of stuff. If you find something that is broken, slap me. --- mediagoblin/contrib/960_12_col.css | 357 -------------- mediagoblin/contrib/960_16_col.css | 447 ++++++++++++++++++ mediagoblin/static/css/base.css | 10 - mediagoblin/static/css/contrib/960_12_col.css | 1 - mediagoblin/static/css/contrib/960_16_col.css | 1 + .../templates/mediagoblin/auth/login.html | 3 +- .../templates/mediagoblin/auth/register.html | 2 +- mediagoblin/templates/mediagoblin/base.html | 14 +- .../templates/mediagoblin/edit/edit.html | 2 +- .../mediagoblin/edit/edit_profile.html | 2 +- .../templates/mediagoblin/submit/start.html | 2 +- .../mediagoblin/user_pages/media.html | 4 +- 12 files changed, 462 insertions(+), 383 deletions(-) delete mode 100644 mediagoblin/contrib/960_12_col.css create mode 100644 mediagoblin/contrib/960_16_col.css delete mode 120000 mediagoblin/static/css/contrib/960_12_col.css create mode 120000 mediagoblin/static/css/contrib/960_16_col.css diff --git a/mediagoblin/contrib/960_12_col.css b/mediagoblin/contrib/960_12_col.css deleted file mode 100644 index 48e86ee8..00000000 --- a/mediagoblin/contrib/960_12_col.css +++ /dev/null @@ -1,357 +0,0 @@ -/* - 960 Grid System ~ Core CSS. - Learn more ~ http://960.gs/ - - Licensed under GPL and MIT. -*/ - -/* - Forces backgrounds to span full width, - even if there is horizontal scrolling. - Increase this if your layout is wider. - - Note: IE6 works fine without this fix. -*/ - -body { - min-width: 960px; -} - -/* `Container -----------------------------------------------------------------------------------------------------*/ - -.container_12 { - margin-left: auto; - margin-right: auto; - width: 960px; -} - -/* `Grid >> Global -----------------------------------------------------------------------------------------------------*/ - -.grid_1, -.grid_2, -.grid_3, -.grid_4, -.grid_5, -.grid_6, -.grid_7, -.grid_8, -.grid_9, -.grid_10, -.grid_11, -.grid_12 { - display: inline; - float: left; - margin-left: 10px; - margin-right: 10px; -} - -.push_1, .pull_1, -.push_2, .pull_2, -.push_3, .pull_3, -.push_4, .pull_4, -.push_5, .pull_5, -.push_6, .pull_6, -.push_7, .pull_7, -.push_8, .pull_8, -.push_9, .pull_9, -.push_10, .pull_10, -.push_11, .pull_11 { - position: relative; -} - -/* `Grid >> Children (Alpha ~ First, Omega ~ Last) -----------------------------------------------------------------------------------------------------*/ - -.alpha { - margin-left: 0; -} - -.omega { - margin-right: 0; -} - -/* `Grid >> 12 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_12 .grid_1 { - width: 60px; -} - -.container_12 .grid_2 { - width: 140px; -} - -.container_12 .grid_3 { - width: 220px; -} - -.container_12 .grid_4 { - width: 300px; -} - -.container_12 .grid_5 { - width: 380px; -} - -.container_12 .grid_6 { - width: 460px; -} - -.container_12 .grid_7 { - width: 540px; -} - -.container_12 .grid_8 { - width: 620px; -} - -.container_12 .grid_9 { - width: 700px; -} - -.container_12 .grid_10 { - width: 780px; -} - -.container_12 .grid_11 { - width: 860px; -} - -.container_12 .grid_12 { - width: 940px; -} - -/* `Prefix Extra Space >> 12 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_12 .prefix_1 { - padding-left: 80px; -} - -.container_12 .prefix_2 { - padding-left: 160px; -} - -.container_12 .prefix_3 { - padding-left: 240px; -} - -.container_12 .prefix_4 { - padding-left: 320px; -} - -.container_12 .prefix_5 { - padding-left: 400px; -} - -.container_12 .prefix_6 { - padding-left: 480px; -} - -.container_12 .prefix_7 { - padding-left: 560px; -} - -.container_12 .prefix_8 { - padding-left: 640px; -} - -.container_12 .prefix_9 { - padding-left: 720px; -} - -.container_12 .prefix_10 { - padding-left: 800px; -} - -.container_12 .prefix_11 { - padding-left: 880px; -} - -/* `Suffix Extra Space >> 12 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_12 .suffix_1 { - padding-right: 80px; -} - -.container_12 .suffix_2 { - padding-right: 160px; -} - -.container_12 .suffix_3 { - padding-right: 240px; -} - -.container_12 .suffix_4 { - padding-right: 320px; -} - -.container_12 .suffix_5 { - padding-right: 400px; -} - -.container_12 .suffix_6 { - padding-right: 480px; -} - -.container_12 .suffix_7 { - padding-right: 560px; -} - -.container_12 .suffix_8 { - padding-right: 640px; -} - -.container_12 .suffix_9 { - padding-right: 720px; -} - -.container_12 .suffix_10 { - padding-right: 800px; -} - -.container_12 .suffix_11 { - padding-right: 880px; -} - -/* `Push Space >> 12 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_12 .push_1 { - left: 80px; -} - -.container_12 .push_2 { - left: 160px; -} - -.container_12 .push_3 { - left: 240px; -} - -.container_12 .push_4 { - left: 320px; -} - -.container_12 .push_5 { - left: 400px; -} - -.container_12 .push_6 { - left: 480px; -} - -.container_12 .push_7 { - left: 560px; -} - -.container_12 .push_8 { - left: 640px; -} - -.container_12 .push_9 { - left: 720px; -} - -.container_12 .push_10 { - left: 800px; -} - -.container_12 .push_11 { - left: 880px; -} - -/* `Pull Space >> 12 Columns -----------------------------------------------------------------------------------------------------*/ - -.container_12 .pull_1 { - left: -80px; -} - -.container_12 .pull_2 { - left: -160px; -} - -.container_12 .pull_3 { - left: -240px; -} - -.container_12 .pull_4 { - left: -320px; -} - -.container_12 .pull_5 { - left: -400px; -} - -.container_12 .pull_6 { - left: -480px; -} - -.container_12 .pull_7 { - left: -560px; -} - -.container_12 .pull_8 { - left: -640px; -} - -.container_12 .pull_9 { - left: -720px; -} - -.container_12 .pull_10 { - left: -800px; -} - -.container_12 .pull_11 { - left: -880px; -} - -/* `Clear Floated Elements -----------------------------------------------------------------------------------------------------*/ - -/* http://sonspring.com/journal/clearing-floats */ - -.clear { - clear: both; - display: block; - overflow: hidden; - visibility: hidden; - width: 0; - height: 0; -} - -/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */ - -.clearfix:before, -.clearfix:after, -.container_12:before, -.container_12:after { - content: '.'; - display: block; - overflow: hidden; - visibility: hidden; - font-size: 0; - line-height: 0; - width: 0; - height: 0; -} - -.clearfix:after, -.container_12:after { - clear: both; -} - -/* - The following zoom:1 rule is specifically for IE6 + IE7. - Move to separate stylesheet if invalid CSS is a problem. -*/ - -.clearfix, -.container_12 { - zoom: 1; -} \ No newline at end of file diff --git a/mediagoblin/contrib/960_16_col.css b/mediagoblin/contrib/960_16_col.css new file mode 100644 index 00000000..faa6d8b2 --- /dev/null +++ b/mediagoblin/contrib/960_16_col.css @@ -0,0 +1,447 @@ +/* + 960 Grid System ~ Core CSS. + Learn more ~ http://960.gs/ + + Licensed under GPL and MIT. +*/ + +/* + Forces backgrounds to span full width, + even if there is horizontal scrolling. + Increase this if your layout is wider. + + Note: IE6 works fine without this fix. +*/ + +body { + min-width: 960px; +} + +/* Container +----------------------------------------------------------------------------------------------------*/ + +.container_16 { + margin-left: auto; + margin-right: auto; + width: 960px; +} + +/* Grid >> Global +----------------------------------------------------------------------------------------------------*/ + +.grid_1, +.grid_2, +.grid_3, +.grid_4, +.grid_5, +.grid_6, +.grid_7, +.grid_8, +.grid_9, +.grid_10, +.grid_11, +.grid_12, +.grid_13, +.grid_14, +.grid_15, +.grid_16 { + display: inline; + float: left; + position: relative; + margin-left: 10px; + margin-right: 10px; +} + +.push_1, .pull_1, +.push_2, .pull_2, +.push_3, .pull_3, +.push_4, .pull_4, +.push_5, .pull_5, +.push_6, .pull_6, +.push_7, .pull_7, +.push_8, .pull_8, +.push_9, .pull_9, +.push_10, .pull_10, +.push_11, .pull_11, +.push_12, .pull_12, +.push_13, .pull_13, +.push_14, .pull_14, +.push_15, .pull_15, +.push_16, .pull_16 { + position: relative; +} + +/* Grid >> Children (Alpha ~ First, Omega ~ Last) +----------------------------------------------------------------------------------------------------*/ + +.alpha { + margin-left: 0; +} + +.omega { + margin-right: 0; +} + +/* Grid >> 16 Columns +----------------------------------------------------------------------------------------------------*/ + +.container_16 .grid_1 { + width: 40px; +} + +.container_16 .grid_2 { + width: 100px; +} + +.container_16 .grid_3 { + width: 160px; +} + +.container_16 .grid_4 { + width: 220px; +} + +.container_16 .grid_5 { + width: 280px; +} + +.container_16 .grid_6 { + width: 340px; +} + +.container_16 .grid_7 { + width: 400px; +} + +.container_16 .grid_8 { + width: 460px; +} + +.container_16 .grid_9 { + width: 520px; +} + +.container_16 .grid_10 { + width: 580px; +} + +.container_16 .grid_11 { + width: 640px; +} + +.container_16 .grid_12 { + width: 700px; +} + +.container_16 .grid_13 { + width: 760px; +} + +.container_16 .grid_14 { + width: 820px; +} + +.container_16 .grid_15 { + width: 880px; +} + +.container_16 .grid_16 { + width: 940px; +} + +/* Prefix Extra Space >> 16 Columns +----------------------------------------------------------------------------------------------------*/ + +.container_16 .prefix_1 { + padding-left: 60px; +} + +.container_16 .prefix_2 { + padding-left: 120px; +} + +.container_16 .prefix_3 { + padding-left: 180px; +} + +.container_16 .prefix_4 { + padding-left: 240px; +} + +.container_16 .prefix_5 { + padding-left: 300px; +} + +.container_16 .prefix_6 { + padding-left: 360px; +} + +.container_16 .prefix_7 { + padding-left: 420px; +} + +.container_16 .prefix_8 { + padding-left: 480px; +} + +.container_16 .prefix_9 { + padding-left: 540px; +} + +.container_16 .prefix_10 { + padding-left: 600px; +} + +.container_16 .prefix_11 { + padding-left: 660px; +} + +.container_16 .prefix_12 { + padding-left: 720px; +} + +.container_16 .prefix_13 { + padding-left: 780px; +} + +.container_16 .prefix_14 { + padding-left: 840px; +} + +.container_16 .prefix_15 { + padding-left: 900px; +} + +/* Suffix Extra Space >> 16 Columns +----------------------------------------------------------------------------------------------------*/ + +.container_16 .suffix_1 { + padding-right: 60px; +} + +.container_16 .suffix_2 { + padding-right: 120px; +} + +.container_16 .suffix_3 { + padding-right: 180px; +} + +.container_16 .suffix_4 { + padding-right: 240px; +} + +.container_16 .suffix_5 { + padding-right: 300px; +} + +.container_16 .suffix_6 { + padding-right: 360px; +} + +.container_16 .suffix_7 { + padding-right: 420px; +} + +.container_16 .suffix_8 { + padding-right: 480px; +} + +.container_16 .suffix_9 { + padding-right: 540px; +} + +.container_16 .suffix_10 { + padding-right: 600px; +} + +.container_16 .suffix_11 { + padding-right: 660px; +} + +.container_16 .suffix_12 { + padding-right: 720px; +} + +.container_16 .suffix_13 { + padding-right: 780px; +} + +.container_16 .suffix_14 { + padding-right: 840px; +} + +.container_16 .suffix_15 { + padding-right: 900px; +} + +/* Push Space >> 16 Columns +----------------------------------------------------------------------------------------------------*/ + +.container_16 .push_1 { + left: 60px; +} + +.container_16 .push_2 { + left: 120px; +} + +.container_16 .push_3 { + left: 180px; +} + +.container_16 .push_4 { + left: 240px; +} + +.container_16 .push_5 { + left: 300px; +} + +.container_16 .push_6 { + left: 360px; +} + +.container_16 .push_7 { + left: 420px; +} + +.container_16 .push_8 { + left: 480px; +} + +.container_16 .push_9 { + left: 540px; +} + +.container_16 .push_10 { + left: 600px; +} + +.container_16 .push_11 { + left: 660px; +} + +.container_16 .push_12 { + left: 720px; +} + +.container_16 .push_13 { + left: 780px; +} + +.container_16 .push_14 { + left: 840px; +} + +.container_16 .push_15 { + left: 900px; +} + +/* Pull Space >> 16 Columns +----------------------------------------------------------------------------------------------------*/ + +.container_16 .pull_1 { + left: -60px; +} + +.container_16 .pull_2 { + left: -120px; +} + +.container_16 .pull_3 { + left: -180px; +} + +.container_16 .pull_4 { + left: -240px; +} + +.container_16 .pull_5 { + left: -300px; +} + +.container_16 .pull_6 { + left: -360px; +} + +.container_16 .pull_7 { + left: -420px; +} + +.container_16 .pull_8 { + left: -480px; +} + +.container_16 .pull_9 { + left: -540px; +} + +.container_16 .pull_10 { + left: -600px; +} + +.container_16 .pull_11 { + left: -660px; +} + +.container_16 .pull_12 { + left: -720px; +} + +.container_16 .pull_13 { + left: -780px; +} + +.container_16 .pull_14 { + left: -840px; +} + +.container_16 .pull_15 { + left: -900px; +} + +/* `Clear Floated Elements +----------------------------------------------------------------------------------------------------*/ + +/* http://sonspring.com/journal/clearing-floats */ + +.clear { + clear: both; + display: block; + overflow: hidden; + visibility: hidden; + width: 0; + height: 0; +} + +/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */ + +.clearfix:before, +.clearfix:after, +.container_16:before, +.container_16:after { + content: '.'; + display: block; + overflow: hidden; + visibility: hidden; + font-size: 0; + line-height: 0; + width: 0; + height: 0; +} + +.clearfix:after, +.container_16:after { + clear: both; +} + +/* + The following zoom:1 rule is specifically for IE6 + IE7. + Move to separate stylesheet if invalid CSS is a problem. +*/ + +.clearfix, +.container_16 { + zoom: 1; +} \ No newline at end of file diff --git a/mediagoblin/static/css/base.css b/mediagoblin/static/css/base.css index 3b2a9a50..2574683e 100644 --- a/mediagoblin/static/css/base.css +++ b/mediagoblin/static/css/base.css @@ -208,16 +208,6 @@ text-align:center; text-align:right; } -/* media pages */ - -.media_image{ - width:640px; -} - -.media_sidebar{ - width:280px; -} - /* comments */ .comment_author { diff --git a/mediagoblin/static/css/contrib/960_12_col.css b/mediagoblin/static/css/contrib/960_12_col.css deleted file mode 120000 index 15c360e4..00000000 --- a/mediagoblin/static/css/contrib/960_12_col.css +++ /dev/null @@ -1 +0,0 @@ -../../../contrib/960_12_col.css \ No newline at end of file diff --git a/mediagoblin/static/css/contrib/960_16_col.css b/mediagoblin/static/css/contrib/960_16_col.css new file mode 120000 index 00000000..a8e89d29 --- /dev/null +++ b/mediagoblin/static/css/contrib/960_16_col.css @@ -0,0 +1 @@ +/home/jef/env/mediagoblin/src/schendjes-mediagoblin/mediagoblin/contrib/960_16_col.css \ No newline at end of file diff --git a/mediagoblin/templates/mediagoblin/auth/login.html b/mediagoblin/templates/mediagoblin/auth/login.html index f6ee7166..2303ce5c 100644 --- a/mediagoblin/templates/mediagoblin/auth/login.html +++ b/mediagoblin/templates/mediagoblin/auth/login.html @@ -20,10 +20,9 @@ {% import "/mediagoblin/utils/wtforms.html" as wtforms_util %} {% block mediagoblin_content %} -
-
+

Log in

{% if login_failed %}
Login failed!
diff --git a/mediagoblin/templates/mediagoblin/auth/register.html b/mediagoblin/templates/mediagoblin/auth/register.html index 7e18ca58..f77b3782 100644 --- a/mediagoblin/templates/mediagoblin/auth/register.html +++ b/mediagoblin/templates/mediagoblin/auth/register.html @@ -23,7 +23,7 @@ -
+

Create an account!

{{ wtforms_util.render_divs(register_form) }}
diff --git a/mediagoblin/templates/mediagoblin/base.html b/mediagoblin/templates/mediagoblin/base.html index 87adfabb..b71fca24 100644 --- a/mediagoblin/templates/mediagoblin/base.html +++ b/mediagoblin/templates/mediagoblin/base.html @@ -23,7 +23,7 @@ + href="{{ request.staticdirect('/css/contrib/960_16_col.css') }}"/> {% block mediagoblin_head %} @@ -35,8 +35,8 @@
{% block mediagoblin_header %}
-
-
+
+
{% block mediagoblin_logo %} {% endblock %}{% block mediagoblin_header_title %}{% endblock %} @@ -55,8 +55,8 @@
{% endblock %} -
-
+
+
{% include "mediagoblin/utils/messages.html" %} {% block mediagoblin_content %} {% endblock mediagoblin_content %} @@ -64,8 +64,8 @@
{% block mediagoblin_footer %}