Merge pull request #15611 from Chocobo1/webui

Suppress WebUI CSS warnings

src/webui/www/.stylelintrc.json

@@ -12,7 +12,9 @@
     "indentation": 4,
     "length-zero-no-unit": null,
     "no-descending-specificity": null,
-    "value-keyword-case": null,
-    "order/properties-alphabetical-order": true
+    "order/properties-alphabetical-order": true,
+    "selector-class-pattern": null,
+    "selector-id-pattern": null,
+    "value-keyword-case": null
   }
 }

src/webui/www/private/css/Layout.css

@@ -41,17 +41,17 @@ body {
 }
 
 #desktopTitlebarWrapper {
-    background: #718ba6 url(../images/bg-header.gif) repeat-x;
+    background: #718ba6 url("../images/bg-header.gif") repeat-x;
     height: 45px;
     overflow: hidden;
     position: relative;
 }
 
 #desktopTitlebar {
-    background: url(../images/logo.gif) no-repeat;
+    background: url("../images/logo.gif") no-repeat;
     background-position: left 0;
     height: 32px;
-    padding: 7px 8px 6px 8px;
+    padding: 7px 8px 6px;
 }
 
 #desktopTitlebar h1.applicationTitle {
@@ -69,7 +69,7 @@ body {
     font-family: Verdana, Arial, Helvetica, sans-serif;
     font-size: 10px;
     font-weight: bold;
-    padding: 7px 0 0 0;
+    padding: 7px 0 0;
     text-align: center;
     text-transform: uppercase;
 }
@@ -128,7 +128,7 @@ body {
 #desktopNavbar ul li a {
     color: #333;
     font-weight: normal;
-    padding: 2px 10px 6px 10px;
+    padding: 2px 10px 6px;
 }
 
 #desktopNavbar ul li a:hover {
@@ -138,13 +138,13 @@ body {
 
 #desktopNavbar ul li a.arrow-right,
 #desktopNavbar ul li a:hover.arrow-right {
-    background-image: url(../images/arrow-right.gif);
+    background-image: url("../images/arrow-right.gif");
     background-position: right 7px;
     background-repeat: no-repeat;
 }
 
 #desktopNavbar li ul {
-    background: #fff url(../images/bg-dropdown.gif) repeat-y;
+    background: #fff url("../images/bg-dropdown.gif") repeat-y;
     border: 1px solid #3f3f3f;
     left: -999em;
     margin-top: -6px;
@@ -186,7 +186,7 @@ body {
 
 #desktopNavbar li ul li a:hover {
     background: #6c98d9;
-    -moz-border-radius: 2px;
+    border-radius: 2px;
     color: #fff;
 }
 
