garrettmills/commafeed
1
0
Fork 0
forked from Archives/Athou_commafeed
Code Pull Requests Activity

show the whole title in the detailed view (#1097 #1144)

Browse Source
This commit is contained in:
Athou
2023-09-05 09:10:26 +02:00
parent 998385334b
commit b356be3e6f
1 changed files with 8 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
commafeed-client/src/components/content/FeedEntryHeader.tsx
View File

@@ -1,4 +1,4 @@
import { Box, createStyles, Text } from "@mantine/core" import { Box, createStyles, Space, Text } from "@mantine/core"
import { Entry } from "app/types" import { Entry } from "app/types"
import { RelativeDate } from "components/RelativeDate" import { RelativeDate } from "components/RelativeDate"
import { FeedEntryTitle } from "./FeedEntryTitle" import { FeedEntryTitle } from "./FeedEntryTitle"
@@ -12,17 +12,11 @@ export interface FeedEntryHeaderProps {
const useStyles = createStyles((theme, props: FeedEntryHeaderProps) => ({ const useStyles = createStyles((theme, props: FeedEntryHeaderProps) => ({
headerText: { headerText: {
fontWeight: theme.colorScheme === "light" && !props.entry.read ? "bold" : "inherit", fontWeight: theme.colorScheme === "light" && !props.entry.read ? "bold" : "inherit",
whiteSpace: props.expanded ? "inherit" : "nowrap",
overflow: "hidden",
textOverflow: "ellipsis",
}, },
headerSubtext: { headerSubtext: {
display: "flex", display: "flex",
alignItems: "center", alignItems: "center",
fontSize: "90%", fontSize: "90%",
whiteSpace: props.expanded ? "inherit" : "nowrap",
overflow: "hidden",
textOverflow: "ellipsis",
}, },
})) }))
export function FeedEntryHeader(props: FeedEntryHeaderProps) { export function FeedEntryHeader(props: FeedEntryHeaderProps) {
@@ -33,18 +27,13 @@ export function FeedEntryHeader(props: FeedEntryHeaderProps) {
<FeedEntryTitle entry={props.entry} /> <FeedEntryTitle entry={props.entry} />
</Box> </Box>
<Box className={classes.headerSubtext}> <Box className={classes.headerSubtext}>
<Box mr={6}> <FeedFavicon url={props.entry.iconUrl} />
<FeedFavicon url={props.entry.iconUrl} /> <Space w={6} />
</Box> <Text color="dimmed">
<Box> {props.entry.feedName}
<Text color="dimmed">{props.entry.feedName}</Text> <span> · </span>
</Box> <RelativeDate date={props.entry.date} />
<Box> </Text>
<Text color="dimmed">
<span>&nbsp;·&nbsp;</span>
<RelativeDate date={props.entry.date} />
</Text>
</Box>
</Box> </Box>
{props.expanded && ( {props.expanded && (
<Box className={classes.headerSubtext}> <Box className={classes.headerSubtext}>