* Rename mediagoblin_header, mediagoblin_body, mediagoblin_footer, mediagoblin_header_right, mediagoblin_logo

* Add html5shiv for older browsers
* Small size fix (940px instead of 960pgx)

extlib/html5shiv/MIT.txt

@@ -0,0 +1,20 @@
+Copyright (c) <year> <copyright holders>
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

extlib/html5shiv/html5shiv.js

@@ -0,0 +1,3 @@
+// HTML5 Shiv v3 | @jon_neal @afarkas @rem | MIT/GPL2 Licensed
+// Uncompressed source: https://github.com/aFarkas/html5shiv
+(function(a,b){var c=function(a){return a.innerHTML="<x-element></x-element>",a.childNodes.length===1}(b.createElement("a")),d=function(a,b,c){return b.appendChild(a),(c=(c?c(a):a.currentStyle).display)&&b.removeChild(a)&&c==="block"}(b.createElement("nav"),b.documentElement,a.getComputedStyle),e={elements:"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video".split(" "),shivDocument:function(a){a=a||b;if(a.documentShived)return;a.documentShived=!0;var f=a.createElement,g=a.createDocumentFragment,h=a.getElementsByTagName("head")[0],i=function(a){f(a)};c||(e.elements.join(" ").replace(/\w+/g,i),a.createElement=function(a){var b=f(a);return b.canHaveChildren&&e.shivDocument(b.document),b},a.createDocumentFragment=function(){return e.shivDocument(g())});if(!d&&h){var j=f("div");j.innerHTML=["x<style>","article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block}","audio{display:none}","canvas,video{display:inline-block;*display:inline;*zoom:1}","[hidden]{display:none}audio[controls]{display:inline-block;*display:inline;*zoom:1}","mark{background:#FF0;color:#000}","</style>"].join(""),h.insertBefore(j.lastChild,h.firstChild)}return a}};e.shivDocument(b),a.html5=e})(this,document)

mediagoblin/static/css/base.css

@@ -84,13 +84,13 @@ input, textarea {
 
 /* website structure */
 
-.mediagoblin_body {
+.container {
   margin: auto;
   width: 96%;
-  max-width: 960px;
+  max-width: 940px;
 }
 
-.mediagoblin_header {
+header {
   width: 100%;
   height: 36px;
   padding-top: 14px;
@@ -98,17 +98,17 @@ input, textarea {
   border-bottom: 1px solid #333;
 }
 
-.mediagoblin_header_right {
+.header_right {
   float: right;
 }
 
-a.mediagoblin_logo {
+a.logo {
   color: #fff;
   font-weight: bold;
   margin-right: 8px;
 }
 
-.mediagoblin_logo img {
+.logo img {
   vertical-align: middle;
 }
 
@@ -117,7 +117,7 @@ a.mediagoblin_logo {
   padding-bottom: 74px;
 }
 
-.mediagoblin_footer {
+footer {
   width: 100%;
   height: 30px;
   border-top: 1px solid #333;

mediagoblin/static/js/extlib/html5shiv.js

@@ -0,0 +1 @@
+../../../../extlib/html5shiv/html5shiv.js

mediagoblin/templates/mediagoblin/base.html

@@ -29,22 +29,24 @@
           href="{{ request.staticdirect('/css/video-js.css') }}"/>
     <link rel="shortcut icon"
           href="{{ request.staticdirect('/images/goblin.ico') }}" />
-    <script type="text/javascript"
-          src="{{ request.staticdirect('/js/extlib/jquery.js') }}"></script>
+    <script src="{{ request.staticdirect('/js/extlib/jquery.js') }}"></script>
+    <!--[if lt IE 9]>
+      <script src="{{ request.staticdirect('/js/extlib/html5shiv.js') }}"></script>
+    <![endif]-->
     {% block mediagoblin_head %}
     {% endblock mediagoblin_head %}
   </head>
   <body>
     {% block mediagoblin_body %}
-    <div class="mediagoblin_body">
+    <div class="container">
       {% block mediagoblin_header %}
-          <div class="mediagoblin_header">
+          <header>
             {% block mediagoblin_logo %}
-              <a class="mediagoblin_logo"
+              <a class="logo"
                  href="{{ request.urlgen('index') }}"
                  ><img src="{{ request.staticdirect('/images/logo.png') }}"
                      alt="{% trans %}MediaGoblin logo{% endtrans %}" /></a>
-            {% endblock %}
+            {% endblock mediagoblin_logo %}
             {% if request.user and request.user.status == 'active' %}
               <a class="button_action"
                  href="{{ request.urlgen('mediagoblin.submit.start') }}">
@@ -52,7 +54,7 @@
               </a>
             {% endif %}
             {% block mediagoblin_header_title %}{% endblock %}
-            <div class="mediagoblin_header_right">
+            <div class="header_right">
               {% if request.user %}
                 {# the following link should only appear when verification is needed #}
                 {% if request.user.status == "needs_email_verification" %}
@@ -72,7 +74,7 @@
                   {% trans %}Log in{% endtrans %}</a>
               {% endif %}
             </div>
-          </div>
+          </header>
       {% endblock %}
       <div class="mediagoblin_content">
           {% include "mediagoblin/utils/messages.html" %}
@@ -80,12 +82,12 @@
           {% endblock mediagoblin_content %}
       </div>
       {% block mediagoblin_footer %}
-          <div class="mediagoblin_footer">
+          <footer>
             {% trans -%}
               Powered by <a href="http://mediagoblin.org">MediaGoblin</a>, a <a href="http://gnu.org/">GNU</a> project
             {%- endtrans %}
-          </div>
-      {% endblock %}
+          </footer>
+      {% endblock mediagoblin_footer %}
     {% endblock mediagoblin_body %}
     </div>
   </body>