Bladeren bron

Refactor CSS selectors in title panel override for readability

Thibaud Colas 11 maanden geleden
bovenliggende
commit
bd6f314b87
1 gewijzigde bestanden met toevoegingen van 4 en 10 verwijderingen
  1. 4 10
      client/scss/components/forms/_title.scss

+ 4 - 10
client/scss/components/forms/_title.scss

@@ -1,10 +1,7 @@
 // Styles for title fields throughout the page.
 // The `title` class is meant to be applied by end users throughout different forms APIs.
-.w-panel.title,
-.w-field.title {
-  input,
-  textarea,
-  .Draftail-Editor .public-DraftEditor-content {
+:where(.w-panel, .w-field).title {
+  :where(input, textarea, .Draftail-Editor .public-DraftEditor-content) {
     @apply w-h2;
     color: theme('colors.text-context');
   }
@@ -12,8 +9,7 @@
 
 // Styles for the title field when at the top of the page.
 // It’s the first panel when comments are disabled, second if enabled.
-.w-panel.title:nth-child(1),
-.w-panel.title:nth-child(2) {
+.w-panel.title:nth-child(-n + 2) {
   .w-panel__header {
     @apply w-sr-only;
 
@@ -32,9 +28,7 @@
     order: 2;
   }
 
-  input,
-  textarea,
-  .Draftail-Editor .public-DraftEditor-content {
+  :is(input, textarea, .Draftail-Editor .public-DraftEditor-content) {
     @apply w-h1;
     color: theme('colors.text-context');
     // Slightly out-dented so the field’s is horizontally aligned.