small padding adjustment in shader page

src/common/toggle/toggle.component.tsx

@@ -1,15 +1,17 @@
 import { ReactNode, Dispatch, SetStateAction } from "react";
+import cn from "classnames";
 
 import styles from "./toggle.module.scss";
 
 type ToggleProps = {
   value: boolean;
   setter: Dispatch<SetStateAction<boolean>>;
   children: ReactNode;
+  className?: string;
 };
 
-export const Toggle = ({ value, setter, children }: ToggleProps) => (
-  <label className={styles.toggle}>
+export const Toggle = ({ value, setter, children, className }: ToggleProps) => (
+  <label className={cn(styles.toggle, className)}>
     <span>{children}</span>
     <input
       type={"checkbox"}

src/features/shaders/shaders.component.tsx

@@ -30,7 +30,12 @@ const Shaders = () => {
           label: nav_category,
         }))}
         options={[
-          <Toggle key={"show_code"} value={codeVisible} setter={setCodeVisible}>
+          <Toggle
+            key={"show_code"}
+            className={styles.toggle}
+            value={codeVisible}
+            setter={setCodeVisible}
+          >
             show code
           </Toggle>,
         ]}

src/features/shaders/shaders.module.scss

@@ -15,3 +15,7 @@
     }
   }
 }
+
+.toggle {
+  padding: 0 0.75rem !important;
+}