💄(frontend) improve DocsGridItem responsive padding

- Adjusted padding and alignment for desktop and mobile views
- Conditionally applied CSS styles based on screen size

Author: PanchoutNathan

CHANGELOG.md

@@ -19,6 +19,7 @@ and this project adheres to
 ## Changed
 
 - 💄(frontend) add abilities on doc row #581
+- 💄(frontend) improve DocsGridItem responsive padding  #582
 
 
 ## [2.0.1] - 2025-01-17

src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGridItem.tsx

@@ -68,10 +68,14 @@ export const DocsGridItem = ({ doc }: DocsGridItemProps) => {
             <SimpleDocItem isPinned={doc.is_favorite} doc={doc} />
             {showAccesses && (
               <Box
-                $padding={{ top: '3xs' }}
-                $css={css`
-                  align-self: flex-start;
-                `}
+                $padding={{ top: !isDesktop ? '4xs' : undefined }}
+                $css={
+                  !isDesktop
+                    ? css`
+                        align-self: flex-start;
+                      `
+                    : undefined
+                }
               >
                 <Tooltip
                   content={