fix: pass-through to color / unset if no gradient

This commit is contained in:
Paul Makles 2022-07-16 12:59:59 +01:00
parent 73fd35bf46
commit dbe8a64ffc
2 changed files with 14 additions and 6 deletions

2
external/lang vendored

@ -1 +1 @@
Subproject commit 58a9fb697de00f570d445be4d12e3ce4a5e3522e Subproject commit 1a8542166173445602c0a4a8f821806002fd2fc4

View file

@ -1,7 +1,7 @@
import { observer } from "mobx-react-lite"; import { observer } from "mobx-react-lite";
import { useParams } from "react-router-dom"; import { useParams } from "react-router-dom";
import { User, API } from "revolt.js"; import { User, API } from "revolt.js";
import styled from "styled-components/macro"; import styled, { css } from "styled-components/macro";
import { Ref } from "preact"; import { Ref } from "preact";
import { Text } from "preact-i18n"; import { Text } from "preact-i18n";
@ -39,10 +39,18 @@ type UsernameProps = Omit<
}; };
const Name = styled.span<{ colour?: string | null }>` const Name = styled.span<{ colour?: string | null }>`
background: ${(props) => props.colour ?? "var(--foreground)"}; ${(props) =>
props.colour &&
(props.colour.includes("gradient")
? css`
background: ${props.colour};
background-clip: text; background-clip: text;
-webkit-background-clip: text; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
`
: css`
color: ${props.colour};
`)}
`; `;
export const Username = observer( export const Username = observer(