diff --git a/core/modules/system/css/system.admin.css b/core/modules/system/css/system.admin.css index a3ccd20..8d67eff 100644 --- a/core/modules/system/css/system.admin.css +++ b/core/modules/system/css/system.admin.css @@ -76,88 +76,90 @@ small .admin-link:after { /** * Modules page. */ -.system-modules thead > tr { +.extension thead > tr { border: 0; } -.system-modules div.incompatible { +.extension div.incompatible { font-weight: bold; } -.system-modules td.checkbox { +.extension td.checkbox { min-width: 25px; width: 4%; } -.system-modules td.module { +.extension td.module { width: 25%; } -.system-modules td { +.extension td { vertical-align: top; } -.system-modules label, +.extension label, .system-modules-uninstall label { color: #1d1d1d; font-size: 1.15em; } -.system-modules details { +.extension details { color: #5c5c5b; line-height: 20px; - overflow: hidden; /* truncates descriptions if too long */ - text-overflow: ellipsis; - white-space: nowrap; } -.system-modules details[open] { +.extension details[open] { height: auto; - overflow: visible; - white-space: normal; } -.system-modules details[open] summary .text { +.extension details[open] > summary .text { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; text-transform: none; } -.system-modules td details a { - color: #5C5C5B; +.extension details a { + color: #5c5c5b; border: 0px; } -.system-modules td details { +.extension details { border: 0; margin: 0; height: 20px; } -.system-modules td details summary { +.extension details > summary { padding: 0; text-transform: none; font-weight: normal; cursor: default; + overflow: hidden; /* truncates descriptions if too long */ + text-overflow: ellipsis; + white-space: nowrap; } -.system-modules td { +.extension details[open] > summary { + overflow: visible; + white-space: normal; +} +.extension td { padding-left: 0; /* LTR */ } -[dir="rtl"] .system-modules td { +[dir="rtl"] .extension td { padding-left: 12px; padding-right: 0; } @media screen and (max-width: 40em) { - .system-modules td.name { + .extension td.name { width: 20%; } - .system-modules td.description { + .extension td.description { width: 40%; } } -.system-modules .requirements { +.extension .requirements { padding: 5px 0; max-width: 490px; } -.system-modules .links { +.extension .links { overflow: hidden; /* prevents collapse */ } -.system-modules .checkbox { +.extension .checkbox { margin: 0 5px; } -.system-modules .checkbox .form-item { +.extension .checkbox .form-item { margin-bottom: 0; } .admin-requirements, @@ -287,6 +289,12 @@ small .admin-link:after { body:not(.toolbar-vertical) .system-themes-list-installed .system-themes-list__header { margin-top: 0; } + body:not(.toolbar-vertical) .system-themes-list-installed .theme-info { + margin-left: 320px; + } + [dir="rtl"] body:not(.toolbar-vertical) .system-themes-list-installed .theme-info { + margin-right: 320px; + } body:not(.toolbar-vertical) .system-themes-list-uninstalled .theme-selector { box-sizing: border-box; width: 31.25%; @@ -320,6 +328,12 @@ small .admin-link:after { .toolbar-vertical .system-themes-list-installed .theme-info__header { margin-top: 0; } + .toolbar-vertical .system-themes-list-installed .theme-info { + margin-left: 320px; + } + [dir="rtl"] .toolbar-vertical .system-themes-list-installed .theme-info { + margin-right: 320px; + } .toolbar-vertical .system-themes-list-uninstalled .theme-selector { box-sizing: border-box; width: 31.25%; @@ -334,9 +348,6 @@ small .admin-link:after { min-height: 170px; } } -.system-themes-list-installed .theme-info { - max-width: 940px; -} .theme-selector .incompatible { margin-top: 10px; diff --git a/core/modules/system/src/Form/ModulesListForm.php b/core/modules/system/src/Form/ModulesListForm.php index e86ba0a..010c0a7 100644 --- a/core/modules/system/src/Form/ModulesListForm.php +++ b/core/modules/system/src/Form/ModulesListForm.php @@ -185,6 +185,10 @@ public function buildForm(array $form, FormStateInterface $form_state) { // Lastly, sort all packages by title. uasort($form['modules'], array('\Drupal\Component\Utility\SortArray', 'sortByTitleProperty')); + $form['#attributes']['class'] = [ + 'extension', + 'extension--module', + ]; $form['#attached']['library'][] = 'system/drupal.system.modules'; $form['actions'] = array('#type' => 'actions'); $form['actions']['submit'] = array( diff --git a/core/modules/system/src/Tests/System/ThemeTest.php b/core/modules/system/src/Tests/System/ThemeTest.php index 557a05c..3209da3 100644 --- a/core/modules/system/src/Tests/System/ThemeTest.php +++ b/core/modules/system/src/Tests/System/ThemeTest.php @@ -363,7 +363,8 @@ function testInstallAndSetAsDefault() { $version = $themes['bartik']->info['version']; // Confirm Bartik is indicated as the default theme. - $this->assertTextPattern('/Bartik ' . preg_quote($version) . '\s{2,}\(default theme\)/'); + $this->assertTextPattern('/Bartik\s{2,}\(default theme\)/'); + $this->assertTextPattern('/Version: ' . preg_quote($version) . '/'); } } diff --git a/core/modules/system/system.admin.inc b/core/modules/system/system.admin.inc index efa1f5c..49c165b 100644 --- a/core/modules/system/system.admin.inc +++ b/core/modules/system/system.admin.inc @@ -341,6 +341,18 @@ function template_preprocess_system_themes_page(&$variables) { $groups = array(); $theme_groups = $variables['theme_groups']; $variables['attributes']['id'] = 'system-themes-page'; + $variables['attributes']['class'] = [ + 'extension', + 'extension--theme', + ]; + + // Build a list of theme names for all known themes + $theme_infos = []; + foreach ($variables['theme_group_titles'] as $state => $title) { + foreach ($theme_groups[$state] as $theme) { + $theme_infos[$theme->getName()] = $theme->info['name']; + } + } foreach ($variables['theme_group_titles'] as $state => $title) { if (!count($theme_groups[$state])) { @@ -377,12 +389,29 @@ function template_preprocess_system_themes_page(&$variables) { ); } + $version = isset($theme->info['version']) ? $theme->info['version'] : ''; + + $requires = []; + foreach (array_keys($theme->requires) as $key) { + $requires[$key] = isset($theme_infos[$key]) ? $theme_infos[$key] : $key; + } + + $required_by = []; + foreach (array_keys($theme->required_by) as $key) { + $required_by[$key] = isset($theme_infos[$key]) ? $theme_infos[$key] : $key; + } + + $current_theme['machine_name'] = $theme->getName(); + $current_theme['version'] = $version; + $current_theme['requires'] = $requires; + $current_theme['required_by'] = $required_by; + // Localize the theme description. $current_theme['description'] = t($theme->info['description']); $current_theme['attributes'] = new Attribute(); $current_theme['name'] = $theme->info['name']; - $current_theme['version'] = isset($theme->info['version']) ? $theme->info['version'] : ''; + $current_theme['version'] = $version; $current_theme['notes'] = $theme->notes; $current_theme['is_default'] = $theme->is_default; $current_theme['is_admin'] = $theme->is_admin; diff --git a/core/modules/system/templates/system-themes-page.html.twig b/core/modules/system/templates/system-themes-page.html.twig index 6e65d76..a72e95c 100644 --- a/core/modules/system/templates/system-themes-page.html.twig +++ b/core/modules/system/templates/system-themes-page.html.twig @@ -56,12 +56,29 @@ {% endif %}

- {{- theme.name }} {{ theme.version -}} + {{- theme.name -}} {% if theme.notes %} ({{ theme.notes|safe_join(', ') }}) {%- endif -%}

-
{{ theme.description }}
+
+ +
+
+
+
{{ 'Machine name: @module-machine-name'|t({'@module-machine-name': theme.machine_name}) }}
+ {% if theme.version %} +
{{ 'Version: @module-version'|t({'@module-version': theme.version}) }}
+ {% endif %} + {% if theme.requires %} +
{{ 'Requires: @module-list'|t({'@module-list': theme.requires|safe_join(', ')}) }}
+ {% endif %} + {% if theme.required_by %} +
{{ 'Required by: @module-list'|t({'@module-list': theme.required_by|safe_join(', ')}) }}
+ {% endif %} +
+
+
{# Display operation links if the theme is compatible. #} {% if theme.incompatible %}
{{ theme.incompatible }}
diff --git a/core/themes/seven/css/components/modules-page.css b/core/themes/seven/css/components/modules-page.css index bc9c1e5..cfe5deb 100644 --- a/core/themes/seven/css/components/modules-page.css +++ b/core/themes/seven/css/components/modules-page.css @@ -1,47 +1,48 @@ /* Modules page */ -.system-modules fieldset { +.extension fieldset { border: 0; border-top: 1px solid #ccc; } -.system-modules details { +.extension details { border: 0; margin: 0; padding: 0; } -.system-modules summary { +.extension summary { border-bottom: 1px solid #ccc; } -.system-modules [open] summary { +.system-themes-list summary, +.extension [open] summary { border-bottom: none; } -.system-modules .details-wrapper { +.extension .details-wrapper { padding: 0 0 0.5em 0; } -.system-modules .fieldset-wrapper { +.extension .fieldset-wrapper { padding: 0; } -.system-modules table, +.extension table, .locale-translation-status-form table { border: 0; } -.system-modules tr.even, -.system-modules tr.odd, +.extension tr.even, +.extension tr.odd, .locale-translation-status-form tr.even, .locale-translation-status-form tr.odd { background: #f3f4ee; border: 0; border-bottom: 10px solid #fff; } -.system-modules tr td:last-child, +.extension tr td:last-child, .locale-translation-status-form tr td:last-child { border: 0; } -.system-modules table th, +.extension table th, .locale-translation-status-form table th { border: 0; border-bottom: 10px solid #fff; } -.system-modules .sticky-header th, +.extension .sticky-header th, .locale-translation-status-form .sticky-header th { border: 0; }