diff --git a/core/includes/install.core.inc b/core/includes/install.core.inc index a941b0b..669e5fd 100644 --- a/core/includes/install.core.inc +++ b/core/includes/install.core.inc @@ -1059,6 +1059,11 @@ function install_settings_form($form, &$form_state, &$install_state) { $form['actions']['save'] = array( '#type' => 'submit', '#value' => st('Save and continue'), + '#attributes' => array( + 'class' => array( + 'button--primary', + ), + ), '#limit_validation_errors' => array( array('driver'), array(isset($form_state['input']['driver']) ? $form_state['input']['driver'] : current($drivers_keys)), @@ -1318,6 +1323,11 @@ function install_select_profile_form($form, &$form_state, $install_state) { $form['actions']['submit'] = array( '#type' => 'submit', '#value' => st('Save and continue'), + '#attributes' => array( + 'class' => array( + 'button--primary', + ), + ), ); return $form; } @@ -1506,6 +1516,11 @@ function install_select_language_form($form, &$form_state, $files = array()) { $form['actions']['submit'] = array( '#type' => 'submit', '#value' => st('Save and continue'), + '#attributes' => array( + 'class' => array( + 'button--primary', + ), + ), ); return $form; } @@ -2392,6 +2407,11 @@ function _install_configure_form($form, &$form_state, &$install_state) { $form['actions']['submit'] = array( '#type' => 'submit', '#value' => st('Save and continue'), + '#attributes' => array( + 'class' => array( + 'button--primary', + ), + ), '#weight' => 15, ); diff --git a/core/includes/theme.inc b/core/includes/theme.inc index 35527a9..63ff6aa 100644 --- a/core/includes/theme.inc +++ b/core/includes/theme.inc @@ -3007,7 +3007,7 @@ function template_preprocess_maintenance_page(&$variables) { $theme_data = list_themes(); $regions = $theme_data[$theme]->info['regions']; - // Add favicon + // Add favicon. if (theme_get_setting('toggle_favicon')) { $favicon = theme_get_setting('favicon'); $type = theme_get_setting('favicon_mimetype'); @@ -3034,7 +3034,7 @@ function template_preprocess_maintenance_page(&$variables) { $site_name = $site_config->get('name'); $site_slogan = $site_config->get('slogan'); - // Construct page title + // Construct page title. if (drupal_get_title()) { $head_title = array( 'title' => strip_tags(drupal_get_title()), @@ -3113,6 +3113,159 @@ function template_process_maintenance_page(&$variables) { } /** + * Process variables for install-page.tpl.php. + * + * The variables array generated here is a mirror of template_preprocess_page(). + * This preprocessor will run its course when theme_maintenance_page() is invoked. + * An alternate template file of maintenance-page--offline.tpl.php can be used when + * the database is offline to hide errors and completely replace the content. + * + * The $variables array contains the following arguments: + * - $content + * + * @see install-page.tpl.php + */ +function template_preprocess_install_page(&$variables) { + global $theme; + $language_interface = language(LANGUAGE_TYPE_INTERFACE); + // Retrieve the theme data to list all available regions. + $theme_data = list_themes(); + $regions = $theme_data[$theme]->info['regions']; + + // Add favicon + if (theme_get_setting('toggle_favicon')) { + $favicon = theme_get_setting('favicon'); + $type = theme_get_setting('favicon_mimetype'); + drupal_add_html_head_link(array('rel' => 'shortcut icon', 'href' => drupal_strip_dangerous_protocols($favicon), 'type' => $type)); + } + + // Get all region content set with drupal_add_region_content(). + foreach (array_keys($regions) as $region) { + // Assign region to a region variable. + $region_content = drupal_get_region_content($region); + isset($variables[$region]) ? $variables[$region] .= $region_content : $variables[$region] = $region_content; + } + + // Setup layout variable. + $variables['layout'] = 'none'; + if (!empty($variables['sidebar_first'])) { + $variables['layout'] = 'first'; + } + if (!empty($variables['sidebar_second'])) { + $variables['layout'] = ($variables['layout'] == 'first') ? 'both' : 'second'; + } + + $site_config = config('system.site'); + $site_name = $site_config->get('name'); + $site_slogan = $site_config->get('slogan'); + + // Construct page title + if (drupal_get_title()) { + $head_title = array( + 'title' => strip_tags(drupal_get_title()), + 'name' => check_plain($site_name), + ); + } + else { + $head_title = array('name' => check_plain($site_name)); + if ($site_slogan) { + $head_title['slogan'] = strip_tags(filter_xss_admin($site_slogan)); + } + } + + $variables['head_title_array'] = $head_title; + $variables['head_title'] = implode(' | ', $head_title); + $variables['base_path'] = base_path(); + $variables['front_page'] = url(); + $variables['breadcrumb'] = ''; + $variables['feed_icons'] = ''; + $variables['help'] = ''; + $variables['language'] = $language_interface; + $variables['language']->dir = $language_interface->direction ? 'rtl' : 'ltr'; + $variables['logo'] = theme_get_setting('logo'); + $variables['messages'] = $variables['show_messages'] ? theme('status_messages') : ''; + $variables['main_menu'] = array(); + $variables['secondary_menu'] = array(); + $variables['site_name'] = 'Installing Drupal 8'; + $variables['site_slogan'] = (theme_get_setting('toggle_slogan') ? filter_xss_admin($site_slogan) : ''); + $variables['tabs'] = ''; + $variables['title'] = drupal_get_title(); + + // Compile a list of classes that are going to be applied to the body element. + $variables['attributes']['class'][] = 'in-maintenance'; + if (isset($variables['db_is_active']) && !$variables['db_is_active']) { + $variables['attributes']['class'][] = 'db-offline'; + } + if ($variables['layout'] == 'both') { + $variables['attributes']['class'][] = 'two-sidebars'; + } + elseif ($variables['layout'] == 'none') { + $variables['attributes']['class'][] = 'no-sidebars'; + } + else { + $variables['attributes']['class'][] = 'one-sidebar'; + $variables['attributes']['class'][] = 'sidebar-' . $variables['layout']; + } + + // Dead databases will show error messages so supplying this template will + // allow themers to override the page and the content completely. + if (isset($variables['db_is_active']) && !$variables['db_is_active']) { + $variables['theme_hook_suggestion'] = 'maintenance_page__offline'; + } + + // Display the html.tpl.php's default mobile metatags for responsive design. + $elements = array( + 'MobileOptimized' => array( + '#tag' => 'meta', + '#attributes' => array( + 'name' => 'MobileOptimized', + 'content' => 'width', + ), + ), + 'HandheldFriendly' => array( + '#tag' => 'meta', + '#attributes' => array( + 'name' => 'HandheldFriendly', + 'content' => 'true', + ), + ), + 'viewport' => array( + '#tag' => 'meta', + '#attributes' => array( + 'name' => 'viewport', + 'content' => 'width=device-width', + ), + ), + 'cleartype' => array( + '#tag' => 'meta', + '#attributes' => array( + 'http-equiv' => 'cleartype', + 'content' => 'on', + ), + ), + ); + foreach ($elements as $name => $element) { + drupal_add_html_head($element, $name); + } +} + +/** + * Theme process function for theme_maintenance_field(). + * + * The variables array generated here is a mirror of template_process_html(). + * This processor will run its course when theme_maintenance_page() is invoked. + * + * @see maintenance-page.tpl.php + * @see template_process_html() + */ +function template_process_install_page(&$variables) { + $variables['head'] = drupal_get_html_head(); + $variables['css'] = drupal_add_css(); + $variables['styles'] = drupal_get_css(); + $variables['scripts'] = drupal_get_js(); +} + +/** * Preprocess variables for region.tpl.php * * Prepares the values passed to the theme_region function to be passed into a @@ -3222,7 +3375,8 @@ function drupal_common_theme() { 'template' => 'maintenance-page', ), 'install_page' => array( - 'variables' => array('content' => NULL), + 'variables' => array('content' => NULL, 'show_messages' => TRUE), + 'template' => 'install-page', ), 'task_list' => array( 'variables' => array('items' => NULL, 'active' => NULL), diff --git a/core/includes/theme.maintenance.inc b/core/includes/theme.maintenance.inc index 578d354..3fe48f3 100644 --- a/core/includes/theme.maintenance.inc +++ b/core/includes/theme.maintenance.inc @@ -148,7 +148,6 @@ function theme_task_list($variables) { /** * Returns HTML for the installation page. * - * Note: this function is not themeable. * * @param $variables * An associative array containing: @@ -156,7 +155,6 @@ function theme_task_list($variables) { */ function theme_install_page($variables) { drupal_add_http_header('Content-Type', 'text/html; charset=utf-8'); - return theme('maintenance_page', $variables); } /** diff --git a/core/modules/system/templates/install-page.tpl.php b/core/modules/system/templates/install-page.tpl.php new file mode 100644 index 0000000..546ee06 --- /dev/null +++ b/core/modules/system/templates/install-page.tpl.php @@ -0,0 +1,86 @@ + + + + + <?php print $head_title; ?> + + + + + +
+ + +
+ + + + + +
+ +
+

+ +
+ +
+
+ +
+ + + + + +
+ + + +
+ + + diff --git a/core/modules/system/templates/maintenance-page.tpl.php b/core/modules/system/templates/maintenance-page.tpl.php index 5da7a1a..2e93bcd 100644 --- a/core/modules/system/templates/maintenance-page.tpl.php +++ b/core/modules/system/templates/maintenance-page.tpl.php @@ -13,10 +13,8 @@ * @ingroup themeable */ ?> - - - + + <?php print $head_title; ?> diff --git a/core/themes/seven/install-page.css b/core/themes/seven/install-page.css new file mode 100644 index 0000000..7d0743a --- /dev/null +++ b/core/themes/seven/install-page.css @@ -0,0 +1,119 @@ +/* Installation theming */ +body.install-page { + background-color: rgb(86, 179, 230); + background-image:-webkit-gradient(linear,50% 0%,50% 100%,color-stop(0, rgb(21,135,211)),color-stop(1, rgba(21,135,211,0))); + background-image:-webkit-linear-gradient(top,rgb(21,135,211) 0%,rgba(21,135,211,0) 100%); + background-image:linear-gradient(180deg,rgb(21,135,211) 0%,rgba(21,135,211,0) 100%); + background-repeat: repeat-x; + background-size: auto 300px; +} +@media all and (min-width: 48em) { /* 768px */ + body.install-page{ + padding-top: 10%; + } + body.install-page #page { + border: 4px solid #ebeae4; + border-radius: 1px; + width: 75%; + max-width: 770px; + box-shadow: 0 4px 23px 5px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(0, 0, 0, 0.15); + padding: 0 2em 1em 0; + } + body.install-page #content { + box-sizing: border-box; + padding-left: 30px; + width: 65%; + } + body.install-page #sidebar-first { + width: 35%; + } +} +body.install-page #site-name { + font-size: 1.8em; + line-height: 1.2em; + width: 8em; + color: #2aa9e0; + margin: 0.25em 0 0.25em 50px; +} +body.install-page #page-title { + background: transparent; + padding-top: 0; +} +@media all and (max-width: 48em) { /* 768px */ +body.install-page #site-name { + margin-left: 0; +} + body.install-page { + padding: 0; + } + body.install-page #page { + width: auto; + padding: 0 40px; + } +} +.task-list { + margin-left: 0; /* LTR */ + list-style-type: none; + list-style-image: none; + padding-left: 0; +} +.task-list li { + padding: 0.5em 1em 0.5em 50px; /* LTR */ + color: #1a1a1a; +} +.task-list li.active { + background: #ebeae4; /* LTR */ + position: relative; + font-weight: normal; +} +.task-list li.active:after { + left: 100%; + border: solid transparent; + content: " "; + height: 0; + width: 0; + position: absolute; + pointer-events: none; + border-color: rgba(235, 234, 228, 0); + border-left-color: #ebeae4; + border-width: 17px; + top: 50%; + margin-top: -17px; +} +.task-list li.done { + color: #adadad; +} +.step-indicator { + display: none; +} +@media all and (max-width: 48em) { /* 768px */ + ol.task-list { + display: none; + } + body.in-maintenance #branding h1 { + float: left; + width: auto; + } + .step-indicator { + display: block; + font-size: 1.231em; + position: absolute; + top: 20px; + right: 40px; + } +} +.install-page .password-parent { + width: auto; +} +.install-page div.form-item div.password-suggestions { + float: none; + width: auto; +} +@media all and (max-width: 975px) and (min-width: 48em) { + .install-page .password-strength, + .install-page .confirm-parent, + .install-page div.password-confirm { + float: none; + width: auto; + } +} \ No newline at end of file diff --git a/core/themes/seven/js/mobile.install.js b/core/themes/seven/js/mobile.install.js index 6784daa..a6af9f1 100644 --- a/core/themes/seven/js/mobile.install.js +++ b/core/themes/seven/js/mobile.install.js @@ -18,11 +18,11 @@ function installStepsSetup () { var steps = document.querySelectorAll('.task-list li'); if (steps.length) { - var branding = document.querySelector('#branding'); + var header = document.querySelector('#header'); var stepIndicator = document.createElement('div'); stepIndicator.className = 'step-indicator'; stepIndicator.innerHTML = findActiveStep(steps) + '/' + steps.length; - branding.appendChild(stepIndicator); + header.appendChild(stepIndicator); } } diff --git a/core/themes/seven/seven.theme b/core/themes/seven/seven.theme index 61212fe..8860973 100644 --- a/core/themes/seven/seven.theme +++ b/core/themes/seven/seven.theme @@ -133,6 +133,7 @@ function seven_tablesort_indicator($variables) { */ function seven_preprocess_install_page(&$variables) { drupal_add_js(drupal_get_path('theme', 'seven') . '/js/mobile.install.js'); + drupal_add_css(drupal_get_path('theme', 'seven') . '/install-page.css'); } /** diff --git a/core/themes/seven/style-rtl.css b/core/themes/seven/style-rtl.css index f4097d9..c101235 100644 --- a/core/themes/seven/style-rtl.css +++ b/core/themes/seven/style-rtl.css @@ -126,15 +126,26 @@ body.in-maintenance #content { padding-left: 20px; padding-right: 0; } -ol.task-list { +/* Install theming */ +body.install-page #page { + padding: 0 0 1em 2em; +} +body.install-page #site-name { + background-position: top right; + margin: 0.25em 30px 0.25em 0; +} +.task-list { margin-right: 0; + padding-right: 0; } -ol.task-list li { +.task-list li { padding: 0.5em 20px 0.5em 1em; } -ol.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.active:after { + left: auto; + right: 100%; + border-left-color: transparent; + border-right-color: #ebeae4; } /* Overlay theming */ diff --git a/core/themes/seven/style.css b/core/themes/seven/style.css index 52db095..c448fee 100644 --- a/core/themes/seven/style.css +++ b/core/themes/seven/style.css @@ -920,7 +920,6 @@ body.in-maintenance #sidebar-first { } body.in-maintenance #content { float: right; /* LTR */ - max-width: 550px; clear: none; width: 72%; } @@ -959,41 +958,6 @@ body.in-maintenance #logo { width: auto; } } -ol.task-list { - margin-left: 0; /* LTR */ - list-style-type: none; - list-style-image: none; -} -ol.task-list li { - padding: 0.5em 1em 0.5em 20px; /* LTR */ - color: #adadad; -} -ol.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; -} -ol.task-list li.done { - background: transparent url(images/task-check.png) no-repeat 0 50%; - color: green; -} -body.in-maintenance #branding .step-indicator { - display: none; -} -@media all and (max-width: 768px) { - ol.task-list, - body.in-maintenance #logo { - display: none; - } - body.in-maintenance #branding h1 { - float: left; - width: auto; - } - body.in-maintenance #branding .step-indicator { - display: block; - float: right; - } -} /* Overlay theming */ .overlay #branding { @@ -1683,7 +1647,6 @@ details.fieldset-no-legend { } } - /** * Node form dropbuttons. */