Commit eed1c99c authored by alexpott's avatar alexpott

Issue #2485375 by marieke_h, Manjit.Singh, MathieuSpil, LewisNyman, geertvd:...

Issue #2485375 by marieke_h, Manjit.Singh, MathieuSpil, LewisNyman, geertvd: Clean up shortcut CSS inline with our CSS standards
parent 537da55a
......@@ -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;
}
......@@ -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);
......
......@@ -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,
),
),
);
}
}
......
......@@ -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.');
}
......
......@@ -10,6 +10,6 @@
[dir="rtl"] .shortcut-wrapper h1#page-title {
float: right;
}
div.add-or-remove-shortcuts {
.shortcut-action {
padding-top: 0.9em;
}
......@@ -20,7 +20,7 @@ body {
#toolbar,
.site-footer,
.tabs,
.add-or-remove-shortcuts {
.shortcut-action {
display: none;
}
.one-sidebar #content,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment