From eed1c99c51b40db48754c3fa14f44da48fb2c8c5 Mon Sep 17 00:00:00 2001
From: Alex Pott <alex.a.pott@googlemail.com>
Date: Tue, 2 Jun 2015 17:09:42 +0100
Subject: [PATCH] Issue #2485375 by marieke_h, Manjit.Singh, MathieuSpil,
 LewisNyman, geertvd: Clean up shortcut CSS inline with our CSS standards

---
 core/modules/shortcut/css/shortcut.icons.theme.css | 14 +++++++-------
 core/modules/shortcut/css/shortcut.theme.css       | 12 ++++++------
 core/modules/shortcut/shortcut.module              | 10 +++++++---
 .../shortcut/src/Tests/ShortcutLinksTest.php       | 14 +++++++-------
 core/themes/bartik/css/components/shortcut.css     |  2 +-
 core/themes/bartik/css/print.css                   |  2 +-
 6 files changed, 29 insertions(+), 25 deletions(-)

diff --git a/core/modules/shortcut/css/shortcut.icons.theme.css b/core/modules/shortcut/css/shortcut.icons.theme.css
index 54569c2e48d1..99812fdc2280 100644
--- a/core/modules/shortcut/css/shortcut.icons.theme.css
+++ b/core/modules/shortcut/css/shortcut.icons.theme.css
@@ -17,24 +17,24 @@
 /**
  * Add/remove links.
  */
