Issue #2405445 by crazyrohila: Refactor book module CSS files inline with our CSS standards

core/modules/book/book.libraries.yml

@@ -12,9 +12,3 @@ navigation:
   css:
     theme:
       css/book.theme.css: {}
-
-admin:
-  version: VERSION
-  css:
-    theme:
-      css/book.admin.css: {}

core/modules/book/book.module

@@ -150,19 +150,17 @@ function book_form_node_form_alter(&$form, FormStateInterface $form_state, $form
   if ($access) {
     $collapsed = !($node->isNew() && !empty($node->book['pid']));
     $form = \Drupal::service('book.manager')->addFormElements($form, $form_state, $node, $account, $collapsed);
-    // Since the "Book" dropdown can't trigger a form submission when
-    // JavaScript is disabled, add a submit button to do that. book.admin.css hides
-    // this button when JavaScript is enabled.
+    // The "js-hide" class hides submit button when Javascript is enabled.
     $form['book']['pick-book'] = array(
       '#type' => 'submit',
       '#value' => t('Change book (update list of parents)'),
       '#submit' => array('book_pick_book_nojs_submit'),
       '#weight' => 20,
-      '#attached' => [
-        'library' => [
-          'book/admin',
-        ],
-      ],
+      '#attributes' => array(
+        'class' => array(
+          'js-hide',
+        ),
+      ),
     );
     $form['#entity_builders'][] = 'book_node_builder';
   }

core/modules/book/css/book.admin.css

@@ -1,11 +0,0 @@
-/**
- * @file
- * Administration styles for the Book module.
- */
-
-/**
- * Book outline on book edit form.
- */
-.js .book-outline-form .form-submit {
-  display: none;
-}

core/modules/book/css/book.theme.css

@@ -3,9 +3,6 @@
  * Styling for the Book module.
  */
 
-/**
- * Book navigation.
- */
 .book-navigation .menu {
   padding-bottom: 0;
   padding-top: 1em;
@@ -15,29 +12,29 @@
   overflow: auto;
   padding: 0.5em 0;
 }
-.book-pager li {
+.book-pager__item {
   display: inline-block;
   list-style-type: none;
   vertical-align: top;
 }
-.book-pager .previous {
+.book-pager__item--previous {
   text-align: left; /* LTR */
   width: 45%;
 }
-[dir="rtl"] .book-pager .previous {
+[dir="rtl"] .book-pager__item--previous {
   float: right;
   text-align: right;
 }
-.book-pager .up {
+.book-pager__item--center {
   text-align: center;
   width: 8%;
 }
-.book-pager .next {
+.book-pager__item--next {
   float: right; /* LTR */
   text-align: right; /* LTR */
   width: 45%;
 }
-[dir="rtl"] .book-pager .next {
+[dir="rtl"] .book-pager__item--next {
   float: left;
   text-align: left;
 }

core/themes/classy/templates/navigation/book-navigation.html.twig

@@ -35,17 +35,17 @@
       <h2 class="visually-hidden" id="book-label-{{ book_id }}">{{ 'Book traversal links for'|t }} {{ book_title }}</h2>
       <ul class="book-pager">
       {% if prev_url %}
-        <li class="previous">
+        <li class="book-pager__item book-pager__item--previous">
           <a href="{{ prev_url }}" rel="prev" title="{{ 'Go to previous page'|t }}"><b>{{ '‹'|t }}</b> {{ prev_title }}</a>
         </li>
       {% endif %}
       {% if parent_url %}
-        <li class="up">
+        <li class="book-pager__item book-pager__item--center">
           <a href="{{ parent_url }}" title="{{ 'Go to parent page'|t }}">{{ 'Up'|t }}</a>
         </li>
       {% endif %}
       {% if next_url %}
-        <li class="next">
+        <li class="book-pager__item book-pager__item--next">
           <a href="{{ next_url }}" rel="next" title="{{ 'Go to next page'|t }}">{{ next_title }} <b>{{ '›'|t }}</b></a>
         </li>
       {% endif %}