upd skeleton for cards

src/pages/Votings/pages/VotingsList/components/VotingListCardSkeleton.tsx

@@ -0,0 +1,32 @@
+import { Divider, Skeleton, Stack, StackProps } from '@mui/material'
+
+import { UiIcon } from '@/ui'
+
+type Props = StackProps
+
+export default function VotingListCard({ ...rest }: Props) {
+  return (
+    <Stack {...rest} spacing={6}>
+      <Stack spacing={2}>
+        <Skeleton width={48} />
+        <Skeleton />
+        <Skeleton />
+      </Stack>
+
+      <Divider />
+
+      <Stack
+        width='100%'
+        direction='row'
+        alignItems='center'
+        justifyContent='space-between'
+        spacing={2}
+      >
+        <Stack direction='row' spacing={2} alignItems='center'>
+          <UiIcon componentName='calendarMonth' size={4} />
+          <Skeleton width={24} />
+        </Stack>
+      </Stack>
+    </Stack>
+  )
+}

src/pages/Votings/pages/VotingsList/components/index.ts

@@ -1 +1,2 @@
 export { default as VotingListCard } from './VotingListCard'
+export { default as VotingListCardSkeleton } from './VotingListCardSkeleton'

src/pages/Votings/pages/VotingsList/index.tsx

@@ -1,9 +1,9 @@
-import { Alert, Box, Grid, Paper, Skeleton, Stack } from '@mui/material'
+import { Alert, Paper, Stack } from '@mui/material'
 
 import { NoDataViewer, PageTitles } from '@/common'
 import { useVotingsContext } from '@/pages/Votings/contexts'
 
-import { VotingListCard } from './components'
+import { VotingListCard, VotingListCardSkeleton } from './components'
 
 export default function VotingsList() {
   const { AppVotings, isVotingsLoading, isVotingsLoadingError } = useVotingsContext()
@@ -13,14 +13,14 @@ export default function VotingsList() {
       <PageTitles title={'Active Polls'} />
 
       {isVotingsLoading ? (
-        <Grid container spacing={4}>
-          <Box component={Grid} item xs={6}>
-            <Skeleton height={360} />
-          </Box>
-          <Box component={Grid} item xs={6}>
-            <Skeleton height={360} />
-          </Box>
-        </Grid>
+        <Stack mt={6} spacing={6}>
+          <Paper>
+            <VotingListCardSkeleton />
+          </Paper>
+          <Paper>
+            <VotingListCardSkeleton />
+          </Paper>
+        </Stack>
       ) : isVotingsLoadingError ? (
         <Alert severity='error'>{`There's an error occurred, please, reload page`}</Alert>
       ) : AppVotings.length ? (