duongdev
diff --git a/‎packages/web/src/@kathena/theme/theme.constants.ts‎
Lines changed: 1 addition & 1 deletion b/‎packages/web/src/@kathena/theme/theme.constants.ts‎
Lines changed: 1 addition & 1 deletion
diff --git a/‎packages/web/src/@kathena/ui/Dialog/Dialog.tsx‎
Lines changed: 10 additions & 2 deletions b/‎packages/web/src/@kathena/ui/Dialog/Dialog.tsx‎
Lines changed: 10 additions & 2 deletions
diff --git a/‎packages/web/src/@kathena/ui/hooks/usePagination.ts‎
Lines changed: 2 additions & 2 deletions b/‎packages/web/src/@kathena/ui/hooks/usePagination.ts‎
Lines changed: 2 additions & 2 deletions
diff --git a/‎packages/web/src/components/VideoPopup/VideoPopup.tsx‎
Lines changed: 13 additions & 4 deletions b/‎packages/web/src/components/VideoPopup/VideoPopup.tsx‎
Lines changed: 13 additions & 4 deletions
@@ -11,4 +11,4 @@ export const HEADING_FONT = `'Inter', sans-serif`
 export const SIDEBAR_WIDTH = 280
 export const APP_BAR_HEIGHT = 64
 export const DASHBOARD_SPACING = 3
-export const DASHBOARD_CARD_CONTENT_MAX_HEIGHT = 500
+export const DASHBOARD_CARD_CONTENT_MAX_HEIGHT = 2000
@@ -21,6 +21,7 @@ export type DialogProps = {
   width?: number | string
   classes?: Partial<Record<'dialogPaper', string>>
   children?: React.ReactNode
+  right?: number | string
 }
 
 const Dialog = (props: DialogProps) => {
@@ -43,7 +44,11 @@ const Dialog = (props: DialogProps) => {
         <DialogContentMUI>{children}</DialogContentMUI>
         <DialogActionsMUI>
           {extraDialogActions}
-          <Button onClick={handleClose} type="button">
+          <Button
+            onClick={handleClose}
+            type="button"
+            className={classes.rightPaper}
+          >
             Đóng
           </Button>
         </DialogActionsMUI>
@@ -52,11 +57,14 @@ const Dialog = (props: DialogProps) => {
   )
 }
 
-const useStyles = makeStyles<Theme, DialogProps, 'dialogPaper'>(() => ({
+const useStyles = makeStyles<Theme, DialogProps>(() => ({
   dialogPaper: {
     maxWidth: '95vw',
     width: ({ width }) => width,
   },
+  rightPaper: {
+    paddingRight: ({ right }) => right,
+  },
 }))
 
 export default Dialog
@@ -14,7 +14,7 @@ export const usePagination = (initialValues?: Partial<PaginationState>) => {
   } = useLocationQuery()
   const [{ page, perPage }, $setPagination] = useState<PaginationState>({
     page: initialValues?.page ?? +(qPage ?? '0'),
-    perPage: initialValues?.perPage ?? +(qPerPage ?? '10'),
+    perPage: initialValues?.perPage ?? +(qPerPage ?? '25'),
   })
   const dirtyRef = useRef(false)
 
@@ -58,7 +58,7 @@ export const usePagination = (initialValues?: Partial<PaginationState>) => {
 
   return {
     page: +((qPage ?? '0') as string),
-    perPage: +((qPerPage ?? '10') as string),
+    perPage: +((qPerPage ?? '25') as string),
     setPage,
     setPerPage,
   }
 
@@ -22,8 +22,9 @@ const VideoPopup: FC<VideoPopupProps> = (props) => {
     <Dialog
       open={open}
       onClose={onClose}
+      right="3.4em"
       extraDialogActions={
-        <>
+        <div style={{ justifyContent: 'space-between' }}>
           <Button
             disabled={index === 0}
             onClick={() => setIndex((state) => state - 1)}
@@ -36,11 +37,19 @@ const VideoPopup: FC<VideoPopupProps> = (props) => {
           >
             Next
           </Button>
-        </>
+        </div>
       }
     >
-      <Typography variant='h3' style={{ marginBottom: 10 }} >{videos[index].title}</Typography>
-      <div style={{ position: 'relative' }}>
+      <div
+        style={{
+          position: 'relative',
+          padding: '0 2em 0 2em',
+        }}
+      >
+        <Typography variant="h3" style={{ marginBottom: 10 }}>
+          {videos[index].title}
+        </Typography>
+
         <div
           // eslint-disable-next-line react/no-danger
           dangerouslySetInnerHTML={{ __html: videos[index].iframe as ANY }}