style: correct collection loading (#5288)

* style: correct collection loading

* review comments

src/nft/components/collection/CollectionPageSkeleton.tsx

+import Column from 'components/Column'
+import Row from 'components/Row'
 import { Box } from 'nft/components/Box'
-import { Column, Row } from 'nft/components/Flex'
 import { useIsMobile } from 'nft/hooks'
 import { CollectionBannerLoading } from 'nft/pages/collection'
 import { COLLECTION_BANNER_HEIGHT } from 'nft/pages/collection'
+import { ScreenBreakpointsPaddings } from 'nft/pages/collection/index.css'
+import styled from 'styled-components/macro'
 
 import { ActivitySwitcherLoading } from './ActivitySwitcher'
 import { CollectionNftsAndMenuLoading } from './CollectionNfts'
 import { CollectionStatsLoading } from './CollectionStats'
 
+const CollectionDescriptionSection = styled(Column)`
+  ${ScreenBreakpointsPaddings}
+`
+
+const CollectionAssets = styled(Box)`
+  ${ScreenBreakpointsPaddings}
+`
+
+const StyledColumn = styled(Column)`
+  width: 100%;
+`
+
+const StyledRow = styled(Row)`
+  gap: 24px;
+  margin-bottom: 28px;
+`
+
 export const CollectionPageSkeleton = () => {
   const isMobile = useIsMobile()
   return (
-    <Column width="full">
+    <StyledColumn>
       <Box width="full" height={`${COLLECTION_BANNER_HEIGHT}`}>
         <CollectionBannerLoading />
       </Box>
-      <Column paddingX="32">
+      <CollectionDescriptionSection>
         <CollectionStatsLoading isMobile={isMobile} />
-        <Row gap="24" marginBottom="28">
-          {ActivitySwitcherLoading}
-        </Row>
-      </Column>
-      <Box paddingX="48">
+        <StyledRow>{ActivitySwitcherLoading}</StyledRow>
+      </CollectionDescriptionSection>
+      <CollectionAssets>
         <CollectionNftsAndMenuLoading />
-      </Box>
-    </Column>
+      </CollectionAssets>
+    </StyledColumn>
   )
 }