fixed paddings on tablet for Lab

src/components/lab/LabHead/index.tsx

@@ -7,8 +7,6 @@ interface IProps {
 }
 
 const LabHead: FC<IProps> = ({ isLoading }) => {
-  return null;
-
   return (
     <div className={styles.wrap}>
       <div className={styles.group}>

src/components/lab/LabHeadItem/styles.module.scss

@@ -13,10 +13,7 @@
   }
 
   &.active {
-    color: $blue;
+    color: $wisegreen;
-    background-color: lighten($content_bg, 6%);
-    border-radius: $radius;
-    padding: 0 $gap;
   }
 }
 

src/containers/lab/LabGrid/styles.module.scss

@@ -11,6 +11,10 @@ div.wrap {
   box-sizing: border-box;
   padding: 0 $gap / 2;
 
+  @include tablet {
+    padding: 0;
+  }
+
   & > div {
     margin-bottom: $gap;
   }

src/layouts/LabLayout/index.tsx

@@ -32,7 +32,10 @@ const LabLayout: FC<IProps> = () => {
       <div className={styles.container}>
         <div className={styles.wrap}>
           <Group className={styles.content}>
-            <LabHead isLoading={is_loading} />
+            <div className={styles.head}>
+              <LabHead isLoading={is_loading} />
+            </div>
+
             <LabGrid />
           </Group>
 

src/layouts/LabLayout/styles.module.scss

@@ -40,4 +40,15 @@
 
 .content {
   min-width: 0;
+  margin-left: -$gap / 2;
+
+  @include tablet {
+    margin-left: 0;
+    padding-bottom: $gap / 2;
+  }
+}
+
+.head {
+  padding: 0 $gap / 2;
+  display: none;
 }

src/styles/variables.scss

@@ -162,6 +162,7 @@ $sidebar_border: transparentize(white, 0.95);
     @content;
   }
 }
+
 @mixin desktop {
   @media (max-width: $content_width) {
     @content;