refactor: remove dead css

inertia/components/dashboard/dashboard_header.tsx

@@ -4,8 +4,8 @@ import {
 	ActionIcon,
 	AppShell,
 	Badge,
+	Box,
 	Burger,
-	Flex,
 	Group,
 	Menu,
 	Text,
@@ -36,14 +36,14 @@ export function DashboardHeader({ navbar, aside }: DashboardHeaderProps) {
 	return (
 		<AppShell.Header style={{ display: 'flex', alignItems: 'center' }}>
 			<Group justify="space-between" px="md" flex={1}>
-				<Group h="100%">
+				<Group h="100%" wrap="nowrap">
 					<Burger
 						opened={navbar.opened}
 						onClick={navbar.toggle}
 						hiddenFrom="sm"
 						size="sm"
 					/>
-					<Flex direction="column">
+					<Box w="50%">
 						<Text lineClamp={1}>
 							{activeCollection?.name}{' '}
 							{activeCollection?.visibility === Visibility.PUBLIC && (
@@ -55,7 +55,7 @@ export function DashboardHeader({ navbar, aside }: DashboardHeaderProps) {
 								{activeCollection.description}
 							</Text>
 						)}
-					</Flex>
+					</Box>
 				</Group>
 				<Group>
 					<ShareCollection />

inertia/components/dashboard/favorite/favorite_list.module.css

@@ -1,28 +0,0 @@
-.sideMenu {
-	height: 100%;
-	width: 100%;
-	display: flex;
-	gap: 0.35em;
-	flex-direction: column;
-}
-
-.listContainer {
-	height: 100%;
-	min-height: 0;
-	display: flex;
-	flex-direction: column;
-}
-
-.collectionList {
-	padding: 1px;
-	padding-right: 5px;
-	display: flex;
-	flex: 1;
-	gap: 0.35em;
-	flex-direction: column;
-	overflow: auto;
-}
-
-.noFavorite {
-	text-align: center;
-}

inertia/components/dashboard/favorite/favorite_list.tsx

@@ -1,8 +1,7 @@
-import { Box, Group, ScrollArea, Stack, Text } from '@mantine/core';
+import { Flex, Group, Stack, Text } from '@mantine/core';
 import { useTranslation } from 'react-i18next';
 import { FavoriteItem } from '~/components/dashboard/favorite/item/favorite_item';
 import { useFavorites } from '~/stores/collection_store';
-import styles from './favorite_list.module.css';
 
 export function FavoriteList() {
 	const { t } = useTranslation('common');
@@ -19,21 +18,15 @@ export function FavoriteList() {
 	}
 
 	return (
-		<Box className={styles.sideMenu}>
+		<Flex direction="column">
-			<Box className={styles.listContainer}>
+			<Text c="dimmed" mt="xs" ml="md" mb={4}>
-				<div style={{ display: 'flex', flexDirection: 'column' }}>
+				{t('favorite')} • {favorites.length}
-					<Text c="dimmed" mt="xs" ml="md" mb={4}>
+			</Text>
-						{t('favorite')} • {favorites.length}
+			<Stack gap={4}>
-					</Text>
+				{favorites.map((link) => (
-					<ScrollArea className={styles.collectionList}>
+					<FavoriteItem link={link} key={link.id} />
-						<Stack gap={4}>
+				))}
-							{favorites.map((link) => (
+			</Stack>
-								<FavoriteItem link={link} key={link.id} />
+		</Flex>
-							))}
-						</Stack>
-					</ScrollArea>
-				</div>
-			</Box>
-		</Box>
 	);
 }

inertia/components/dashboard/favorite/item/favorite_item.tsx

@@ -1,4 +1,4 @@
-import { Box, Card, Group, Text } from '@mantine/core';
+import { Card, Flex, Group, Text } from '@mantine/core';
 import { ExternalLinkStyled } from '~/components/common/external_link_styled';
 import LinkFavicon from '~/components/dashboard/link/item/favicon/link_favicon';
 import LinkControls from '~/components/dashboard/link/item/link_controls';
@@ -6,22 +6,18 @@ import { LinkWithCollection } from '~/types/app';
 import styles from './favorite_item.module.css';
 
 export const FavoriteItem = ({ link }: { link: LinkWithCollection }) => (
-	<ExternalLinkStyled
+	<ExternalLinkStyled href={link.url} title={link.url}>
-		href={link.url}
-		title={link.url}
-		style={{ width: '260px', maxWidth: '100%' }}
-	>
 		<Card className={styles.linkWrapper}>
 			<Group gap="xs" wrap="nowrap">
-				<LinkFavicon size={32} url={link.url} />
+				<LinkFavicon url={link.url} />
-				<Box maw="calc(100% - 80px)">
+				<Flex style={{ width: '100%' }} direction="column">
 					<Text lineClamp={1} c="blue">
 						{link.name}
 					</Text>
 					<Text c="gray" size="xs" mb={4} lineClamp={1}>
 						{link.collection.name}
 					</Text>
-				</Box>
+				</Flex>
 				<LinkControls link={link} showGoToCollection />
 			</Group>
 		</Card>

inertia/components/dashboard/link/item/link.module.css

@@ -12,7 +12,6 @@
 }
 
 .linkUrl {
-	max-width: calc(100% - 50px);
 	transition: opacity 0.15s;
 }
 

inertia/components/dashboard/link/item/link_item.tsx

@@ -43,7 +43,7 @@ function LinkItemURL({ url }: { url: Link['url'] }) {
 		return (
 			<Text className={styles.linkUrl} c="gray" size="xs" lineClamp={1}>
 				{origin}
-				{pathname}
+				{pathname !== '/' && pathname}
 			</Text>
 		);
 	} catch (error) {