Large header breakpoint

2025-08-02 14:34:22 -06:00
parent 47f023befa
commit 4a1aa02a28
7 changed files with 100 additions and 38 deletions
@@ -1,5 +1,17 @@
-export default function MenuBar({ children, className = "", ...props }) {
-  const baseStyles = `flex items-center px-[var(--spacing-scale-004)] py-[var(--spacing-scale-004)] gap-[var(--spacing-scale-001)] ${className}`;
+export default function MenuBar({
+  children,
+  className = "",
+  size = "default",
+  ...props
+}) {
+  const sizeStyles = {
+    default:
+      "px-[var(--spacing-scale-004)] py-[var(--spacing-scale-004)] gap-[var(--spacing-scale-001)]",
+    large:
+      "px-[var(--spacing-scale-004)] py-[var(--spacing-scale-004)] gap-[var(--spacing-scale-012)]",
+  };
+
+  const baseStyles = `flex items-center ${sizeStyles[size]} ${className}`;

  return (
    <nav className={baseStyles} {...props}>