feat(core): card view drag handle for doc explorer (#12431)

close AF-2624, AF-2628, AF-2581

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **New Features**
  - Introduced a draggable handle to document cards in the explorer, visible on hover in card view.
  - Added an option to remove grouping in the display menu.
  - Added contextual tooltips for user avatars indicating creation or last update.
  - Enabled optional tooltips on public user labels.
  - Extended dropdown buttons to accept custom styling classes.
  - Added a new masonry story showcasing item heights determined by ratios.

- **Style**
  - Enhanced drag handle appearance and visibility for card view items.
  - Replaced static shadows with theme-aware, smoothly transitioning shadows on card items.
  - Adjusted spacing between items in the document explorer for improved layout, with increased horizontal and (in card view) vertical gaps.
  - Reduced top padding in workspace page styles.
  - Added new button background style for secondary buttons.

- **Bug Fixes**
  - Removed duplicate internal property declarations to eliminate redundancy.

- **Refactor**
  - Simplified layout props by removing fixed height parameters in multiple components.
  - Updated masonry layout logic to support ratio-based item sizing alongside fixed heights.
  - Removed randomized skeleton loading placeholders, replacing them with fixed or no placeholders.
  - Refined masonry component typings and scrollbar placement for improved styling and layout.
  - Improved selection logic to activate selection mode when selecting all documents.

- **Localization**
  - Added new translation keys for grouping removal and user attribution tooltips.
  - Updated English locale with new strings for "Remove group" and user-created/updated tooltips.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

packages/frontend/core/src/desktop/pages/workspace/all-page/all-page.css.ts

@@ -33,7 +33,7 @@ export const body = style({
 export const scrollArea = style({
   height: 0,
   flex: 1,
-  paddingTop: '24px',
+  paddingTop: '12px',
 });
 
 // group
@@ -43,7 +43,7 @@ export const pinnedCollection = style({
   flexDirection: 'column',
   gap: 8,
   padding: '0 24px',
-  paddingTop: '24px',
+  paddingTop: '12px',
   '@container': {
     'docs-body (width <= 500px)': {
       padding: '0 20px',