summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorcatch2014-03-26 12:26:11 (GMT)
committercatch2014-03-26 12:26:11 (GMT)
commitd43ffb1faa6e5d0cdd228bc59e7003d7eb6ed2c9 (patch)
treedc57dba9b696250f727585a886992b301c6768b9
parentc01616fb5558dfa98355f10592f2c22e249ac42f (diff)
Issue #2169765 by philipz, Sutharsan, ckrina, c_lehel, LewisNyman: Redesign update.php to be more consistent with the installation process.
-rw-r--r--core/includes/install.core.inc1
-rw-r--r--core/includes/theme.maintenance.inc9
-rw-r--r--core/themes/seven/install-page.css165
-rw-r--r--core/themes/seven/js/mobile.install.js2
-rw-r--r--core/themes/seven/maintenance-page.css184
-rw-r--r--core/themes/seven/seven.base.css1
-rw-r--r--core/themes/seven/seven.libraries.yml10
-rw-r--r--core/themes/seven/seven.theme27
-rw-r--r--core/themes/seven/style.css81
-rw-r--r--core/themes/seven/templates/maintenance-page.html.twig80
-rw-r--r--core/update.php2
11 files changed, 267 insertions, 295 deletions
diff --git a/core/includes/install.core.inc b/core/includes/install.core.inc
index 74f82ba..d335e65 100644
--- a/core/includes/install.core.inc
+++ b/core/includes/install.core.inc
@@ -910,7 +910,6 @@ function install_display_output($output, $install_state) {
'#theme' => 'task_list',
'#items' => install_tasks_to_display($install_state),
'#active' => $active_task,
- '#variant' => 'install',
);
drupal_add_region_content('sidebar_first', drupal_render($task_list));
}
diff --git a/core/includes/theme.maintenance.inc b/core/includes/theme.maintenance.inc
index d3023b9..57183d6 100644
--- a/core/includes/theme.maintenance.inc
+++ b/core/includes/theme.maintenance.inc
@@ -109,23 +109,16 @@ function _drupal_maintenance_theme() {
* An associative array containing:
* - items: An associative array of maintenance tasks.
* - active: The key for the currently active maintenance task.
- * - variant: A variant name to be used for a CSS class.
*
* @ingroup themeable
*/
function theme_task_list($variables) {
$items = $variables['items'];
$active = $variables['active'];
- if (isset($variables['variant'])) {
- $class = $variables['variant'] . '-task-list';
- }
- else {
- $class = 'task-list';
- }
$done = isset($items[$active]) || $active == NULL;
$output = '<h2 class="visually-hidden">Installation tasks</h2>';
- $output .= '<ol class="' . $class . '">';
+ $output .= '<ol class="task-list">';
foreach ($items as $k => $item) {
if ($active == $k) {
diff --git a/core/themes/seven/install-page.css b/core/themes/seven/install-page.css
index 7981932..5c3bf83 100644
--- a/core/themes/seven/install-page.css
+++ b/core/themes/seven/install-page.css
@@ -23,171 +23,6 @@
background-position: left top, 50% 50%;
min-height: 100%;
}
-.install-page {
- background: none;
-}
-.name-and-slogan h1 {
- font-size: 2em;
- line-height: 1.2em;
- color: #0074bd;
-}
-
-/**
- * Layout
- */
-.install-page .l-container {
- background: #fff;
- width: auto;
- margin-left: 1.25em;
- margin-right: 1.25em;
-}
-.install-page .l-container:after { /* no reason for a clearfix in the markup */
- content: "";
- display: table;
- clear: both;
-}
-@media all and (max-width: 48em) { /* 768px */
- .install-page .l-container {
- margin-top: 1.25em;
- padding: 10px 20px 0;
- }
- .install-page .name-and-slogan {
- margin: 0 0 1.45em 0;
- }
-}
-
-@media all and (min-width: 48em) { /* 768px */
- html {
- display: table;
- }
- .install-page {
- display: table-cell;
- padding: 1em 0;
- vertical-align: middle;
- }
- html, .install-page {
- margin: 0;
- width: 100%;
- height: 100%;
- }
- .install-page .l-container {
- margin: 0 auto;
- max-width: 770px;
- width: 75%;
- border-radius: 5px;
- box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
- padding: 20px 0 40px 0;
- }
-
- /* Positioning sidebar & content */
- .install-page [role="main"] {
- -webkit-box-sizing: border-box;
- -moz-box-sizing: border-box;
- box-sizing: border-box;
- clear: none;
- float: left;
- padding-left: 3.85em;
- padding-right: 3.85em;
- width: 65%;
- }
- [dir="rtl"] .install-page [role="main"] {
- float: right;
- }
- ul {
- padding: 15px;
- margin: 0.25em 0;
- }
- .install-page .l-sidebar-first {
- float: left;
- width: 35%;
- }
- [dir="rtl"] .install-page .l-sidebar-first {
- float: right;
- }
-
- /* Margins for sitename */
- .install-page .name-and-slogan h1 {
- margin: 0.75em 0 0.75em 1.9em; /* LTR */
- }
- [dir="rtl"] .install-page .name-and-slogan h1 {
- margin: 0.75em 1.9em 0.75em 0;
- }
-}
-
-/**
- * Task list & step indicator
- */
-@media all and (max-width: 48em) { /* 768px */
- header[role="banner"] {
- position: relative;
- }
- .step-indicator {
- display: block;
- font-size: 1.385em;
- position: absolute;
- top: 0.2em;
- right: 0.5em;
- }
- [dir="rtl"] .step-indicator {
- left: 2em;
- right: auto;
- }
- .install-task-list {
- display: none;
- }
-}
-
-@media all and (min-width: 48em) { /* 768px */
- .step-indicator {
- display: none;
- }
- .install-task-list {
- margin-left: 0; /* LTR */
- list-style-type: none;
- list-style-image: none;
- padding-left: 0; /* LTR */
- padding-bottom: 1em;
- }
- [dir="rtl"] .install-task-list {
- margin-right: 0;
- padding-right: 0;
- }
- .install-task-list li {
- padding: 0.5em 1em 0.5em 3.85em; /* LTR */
- color: #1a1a1a;
- }
- [dir="rtl"] .install-task-list li {
- padding: 0.5em 1em 0.5em 1em;
- }
- .install-task-list .active {
- background: #ebeae4;
- position: relative;
- font-weight: normal;
- }
- .install-task-list .active:after {
- left: 100%; /* LTR */
- border: solid transparent;
- border-color: rgba(235, 234, 228, 0);
- border-left-color: #ebeae4; /* LTR */
- border-width: 1.35em;
- content: " ";
- height: 0;
- width: 0;
- position: absolute;
- pointer-events: none;
- top: 50%;
- margin-top: -1.32em;
- }
- [dir="rtl"] .install-task-list .active:after {
- left: auto;
- right: 100%;
- border-left-color: transparent;
- border-right-color: #ebeae4;
- }
- .install-task-list .done {
- color: #adadad;
- }
-}
/**
* Password widget
diff --git a/core/themes/seven/js/mobile.install.js b/core/themes/seven/js/mobile.install.js
index 2326c24..28268bf 100644
--- a/core/themes/seven/js/mobile.install.js
+++ b/core/themes/seven/js/mobile.install.js
@@ -16,7 +16,7 @@
}
function installStepsSetup () {
- var steps = document.querySelectorAll('.install-task-list li');
+ var steps = document.querySelectorAll('.task-list li');
if (steps.length) {
var header = document.querySelector('header[role="banner"]');
var stepIndicator = document.createElement('div');
diff --git a/core/themes/seven/maintenance-page.css b/core/themes/seven/maintenance-page.css
new file mode 100644
index 0000000..bc56fa0
--- /dev/null
+++ b/core/themes/seven/maintenance-page.css
@@ -0,0 +1,184 @@
+/**
+ * @file
+ * Maintenance theming.
+ */
+.maintenance-background {
+ background-color: #e0e0d8;
+ background-image: -webkit-radial-gradient(hsl(203, 2%, 90%), hsl(203, 2%, 95%));
+ background-image: -moz-radial-gradient(hsl(203, 2%, 90%), hsl(203, 2%, 95%));
+ background-image: -o-radial-gradient(hsl(203, 2%, 90%), hsl(203, 2%, 95%));
+ background-image: radial-gradient(hsl(203, 2%, 90%), hsl(203, 2%, 95%));
+ background-repeat: repeat;
+ background-position: left top, 50% 50%;
+ min-height: 100%;
+}
+
+/* Maintenance theming */
+.install-page,
+.in-maintenance {
+ background: none;
+}
+.name-and-slogan h1 {
+ font-size: 2em;
+ line-height: 1.2em;
+ color: #0074bd;
+}
+
+/**
+ * Task list & step indicator
+ */
+@media all and (max-width: 48em) { /* 768px */
+ header[role="banner"] {
+ position: relative;
+ }
+ .step-indicator {
+ display: block;
+ font-size: 1.385em;
+ position: absolute;
+ top: 0.2em;
+ right: 0.5em;
+ }
+ [dir="rtl"] .step-indicator {
+ left: 2em;
+ right: auto;
+ }
+ .task-list {
+ display: none;
+ }
+}
+
+@media all and (min-width: 48em) { /* 768px */
+ .step-indicator {
+ display: none;
+ }
+ .task-list {
+ margin-left: 0; /* LTR */
+ list-style-type: none;
+ list-style-image: none;
+ padding-left: 0; /* LTR */
+ padding-bottom: 1em;
+ }
+ [dir="rtl"] .task-list {
+ margin-right: 0;
+ padding-right: 0;
+ }
+ .task-list li {
+ padding: 0.5em 1em 0.5em 3.85em; /* LTR */
+ color: #1a1a1a;
+ }
+ [dir="rtl"] .task-list li {
+ padding: 0.5em 1em 0.5em 1em;
+ }
+ .task-list .active {
+ background: #ebeae4;
+ position: relative;
+ font-weight: normal;
+ }
+ .task-list .active:after {
+ left: 100%; /* LTR */
+ border: solid transparent;
+ border-color: rgba(235, 234, 228, 0);
+ border-left-color: #ebeae4; /* LTR */
+ border-width: 1.35em;
+ content: " ";
+ height: 0;
+ width: 0;
+ position: absolute;
+ pointer-events: none;
+ top: 50%;
+ margin-top: -1.32em;
+ }
+ [dir="rtl"] .task-list .active:after {
+ left: auto;
+ right: 100%;
+ border-left-color: transparent;
+ border-right-color: #ebeae4;
+ }
+ .task-list .done {
+ color: #adadad;
+ }
+}
+
+/**
+ * Layout
+ */
+.l-container {
+ background: #fff;
+ width: auto;
+ margin-left: 1.25em;
+ margin-right: 1.25em;
+}
+.l-container:after { /* no reason for a clearfix in the markup */
+ content: "";
+ display: table;
+ clear: both;
+}
+@media all and (max-width: 48em) { /* 768px */
+ .l-container {
+ margin: 1.25em;
+ padding: 10px 20px;
+ }
+ .name-and-slogan {
+ margin: 0 0 1.45em 0;
+ }
+}
+
+@media all and (min-width: 48em) { /* 768px */
+ html {
+ display: table;
+ }
+ .in-maintenance,
+ .install-page {
+ display: table-cell;
+ padding: 1em 0;
+ vertical-align: middle;
+ }
+ html, .install-page, .in-maintenance {
+ margin: 0;
+ width: 100%;
+ height: 100%;
+ }
+ .l-container {
+ margin: 0 auto;
+ max-width: 770px;
+ width: 75%;
+ border-radius: 5px;
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
+ padding: 20px 0 40px 0;
+ }
+
+ /* Positioning sidebar & content */
+ main {
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ clear: none;
+ float: left;
+ padding-left: 3.85em;
+ padding-right: 3.85em;
+ width: 65%;
+ }
+ [dir="rtl"] main {
+ float: right;
+ }
+ ul {
+ padding: 15px;
+ margin: 0.25em 0;
+ }
+ .l-sidebar-first {
+ float: left;
+ width: 35%;
+ }
+ [dir="rtl"] .l-sidebar-first {
+ float: right;
+ }
+
+ /* Margins for sitename */
+ h1.page-title,
+ .name-and-slogan h1 {
+ margin: 0.75em 0 0.75em 1.9em; /* LTR */
+ }
+ [dir="rtl"] .name-and-slogan h1 {
+ margin: 0.75em 1.9em 0.75em 0;
+ }
+}
diff --git a/core/themes/seven/seven.base.css b/core/themes/seven/seven.base.css
index 59f4d5e..844712d 100644
--- a/core/themes/seven/seven.base.css
+++ b/core/themes/seven/seven.base.css
@@ -116,6 +116,7 @@ ul {
ol {
list-style-type: decimal;
margin: 0.25em 0 0.25em 2em; /* LTR */
+ padding: 0;
}
[dir="rtl"] ol {
margin: 0.25em 2em 0.25em 0;
diff --git a/core/themes/seven/seven.libraries.yml b/core/themes/seven/seven.libraries.yml
index 4d0dac1..fb22ac1 100644
--- a/core/themes/seven/seven.libraries.yml
+++ b/core/themes/seven/seven.libraries.yml
@@ -1,3 +1,13 @@
+maintenance-page:
+ version: VERSION
+ js:
+ js/mobile.install.js: {}
+ css:
+ theme:
+ maintenance-page.css: {}
+ dependencies:
+ - system/maintenance
+
install-page:
version: VERSION
js:
diff --git a/core/themes/seven/seven.theme b/core/themes/seven/seven.theme
index 6f5ce6b..c0a5a08 100644
--- a/core/themes/seven/seven.theme
+++ b/core/themes/seven/seven.theme
@@ -274,7 +274,32 @@ function seven_preprocess_install_page(&$variables) {
// Normally we could attach libraries via hook_page_alter(), but when the
// database is inactive it's not called so we add them here.
- $libraries['#attached']['library'][] = 'seven/install-page';
+ $libraries = array(
+ '#attached' => array(
+ 'library' => array(
+ 'seven/maintenance-page',
+ 'seven/install-page',
+ ),
+ ),
+ );
+ drupal_render($libraries);
+}
+
+/**
+ * Implements hook_preprocess_maintenance_page().
+ */
+function seven_preprocess_maintenance_page(&$variables) {
+ $variables['styles'] = new RenderWrapper('drupal_get_css');
+ $variables['scripts'] = new RenderWrapper('drupal_get_js');
+ // // Normally we could attach libraries via hook_page_alter(), but when the
+ // // database is inactive it's not called so we add them here.
+ $libraries = array(
+ '#attached' => array(
+ 'library' => array(
+ 'seven/maintenance-page',
+ ),
+ ),
+ );
drupal_render($libraries);
}
diff --git a/core/themes/seven/style.css b/core/themes/seven/style.css
index 5bd29b0..95daa96 100644
--- a/core/themes/seven/style.css
+++ b/core/themes/seven/style.css
@@ -999,87 +999,6 @@ div.admin-options div.form-item {
border: none;
}
-/* Maintenance theming */
-body.in-maintenance #sidebar-first {
- float: left; /* LTR */
- max-width: 200px;
- width: 25%;
-}
-[dir="rtl"] body.in-maintenance #sidebar-first {
- float: right;
-}
-body.in-maintenance #content {
- float: right; /* LTR */
- clear: none;
- width: 72%;
-}
-[dir="rtl"] body.in-maintenance #content {
- float: left;
-}
-body.in-maintenance #page {
- max-width: 770px;
- margin: 0 auto;
- padding-top: 2em;
- width: 90%;
-}
-body.in-maintenance .branding__inner {
- max-width: 770px;
- margin: 0 auto;
- float: none;
- width: 90%;
-}
-body.in-maintenance .form-radios .form-type-radio {
- padding: 2px 0;
-}
-body.in-maintenance div.form-item:after {
- content: "";
- display: none;
- clear: none;
-}
-body.in-maintenance .form-submit {
- display: block;
-}
-body.in-maintenance #logo {
- margin-bottom: 1.5em;
- max-width: 180px;
-}
-@media all and (max-width: 768px) {
- body.in-maintenance #sidebar-first,
- body.in-maintenance #content {
- float: none;
- max-width: none;
- width: auto;
- }
-}
-.task-list {
- margin-left: 0; /* LTR */
- list-style-type: none;
- list-style-image: none;
-}
-[dir="rtl"] .task-list {
- margin-right: 0;
-}
-.task-list li {
- padding: 0.5em 1em 0.5em 20px; /* LTR */
- color: #adadad;
-}
-[dir="rtl"] .task-list li {
- padding: 0.5em 20px 0.5em 1em;
-}
-.task-list li.active {
- background: transparent url(images/task-item.png) no-repeat 3px 50%; /* LTR */
- padding: 0.5em 1em 0.5em 20px; /* LTR */
- color: #000;
-}
-[dir="rtl"] .task-list li.active {
- background: transparent url(images/task-item-rtl.png) no-repeat right 50%;
- padding: 0.5em 20px 0.5em 1em;
-}
-.task-list li.done {
- background: transparent url(images/task-check.png) no-repeat 0 50%;
- color: green;
-}
-
/* Field UI */
#field-display-overview input.field-plugin-settings-edit {
diff --git a/core/themes/seven/templates/maintenance-page.html.twig b/core/themes/seven/templates/maintenance-page.html.twig
index dc691c1..a3d78d1 100644
--- a/core/themes/seven/templates/maintenance-page.html.twig
+++ b/core/themes/seven/templates/maintenance-page.html.twig
@@ -12,47 +12,53 @@
*/
#}
<!DOCTYPE html>
-<html{{ html_attributes }}>
- <head>
- <title>{{ head_title }}</title>
- {{ head }}
- {{ styles }}
- {{ scripts }}
- </head>
- <body{{ attributes }}>
+<html{{ html_attributes }} class="maintenance-background">
+<head>
+ {{ head }}
+ <title>{{ head_title }}</title>
+ {{ styles }}
+ {{ scripts }}
+</head>
+<body{{ attributes }}>
+
+<div class="l-container">
{{ page_top }}
- <header id="branding">
- <div class="branding__inner">
- {% if title %}<h1 class="page-title">{{ title }}</h1>{% endif %}
- </div>
+ <header role="banner">
+ {% if site_name or site_slogan %}
+ <div class="name-and-slogan">
+ {% if site_name %}
+ <h1>{{ site_name }}</h1>
+ {% endif %}
+ {% if site_slogan %}
+ <div class="site-slogan">{{ site_slogan }}</div>
+ {% endif %}
+ </div>{# /.name-and-slogan #}
+ {% endif %}
</header>
- <div id="page">
- <div id="sidebar-first" class="sidebar">
- {% if logo %}
- <img id="logo" src="{{ logo }}" alt="{{ site_name }}" />
- {% endif %}
+ {% if sidebar_first %}
+ <aside class="l-sidebar-first" role="complementary">
{{ sidebar_first }}
- </div>
-
- <main id="content" class="clearfix">
- {% if messages %}
- <div id="console">{{ messages }}</div>
- {% endif %}
- {% if help %}
- <div id="help">
- {{ help }}
- </div>
- {% endif %}
- {{ content }}
- </main>
- </div>
-
- <footer role="contentinfo">
- {{ page_bottom }}
- </footer>
-
- </body>
+ </aside>{# /.l-sidebar-first #}
+ {% endif %}
+
+ <main role="main">
+ {% if title %}
+ <h1>{{ title }}</h1>
+ {% endif %}
+ {{ messages }}
+ {{ content }}
+ </main>
+
+ {% if footer %}
+ <footer role="contentinfo">
+ {{ footer }}
+ </footer>
+ {% endif %}
+
+</div>{# /.l-container #}
+
+</body>
</html>
diff --git a/core/update.php b/core/update.php
index cd94972..8f7c325 100644
--- a/core/update.php
+++ b/core/update.php
@@ -211,7 +211,7 @@ function update_info_page() {
$output .= "</ol>\n";
$output .= "<p>When you have performed the steps above, you may proceed.</p>\n";
$form_action = check_url(drupal_current_script_url(array('op' => 'selection', 'token' => $token)));
- $output .= '<form method="post" action="' . $form_action . '"><p><input type="submit" value="Continue" class="form-submit button button-primary" /></p></form>';
+ $output .= '<form method="post" action="' . $form_action . '"><div class="form-actions form-wrapper" id="edit-actions"><input type="submit" value="Continue" class="button button--primary form-submit" /></div></form>';
$output .= "\n";
$build = array(