Plan for removing dependency to Stable in Bartik/Seven/Claro/Umami

@@ -41,8 +41,8 @@
   height: auto;
   margin: 0;
   padding: 0;
-  background-color: transparent;
   /* Use lighter drag icon against dark background. */
+  background-color: transparent;
   background-image: url(../../../images/core/icons/bebebe/move.svg);
   background-repeat: no-repeat;
   background-position: center;

@@ -79,7 +79,7 @@
   right: 0;
   left: 0;
 }
-/* .toolbar-loading is required by Toolbar JavaScript to pre-render markup
+/* .toolbar-loading is required by toolbar JavaScript to pre-render markup
  * style to avoid extra reflow & flicker. */
 @media (min-width: 61em) {
   .toolbar-loading.toolbar-horizontal .toolbar .toolbar-bar .toolbar-tab:last-child .toolbar-tray {

@@ -5,7 +5,7 @@
 
 .container-inline div,
 .container-inline label {
-  display: inline;
+  display: inline-block;
 }
 /* Details contents always need to be rendered as block. */
 .container-inline .details-wrapper {

@@ -20,7 +20,7 @@
   width: 3%;
   min-width: 3%;
   max-width: 100%;
-  height: 1.5em;
+  height: 16px;
   background-color: #000;
 }
 .progress__description,

@@ -11,10 +11,12 @@
 }
 .system-status-counter__status-icon:before {
   display: block;
+  width: 100%;
+  height: 100%;
   content: "";
   background-repeat: no-repeat;
   background-position: center 2px;
-  background-size: 20px;
+  background-size: 16px;
 }
 
 .system-status-counter__status-icon--error:before {

@@ -8,9 +8,3 @@
   float: none;
   margin: unset;
 }
-
-/* Undo margin added to figure in core/assets/vendor/normalize-css/normalize.css */
-figure.caption-drupal-media.align-center {
-  margin-right: auto;
-  margin-left: auto;
-}

@@ -40,3 +40,7 @@
 .block-form .form-item-settings-admin-label label:after {
   content: ":";
 }
+.block-disabled:not(:hover) {
+  opacity: 0.675;
+  background: #fcfcfa;
+}

@@ -25,18 +25,18 @@
     {% if type == 'error' %}
       <div role="alert">
     {% endif %}
-      {% if status_headings[type] %}
-        <h2 class="visually-hidden">{{ status_headings[type] }}</h2>
-      {% endif %}
-      {% if messages|length > 1 %}
-        <ul>
-          {% for message in messages %}
-            <li>{{ message }}</li>
-          {% endfor %}
-        </ul>
-      {% else %}
-        {{ messages|first }}
-      {% endif %}
+    {% if status_headings[type] %}
+      <h2 class="visually-hidden">{{ status_headings[type] }}</h2>
+    {% endif %}
+    {% if messages|length > 1 %}
+      <ul>
+        {% for message in messages %}
+          <li>{{ message }}</li>
+        {% endfor %}
+      </ul>
+    {% else %}
+      {{ messages|first }}
+    {% endif %}
     {% if type == 'error' %}
       </div>
     {% endif %}

@@ -28,4 +28,8 @@
     {{ errors }}
   </div>
 {% endif %}
-{{ description }}
+{% if description %}
+  <div{{ description_attributes }}>
+    {{ description }}
+  </div>
+{% endif %}

@@ -4,18 +4,19 @@
  * Theme override for a fieldset element and its children.
  *
  * Available variables:
- * - attributes: HTML attributes for the fieldset element.
- * - errors: (optional) Any errors for this fieldset element, may not be set.
- * - required: Boolean indicating whether the fieldeset element is required.
- * - legend: The legend element containing the following properties:
- *   - title: Title of the fieldset, intended for use as the text of the legend.
- *   - attributes: HTML attributes to apply to the legend.
+ * - attributes: HTML attributes for the <fieldset> element.
+ * - errors: (optional) Any errors for this <fieldset> element, may not be set.
+ * - required: Boolean indicating whether the <fieldeset> element is required.
+ * - legend: The <legend> element containing the following properties:
+ *   - title: Title of the <fieldset>, intended for use as the text
+       of the <legend>.
+ *   - attributes: HTML attributes to apply to the <legend> element.
  * - description: The description element containing the following properties:
- *   - content: The description content of the fieldset.
+ *   - content: The description content of the <fieldset>.
  *   - attributes: HTML attributes to apply to the description container.
- * - children: The rendered child elements of the fieldset.
- * - prefix: The content to add before the fieldset children.
- * - suffix: The content to add after the fieldset children.
+ * - children: The rendered child elements of the <fieldset>.
+ * - prefix: The content to add before the <fieldset> children.
+ * - suffix: The content to add after the <fieldset> children.
  *
  * @see template_preprocess_fieldset()
  */
@@ -36,7 +37,7 @@
       required ? 'form-required',
     ]
   %}
