add selector-max-type stylelint rule

grafana-plugin/.stylelintrc

@@ -3,6 +3,10 @@
   "plugins": ["stylelint-prettier"],
   "rules": {
     "block-no-empty": [true, { "severity": "warning" }],
+    "selector-max-type": [ 0, {
+      "severity": "error",
+      "ignore": ["child", "compounded", "descendant", "next-sibling"]
+    }],
     "selector-pseudo-class-no-unknown": [
       true,
       {

grafana-plugin/package.json

@@ -5,8 +5,8 @@
   "scripts": {
     "lint": "eslint --cache --ext .js,.jsx,.ts,.tsx --max-warnings=0 ./src",
     "lint:fix": "eslint --fix --cache --ext .js,.jsx,.ts,.tsx --max-warnings=0 --quiet ./src",
-    "stylelint": "stylelint ./src/**/*.css",
-    "stylelint:fix": "stylelint --fix ./src/**/*.css",
+    "stylelint": "stylelint ./src/**/*.{css,scss,module.css,module.scss}",
+    "stylelint:fix": "stylelint --fix ./src/**/*.{css,scss,module.css,module.scss}",
     "build": "grafana-toolkit plugin:build",
     "test": "jest --verbose",
     "dev": "grafana-toolkit plugin:dev",

grafana-plugin/src/components/ScheduleBorderedAvatar/ScheduleBorderedAvatar.module.scss

@@ -1,12 +1,14 @@
 .root {
   position: relative;
 }
+
 .avatar {
   position: absolute;
-  top: 0px;
-  left: 0px;
+  top: 0;
+  left: 0;
   z-index: -1;
 }
+
 .icon {
   position: relative;
   top: -8px;

grafana-plugin/src/components/SourceCode/SourceCode.module.scss

@@ -1,10 +1,6 @@
 .root {
   position: relative;
   width: 100%;
-
-  &:hover .copyButton {
-    opacity: 1;
-  }
 }
 
 .scroller {
@@ -24,6 +20,11 @@
   right: 15px;
   transition: opacity 0.2s ease;
 }
+
 .copyButton {
   opacity: 0;
 }
+
+.root:hover .copyButton {
+  opacity: 1;
+}

grafana-plugin/src/components/Text/Text.module.scss

@@ -6,30 +6,39 @@
   &--primary {
     color: var(--primary-text-color);
   }
+
   &--secondary {
     color: var(--secondary-text-color);
   }
+
   &--disabled {
     color: var(--disabled-text-color);
   }
+
   &--warning {
     color: var(--warning-text-color);
   }
+
   &--link {
     color: var(--primary-text-link);
   }
+
   &--success {
     color: var(--green-5);
   }
+
   &--strong {
     font-weight: bold;
   }
+
   &--underline {
     text-decoration: underline;
   }
+
   &--small {
     font-size: 12px;
   }
+
   &--large {
     font-size: 20px;
   }