@shohojdhara/atomix 0.4.5 → 0.4.6

package/src/components/AtomixGlass/stories/shared-components.tsx

@@ -75,16 +75,18 @@ export const BackgroundWrapper: React.FC<BackgroundWrapperProps> = ({
 
   const bgStyle = {
     backgroundImage: bgImage ? `url(${bgImage})` : undefined,
+    backgroundSize: 'cover',
+    backgroundPosition: 'center',
+    backgroundRepeat: 'no-repeat',
     height,
     width,
     borderRadius,
-    padding,
     ...style,
   };
 
   return (
     <div
-      className={`u-relative u-overflow-hidden ${className}`}
+      className={`u-relative u-overflow-hidden u-flex u-items-center u-justify-center ${className}`}
       style={bgStyle}
       aria-hidden={ariaHidden}
     >
@@ -94,10 +96,16 @@ export const BackgroundWrapper: React.FC<BackgroundWrapperProps> = ({
           style={{
             backgroundColor: overlayColor,
             opacity: overlayOpacity,
+            padding,
           }}
         />
       )}
-      <div className="u-relative u-z-10">{children}</div>
+      <div
+        className="u-relative u-z-10 u-w-100 u-h-100 u-flex u-items-center u-justify-center"
+        style={{ padding }}
+      >
+        {children}
+      </div>
     </div>
   );
 };

package/src/components/Navigation/Navbar/Navbar.tsx

@@ -152,15 +152,23 @@ export const Navbar = forwardRef<HTMLElement, NavbarProps>(
         shaderVariant: 'premiumGlass' as const,
       };
       const glassProps = glass === true ? defaultGlassProps : { ...defaultGlassProps, ...glass };
+
+      // AtomixGlass hoists layout props (position/top/left/right/zIndex) to its
+      // root element, keeping all internal layers in the same stacking context.
+      const isFixed = position === 'fixed' || position === 'fixed-bottom';
+
       return (
         <AtomixGlass
           {...glassProps}
           style={{
-            ...(position === 'fixed' && { position: 'fixed' }),
-            left: 0,
-            right: 0,
-            top: 0,
-            zIndex: 1000,
+            ...(isFixed && {
+              position: 'fixed' as const,
+              top: position === 'fixed' ? 0 : undefined,
+              bottom: position === 'fixed-bottom' ? 0 : undefined,
+              left: 0,
+              right: 0,
+              zIndex: 1030, // matches --atomix-navbar-z-index from _components.navbar.scss
+            }),
           }}
         >
           <nav

package/src/lib/composables/index.ts

@@ -29,8 +29,7 @@ export * from './useTodo';
 export * from './useForm';
 export * from './useFormGroup';
 
-// GlassContainer composables
-export * from './useGlassContainer';
+// AtomixGlass composables
 export * from './useAtomixGlass';
 export * from './useInput';
 export * from './useRadio';