-  {#  Always wrap fieldset legends in a SPAN for CSS positioning. #}
+  {#  Always wrap fieldset legends in a <span> for CSS positioning. #}
   <legend{{ legend.attributes }}>
     <span{{ legend_span.attributes.addClass(legend_span_classes) }}>{{ legend.title }}</span>
   </legend>

@@ -5,7 +5,7 @@
  *
  * Available variables
  * - wrapper_attributes: A list of HTML attributes for the wrapper element.
- * - attributes: A list of HTML attributes for the textarea element.
+ * - attributes: A list of HTML attributes for the <textarea> element.
  * - resizable: An indicator for whether the textarea is resizable.
  * - required: An indicator for whether the textarea is required.
  * - value: The textarea content.

@@ -8,6 +8,7 @@
  * Available variables:
  * - forums: The forums to display (as processed by forum-list.html.twig).
  * - topics: The topics to display.
+ * - topics_original: Original topics data before modification.
  * - topics_pager: The topics pager.
  * - forums_defined: A flag to indicate that the forums are configured.
  *

@@ -26,7 +26,7 @@
 
     <main role="main">
       {% if title %}
-        <h1>{{ title }}</h1>
+        <h2>{{ title }}</h2>
       {% endif %}
       {{ page.highlighted }}
       {{ page.content }}

@@ -26,10 +26,10 @@
 <!DOCTYPE html>
 <html{{ html_attributes }}>
   <head>
-    <head-placeholder token="{{ placeholder_token|raw }}">
+    <head-placeholder token="{{ placeholder_token }}">
     <title>{{ head_title|safe_join(' | ') }}</title>
-    <css-placeholder token="{{ placeholder_token|raw }}">
-    <js-placeholder token="{{ placeholder_token|raw }}">
+    <css-placeholder token="{{ placeholder_token }}">
+    <js-placeholder token="{{ placeholder_token }}">
   </head>
   <body{{ attributes }}>
     {#
@@ -42,6 +42,6 @@
     {{ page_top }}
     {{ page }}
     {{ page_bottom }}
-    <js-bottom-placeholder token="{{ placeholder_token|raw }}">
+    <js-bottom-placeholder token="{{ placeholder_token }}">
   </body>
 </html>

@@ -5,7 +5,7 @@
  *
  * Available variables:
  * - content: The content for this region, typically blocks.
- * - attributes: HTML attributes for the region div.
+ * - attributes: HTML attributes for the region <div>.
  * - region: The name of the region variable as defined in the theme's
  *   .info.yml file.
  *

@@ -1,22 +1,22 @@
 {#
 /**
-* @file
-* Theme override for a language negotiation configuration form.
-*
-* Available variables:
-* - language_types: A list of language negotiation types. Each language type
-*   contains the following:
-*   - type: The machine name for the negotiation type.
-*   - title: The language negotiation type name.
-*   - description: A description for how the language negotiation type operates.
-*   - configurable: A radio element to toggle the table.
-*   - table: A draggable table for the language detection methods of this type.
-*   - children: Remaining form items for the group.
-*   - attributes: A list of HTML attributes for the wrapper element.
-* - children: Remaining form items for all groups.
-*
-* @see template_preprocess_language_negotiation_configure_form()
-*/
+ * @file
+ * Theme override for a language negotiation configuration form.
+ *
+ * Available variables:
+ * - language_types: A list of language negotiation types. Each language type
+ *   contains the following:
+ *   - type: The machine name for the negotiation type.
+ *   - title: The language negotiation type name.
+ *   - description: A description for how the language negotiation type operates.
+ *   - configurable: A radio element to toggle the table.
+ *   - table: A draggable table for the language detection methods of this type.
+ *   - children: Remaining form items for the group.
+ *   - attributes: A list of HTML attributes for the wrapper element.
+ * - children: Remaining form items for all groups.
+ *
+ * @see template_preprocess_language_negotiation_configure_form()
+ */
 #}
 {% for language_type in language_types %}
   {%

@@ -21,7 +21,7 @@
 #}
 {{ form.filters }}
 
-<table class="responsive-enabled" data-striping="1">
+<table class="responsive-enabled">
   <thead>
     <tr>
       <th>{{ 'Uninstall'|t }}</th>

@@ -5,8 +5,8 @@
  *
  * This template will be used when a system config form specifies 'config_form'
  * as its #theme callback.  Otherwise, by default, system config forms will be
- * themed by form.html.twig. This does not alter the appearance of a form at all,
- * but is provided as a convenience for themers.
+ * themed by form.html.twig. This does not alter the appearance of a form at
+ * all, but is provided as a convenience for themers.
  *
  * Available variables:
  * - form: The confirm form.

@@ -12,7 +12,7 @@
  *     https://www.drupal.org/node/893530 and
  *     http://api.drupal.org/api/drupal/includes!theme.inc/function/theme_table/7#comment-5109.
  * - header: Table header cells. Each cell contains the following properties:
- *   - tag: The HTML tag name to use; either 'th' or 'td'.
+ *   - tag: The HTML tag name to use; either TH or TD.
  *   - attributes: HTML attributes to apply to the tag.
  *   - content: A localized string for the title of the column.
  *   - field: Field name (required for column sorting).

@@ -11,5 +11,6 @@
  * @ingroup themable
  */
 #}
-{{ amount }} {{ text }}
+<span class="system-status-counter__status-icon system-status-counter__status-icon--{{ severity }}"></span>
+<span>{{ amount }} {{ text }}</span>
 <a href="#{{ severity }}"><span class="visually-hidden">{{ text }} </span>Details</a>

@@ -27,7 +27,7 @@
     {% for row in rows %}
       <tr{{ row.attributes }}>
         <td class="views-ui-view-name">
-          <h3 data-drupal-selector="views-table-filter-text-source">{{ row.data.view_name.data }}</h3>
+          <strong data-drupal-selector="views-table-filter-text-source">{{ row.data.view_name.data }}</strong>
         </td>
         <td class="views-ui-view-machine-name" data-drupal-selector="views-table-filter-text-source">
           {{ row.data.machine_name.data }}

@@ -22,7 +22,7 @@
  * @see template_preprocess_system_modules_details()
  */
 #}
-<table class="responsive-enabled" data-striping="1">
+<table class="responsive-enabled">
   <thead>
     <tr>
       <th class="checkbox visually-hidden">{{ 'Installed'|t }}</th>

@@ -2,38 +2,38 @@
 /**
  * @file
  * Theme override for the status report.
- *
- * Available variables:
- * - requirements: Contains multiple requirement instances.
- *   Each requirement contains:
- *   - title: The title of the requirement.
- *   - value: (optional) The requirement's status.
- *   - description: (optional) The requirement's description.
- *   - severity_title: The title of the severity.
- *   - severity_status: Indicates the severity status.
- *
- * @see template_preprocess_status_report()
- */
-#}
-<table class="system-status-report">
-  <tbody>
-  {% for requirement in requirements %}
-    <tr class="system-status-report__entry system-status-report__entry--{{ requirement.severity_status }} color-{{ requirement.severity_status }}">
-      {% if requirement.severity_status in ['warning', 'error'] %}
-        <th class="system-status-report__status-title system-status-report__status-icon system-status-report__status-icon--{{ requirement.severity_status }}">
+  *
+  * Available variables:
+  * - grouped_requirements: Contains grouped requirements.
+  *   Each group contains:
+  *   - title: The title of the group.
+  *   - type: The severity of the group.
+  *   - items: The requirement instances.
+  *     Each requirement item contains:
+  *     - title: The title of the requirement.
+  *     - value: (optional) The requirement's status.
+  *     - description: (optional) The requirement's description.
+  *     - severity_title: The title of the severity.
+  *     - severity_status: Indicates the severity status.
+  * - requirements: Ungrouped requirements
+  *
+  * @ingroup themeable
+  */
+ #}
+{% for group in grouped_requirements %}
+  <h3 id="{{ group.type }}">{{ group.title }}</h3>
+  {% for requirement in group.items %}
+    <details>
+      <summary role="button">
+        {% if requirement.severity_title  %}
           <span class="visually-hidden">{{ requirement.severity_title }}</span>
-      {% else %}
-        <th class="system-status-report__status-title">
-      {% endif %}
-        {{ requirement.title }}
-      </th>
-      <td>
-        {{ requirement.value }}
-        {% if requirement.description %}
-          <div class="description">{{ requirement.description }}</div>
         {% endif %}
-      </td>
-    </tr>
+        {{ requirement.title }}
+      </summary>
+      {{ requirement.value }}
+      {% if requirement.description %}
+        <div>{{ requirement.description }}</div>
+      {% endif %}
+    </details>
   {% endfor %}
-  </tbody>
-</table>
+{% endfor %}

@@ -27,7 +27,7 @@
  * - title: Comment title, linked to the comment.
  * - attributes: HTML attributes for the containing element.
  *   The attributes.class may contain one or more of the following classes:
- *   - comment: The current template type; e.g., 'theming hook'.
+ *   - comment: The current template type; for instance, 'theming hook'.
  *   - by-anonymous: Comment by an unregistered user.
  *   - by-{entity-type}-author: Comment by the author of the parent entity,
  *     eg. by-node-author.

@@ -15,7 +15,7 @@
  *   Calling other methods, such as node.delete(), will result in an exception.
  *   See \Drupal\node\Entity\Node for a full list of public properties and
  *   methods for the node object.
- * - label: The title of the node.
+ * - label: (optional) The title of the node.
  * - content: All node items. Use {{ content }} to print them all,
  *   or print a subset such as {{ content.field_example }}. Use
  *   {{ content|without('field_example') }} to temporarily suppress the printing
@@ -23,8 +23,8 @@
  * - author_picture: The node author user entity, rendered using the "compact"
  *   view mode.
  * - metadata: Metadata for this node.
- * - date: Themed creation date field.
- * - author_name: Themed author name field.
+ * - date: (optional) Themed creation date field.
+ * - author_name: (optional) Themed author name field.
  * - url: Direct URL of the current node.
  * - display_submitted: Whether submission information should be displayed.
  * - attributes: HTML attributes for the containing element.
@@ -73,7 +73,7 @@
 <article{{ attributes }}>
 
   {{ title_prefix }}
-  {% if not page %}
+  {% if label and not page %}
     <h2{{ title_attributes }}>
       <a href="{{ url }}" rel="bookmark">{{ label }}</a>
     </h2>

@@ -1,20 +1,37 @@
 {#
 /**
  * @file
- * Theme override to display a media item.
+ * Theme override to present a media item.
  *
  * Available variables:
- * - name: Name of the media.
+ * - media: The media item, with limited access to object properties and
+ *   methods. Only method names starting with "get", "has", or "is" and
+ *   a few common methods such as "id", "label", and "bundle" are available.
+ *   For example:
+ *   - entity.getEntityTypeId() will return the entity type ID.
+ *   - entity.hasField('field_example') returns TRUE if the entity includes
+ *     field_example. (This does not indicate the presence of a value in this
+ *     field.)
+ *   Calling other methods, such as entity.delete(), will result in
+ *   an exception.
+ *   See \Drupal\Core\Entity\EntityInterface for a full list of methods.
+ * - name: Name of the media item.
  * - content: Media content.
+ * - title_prefix: Additional output populated by modules, intended to be
+ *   displayed in front of the main title tag that appears in the template.
+ * - title_suffix: Additional output populated by modules, intended to be
+ *   displayed after the main title tag that appears in the template.
+ * - view_mode: View mode; for example, "teaser" or "full".
+ * - attributes: HTML attributes for the containing element.
+ * - title_attributes: Same as attributes, except applied to the main title
+ *   tag that appears in the template.
  *
  * @see template_preprocess_media()
  *
  * @ingroup themeable
  */
 #}
-<article{{ attributes }}>
+<div{{ attributes }}>
   {{ title_suffix.contextual_links }}
-  {% if content %}
-    {{ content }}
-  {% endif %}
-</article>
+  {{ content }}
+</div>

@@ -9,7 +9,10 @@
  * - file_size: The size of the file.
  *
  * @see template_preprocess_file_link()
- * @see stable_preprocess_image_widget()
  */
 #}
 <span{{ attributes }}>{{ link }}</span>
+{% if file_size %}
+  {# @todo remove class before Drupal 9.0.0 #}
+  <span class="file-size">({{ file_size }})</span>
+{% endif %}

@@ -11,7 +11,7 @@
  * @see template_preprocess_views_view_opml()
  */
 #}
-<?xml version="1.0" encoding="utf-8"?>
+<?xml version="1.0" encoding="utf-8" ?>
 <opml version="2.0">
   <head>
     <title>{{ title }}</title>

@@ -15,7 +15,7 @@
  * @see template_preprocess_views_view_rss()
  */
 #}
-<?xml version="1.0" encoding="utf-8"?>
+<?xml version="1.0" encoding="utf-8" ?>
 <rss version="2.0" xml:base="{{ link }}"{{ namespaces }}>
   <channel>
     <title>{{ title }}</title>