Commit 728aad1d authored by webchick's avatar webchick

Issue #2169765 by philipz, Sutharsan, ckrina, c_lehel, LewisNyman: Redesign...

Issue #2169765 by philipz, Sutharsan, ckrina, c_lehel, LewisNyman: Redesign update.php to be more consistent with the installation process.
parent 021900be
...@@ -910,7 +910,6 @@ function install_display_output($output, $install_state) { ...@@ -910,7 +910,6 @@ function install_display_output($output, $install_state) {
'#theme' => 'task_list', '#theme' => 'task_list',
'#items' => install_tasks_to_display($install_state), '#items' => install_tasks_to_display($install_state),
'#active' => $active_task, '#active' => $active_task,
'#variant' => 'install',
); );
drupal_add_region_content('sidebar_first', drupal_render($task_list)); drupal_add_region_content('sidebar_first', drupal_render($task_list));
} }
......
...@@ -109,23 +109,16 @@ function _drupal_maintenance_theme() { ...@@ -109,23 +109,16 @@ function _drupal_maintenance_theme() {
* An associative array containing: * An associative array containing:
* - items: An associative array of maintenance tasks. * - items: An associative array of maintenance tasks.
* - active: The key for the currently active maintenance task. * - active: The key for the currently active maintenance task.
* - variant: A variant name to be used for a CSS class.
* *
* @ingroup themeable * @ingroup themeable
*/ */
function theme_task_list($variables) { function theme_task_list($variables) {
$items = $variables['items']; $items = $variables['items'];
$active = $variables['active']; $active = $variables['active'];
if (isset($variables['variant'])) {
$class = $variables['variant'] . '-task-list';
}
else {
$class = 'task-list';
}
$done = isset($items[$active]) || $active == NULL; $done = isset($items[$active]) || $active == NULL;
$output = '<h2 class="visually-hidden">Installation tasks</h2>'; $output = '<h2 class="visually-hidden">Installation tasks</h2>';
$output .= '<ol class="' . $class . '">'; $output .= '<ol class="task-list">';
foreach ($items as $k => $item) { foreach ($items as $k => $item) {
if ($active == $k) { if ($active == $k) {
......
...@@ -258,7 +258,7 @@ public static function strlen($text) { ...@@ -258,7 +258,7 @@ public static function strlen($text) {
} }
/** /**
* Uppercase a UTF-8 string. * Converts a UTF-8 string to uppercase.
* *
* @param string $text * @param string $text
* The string to run the operation on. * The string to run the operation on.
...@@ -280,7 +280,7 @@ public static function strtoupper($text) { ...@@ -280,7 +280,7 @@ public static function strtoupper($text) {
} }
/** /**
* Lowercase a UTF-8 string. * Converts a UTF-8 string to lowercase.
* *
* @param string $text * @param string $text
* The string to run the operation on. * The string to run the operation on.
...@@ -302,18 +302,52 @@ public static function strtolower($text) { ...@@ -302,18 +302,52 @@ public static function strtolower($text) {
} }
/** /**
* Capitalizes the first letter of a UTF-8 string. * Capitalizes the first character of a UTF-8 string.
* *
* @param string $text * @param string $text
* The string to convert. * The string to convert.
* *
* @return string * @return string
* The string with the first letter as uppercase. * The string with the first character as uppercase.
*/ */
public static function ucfirst($text) { public static function ucfirst($text) {
return static::strtoupper(static::substr($text, 0, 1)) . static::substr($text, 1); return static::strtoupper(static::substr($text, 0, 1)) . static::substr($text, 1);
} }
/**
* Converts the first character of a UTF-8 string to lowercase.
*
* @param string $text
* The string that will be converted.
*
* @return string
* The string with the first character as lowercase.
*
* @ingroup php_wrappers
*/
public static function lcfirst($text) {
// Note: no mbstring equivalent!
return static::strtolower(static::substr($text, 0, 1)) . static::substr($text, 1);
}
/**
* Capitalizes the first character of each word in a UTF-8 string.
*
* @param string $text
* The text that will be converted.
*
* @return string
* The input $text with each word capitalized.
*
* @ingroup php_wrappers
*/
public static function ucwords($text) {
$regex = '/(^|[' . static::PREG_CLASS_WORD_BOUNDARY . '])([^' . static::PREG_CLASS_WORD_BOUNDARY . '])/u';
return preg_replace_callback($regex, function(array $matches) {
return $matches[1] . Unicode::strtoupper($matches[2]);
}, $text);
}
/** /**
* Cuts off a piece of a string based on character indices and counts. * Cuts off a piece of a string based on character indices and counts.
* *
......
...@@ -263,14 +263,9 @@ protected function caseTransform($string, $option) { ...@@ -263,14 +263,9 @@ protected function caseTransform($string, $option) {
case 'lower': case 'lower':
return drupal_strtolower($string); return drupal_strtolower($string);
case 'ucfirst': case 'ucfirst':
return drupal_strtoupper(drupal_substr($string, 0, 1)) . drupal_substr($string, 1); return Unicode::ucfirst($string);
case 'ucwords': case 'ucwords':
if (Unicode::getStatus() == Unicode::STATUS_MULTIBYTE) { return Unicode::ucwords($string);
return mb_convert_case($string, MB_CASE_TITLE);
}
else {
return ucwords($string);
}
} }
} }
......
...@@ -193,6 +193,70 @@ public function providerUcfirst() { ...@@ -193,6 +193,70 @@ public function providerUcfirst() {
); );
} }
/**
* Tests Unicode::lcfirst().
*
* @dataProvider providerLcfirst
*/
public function testLcfirst($text, $expected, $multibyte = FALSE) {
$status = $multibyte ? Unicode::STATUS_MULTIBYTE : Unicode::STATUS_SINGLEBYTE;
Unicode::setStatus($status);
$this->assertEquals($expected, Unicode::lcfirst($text));
}
/**
* Data provider for testLcfirst().
*
* @see testLcfirst()
*
* @return array
* An array containing a string, its lowercase version and whether it should
* be processed as multibyte.
*/
public function providerLcfirst() {
return array(
array('tHe QUIcK bRoWn', 'tHe QUIcK bRoWn'),
array('FrançAIS is ÜBER-åwesome', 'françAIS is ÜBER-åwesome'),
array('Über', 'über'),
array('Åwesome', 'åwesome'),
// Add a multibyte string.
array('ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΣὨ', 'αΒΓΔΕΖΗΘΙΚΛΜΝΞΟΣὨ', TRUE),
);
}
/**
* Tests Unicode::ucwords().
*
* @dataProvider providerUcwords
*/
public function testUcwords($text, $expected, $multibyte = FALSE) {
$status = $multibyte ? Unicode::STATUS_MULTIBYTE : Unicode::STATUS_SINGLEBYTE;
Unicode::setStatus($status);
$this->assertEquals($expected, Unicode::ucwords($text));
}
/**
* Data provider for testUcwords().
*
* @see testUcwords()
*
* @return array
* An array containing a string, its capitalized version and whether it should
* be processed as multibyte.
*/
public function providerUcwords() {
return array(
array('tHe QUIcK bRoWn', 'THe QUIcK BRoWn'),
array('françAIS', 'FrançAIS'),
array('über', 'Über'),
array('åwesome', 'Åwesome'),
// Make sure we don't mangle extra spaces.
array('frànçAIS is über-åwesome', 'FrànçAIS Is Über-Åwesome'),
// Add a multibyte string.
array('σion', 'Σion', TRUE),
);
}
/** /**
* Tests Unicode::strlen(). * Tests Unicode::strlen().
* *
......
...@@ -23,171 +23,6 @@ ...@@ -23,171 +23,6 @@
background-position: left top, 50% 50%; background-position: left top, 50% 50%;
min-height: 100%; 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 * Password widget
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
} }
function installStepsSetup () { function installStepsSetup () {
var steps = document.querySelectorAll('.install-task-list li'); var steps = document.querySelectorAll('.task-list li');
if (steps.length) { if (steps.length) {
var header = document.querySelector('header[role="banner"]'); var header = document.querySelector('header[role="banner"]');
var stepIndicator = document.createElement('div'); var stepIndicator = document.createElement('div');
......
/**
* @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;
}
}
...@@ -116,6 +116,7 @@ ul { ...@@ -116,6 +116,7 @@ ul {
ol { ol {
list-style-type: decimal; list-style-type: decimal;
margin: 0.25em 0 0.25em 2em; /* LTR */ margin: 0.25em 0 0.25em 2em; /* LTR */
padding: 0;
} }
[dir="rtl"] ol { [dir="rtl"] ol {
margin: 0.25em 2em 0.25em 0; margin: 0.25em 2em 0.25em 0;
......
maintenance-page:
version: VERSION
js:
js/mobile.install.js: {}
css:
theme: