From 489737274a3e634c8d35970457e2c16722e51cd1 Mon Sep 17 00:00:00 2001
From: Geometrically <18202329+Geometrically@users.noreply.github.com>
Date: Tue, 17 Jan 2023 10:11:29 -0700
Subject: [PATCH] Careers button (#921)

* Careers button

* Add link target
---
 layouts/default.vue | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/layouts/default.vue b/layouts/default.vue
index 84bfc731b..cea65314c 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -366,11 +366,13 @@
         <p>© Rinth, Inc.</p>
       </div>
       <div class="links links-1" role="region" aria-label="Legal">
-        <h4 aria-hidden="true">Legal</h4>
+        <h4 aria-hidden="true">Company</h4>
         <nuxt-link to="/legal/terms">Terms</nuxt-link>
         <nuxt-link to="/legal/privacy">Privacy</nuxt-link>
         <nuxt-link to="/legal/rules">Rules</nuxt-link>
-        <nuxt-link to="/legal/security">Security</nuxt-link>
+        <a :target="$external()" href="https://careers.modrinth.com">
+          Careers <span class="count-bubble">2</span>
+        </a>
       </div>
       <div class="links links-2" role="region" aria-label="Resources">
         <h4 aria-hidden="true">Resources</h4>
@@ -1168,6 +1170,15 @@ export default {
       &.links-3 {
         grid-area: links-3;
       }
+
+      .count-bubble {
+        font-size: 1rem;
+        border-radius: 5rem;
+        background: var(--color-brand);
+        color: var(--color-text-inverted);
+        padding: 0 0.25rem;
+        margin-left: 0.25rem;
+      }
     }
 
     .buttons {