diff --git a/src/components/Markdown/styles.tsx b/src/components/Markdown/styles.tsx index c39a773..0a0a0d8 100644 --- a/src/components/Markdown/styles.tsx +++ b/src/components/Markdown/styles.tsx @@ -168,29 +168,18 @@ export const MarkdownWrapper = styled.div` } a:not(.anchor):not(.button) { - display: inline-block; - position: relative; - font-weight: 700; - color: ${(props) => (props.theme.name === "dark" ? "#f9f9f9" : "#172129")}; text-decoration: none; - word-break: break-word; - cursor: pointer; - - &::after { - content: ""; - display: block; - width: 100%; - left: 0; - right: 0; - height: 2px; - background: linear-gradient(92.97deg, #feaf6d 0%, #ff70a5 100%); - } + color: inherit; + background-image: linear-gradient(120deg, #feaf6d 0%, #ff70a5 100%); + background-repeat: no-repeat; + background-size: 100% 3px; + background-position: 0 100%; + transition: all 0.125s ease-in; + font-weight: 700; &:hover { - background: linear-gradient(92.97deg, #feaf6d 0%, #ff70a5 100%); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; + color: black; + background-size: 100% 100%; } } ` diff --git a/src/components/ResourcesHomeContent/styles.tsx b/src/components/ResourcesHomeContent/styles.tsx index 8de1f94..7f1aba9 100644 --- a/src/components/ResourcesHomeContent/styles.tsx +++ b/src/components/ResourcesHomeContent/styles.tsx @@ -51,11 +51,13 @@ export const Box = styled.div` position: relative; color: #fff !important; font-weight: 400 !important; + background: none !important; border-bottom: 1px solid #fff; margin-bottom: 1px; display: inline-flex; align-items: center; font-size: 18px; + transition: none !important; &:hover { background: none; @@ -66,6 +68,7 @@ export const Box = styled.div` } &::after { + margin-left: 4px; position: absolute; left: 100%; display: block;