docs: fix divider for rule category (eslint#19264)

* docs: fix divider for fourth rule category

* fix alignment of rule category description

* apply suggestion

* remove flex property

docs/src/assets/scss/components/rules.scss

@@ -20,25 +20,30 @@
                 border-left: 1px solid var(--divider-color);
                 left: 0;
             }
+
+            &:nth-child(2)::after {
+                height: 70%;
+                position: absolute;
+            }
         }
 
         @media screen and (min-width: 768px) and (max-width: 799px), screen and (min-width: 854px) and (max-width: 1023px), screen and (min-width: 1256px) {
-            &:not(:first-child)::after {
+            &:nth-child(3)::after {
                 height: 70%;
                 position: absolute;
             }
         }
 
-        @media screen and (min-width: 800px) and (max-width: 853px), screen and (min-width: 1024px) and (max-width: 1255px) {
-            &:nth-child(2)::after {
+        @media screen and (min-width: 800px) and (max-width: 853px), screen and (min-width: 1024px) and (max-width: 1255px), screen and (min-width: 1654px) and (max-width: 1982px) {
+            &:nth-child(4)::after {
                 height: 70%;
                 position: absolute;
             }
         }
     }
 
     .rule-category__description {
-        flex: 1 1 45ch;
+        height: 100%;
     }
 }
 
@@ -58,10 +63,6 @@
     p {
         margin: 0;
     }
-
-    .rule-category__description {
-        flex: 1 1 30ch;
-    }
 }
 
 .rule:not(.token) {
@@ -80,11 +81,6 @@
     }
 }
 
-.rule--deprecated,
-.rule--removed {
-    // opacity: .5;
-}
-
 .rule__content {
     flex: 1 1 35ch;
     overflow-x: auto;