Added "Open in new tab" icon

This commit is contained in:
Neshura 2023-03-15 22:17:51 +01:00
parent 94223fd80c
commit e5dd399a07
Signed by: Neshura
GPG key ID: B6983AAA6B9A7A6C
2 changed files with 15 additions and 1 deletions

View file

@ -16,6 +16,7 @@ const Card = styled.div`
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
width: 30rem; width: 30rem;
max-width: 90%;
min-height: 10rem; min-height: 10rem;
max-height: 15rem; max-height: 15rem;
margin-bottom: 2rem; margin-bottom: 2rem;
@ -58,6 +59,16 @@ const CardTitleIcon = styled.div`
height: 1.5rem; height: 1.5rem;
`; `;
const OpenInNewTab = styled.div`
filter: invert();
position: relative;
object-fit: contain;
margin: 0.3rem;
margin-left: 0.5rem;
aspect-ratio: 1;
height: 1.2rem;
`
const CardTitleIconMirror = styled.div` const CardTitleIconMirror = styled.div`
height: 1.5rem; height: 1.5rem;
aspect-ratio: 1; aspect-ratio: 1;
@ -155,7 +166,9 @@ const CardTitle = ({ content, href }: { content: Service, href: string }) => {
<CardTitleText>{content.name}</CardTitleText> <CardTitleText>{content.name}</CardTitleText>
{ {
content.icon ? ( content.icon ? (
<CardTitleIconMirror /> <OpenInNewTab>
<Image alt="open" src={"/icons/open-new-window.svg"} fill />
</OpenInNewTab>
) : (<></>) ) : (<></>)
} }
</CardTitleLink> </CardTitleLink>

View file

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" viewBox="0 0 24 24" stroke-width="1.5" fill="none" xmlns="http://www.w3.org/2000/svg" color="#000000"><path d="M21 3h-6m6 0l-9 9m9-9v6" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path d="M21 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V5a2 2 0 012-2h6" stroke="#000000" stroke-width="1.5" stroke-linecap="round"></path></svg>

After

Width:  |  Height:  |  Size: 431 B