From e5dd399a077f7795aa1cc829d05d33ee4d2d6658 Mon Sep 17 00:00:00 2001
From: Neshura <neshura@neshweb.net>
Date: Wed, 15 Mar 2023 22:17:51 +0100
Subject: [PATCH] Added "Open in new tab" icon

---
 components/styles/cards/mobile.tsx | 15 ++++++++++++++-
 public/icons/open-new-window.svg   |  1 +
 2 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 public/icons/open-new-window.svg

diff --git a/components/styles/cards/mobile.tsx b/components/styles/cards/mobile.tsx
index da765e2..a744d0a 100644
--- a/components/styles/cards/mobile.tsx
+++ b/components/styles/cards/mobile.tsx
@@ -16,6 +16,7 @@ const Card = styled.div`
   flex-direction: column;
   align-items: center;
   width: 30rem;
+  max-width: 90%;
   min-height: 10rem;
   max-height: 15rem;
   margin-bottom: 2rem;
@@ -58,6 +59,16 @@ const CardTitleIcon = styled.div`
   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`
   height: 1.5rem;
   aspect-ratio: 1;
@@ -155,7 +166,9 @@ const CardTitle = ({ content, href }: { content: Service, href: string }) => {
           <CardTitleText>{content.name}</CardTitleText>
           {
           content.icon ? (
-            <CardTitleIconMirror />
+            <OpenInNewTab>
+              <Image alt="open" src={"/icons/open-new-window.svg"} fill />
+            </OpenInNewTab>
           ) : (<></>)
           }
         </CardTitleLink>
diff --git a/public/icons/open-new-window.svg b/public/icons/open-new-window.svg
new file mode 100644
index 0000000..ac2bb29
--- /dev/null
+++ b/public/icons/open-new-window.svg
@@ -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>
\ No newline at end of file