LibWeb: Add slider- prefix to slider pseudo-element names

Corresponds to 9549bb8951

Libraries/LibWeb/CSS/Default.css

@@ -79,7 +79,7 @@ input[type=range] {
     width: 20ch;
     height: 16px;
 
-    &::track {
+    &::slider-track {
         display: block;
         position: relative;
         height: 4px;
@@ -89,14 +89,14 @@ input[type=range] {
         border: 1px solid rgba(0, 0, 0, 0.5);
     }
 
-    &::fill {
+    &::slider-fill {
         display: block;
         position: absolute;
         height: 100%;
         background-color: AccentColor;
     }
 
-    &::thumb {
+    &::slider-thumb {
         display: block;
         margin-top: -6px;
         width: 16px;
@@ -115,27 +115,27 @@ meter {
     width: 300px;
     height: 12px;
 
-    &::track {
+    &::slider-track {
         display: block;
         height: 100%;
         background-color: hsl(0, 0%, 96%);
         border: 1px solid rgba(0, 0, 0, 0.5);
     }
 
-    &::fill {
+    &::slider-fill {
         display: block;
         height: 100%;
     }
 
-    &:optimal-value::fill {
+    &:optimal-value::slider-fill {
         background-color: hsl(141, 53%, 53%);
     }
 
-    &:suboptimal-value::fill {
+    &:suboptimal-value::slider-fill {
         background-color: hsl(48, 100%, 67%);
     }
 
-    &:even-less-good-value::fill {
+    &:even-less-good-value::slider-fill {
         background-color: hsl(348, 100%, 61%);
     }
 }
@@ -146,14 +146,14 @@ progress {
     width: 300px;
     height: 12px;
 
-    &::track {
+    &::slider-track {
         display: block;
         height: 100%;
         background-color: AccentColorText;
         border: 1px solid rgba(0, 0, 0, 0.5);
     }
 
-    &::fill {
+    &::slider-fill {
         display: block;
         height: 100%;
         background-color: AccentColor;

Libraries/LibWeb/CSS/PseudoElements.json

@@ -1,33 +1,33 @@
 {
   "-moz-meter-bar": {
-    "alias-for": "fill"
+    "alias-for": "slider-fill"
   },
   "-moz-progress-bar": {
-    "alias-for": "fill"
+    "alias-for": "slider-fill"
   },
   "-moz-range-progress": {
-    "alias-for": "fill"
+    "alias-for": "slider-fill"
   },
   "-moz-range-track": {
-    "alias-for": "track"
+    "alias-for": "slider-track"
   },
   "-moz-range-thumb": {
-    "alias-for": "thumb"
+    "alias-for": "slider-thumb"
   },
   "-webkit-meter-bar": {
-    "alias-for": "track"
+    "alias-for": "slider-track"
   },
   "-webkit-progress-bar": {
-    "alias-for": "track"
+    "alias-for": "slider-track"
   },
   "-webkit-progress-value": {
-    "alias-for": "fill"
+    "alias-for": "slider-fill"
   },
   "-webkit-slider-runnable-track": {
-    "alias-for": "track"
+    "alias-for": "slider-track"
   },
   "-webkit-slider-thumb": {
-    "alias-for": "thumb"
+    "alias-for": "slider-thumb"
   },
   "after": {
     "spec": "https://drafts.csswg.org/css-pseudo-4/#selectordef-after",
@@ -47,9 +47,6 @@
   "file-selector-button": {
     "spec": "https://drafts.csswg.org/css-pseudo-4/#selectordef-file-selector-button"
   },
-  "fill": {
-    "spec": "https://drafts.csswg.org/css-forms-1/#selectordef-fill"
-  },
   "first-letter": {
     "spec": "https://drafts.csswg.org/css-pseudo-4/#selectordef-first-letter",
     "property-whitelist": [
@@ -107,11 +104,14 @@
       "#custom-properties"
     ]
   },
-  "thumb": {
+  "slider-fill": {
-    "spec": "https://drafts.csswg.org/css-forms-1/#selectordef-thumb"
+    "spec": "https://drafts.csswg.org/css-forms-1/#selectordef-slider-fill"
   },
-  "track": {
+  "slider-thumb": {
-    "spec": "https://drafts.csswg.org/css-forms-1/#selectordef-track"
+    "spec": "https://drafts.csswg.org/css-forms-1/#selectordef-slider-thumb"
+  },
+  "slider-track": {
+    "spec": "https://drafts.csswg.org/css-forms-1/#selectordef-slider-track"
   },
   "view-transition": {
     "spec": "https://drafts.csswg.org/css-view-transitions-1/#selectordef-view-transition"

Libraries/LibWeb/HTML/HTMLInputElement.cpp

@@ -1217,15 +1217,15 @@ void HTMLInputElement::create_range_input_shadow_tree()
     set_shadow_root(shadow_root);
 
     m_slider_runnable_track = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
-    m_slider_runnable_track->set_use_pseudo_element(CSS::PseudoElement::Track);
+    m_slider_runnable_track->set_use_pseudo_element(CSS::PseudoElement::SliderTrack);
     MUST(shadow_root->append_child(*m_slider_runnable_track));
 
     m_slider_progress_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
-    m_slider_progress_element->set_use_pseudo_element(CSS::PseudoElement::Fill);
+    m_slider_progress_element->set_use_pseudo_element(CSS::PseudoElement::SliderFill);
     MUST(m_slider_runnable_track->append_child(*m_slider_progress_element));
 
     m_slider_thumb = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
-    m_slider_thumb->set_use_pseudo_element(CSS::PseudoElement::Thumb);
+    m_slider_thumb->set_use_pseudo_element(CSS::PseudoElement::SliderThumb);
     MUST(m_slider_runnable_track->append_child(*m_slider_thumb));
 
     update_slider_shadow_tree_elements();

Libraries/LibWeb/HTML/HTMLMeterElement.cpp

@@ -197,11 +197,11 @@ void HTMLMeterElement::create_shadow_tree_if_needed()
     set_shadow_root(shadow_root);
 
     auto meter_bar_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
-    meter_bar_element->set_use_pseudo_element(CSS::PseudoElement::Track);
+    meter_bar_element->set_use_pseudo_element(CSS::PseudoElement::SliderTrack);
     MUST(shadow_root->append_child(*meter_bar_element));
 
     m_meter_value_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
-    m_meter_value_element->set_use_pseudo_element(CSS::PseudoElement::Fill);
+    m_meter_value_element->set_use_pseudo_element(CSS::PseudoElement::SliderFill);
     MUST(meter_bar_element->append_child(*m_meter_value_element));
     update_meter_value_element();
 }

Libraries/LibWeb/HTML/HTMLProgressElement.cpp

@@ -118,11 +118,11 @@ void HTMLProgressElement::create_shadow_tree_if_needed()
     set_shadow_root(shadow_root);
 
     auto progress_bar_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
-    progress_bar_element->set_use_pseudo_element(CSS::PseudoElement::Track);
+    progress_bar_element->set_use_pseudo_element(CSS::PseudoElement::SliderTrack);
     MUST(shadow_root->append_child(*progress_bar_element));
 
     m_progress_value_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
-    m_progress_value_element->set_use_pseudo_element(CSS::PseudoElement::Fill);
+    m_progress_value_element->set_use_pseudo_element(CSS::PseudoElement::SliderFill);
     MUST(progress_bar_element->append_child(*m_progress_value_element));
     update_progress_value_element();
 }