Reland “Enable property-no-vendor-prefix stylelint check”
This patch drops unnecessary -webkit- prefixes in CSS and enables
a lint check to enforce that prevent such properties from being
added in the future. Note that the use of vendor-prefixed CSS
properties is still accepted in cases where there is no standardized
and browser-supported alternative.
[email protected]
No-Presubmit: true
No-Tree-Checks: true
No-Try: true
Bug: chromium:1104187
Change-Id: Ibf36fe5a3802b5f3ac663b7ac873a4758e0fda14
Fixed: chromium:1031475
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2297386
Reviewed-by: Changhao Han <[email protected]>
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2297393
Commit-Queue: Mathias Bynens <[email protected]>
Auto-Submit: Mathias Bynens <[email protected]>
Reviewed-by: Mathias Bynens <[email protected]>
diff --git a/front_end/ui/checkboxTextLabel.css b/front_end/ui/checkboxTextLabel.css
index d1b4703..beef3b6 100644
--- a/front_end/ui/checkboxTextLabel.css
+++ b/front_end/ui/checkboxTextLabel.css
@@ -28,7 +28,7 @@
}
input.dt-checkbox-themed {
- -webkit-appearance: none;
+ appearance: none;
margin: auto 5px auto 2px;
border: 1px solid rgb(45 45 45);
border-radius: 3px;
diff --git a/front_end/ui/glassPane.css b/front_end/ui/glassPane.css
index c6ef6fd..09acc05 100644
--- a/front_end/ui/glassPane.css
+++ b/front_end/ui/glassPane.css
@@ -57,5 +57,5 @@
}
:host-context(.-theme-with-dark-background) .arrow {
- -webkit-filter: invert(80%);
+ filter: invert(80%);
}
diff --git a/front_end/ui/inspectorCommon.css b/front_end/ui/inspectorCommon.css
index bc8ed92..a4b596b 100644
--- a/front_end/ui/inspectorCommon.css
+++ b/front_end/ui/inspectorCommon.css
@@ -182,7 +182,7 @@
}
:host-context(.-theme-with-dark-background) input[type="checkbox"]:not(.-theme-preserve) {
- -webkit-filter: invert(80%);
+ filter: invert(80%);
}
.harmony-input:not([type]),
@@ -246,7 +246,7 @@
}
.chrome-select {
- -webkit-appearance: none;
+ appearance: none;
user-select: none;
border: 1px solid rgb(0 0 0 / 20%);
border-radius: 2px;
@@ -307,14 +307,14 @@
}
:not(.platform-mac).-theme-with-dark-background ::-webkit-scrollbar-track {
- -webkit-box-shadow: inset 0 0 1px rgb(255 255 255 / 30%);
+ box-shadow: inset 0 0 1px rgb(255 255 255 / 30%);
background: rgb(36 36 36);
}
:not(.platform-mac).-theme-with-dark-background ::-webkit-scrollbar-thumb {
border-radius: 2px;
background-color: #333;
- -webkit-box-shadow: inset 0 0 1px rgb(255 255 255 / 50%);
+ box-shadow: inset 0 0 1px rgb(255 255 255 / 50%);
}
:not(.platform-mac).-theme-with-dark-background ::-webkit-scrollbar-corner {
@@ -327,14 +327,14 @@
}
:host-context(:not(.platform-mac).-theme-with-dark-background) ::-webkit-scrollbar-track {
- -webkit-box-shadow: inset 0 0 1px rgb(255 255 255 / 30%);
+ box-shadow: inset 0 0 1px rgb(255 255 255 / 30%);
background: rgb(36 36 36);
}
:host-context(:not(.platform-mac).-theme-with-dark-background) ::-webkit-scrollbar-thumb {
border-radius: 2px;
background-color: #333;
- -webkit-box-shadow: inset 0 0 1px rgb(255 255 255 / 50%);
+ box-shadow: inset 0 0 1px rgb(255 255 255 / 50%);
}
:host-context(:not(.platform-mac).-theme-with-dark-background) ::-webkit-scrollbar-corner {
diff --git a/front_end/ui/radioButton.css b/front_end/ui/radioButton.css
index 17a7319..cfe5095 100644
--- a/front_end/ui/radioButton.css
+++ b/front_end/ui/radioButton.css
@@ -15,7 +15,7 @@
border: 1px solid #a5a5a5;
background-image: linear-gradient(to bottom, var(--gradient-start), var(--gradient-end));
border-radius: 8px;
- -webkit-appearance: none;
+ appearance: none;
vertical-align: middle;
margin: 0 5px 5px 0;
}
diff --git a/front_end/ui/searchableView.css b/front_end/ui/searchableView.css
index eef13d7..ee178b9 100644
--- a/front_end/ui/searchableView.css
+++ b/front_end/ui/searchableView.css
@@ -18,7 +18,7 @@
}
.search-replace {
- -webkit-appearance: none;
+ appearance: none;
border: 0;
padding: 0 3px;
margin: 0;
@@ -69,7 +69,7 @@
}
.toolbar-search-control {
- display: -webkit-flex;
+ display: flex;
position: relative;
background-color: white;
}
@@ -104,7 +104,7 @@
}
:host-context(.-theme-with-dark-background) .toolbar-search-navigation {
- -webkit-filter: invert(90%);
+ filter: invert(90%);
}
.toolbar-search-navigation.toolbar-search-navigation-prev.enabled:active {
diff --git a/front_end/ui/slider.css b/front_end/ui/slider.css
index 4f14772..a9fa9af 100644
--- a/front_end/ui/slider.css
+++ b/front_end/ui/slider.css
@@ -5,7 +5,7 @@
*/
.dt-range-input {
- -webkit-appearance: none;
+ appearance: none;
margin: 0;
padding: 0;
height: 10px;
@@ -16,7 +16,7 @@
.dt-range-input::-webkit-slider-thumb,
.-theme-preserve {
- -webkit-appearance: none;
+ appearance: none;
margin: 0;
padding: 0;
border: 0;
@@ -28,7 +28,7 @@
}
.dt-range-input::-webkit-slider-runnable-track {
- -webkit-appearance: none;
+ appearance: none;
margin: 0;
padding: 0;
width: 100%;
diff --git a/front_end/ui/toolbar.css b/front_end/ui/toolbar.css
index 524aa04..a28dd6e 100644
--- a/front_end/ui/toolbar.css
+++ b/front_end/ui/toolbar.css
@@ -210,7 +210,7 @@
select.toolbar-item {
min-width: 38px;
- -webkit-appearance: none;
+ appearance: none;
border: 1px solid transparent;
border-radius: 0;
padding: 0 13px 0 5px;
diff --git a/front_end/ui/tooltip.css b/front_end/ui/tooltip.css
index 3ac0b71..697c674 100644
--- a/front_end/ui/tooltip.css
+++ b/front_end/ui/tooltip.css
@@ -12,7 +12,7 @@
line-height: 14px;
display: flex;
align-items: center;
- -webkit-filter: drop-shadow(0 1px 2px hsl(0deg 0% 0% / 30%));
+ filter: drop-shadow(0 1px 2px hsl(0deg 0% 0% / 30%));
border: 1px solid hsl(0deg 0% 0% / 10%);
background-clip: padding-box;
box-sizing: border-box;
diff --git a/front_end/ui/treeoutline.css b/front_end/ui/treeoutline.css
index 1a159c0..7d938ed 100644
--- a/front_end/ui/treeoutline.css
+++ b/front_end/ui/treeoutline.css
@@ -113,7 +113,7 @@
-webkit-mask-size: 32px 24px;
-webkit-mask-position: 0 0;
background-color: #727272;
- content: "\00a0\00a0";
+ content: "\A0\A0";
text-shadow: none;
margin-right: -2px;
height: 12px;