Draft: Resolve #3483055 "Fix stylelint issues" Creating new MR in order to test with tugboat

Closes #3483055

css/environment_indicator.css

@@ -3,56 +3,72 @@
 }
 
 #environment-indicator {
+  z-index: 10;
+  right: 0;
+  left: 0;
+  padding: 5px;
   text-align: center;
   white-space: nowrap;
   color: white;
+  background-image: linear-gradient(
+    to bottom,
+    rgba(207, 207, 207, 0.3) 19%,
+    rgba(250, 250, 250, 0.3) 60%,
+    rgba(255, 255, 255, 0.3) 80%
+  );
   text-shadow: 0 -1px 1px #333;
   font-weight: bold;
-  z-index: 10;
-  left: 0;
-  right: 0;
-  padding: 5px;
-  background-image: linear-gradient(bottom, rgba(207,207,207,0.3) 19%, rgba(250,250,250,0.3) 60%, rgba(255,255,255,0.3) 80%);
 }
 
-#environment-indicator .description { font-size: 0.85em; }
-#environment-indicator .description::before { content: "("; }
-#environment-indicator .description::after { content: ")"; }
+#environment-indicator .description {
+  font-size: 0.85em;
+}
+
+#environment-indicator .description::before {
+  content: "(";
+}
 
-#environment-indicator ul { overflow: hidden; margin: 0; }
+#environment-indicator .description::after {
+  content: ")";
+}
+
+#environment-indicator ul {
+  overflow: hidden;
+  margin: 0;
+}
 
 #environment-indicator ul.environment-switcher-container li {
-  list-style: none;
   float: left;
+  list-style: none;
 }
 
 #environment-indicator ul.environment-switcher-container li a {
   margin: 0 3px;
   padding: 3px 8px;
+  border: none;
   -moz-border-radius: 15px;
   -webkit-border-radius: 15px;
   border-radius: 15px;
-  font-size: 0.8em;
   text-shadow: none;
-  border: none;
+  font-size: 0.8em;
 }
 
 #environment-indicator ul.environment-switcher-container li a:hover {
-  background-color: #DDD;
+  background-color: #ddd;
   box-shadow: inset 0 1px 5px #333;
 }
 
 #environment-indicator ul.environment-switcher-container {
   display: none;
-  padding: 8px 10px 6px 10px;
   margin-top: 1px;
+  padding: 8px 10px 6px 10px;
 }
 
 .environment-indicator-color {
-  font-size: 1em;
   text-align: center;
   border-radius: 5px;
-  background-color: #EDEDE0;
+  background-color: #edede0;
+  font-size: 1em;
 }
 
 .toolbar .toolbar-bar .toolbar-tab > a.toolbar-icon.is-active::before {
@@ -60,24 +76,27 @@
 }
 
 .toolbar .toolbar-bar .toolbar-tab > a.toolbar-icon.is-active {
-  background-image: linear-gradient(rgba(255,255,255,0.25) 20%,transparent 200%);
+  background-image: linear-gradient(
+    rgba(255, 255, 255, 0.25) 20%,
+    transparent 200%
+  );
 }
 
-.toolbar-bar .toolbar-icon-environment:before {
+.toolbar-bar .toolbar-icon-environment::before {
   background-image: url("../images/env-bebebe.svg");
 }
-.no-svg .toolbar-bar .toolbar-icon-environment:before {
+.no-svg .toolbar-bar .toolbar-icon-environment::before {
   background-image: url("../images/env-bebebe.png");
 }
-.toolbar-bar .toolbar-icon-environment.is-active:before {
+.toolbar-bar .toolbar-icon-environment.is-active::before {
   background-image: url("../images/env-ffffff.svg");
 }
-.no-svg .toolbar-bar .toolbar-icon-environment.is-active:before {
+.no-svg .toolbar-bar .toolbar-icon-environment.is-active::before {
   background-image: url("../images/env-ffffff.png");
 }
 .toolbar .toolbar-tray-vertical .edit-environments {
-  text-align: right;
   padding: 1em;
+  text-align: right;
 }
 .toolbar .toolbar-tray-horizontal .edit-environments {
   float: right;
@@ -97,10 +116,26 @@
   margin-top: var(--environment-indicator-border-width);
 }
 
-.gin--vertical-toolbar .toolbar-menu-administration > .toolbar-menu > .menu-item .toolbar-menu {
-  margin-inline-start: calc(var(--gin-toolbar-width-collapsed, var(--ginToolbarWidthCollapsed)) - 4px);
+.gin--vertical-toolbar {
+  .toolbar-menu-administration {
+    > .toolbar-menu > .menu-item .toolbar-menu {
+      margin-inline-start: calc(
+        var(
+            --gin-toolbar-width-collapsed,
+            var(--gin-toolbar-width-collapsed-fallback)
+          ) -
+          4px
+      );
+    }
+  }
+}
+
+.gin--vertical-toolbar[data-toolbar-menu="open"] {
+  .toolbar-menu-administration {
+    > .toolbar-menu > .menu-item .toolbar-menu {
+      margin-inline-start: calc(
+        var(--gin-toolbar-width, var(--gin-toolbar-width-fallback)) - 4px
+      );
+    }
+  }
 }
-
-.gin--vertical-toolbar[data-toolbar-menu="open"] .toolbar-menu-administration > .toolbar-menu > .menu-item .toolbar-menu {
-  margin-inline-start: calc(var(--gin-toolbar-width, var(--ginToolbarWidth)) - 4px);
-}
\ No newline at end of file