-.add-or-remove-shortcuts .icon {
+.shortcut-action__icon {
   background: transparent url(../images/favstar.svg) no-repeat left top;
   width: 20px;
   height: 20px;
   display: inline-block;
   vertical-align: -2px;
 }
-[dir="rtl"] .add-or-remove-shortcuts .icon {
+[dir="rtl"] .shortcut-action__icon {
   background-image: url(../images/favstar-rtl.svg);
 }
-.add-shortcut a:hover .icon,
-.add-shortcut a:focus .icon {
+.shortcut-action--add:hover .shortcut-action__icon,
+.shortcut-action--add:focus .shortcut-action__icon {
   background-position: -20px top;
 }
-.remove-shortcut .icon {
+.shortcut-action--remove .shortcut-action__icon {
   background-position: -40px top;
 }
-.remove-shortcut a:focus .icon,
-.remove-shortcut a:hover .icon {
+.shortcut-action--remove:focus .shortcut-action__icon,
+.shortcut-action--remove:hover .shortcut-action__icon {
   background-position: -60px top;
 }
diff --git a/core/modules/shortcut/css/shortcut.theme.css b/core/modules/shortcut/css/shortcut.theme.css
index 5b22f828b9a4..73d58c6d4652 100644
--- a/core/modules/shortcut/css/shortcut.theme.css
+++ b/core/modules/shortcut/css/shortcut.theme.css
@@ -23,15 +23,15 @@
 /**
  * Add/remove links.
  */
-.add-or-remove-shortcuts {
+.shortcut-action {
   display: inline-block;
   margin-left: 0.3em; /* LTR */
 }
-[dir="rtl"] .add-or-remove-shortcuts {
+[dir="rtl"] .shortcut-action {
   margin-left: 0;
   margin-right: 0.3em;
 }
-.add-or-remove-shortcuts .text {
+.shortcut-action__message {
   background: #000000;
   background: rgba(0, 0, 0, 0.5);
   border-radius: 5px;
@@ -49,12 +49,12 @@
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
 }
-[dir="rtl"] .add-or-remove-shortcuts .text {
+[dir="rtl"] .shortcut-action__message {
   margin-left: 0;
   margin-right: 0.3em;
 }
-.add-or-remove-shortcuts a:hover .text,
-.add-or-remove-shortcuts a:focus .text {
+.shortcut-action:hover .shortcut-action__message,
+.shortcut-action:focus .shortcut-action__message {
   opacity: 1;
   -ms-transform: translateY(-2px);
   -webkit-transform: translateY(-2px);
diff --git a/core/modules/shortcut/shortcut.module b/core/modules/shortcut/shortcut.module
index ccca313101d9..1d5c2753977d 100644
--- a/core/modules/shortcut/shortcut.module
+++ b/core/modules/shortcut/shortcut.module
@@ -347,12 +347,16 @@ function shortcut_preprocess_page(&$variables) {
             'shortcut/drupal.shortcut',
           ),
         ),
-        '#prefix' => '<div class="add-or-remove-shortcuts ' . $link_mode . '-shortcut">',
         '#type' => 'link',
-        '#title' => SafeMarkup::format('<span class="icon"></span><span class="text">@text</span>', array('@text' => $link_text)),
+        '#title' => SafeMarkup::format('<span class="shortcut-action__icon"></span><span class="shortcut-action__message">@text</span>', array('@text' => $link_text)),
         '#url' => Url::fromRoute($route_name, $route_parameters),
         '#options' => array('query' => $query),
-        '#suffix' => '</div>',
+        '#attributes' => array(
+          'class' => array(
+            'shortcut-action',
+            'shortcut-action--' . $link_mode,
+          ),
+        ),
       );
     }
   }
diff --git a/core/modules/shortcut/src/Tests/ShortcutLinksTest.php b/core/modules/shortcut/src/Tests/ShortcutLinksTest.php
index 3b5811f3c932..52ec545feda3 100644
--- a/core/modules/shortcut/src/Tests/ShortcutLinksTest.php
+++ b/core/modules/shortcut/src/Tests/ShortcutLinksTest.php
@@ -243,23 +243,23 @@ public function testNoShortcutLink() {
       ->save();
 
     $this->drupalGet('page-that-does-not-exist');
-    $result = $this->xpath('//div[contains(@class, "add-shortcut")]');
+    $result = $this->xpath('//a[contains(@class, "shortcut-action--add")]');
     $this->assertTrue(empty($result), 'Add to shortcuts link was not shown on a page not found.');
 
     // The user does not have access to this path.
     $this->drupalGet('admin/modules');
-    $result = $this->xpath('//div[contains(@class, "add-shortcut")]');
+    $result = $this->xpath('//a[contains(@class, "shortcut-action--add")]');
     $this->assertTrue(empty($result), 'Add to shortcuts link was not shown on a page the user does not have access to.');
 
-    // Verify that the testing mechanism works by verifying the shortcut
-    // link appears on admin/people.
-    $this->drupalGet('admin/people');
-    $result = $this->xpath('//div[contains(@class, "remove-shortcut")]');
+    // Verify that the testing mechanism works by verifying the shortcut link
+    // appears on admin/content.
+    $this->drupalGet('admin/content');
+    $result = $this->xpath('//a[contains(@class, "shortcut-action--remove")]');
     $this->assertTrue(!empty($result), 'Remove from shortcuts link was shown on a page the user does have access to.');
 
     // Verify that the shortcut link appears on routing only pages.
     $this->drupalGet('router_test/test2');
-    $result = $this->xpath('//div[contains(@class, "add-shortcut")]');
+    $result = $this->xpath('//a[contains(@class, "shortcut-action--add")]');
     $this->assertTrue(!empty($result), 'Add to shortcuts link was shown on a page the user does have access to.');
   }
 
diff --git a/core/themes/bartik/css/components/shortcut.css b/core/themes/bartik/css/components/shortcut.css
index 2262be82a5fe..36c28e02ebd6 100644
--- a/core/themes/bartik/css/components/shortcut.css
+++ b/core/themes/bartik/css/components/shortcut.css
@@ -10,6 +10,6 @@
 [dir="rtl"] .shortcut-wrapper h1#page-title {
   float: right;
 }
-div.add-or-remove-shortcuts {
+.shortcut-action {
   padding-top: 0.9em;
 }
diff --git a/core/themes/bartik/css/print.css b/core/themes/bartik/css/print.css
index 58d1841d22c5..248fe6e571c9 100644
--- a/core/themes/bartik/css/print.css
+++ b/core/themes/bartik/css/print.css
@@ -20,7 +20,7 @@ body {
 #toolbar,
 .site-footer,
 .tabs,
-.add-or-remove-shortcuts {
+.shortcut-action {
   display: none;
 }
 .one-sidebar #content,
-- 
GitLab