Bug 794109 - stub installer fallback page

Initial commit, work in progress

apps/firefox/templates/firefox/installer-help.html

@@ -0,0 +1,29 @@
+{% extends "/firefox/base-resp.html" %}
+
+{% block page_title %}Your download was interrupted{% endblock %}
+{% block body_id %}installer-help{% endblock %}
+
+{% block site_css %}
+  {{ css('installer_help') }}
+{% endblock %}
+
+{% block content %}
+
+<div id="main-content">
+  <hgroup>
+    <h1>Your download was interrupted</h1>
+    <h2>Please click the download button to continue.</h2>
+  </hgroup>
+
+  <aside class="download-button">
+  [ Download Button Here ]
+  </aside>
+
+  <aside class="help">
+    <h3>Need help installing?</h3>
+    <p><a href="https://support.mozilla.org/kb/install-firefox-windows">Visit support.mozilla.org</a></p>
+  </aside>
+
+</div>
+
+{% endblock %}

apps/firefox/urls.py

@@ -32,6 +32,7 @@
     page('firefox/organizations', 'firefox/organizations/organizations.html'),
     page('firefox/performance', 'firefox/performance.html'),
     page('firefox/security', 'firefox/security.html'),
+    page('firefox/installer-help', 'firefox/installer-help.html'),
     page('firefox/speed', 'firefox/speed.html',
          latest_version=product_details.firefox_versions['LATEST_FIREFOX_VERSION']),
     page('firefox/technology', 'firefox/technology.html'),

media/css/firefox/installer-help.less

@@ -0,0 +1,74 @@
+@import "../sandstone/variables-resp.less";
+@import "../sandstone/mixins-resp.less";
+@import "../sandstone/buttons.less";
+
+#main-content {
+  background: #fff;
+  padding: 40px (@gridColumnWidth * 6) 40px 40px;
+  margin: 0 auto @baseLine;
+  @shadow: 0 0 1px rgba(0,0,0,.05);
+  .box-shadow(@shadow);
+  border-bottom: 1px solid #ddd;
+  hgroup {
+    margin: 0 0 (@baseLine * 2);
+    h1 {
+      font-size: 32px;
+      letter-spacing: -1px;
+      margin: 0 0 .25em;
+    }
+    h2 {
+      font-size: 24px;
+      letter-spacing: -0.25px;
+      margin: 0 0 .25em;
+    }
+  }
+
+  .download-button {
+    position: absolute;
+    right: 40px;
+    top: 40px;
+  }
+
+  .help {
+    .span(4);
+    margin: 0;
+    padding: 20px 20px 0;
+    background: #fafafa;
+    border: 1px solid #efefef;
+    box-shadow: inset 0 0 6px rgba(0,0,0,.05);
+
+    h3 {
+      font-size: 20px;
+    }
+  }
+
+}
+
+
+/* Tablet Layout: 760px */
+@media only screen and (min-width: @breakTablet) and (max-width: @breakDesktop) {
+
+  #main-content {
+    width: auto;
+    padding: 40px 50% 40px 40px;
+  }
+
+}
+
+/* Mobile layout: 320px */
+@media only screen and (max-width: @breakTablet) {
+
+  #main-content {
+    padding: 20px 25px;
+    .download-button {
+      position: static;
+      margin: 0 auto (@baseLine * 2);
+    }
+    .help {
+      width: auto;
+      float: none;
+      margin: 0;
+    }
+  }
+
+}

media/css/sandstone/buttons.less

@@ -244,6 +244,8 @@
         letter-spacing: -0.02em;
         padding-right: 32px;
         background: url(/media/img/sandstone/buttons/arrow-large.png) no-repeat 100% 0;
+        min-height: 28px;
+        margin-bottom: -2px;
     }
     .download-info {
         display: block;

settings/base.py

@@ -181,6 +181,10 @@ def JINJA_CONFIG():
             'css/firefox/whatsnew.less',
             'css/firefox/whatsnew-android.less',
         ),
+        'installer_help': (
+            'css/firefox/template-resp.less',
+            'css/firefox/installer-help.less',
+        ),
         'home': (
             'css/home.less',
         ),