diff --git a/apps/firefox/templates/firefox/installer-help.html b/apps/firefox/templates/firefox/installer-help.html new file mode 100644 index 00000000000..0334745fcb2 --- /dev/null +++ b/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 %} + +
+
+

Your download was interrupted

+

Please click the download button to continue.

+
+ + + + + +
+ +{% endblock %} diff --git a/apps/firefox/urls.py b/apps/firefox/urls.py index 0282f9b8785..21be062b916 100644 --- a/apps/firefox/urls.py +++ b/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'), diff --git a/media/css/firefox/installer-help.less b/media/css/firefox/installer-help.less new file mode 100644 index 00000000000..2476189a95e --- /dev/null +++ b/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; + } + } + +} diff --git a/media/css/sandstone/buttons.less b/media/css/sandstone/buttons.less index 4732ffd8616..b1899ae3c5a 100644 --- a/media/css/sandstone/buttons.less +++ b/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; diff --git a/settings/base.py b/settings/base.py index 4740f53e56c..3976d5bbe5b 100644 --- a/settings/base.py +++ b/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', ),