yuuza/outline
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: Transparent thumbnails show document behind in hover previews

Browse Source
This commit is contained in:
Tom Moor
2023-07-29 22:51:14 -04:00
parent a3983c36c9
commit 7e1ea69939
2 changed files with 3 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/components/HoverPreview/Components.tsx
View File

@@ -56,7 +56,7 @@ export const CardContent = styled.div`
// &:after — gradient mask for overflow text // &:after — gradient mask for overflow text
export const Card = styled.div<{ fadeOut?: boolean; $borderRadius?: string }>` export const Card = styled.div<{ fadeOut?: boolean; $borderRadius?: string }>`
backdrop-filter: blur(10px); backdrop-filter: blur(10px);
background: ${(props) => props.theme.menuBackground}; background: ${s("menuBackground")};
padding: ${CARD_PADDING}px; padding: ${CARD_PADDING}px;
width: ${CARD_WIDTH}px; width: ${CARD_WIDTH}px;
font-size: 0.9em; font-size: 0.9em;

2
app/components/HoverPreview/HoverPreviewLink.tsx
View File

@@ -1,5 +1,6 @@
import * as React from "react"; import * as React from "react";
import styled from "styled-components"; import styled from "styled-components";
import { s } from "@shared/styles";
import Flex from "~/components/Flex"; import Flex from "~/components/Flex";
import { import {
Preview, Preview,
@@ -44,6 +45,7 @@ const Thumbnail = styled.img`
object-fit: cover; object-fit: cover;
max-width: ${CARD_WIDTH}px; max-width: ${CARD_WIDTH}px;
height: ${THUMBNAIL_HEIGHT}px; height: ${THUMBNAIL_HEIGHT}px;
background: ${s("menuBackground")};
`; `;
export default HoverPreviewLink; export default HoverPreviewLink;