Quantcast
Channel: Issues for Drupal core
Viewing all articles
Browse latest Browse all 291721

Umami Theme - follow-up - remove elements, use classes in CSS

$
0
0

Item 4 from here needs attention
https://www.drupal.org/project/drupal/issues/2904243#comment-12405231

+++ b/core/themes/umami/css/components/blocks/footer-promo/footer-promo.css
@@ -0,0 +1,47 @@
+.footer-promo__text a {
...
+.footer-promo__text a:after {

+++ b/core/themes/umami/css/components/navigation/tabs/tabs.css
@@ -0,0 +1,35 @@
+.tabs li {
...
+.tabs a {
...
+.tabs a.is-active {
...
+.tabs a:focus,
+.tabs a:hover {

Please go through the CSS selectors using elements. We should try convert as many of them to classes as we can since it will make future changes easier for us.

Update to Issue Summary

This issue is to ensure that - as much as possible - we theme the Umami theme via BEM CSS classes and do not write CSS for specific HTML elements. This means we theme items such as links in tabs using a class like .tabs__link instead of .tabs a. This has the benefit of reducing CSS specificity, but also means that CSS does not leak out into other things. In this example, all a elements inside the .tabs class could be affected (e.g. potentially links in contextual links).


Viewing all articles
Browse latest Browse all 291721

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>