mirror of
https://github.com/Sonny93/my-links.git
synced 2025-12-09 07:03:25 +00:00
refactor: remove dead css
This commit is contained in:
@@ -4,8 +4,8 @@ import {
|
|||||||
ActionIcon,
|
ActionIcon,
|
||||||
AppShell,
|
AppShell,
|
||||||
Badge,
|
Badge,
|
||||||
|
Box,
|
||||||
Burger,
|
Burger,
|
||||||
Flex,
|
|
||||||
Group,
|
Group,
|
||||||
Menu,
|
Menu,
|
||||||
Text,
|
Text,
|
||||||
@@ -36,14 +36,14 @@ export function DashboardHeader({ navbar, aside }: DashboardHeaderProps) {
|
|||||||
return (
|
return (
|
||||||
<AppShell.Header style={{ display: 'flex', alignItems: 'center' }}>
|
<AppShell.Header style={{ display: 'flex', alignItems: 'center' }}>
|
||||||
<Group justify="space-between" px="md" flex={1}>
|
<Group justify="space-between" px="md" flex={1}>
|
||||||
<Group h="100%">
|
<Group h="100%" wrap="nowrap">
|
||||||
<Burger
|
<Burger
|
||||||
opened={navbar.opened}
|
opened={navbar.opened}
|
||||||
onClick={navbar.toggle}
|
onClick={navbar.toggle}
|
||||||
hiddenFrom="sm"
|
hiddenFrom="sm"
|
||||||
size="sm"
|
size="sm"
|
||||||
/>
|
/>
|
||||||
<Flex direction="column">
|
<Box w="50%">
|
||||||
<Text lineClamp={1}>
|
<Text lineClamp={1}>
|
||||||
{activeCollection?.name}{' '}
|
{activeCollection?.name}{' '}
|
||||||
{activeCollection?.visibility === Visibility.PUBLIC && (
|
{activeCollection?.visibility === Visibility.PUBLIC && (
|
||||||
@@ -55,7 +55,7 @@ export function DashboardHeader({ navbar, aside }: DashboardHeaderProps) {
|
|||||||
{activeCollection.description}
|
{activeCollection.description}
|
||||||
</Text>
|
</Text>
|
||||||
)}
|
)}
|
||||||
</Flex>
|
</Box>
|
||||||
</Group>
|
</Group>
|
||||||
<Group>
|
<Group>
|
||||||
<ShareCollection />
|
<ShareCollection />
|
||||||
|
|||||||
@@ -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;
|
|
||||||
}
|
|
||||||
@@ -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 { useTranslation } from 'react-i18next';
|
||||||
import { FavoriteItem } from '~/components/dashboard/favorite/item/favorite_item';
|
import { FavoriteItem } from '~/components/dashboard/favorite/item/favorite_item';
|
||||||
import { useFavorites } from '~/stores/collection_store';
|
import { useFavorites } from '~/stores/collection_store';
|
||||||
import styles from './favorite_list.module.css';
|
|
||||||
|
|
||||||
export function FavoriteList() {
|
export function FavoriteList() {
|
||||||
const { t } = useTranslation('common');
|
const { t } = useTranslation('common');
|
||||||
@@ -19,21 +18,15 @@ export function FavoriteList() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box className={styles.sideMenu}>
|
<Flex direction="column">
|
||||||
<Box className={styles.listContainer}>
|
|
||||||
<div style={{ display: 'flex', flexDirection: 'column' }}>
|
|
||||||
<Text c="dimmed" mt="xs" ml="md" mb={4}>
|
<Text c="dimmed" mt="xs" ml="md" mb={4}>
|
||||||
{t('favorite')} • {favorites.length}
|
{t('favorite')} • {favorites.length}
|
||||||
</Text>
|
</Text>
|
||||||
<ScrollArea className={styles.collectionList}>
|
|
||||||
<Stack gap={4}>
|
<Stack gap={4}>
|
||||||
{favorites.map((link) => (
|
{favorites.map((link) => (
|
||||||
<FavoriteItem link={link} key={link.id} />
|
<FavoriteItem link={link} key={link.id} />
|
||||||
))}
|
))}
|
||||||
</Stack>
|
</Stack>
|
||||||
</ScrollArea>
|
</Flex>
|
||||||
</div>
|
|
||||||
</Box>
|
|
||||||
</Box>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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 { ExternalLinkStyled } from '~/components/common/external_link_styled';
|
||||||
import LinkFavicon from '~/components/dashboard/link/item/favicon/link_favicon';
|
import LinkFavicon from '~/components/dashboard/link/item/favicon/link_favicon';
|
||||||
import LinkControls from '~/components/dashboard/link/item/link_controls';
|
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';
|
import styles from './favorite_item.module.css';
|
||||||
|
|
||||||
export const FavoriteItem = ({ link }: { link: LinkWithCollection }) => (
|
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}>
|
<Card className={styles.linkWrapper}>
|
||||||
<Group gap="xs" wrap="nowrap">
|
<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">
|
<Text lineClamp={1} c="blue">
|
||||||
{link.name}
|
{link.name}
|
||||||
</Text>
|
</Text>
|
||||||
<Text c="gray" size="xs" mb={4} lineClamp={1}>
|
<Text c="gray" size="xs" mb={4} lineClamp={1}>
|
||||||
{link.collection.name}
|
{link.collection.name}
|
||||||
</Text>
|
</Text>
|
||||||
</Box>
|
</Flex>
|
||||||
<LinkControls link={link} showGoToCollection />
|
<LinkControls link={link} showGoToCollection />
|
||||||
</Group>
|
</Group>
|
||||||
</Card>
|
</Card>
|
||||||
|
|||||||
@@ -12,7 +12,6 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.linkUrl {
|
.linkUrl {
|
||||||
max-width: calc(100% - 50px);
|
|
||||||
transition: opacity 0.15s;
|
transition: opacity 0.15s;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -43,7 +43,7 @@ function LinkItemURL({ url }: { url: Link['url'] }) {
|
|||||||
return (
|
return (
|
||||||
<Text className={styles.linkUrl} c="gray" size="xs" lineClamp={1}>
|
<Text className={styles.linkUrl} c="gray" size="xs" lineClamp={1}>
|
||||||
{origin}
|
{origin}
|
||||||
{pathname}
|
{pathname !== '/' && pathname}
|
||||||
</Text>
|
</Text>
|
||||||
);
|
);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
|
|||||||
Reference in New Issue
Block a user