Redesign update.php to be more consistent with the installation process

Yeah, specifically I thought the task completion-related design could really stand to be unified. I agree we don't need to be as "POW!" about it since this is ultimately a maintenance task, but it's really weird to have two very different designs for tracking "you're at step 1 of N." Also weird to see Druplicon in one and not the other.

The installation design feels about 'loud' for update.php but we could have a tweaked version that's a little calmer.

So something in this direction?

Ooooh! Maybe! That looks really nice. Ideally, whatever we did here would apply to all maintenance pages. It makes sense to one-off the installer, but not sure about update vs. 'site down' vs. 'omg something happened' :)

Possibly related #1189822: Convert maintenance-page.html.twig to HTML5

Starting to work on that.

Changes done:
- Updated template maintenance-page.html.twig to follow markup from install-page.html.twig.
- Updated seven/style.css with styles from install-page.css
- Updated file update.php to use "button--primary" class instead "button-primary" for the input.

Not sure if the
element should be the {{ title }} or the {{ site_name }}. The #7 patch is made with the {{ site_name }} because on some steps the title changes to "home". See attached file update_php-redesign-2169765-7B-firefox.png.

Moved the title of the page to the header like in design.

It looks really good! Two small things I would change:
1. Move and indent {{ page_top }} - see interdiff.txt.
2. Consider min-height for l-container. After jumping from first page to "No updates..." the window jumps suddenly and becomes small and still centered vertically. This looks bad IMO. It should be as high as first step.

I'm starting to work on it.

1. Moved most of css from install-page.css to new maintenance-page.css.
2. Task list styles are shared although I haven't changed install-task-list class to task-list. This could be a follow up if decided so.
3. maintenance-page.html.twig is almost identical to install-page.html.twig. We could even make them one twig template in follow up. Same goes with install-page.css which could be merged into maintenance-page.css.
4. Layout classes are shared now in maintenance-page.css.
5. Removed some unused styles for #page and #content from install-page.css.
6. Prettier maintenance background with gradient and noise like install page but gray.

All good catches :) I have most of them fixed now and patch is coming soon.

Fixed:

1. The background is darker now so the noise is down but I liked lighter background better
2. Primary button fixed, it got left out from #13
3. ol identation fixed.
4. Mobile bottom padding added
5. Steps in mobile working the same as install page now
6. install-task-list class removed both from css and theme function. Moreover I've changed the variant (if defined at any point in future) to task-list--[variant] in theme function.

I expect some failing tests now but lets see what happens :)

In attached patch:

• task-list--variant functionality is gone
• maintanance background is lighter and noise is removed again.

1. Regarding cheerfulness: I think the lighter background improves that a lot. I like the rounded corners but most of all it's just consistent with the install page which is important too. Why do you feel they don't make much sense here? If you think they should be removed in update I guess the same goes for install page.
2. The blue colors in heading or button make it look better I think and I think some blue color is needed here anyway - it's Drupal:)
3. If any background color change should indicate success I say it would be green. First because It's the success color but also I think this page should never look like install page anyway

A quick mockup of green background makes me sure it's a bad idea :)

update_php-redesign-2169765-23.patch no longer applies.

error: patch failed: core/themes/seven/seven.theme:15
error: core/themes/seven/seven.theme: patch does not apply

Patch #23 rerolled.

seven_library_info() got replaced by seven.libraries.yml in #1996238: Replace hook_library_info() by *.libraries.yml file.
Someone with inside knowledge should check if the replaced if the changes in seven_library_info() are fully replaced by the configuration in seven.libraries.yml.

Patch #23

diff --git a/core/themes/seven/seven.theme b/core/themes/seven/seven.theme
index 409632b..b3dbb06 100644
--- a/core/themes/seven/seven.theme
+++ b/core/themes/seven/seven.theme
@@ -15,6 +15,14 @@ function seven_library_info() {
   $path = drupal_get_path('theme', 'seven');
 
   $libraries['install-page'] = array(
+    'css' => array(
+      $path . '/install-page.css' => array(
+        'group' => CSS_AGGREGATE_THEME,
+      ),
+    ),
+  );
+
+  $libraries['maintenance-page'] = array(
     'version' => \Drupal::VERSION,
     'js' => array(
       $path . '/js/mobile.install.js' => array(
@@ -22,7 +30,7 @@ function seven_library_info() {
       ),
     ),
     'css' => array(
-      $path . '/install-page.css' => array(
+      $path . '/maintenance-page.css' => array(
         'group' => CSS_AGGREGATE_THEME,
       ),
     ),

seven.libraries.yml

install-page:
  version: VERSION
  js:
    js/mobile.install.js: {}
  css:
    theme:
      install-page.css: {}
  dependencies:
    - system/maintenance

drupal.nav-tabs:
  version: VERSION
  js:
    js/nav-tabs.js: {}
  dependencies:
    - core/matchmedia
    - core/jquery
    - core/drupal
    - core/jquery.once
    - core/jquery.intrinsic

Again, reroll of #23 patch.

Nice re-roll! I didn't know about libraries.yml but I love it :) This requires adding maintenance section to libraries.yml I guess... I hope it is ok like this.
Other than that still looks good.

update_php-redesign-2169765-31.patch no longer applies.

error: patch failed: core/update.php:210
error: core/update.php: patch does not apply

Rerolled #31 patch

34: update_php-redesign-2169765-34.patch queued for re-testing.

Rerolled.

I couldn't apply the patch. there were errors while apply the part with the seven.theme file

I thought you assigned for re-roll :) I'll do it today then.

38: update_php-redesign-2169765-37.patch queued for re-testing.

Ready to review again.

44: update_php-redesign-2169765-44.patch queued for re-testing.

Install:

Update:

Even the "responsive-y" stuff works!

Awesome work! :D

Committed and pushed to 8.x. Woot!

#70719: Add Unicode::ucwords() and Unicode::lcfirst() implementation and make use of them in core got accidentally committed here too by the looks of it.

Suggest rolling this back and recommitting them separately?

The site slogan seems to have been missed during this redesign.

Change status.

Opened follow-up at #2230997: Remove the slogan in install.php and update.php. With the different commits and reverts this one is getting messy.