Migrate MenuSection to tailwind

src/sidebar/components/MenuSection.js

@@ -28,8 +28,12 @@ import { toChildArray } from 'preact';
 export default function MenuSection({ heading, children }) {
   return (
     <>
-      {heading && <h2 className="MenuSection__heading">{heading}</h2>}
-      <ul className="MenuSection__content">
+      {heading && (
+        <h2 className="text-color-text-light p-3 leading-none uppercase">
+          {heading}
+        </h2>
+      )}
+      <ul className="border-b">
         {toChildArray(children).map(child => (
           <li key={/** @type {JSXElement} **/ (child).key}>{child}</li>
         ))}

src/styles/sidebar/components/MenuSection.scss

-@use '../../variables' as var;
-@use '../../mixins/utils';
-
-.MenuSection__content {
-  @include utils.border--bottom;
-}
-
-.MenuSection__heading {
-  color: var.$color-text--light;
-  line-height: 1;
-  margin: 1px 1px 0;
-  margin-bottom: 10px;
-  padding: 12px 10px 0;
-  text-transform: uppercase;
-}

src/styles/sidebar/components/_index.scss

@@ -13,7 +13,6 @@
 @use './GroupList';
 @use './GroupListItem';
 @use './Menu';
-@use './MenuSection';
 @use './StyledText';
 
 // TODO: Evaluate all classes below after components have been converted to