Add play store badge

Shadow149 · Shadow149 · commit 939f340ad044 · 2024-06-28T18:24:02.000+01:00
diff --git a/assets/badge.svg b/assets/badge.svg
@@ -0,0 +1,3 @@
+<svg width="230" height="228" viewBox="0 0 230 228" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M115 0L134.989 20.9609L161.775 9.94228L171.51 37.2211L200.462 38.05L198.26 66.93L224.371 79.463L210.613 104.951L229.37 127.021L206.435 144.709L214.593 172.5L186.446 179.33L182.595 208.037L154.104 202.828L138.91 227.487L115 211.14L91.0902 227.487L75.8963 202.828L47.4047 208.037L43.5541 179.33L15.4071 172.5L23.5654 144.709L0.629982 127.021L19.3867 104.951L5.6285 79.463L31.7403 66.93L29.5383 38.05L58.4903 37.2211L68.2253 9.94228L95.0114 20.9609L115 0Z" fill="#F4921E"/>
+</svg>
diff --git a/assets/favicon.png b/assets/favicon.png
diff --git a/index.html b/index.html
@@ -7,6 +7,7 @@
         <link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;500&display=swap" rel="stylesheet">
         <link href="styles.css" rel="stylesheet">
         <link href="styles/media.css" rel="stylesheet">
+        <link rel="icon" type="image/x-icon" href="/assets/favicon.png">
         <meta name="viewport" content="width=device-width, initial-scale=1">
         <script type="text/javascript" src="javascript/night_mode.js"></script>
         <script type="module" src="script.js"></script>
diff --git a/projects/index.html b/projects/index.html
@@ -8,6 +8,7 @@
         <link href="../styles.css" rel="stylesheet">
         <link href="../styles/media.css" rel="stylesheet">
         <link href="styles.css" rel="stylesheet">
+        <link rel="icon" type="image/x-icon" href="../assets/favicon.png">
         <meta name="viewport" content="width=device-width, initial-scale=1">
         <script type="text/javascript" src="../javascript/night_mode.js"></script>
         <script type="module" src="script.js"></script>
@@ -76,6 +77,10 @@ <h3>Simulation competition environment, as part of RoboCupJunior Rescue.</h3>
                         </ul>
                     </div>
                     <div class="card-container">
+                        <a class="badge" href="https://play.google.com/store/apps/details?id=com.lazy.lazycubeapp&hl=en_GB"
+                            target="_blank">
+                            <div class="badge-text">Now on Google Play store!</div>
+                        </a>
                         <a class="card-wrap" href="https://gitlab.com/AlfredRoberts/lazycube"
                             target="_blank">
                             <div class="card" data-img="../assets/lazy_cube_background.png"></div>
diff --git a/projects/styles.css b/projects/styles.css
@@ -115,6 +115,33 @@ ul li {
     opacity: 0.05;
 }
 
+.badge {
+    width: 100px;
+    height: 100px;
+    position: absolute;
+    z-index: 1;
+    filter: drop-shadow(0px 0px 15px #00000053);
+    translate: 90% -210%;
+    background-image: url(../assets/badge.svg);
+    background-repeat: no-repeat;
+    background-size: 100px;
+    display: flex;
+    flex-wrap: nowrap;
+    justify-content: center;
+    align-items: center;
+    transform: rotate(-20deg);
+}
+
+.badge-text {
+    width: 80%;
+    text-align: center;
+    font-family: cursive;
+    line-height: 12px;
+    font-size: 13px;
+    padding: 5px;
+    font-style: italic;
+}
+
 
 
 @media (max-width: 1100px) {
diff --git a/resume/index.html b/resume/index.html
@@ -6,6 +6,7 @@
         <link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;500&display=swap" rel="stylesheet">
         <link href="../styles.css" rel="stylesheet">
         <link href="../styles/media.css" rel="stylesheet">
+        <link rel="icon" type="image/x-icon" href="../assets/favicon.png">
         <script type="module" src="script.js"></script>
         <meta name="viewport" content="width=device-width, initial-scale=1">
     </head>