@@ -239,7 +239,7 @@ li.divider {
     font-family: Verdana, Arial, Helvetica, sans-serif;
     font-size: 11px;
     height: 24px;
-    padding: 6px 8px 0 8px;
+    padding: 6px 8px 0;
 }
 
 /* Panel Layout
@@ -283,7 +283,7 @@ li.divider {
 }
 
 .panel-header {
-    background: #f1f1f1 url(../images/bg-panel-header.gif) repeat-x;
+    background: #f1f1f1 url("../images/bg-panel-header.gif") repeat-x;
     border-bottom: 1px solid #d3d3d3;
     height: 30px;
     overflow: hidden;
@@ -295,7 +295,7 @@ li.divider {
 }
 
 .panel-headerContent.tabs {
-    background: url(../images/tabs.gif) repeat-x;
+    background: url("../images/tabs.gif") repeat-x;
     background-position: left -68px;
 }
 
@@ -306,15 +306,15 @@ li.divider {
     height: 22px;
     margin: 0;
     overflow: hidden;
-    padding: 3px 8px 0 8px;
+    padding: 3px 8px 0;
 }
 
 .panel-collapse {
-    background: url(../icons/collapse.svg) left top no-repeat;
+    background: url("../icons/collapse.svg") left top no-repeat;
 }
 
 .panel-expand {
-    background: url(../icons/collapse.svg) left top no-repeat;
+    background: url("../icons/collapse.svg") left top no-repeat;
     transform: rotate(180deg);
 }
 
@@ -326,7 +326,7 @@ li.divider {
 /* Column and Panel Handles */
 
 .horizontalHandle {
-    background: #eee url(../images/bg-handle-horizontal.gif) repeat-x;
+    background: #eee url("../images/bg-handle-horizontal.gif") repeat-x;
     font-size: 1px;
     height: 4px;
     line-height: 1px;
@@ -338,7 +338,7 @@ li.divider {
 }
 
 .horizontalHandle .handleIcon {
-    background: url(../images/handle-icon-horizontal.gif) center center
+    background: url("../images/handle-icon-horizontal.gif") center center
         no-repeat;
     font-size: 1px;
     height: 4px;
@@ -348,7 +348,7 @@ li.divider {
 }
 
 .columnHandle {
-    background: #c3c3c3 url(../images/handle-icon.gif) center center no-repeat;
+    background: #c3c3c3 url("../images/handle-icon.gif") center center no-repeat;
     border: 1px solid #909090;
     border-bottom: 0;
     border-top: 0;
@@ -371,7 +371,7 @@ li.divider {
 
 /* Have to specify div here for IE6's sake */
 div.toolbox.divider {
-    background: url(../images/toolbox-divider.gif) repeat-y;
+    background: url("../images/toolbox-divider.gif") repeat-y;
     padding-left: 8px;
 }
 
@@ -400,18 +400,18 @@ div.toolbox.divider {
 
 .iconWrapper:hover {
     border: 1px solid #a0a0a0;
-    -moz-border-radius: 3px;
+    border-radius: 3px;
 }
 
 #spinnerWrapper {
-    background: url(../images/spinner-placeholder.gif) no-repeat;
+    background: url("../images/spinner-placeholder.gif") no-repeat;
     height: 16px;
-    margin: 4px 5px 0 5px;
+    margin: 4px 5px 0;
     width: 16px;
 }
 
 #spinner {
-    background: url(../images/spinner.gif) no-repeat;
+    background: url("../images/spinner.gif") no-repeat;
     display: none;
     height: 16px;
     width: 16px;

src/webui/www/private/css/Tabs.css

@@ -18,7 +18,7 @@ Required by:
 /* Toolbar Tabs */
 
 .toolbarTabs {
-    background: url(../images/tabs.gif) repeat-x;
+    background: url("../images/tabs.gif") repeat-x;
     background-position: left -70px;
     overflow: visible;
     padding: 0 5px 2px 2px;
@@ -33,20 +33,20 @@ Required by:
 }
 
 .tab-menu li {
-    background: url(../images/tabs.gif) repeat-x;
+    background: url("../images/tabs.gif") repeat-x;
     background-position: left -35px;
     cursor: pointer;
     float: left;
-    margin: 0 0 5px 0;
+    margin: 0 0 5px;
 }
 
 .tab-menu li.selected {
-    background: url(../images/tabs.gif) repeat-x;
+    background: url("../images/tabs.gif") repeat-x;
     background-position: left 0;
 }
 
 .tab-menu li a {
-    background: url(../images/tabs.gif) repeat-x;
+    background: url("../images/tabs.gif") repeat-x;
     background-position: right -35px;
     color: #181818;
     display: block;
@@ -57,7 +57,7 @@ Required by:
 }
 
 .tab-menu li.selected a {
-    background: url(../images/tabs.gif) repeat-x;
+    background: url("../images/tabs.gif") repeat-x;
     background-position: right 0;
     color: #181818;
     font-weight: bold;

src/webui/www/private/css/Window.css

@@ -42,7 +42,7 @@ Required by:
 */
 
 .mochaTitlebar {
-    background: url(../images/spacer.gif?from=fafafa&to=e5e5e5);
+    background: url("../images/spacer.gif?from=fafafa&to=e5e5e5");
     overflow: hidden;
     width: 100%;
 }
@@ -97,12 +97,9 @@ div.mochaToolbarWrapper.bottom {
 
 .mocha .handle {
     background: #0f0;
-    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE8 */
-    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); /* IE6 and 7*/
     font-size: 1px; /* For IE6 */
     height: 3px;
-    -moz-opacity: 0;
-    opacity: 0;
+    opacity: 0%;
     overflow: hidden;
     position: absolute;
     width: 3px;
@@ -178,7 +175,7 @@ div.mochaToolbarWrapper.bottom {
 }
 
 .mochaSpinner {
-    background: url(../images/spinner.gif) no-repeat;
+    background: url("../images/spinner.gif") no-repeat;
     bottom: 7px;
     display: none;
     height: 16px;
@@ -210,11 +207,8 @@ div.mochaToolbarWrapper.bottom {
 #modalOverlay {
     background: #000;
     display: none;
-    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE8 */
-    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); /* IE6 and 7*/
     left: 0;
-    -moz-opacity: 0;
-    opacity: 0;
+    opacity: 0%;
     position: fixed;
     top: 0;
     width: 100%;
@@ -224,11 +218,8 @@ div.mochaToolbarWrapper.bottom {
 /* Fix for IE6 select z-index issue */
 #modalFix {
     display: none;
-    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE8 */
-    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); /* IE6 and 7*/
     left: 0;
-    -moz-opacity: 0;
-    opacity: 0;
+    opacity: 0%;
     position: absolute;
     top: 0;
     width: 100%;
@@ -317,10 +308,7 @@ div.mochaToolbarWrapper.bottom {
 }
 
 .mocha.notification .mochaTitlebar {
-    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE8 */
-    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); /* IE6 and 7*/
-    -moz-opacity: 0;
-    opacity: 0;
+    opacity: 0%;
 }
 
 .mocha.notification .mochaContentBorder {
@@ -337,7 +325,7 @@ div.mochaToolbarWrapper.bottom {
 /* Example Window Themes */
 
 #about_contentWrapper {
-    background: #e5e5e5 url(../images/logo2.gif) 3px 3px no-repeat;
+    background: #e5e5e5 url("../images/logo2.gif") 3px 3px no-repeat;
 }
 
 #builder_contentWrapper {
@@ -378,7 +366,7 @@ div.mochaToolbarWrapper.bottom {
 .mochaMinimizeButton.replaced,
 .mochaMaximizeButton.replaced,
 .mochaCloseButton.replaced {
-    background-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7) !important;
+    background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7") !important;
 }
 
 /* iOS iframe scrolling */

src/webui/www/private/css/dynamicTable.css

@@ -51,11 +51,7 @@ tr.dynamicTableHeader {
 
 .dynamicTable th {
     background-color: #eee;
-    border-right-color: #ccc;
-    border-right-style: solid;
-    border-right-width: 1px;
-    -moz-box-sizing: border-box;
-    -webkit-box-sizing: border-box;
+    border-right: 1px solid #ccc;
     box-sizing: border-box;
     padding: 4px;
     white-space: nowrap;
@@ -78,14 +74,14 @@ tr.dynamicTableHeader {
 }
 
 .dynamicTable th.sorted {
-    background-image: url(../icons/go-up.svg);
+    background-image: url("../icons/go-up.svg");
     background-position: right;
     background-repeat: no-repeat;
     background-size: 15px;
 }
 
 .dynamicTable th.sorted.reverse {
-    background-image: url(../icons/go-down.svg);
+    background-image: url("../icons/go-down.svg");
 }
 
 .dynamicTable td img.flags {

src/webui/www/private/css/style.css

@@ -1,7 +1,5 @@
 /* Reset */
 
-/*ul,ol,dl,li,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,object,iframe { margin: 0; padding: 0; }*/
-
 a img,
 :link img,
 :visited img {
@@ -42,7 +40,7 @@ h4 {
     font-size: 12px;
     font-weight: bold;
     margin: 0;
-    padding: 0 0 5px 0;
+    padding: 0 0 5px;
 }
 
 h2 {
@@ -55,8 +53,8 @@ h2 {
     border-bottom: 1px solid #bbb;
     display: block;
     font-size: 12px;
-    margin: 0 0 8px 0;
-    padding: 6px 0 6px 0;
+    margin: 0 0 8px;
+    padding: 6px 0;
 }
 
 #error_div {
@@ -82,7 +80,7 @@ a:hover {
 
 p {
     margin: 0;
-    padding: 0 0 9px 0;
+    padding: 0 0 9px;
 }
 
 /* List Elements */
@@ -97,7 +95,7 @@ dt {
 }
 
 dd {
-    padding: 0 0 9px 0;
+    padding: 0 0 9px;
 }
 
 /* Code */
@@ -109,7 +107,7 @@ pre {
     display: block;
     font-family: "Courier New", Courier, monospace;
     font-size: 11px;
-    margin: 0 0 10px 0;
+    margin: 0 0 10px;
     max-height: 250px;
     overflow: auto;
     padding: 10px;
@@ -167,7 +165,7 @@ hr {
 }
 
 a.propButton {
-    border: 1px solid rgb(85, 81, 91);
+    border: 1px solid rgb(85 81 91);
     margin-left: 3px;
     margin-right: 3px;
     /*border-radius: 3px;*/
@@ -243,7 +241,7 @@ a.propButton img {
 
 .contextMenu li a.arrow-right,
 .contextMenu li a:hover.arrow-right {
-    background-image: url(../images/arrow-right.gif);
+    background-image: url("../images/arrow-right.gif");
     background-position: right center;
     background-repeat: no-repeat;
 }
@@ -260,7 +258,6 @@ a.propButton img {
 
 .contextMenu li img {
     height: 16px;
-    -ms-interpolation-mode: bicubic;
     margin-bottom: -4px;
     width: 16px;
 }
@@ -290,7 +287,7 @@ a.propButton img {
 }
 
 .sliderarea {
-    background: #f2f2f2 url(../images/slider-area.gif) repeat-x;
+    background: #f2f2f2 url("../images/slider-area.gif") repeat-x;
     border: 1px solid #a3a3a3;
     border-bottom: 1px solid #ccc;
     border-left: 1px solid #ccc;
@@ -307,7 +304,7 @@ a.propButton img {
 }
 
 .sliderknob {
-    background: url(../images/knob.gif) no-repeat;
+    background: url("../images/knob.gif") no-repeat;
     cursor: pointer;
     font-size: 1px;
     height: 9px;
@@ -338,7 +335,7 @@ a.propButton img {
 }
 
 #mochaToolbar .divider {
-    background-image: url(../images/toolbox-divider.gif);
+    background-image: url("../images/toolbox-divider.gif");
     background-position: left center;
     background-repeat: no-repeat;
     padding-left: 14px;
@@ -387,7 +384,7 @@ a.propButton img {
 /* Tri-state checkbox */
 
 label.tristate {
-    background: url(../images/3-state-checkbox.gif) 0 0 no-repeat;
+    background: url("../images/3-state-checkbox.gif") 0 0 no-repeat;
     display: block;
     float: left;
     height: 13px;
@@ -407,8 +404,6 @@ label.partial {
 
 fieldset.settings {
     border: solid 1px black;
-    -webkit-border-radius: 8px;
-    -moz-border-radius: 8px;
     border-radius: 8px;
     padding: 4px 4px 4px 10px;
 }
@@ -506,10 +501,6 @@ td.generalLabel {
 
 .unselectable {
     -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
     user-select: none;
 }