chore: add npm icon + link

src/_data/nav.js

@@ -19,6 +19,7 @@ export default async function () {
     social: [
       { name: 'Email', url: '/contact', icon: 'at' },
       { name: 'GitHub', url: 'https://github.com/cdransf', icon: 'brand-github' },
+      { name: 'npm', url: 'https://www.npmjs.com/~cdransf', icon: 'brand-npm'},
       { name: 'Mastodon', url: 'https://social.lol/@cory', icon: 'brand-mastodon' },
       { name: 'Last.fm', url: 'https://www.last.fm/user/coryd_', icon: 'brand-lastfm' },
       { name: 'Trakt', url: 'https://trakt.tv/users/cdransf', icon: 'device-tv' },

src/_includes/partials/nav/theme-toggle.liquid

@@ -4,7 +4,9 @@
 {% endcapture %}
 <style>{{ css }}</style>
 <template id="theme-toggle-template">
-  <button class="theme__toggle">
+  <button
+    class="theme__toggle"
+    aria-label="Toggle site theme">
     <span class="light">
       {% tablericon "sun" "Toggle light theme" %}
     </span>

src/assets/styles/index.css

@@ -232,6 +232,7 @@ nav ul li .active svg:hover {
 /* social icons */
 .at svg { stroke: var(--brand-hey) !important; }
 .brand-github svg { stroke: var(--brand-github) !important; }
+.brand-npm svg { stroke: var(--brand-npm) !important; }
 .brand-mastodon svg { stroke: var(--brand-mastodon) !important; }
 .brand-lastfm svg { stroke: var(--brand-lastfm) !important; }
 .device-tv svg { stroke: var(--brand-trakt) !important; }
@@ -271,7 +272,7 @@ article {
 }
 
 footer nav:first-child {
-  gap: .75rem;
+  gap: .6rem;
   margin-top: 2rem;
   padding: 2rem 0 1rem;
   width: 100%;

src/assets/styles/partials/vars.css

@@ -42,8 +42,9 @@
   --accent-color-hover: var(--blue-800);
   --selection-color: var(--accent-color);
 
-  --brand-github: #333;
   --brand-hey: #5522fa;
+  --brand-github: #333;
+  --brand-npm: #cc3534;
   --brand-mastodon: #6364ff;
   --brand-lastfm: #d51007;
   --brand-trakt: #ed1c24;