website refactor

apps/website/templates/MediaTemplate.tsx

@@ -2,24 +2,25 @@
 
 import { MediaGallery } from '@/components/media/MediaGallery';
 import { MediaViewData } from '@/lib/view-data/MediaViewData';
-import { SharedBox, SharedContainer } from '@/components/shared/UIComponents';
+import { Box } from '@/ui/Box';
+import { Container } from '@/ui/Container';
 import { TemplateProps } from '@/lib/contracts/components/ComponentContracts';
 
 export function MediaTemplate({ viewData }: TemplateProps<MediaViewData>) {
   const { assets, categories, title, description } = viewData;
   
   return (
-    <SharedContainer>
-      <SharedBox paddingY={8}>
-        <SharedBox display="flex" flexDirection="col" gap={8}>
+    <Container>
+      <Box paddingY={8}>
+        <Box display="flex" flexDirection="col" gap={8}>
           <MediaGallery
             assets={assets}
             categories={categories}
             title={title}
             description={description}
           />
-        </SharedBox>
-      </SharedBox>
-    </SharedContainer>
+        </Box>
+      </Box>
+    </Container>
   );
 }