mirror of
https://github.com/Stone-Red-Code/website.git
synced 2026-09-07 16:06:12 +02:00
fix: resource link in light mode
This commit is contained in:
@@ -49,10 +49,12 @@ export const Box = styled.div`
|
|||||||
|
|
||||||
a:not(.anchor) {
|
a:not(.anchor) {
|
||||||
position: relative;
|
position: relative;
|
||||||
color: #fff !important;
|
color: ${(props) =>
|
||||||
|
props.theme.name === "dark" ? "#fff" : "#000"} !important;
|
||||||
font-weight: 400 !important;
|
font-weight: 400 !important;
|
||||||
background: none !important;
|
background: none !important;
|
||||||
border-bottom: 1px solid #fff;
|
border-bottom: 1px solid ${(props) =>
|
||||||
|
props.theme.name === "dark" ? "#fff" : "#000"};
|
||||||
margin-bottom: 1px;
|
margin-bottom: 1px;
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -62,7 +64,8 @@ export const Box = styled.div`
|
|||||||
&:hover {
|
&:hover {
|
||||||
background: none;
|
background: none;
|
||||||
-webkit-background-clip: none;
|
-webkit-background-clip: none;
|
||||||
-webkit-text-fill-color: #fff;
|
-webkit-text-fill-color: ${(props) =>
|
||||||
|
props.theme.name === "dark" ? "#fff" : "#000"};
|
||||||
border-bottom-width: 2px;
|
border-bottom-width: 2px;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
@@ -75,6 +78,8 @@ export const Box = styled.div`
|
|||||||
content: "";
|
content: "";
|
||||||
/* I would prefer a svg, but could not get it to work */
|
/* I would prefer a svg, but could not get it to work */
|
||||||
background-image: url("${externalLink}");
|
background-image: url("${externalLink}");
|
||||||
|
filter: ${(props) =>
|
||||||
|
props.theme.name === "dark" ? "invert(0%)" : "invert(100%)"} ;
|
||||||
background-size: 16px 16px;
|
background-size: 16px 16px;
|
||||||
width: 16px;
|
width: 16px;
|
||||||
height: 16px;
|
height: 16px;
|
||||||
|
|||||||
Reference in New Issue
Block a user