Commit 7bef4c8a authored by Ategon's avatar Ategon Committed by Grant
Browse files

Prevent the settings sidebar from resizing

parent c04c9e1c

packages/client/src/components/Settings/SettingsSidebar.tsx

+1 −0
Original line number Diff line number Diff line
@@ -21,6 +21,7 @@ export const SettingsSidebar = () => { 
      title="Settings"

      description="Configuration options for customizing your experience"

      side="Right"

      width="25rem"

    >

      <div className="p-4 flex flex-col gap-4">

        <TemplateSettings />

packages/client/src/components/SidebarBase.tsx

+4 −0
Original line number Diff line number Diff line
@@ -22,6 +22,7 @@ export const SidebarBase = ({ 
  title,

  description,

  side,

  width,

}: {

  children: string | JSX.Element | JSX.Element[];

  icon: LucideIcon;
@@ -30,12 +31,14 @@ export const SidebarBase = ({ 
  title: string;

  description?: string;

  side: "Left" | "Right";

  width?: string;

}) => {

  const reduceMotion = useReducedMotion() ?? false;



  return (

    <div>

      <motion.div

        style={{ width }}

        className={`min-w-[20rem] max-w-[75vw] md:max-w-[30vw] bg-white dark:bg-black flex flex-col justify-between fixed ${side === "Left" ? "left-0" : "right-0"}  h-full shadow-xl overflow-y-auto z-50 top-0`}

        initial={{ x: side === "Left" ? "-150%" : "150%" }}

        animate={{
@@ -52,6 +55,7 @@ export const SidebarBase = ({ 
        }

      />

      <motion.div

        style={{ width }}

        aria-hidden={!shown}

        data-sidebar-side={side}

        className={`canvas-sidebar canvas-sidebar--${side.toLowerCase()} min-w-[20rem] max-w-[75vw] md:max-w-[30vw] bg-white dark:bg-black text-black dark:text-white flex flex-col fixed ${side === "Left" ? "left-0" : "right-0"} h-full shadow-xl overflow-y-auto z-50 top-0`}