firefox browser support

nukehub-dev · Jan 9, 2025 · 326b16d · 326b16d
1 parent f081cef
commit 326b16d
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 33 deletions.
diff --git a/_includes/svg.html b/_includes/svg.html
@@ -8,39 +8,39 @@
   <g
      id="g10485"
      transform="matrix(3.1345855,0,0,3.1681526,-1119.1055,-1093.7635)">
-    <path class="home_nukehub-circle-light"
+    <path class="nukehub-logo-circle-light"
        d="m 385.12,463.48 c -4.44,13.5 -25.32,10.98 -24.58,-4.84 q 0.44,-9.43 4.73,-20.45 c 16.22,-41.66 43.4,-67.32 82.87,-86.81 6.57,-3.23 16,-4.4 21.9,0.25 5.87,4.63 5.15,14.67 0.11,19.81 q -2.01,2.05 -7.97,4.65 c -31.59,13.76 -60.02,40.66 -72.02,72.97 q -2.65,7.16 -5.04,14.42 z"
        id="path8881"
        />
-    <path class="home_nukehub-circle-light"
+    <path class="nukehub-logo-circle-light"
        d="m 580.69,375.81 c -8.55,-5.25 -6.46,-18.71 1.13,-23.07 6.21,-3.57 12.23,-1.85 18.21,1.5 36.82,20.65 69.97,55.47 81.05,96.48 1.62,5.99 0.63,13.94 -4.29,18.16 -6.47,5.53 -16.75,4.78 -20.87,-3.61 q -1.25,-2.54 -4.15,-11.45 c -9.63,-29.5 -29.11,-51.99 -55.74,-68.53 q -7.66,-4.75 -15.34,-9.48 z"
        id="path8883"
        />
-    <path class="home_nukehub-circle"
+    <path class="nukehub-logo-circle"
        d="m 451.17,494.48 c -14.33,-0.17 -28.77,-0.93 -43.06,-0.06 q -0.49,0.03 -0.45,-0.46 c 1.7,-19.31 7.65,-39.22 19.23,-54.92 12.16,-16.48 28.66,-31.06 47.76,-38.88 q 16.05,-6.58 33.29,-9.43 0.51,-0.08 0.5,0.43 l -0.29,44.63 a 0.67,0.67 0 0 1 -0.65,0.66 q -3.51,0.14 -6.78,1.21 c -26.17,8.65 -44.06,28.88 -48.96,56.32 q -0.09,0.5 -0.59,0.5 z"
        id="path8885"
        />
-    <path class="home_nukehub-circle"
+    <path class="nukehub-logo-circle"
        d="m 532.87,436.7 a 0.53,0.53 0 0 1 -0.42,-0.53 l 0.17,-44.11 q 0.01,-0.48 0.49,-0.44 38.83,3.68 66.19,31.05 10.82,10.83 19.09,23.67 c 9.72,15.09 12.84,30.4 14.66,48.33 q 0.06,0.55 -0.49,0.51 -22.65,-1.59 -45.33,-0.63 -0.53,0.02 -0.62,-0.5 c -1.97,-11.27 -5.31,-22.23 -12.18,-31.28 Q 559.21,442.74 532.87,436.7 Z"
        id="path8887"
        />
-    <path class="home_nukehub-circle-light"
+    <path class="nukehub-logo-circle-light"
        d="m 486.45,544.05 c -29.77,-27.76 -18.47,-74.32 19.6,-86.26 15.79,-4.95 34.04,-0.2 46.42,10.55 19.84,17.25 21.61,44.46 7.24,66.3 -16.4,24.94 -51.06,30.11 -73.26,9.41 z m 39.37,-44.52 a 17.6,17.6 0 0 0 -17.6,-17.6 17.6,17.6 0 0 0 -17.6,17.6 17.6,17.6 0 0 0 17.6,17.6 17.6,17.6 0 0 0 17.6,-17.6 z"
        id="path8889"
        />
-    <path class="home_nukehub-circle"
+    <path class="nukehub-logo-circle"
        d="m 633.48,518.74 a 0.37,0.37 0 0 1 0.35,0.4 c -4.98,56.3 -45.11,97.31 -100.96,104.1 q -0.28,0.03 -0.28,-0.26 l -0.12,-45.12 a 0.7,0.7 0 0 1 0.53,-0.68 c 28.34,-7.07 48.76,-28.83 52.71,-57.94 a 0.58,0.57 2.3 0 1 0.55,-0.5 q 23.61,-1.07 47.22,0 z"
        id="path8893"
        />
-    <path class="home_nukehub-circle"
+    <path class="nukehub-logo-circle"
        d="m 486.73,617.78 c -43.89,-14.64 -74.82,-51.87 -78.6,-98.46 q -0.04,-0.48 0.44,-0.49 18.71,-0.38 37.43,-0.34 2.66,0 5.29,0.35 0.49,0.07 0.53,0.55 c 2.95,28.92 29.37,51.88 56,58.18 q 0.38,0.09 0.39,0.49 l 0.33,44.69 q 0,0.46 -0.45,0.36 -14.33,-2.99 -21.36,-5.33 z"
        id="path8895"
        />
-    <path class="home_nukehub-circle-light"
+    <path class="nukehub-logo-circle-light"
        d="m 443.36,660.71 c -35.69,-19.39 -67.56,-50.9 -81.31,-89.23 -1.72,-4.8 -3.6,-10.45 -2.27,-15.38 q 2.48,-9.17 11.91,-10.16 c 7.83,-0.82 12,3.87 14.26,10.85 q 4.39,13.56 14.66,28.92 c 16.87,25.23 38.11,40.65 64.92,54.16 15.45,7.78 8.04,27.95 -7.79,25.88 q -6.73,-0.89 -14.38,-5.04 z"
        id="path8897"
        />
-    <path class="home_nukehub-circle-light"
+    <path class="nukehub-logo-circle-light"
        d="m 587.87,665.74 c -5.5,-0.8 -11.2,-4.91 -12.2,-10.7 -1.66,-9.57 2.87,-13.24 10.96,-17.83 30.8,-17.47 56.29,-41.82 66.53,-76.66 q 2.2,-7.46 3.79,-9.5 c 3.35,-4.27 8.78,-5.73 14.1,-4.55 14.04,3.14 10.56,17.53 6.89,27.99 -13.54,38.63 -40.24,65.15 -74.67,86.01 -4.92,2.97 -9.83,6.06 -15.4,5.24 z"
        id="path8899"
        />

diff --git a/css/nukehub.css b/css/nukehub.css
@@ -260,7 +260,7 @@ ul {
 
 /* TODO: REUSABLE CSS CLASSES */
 .section {
-  padding: 2rem 0 4rem;
+  margin: 2rem 0 4rem;
 }
 .section_title {
   font-size: var(--h1-font);
@@ -1403,19 +1403,21 @@ button {
 .home_social-icon:hover {
   color: var(--color-alt);
 }
-.home_nukehub {
+.nukehub-logo {
   fill: var(--svg-fill);
+  overflow: visible;
+  zoom: calc(1 / var(--zoom-scale));
 }
-.home_nukehub-circle-light {
+.nukehub-logo-circle-light {
   fill: var(--color);
 }
-.home_nukehub-circle {
+.nukehub-logo-circle {
   fill: var(--color-alt);
 }
-.home_nukehub:hover {
+.nukehub-logo:hover {
   animation: shake 0.5s;
 }
-.home_nukehub:active {
+.nukehub-logo:active {
   animation: shake 0.5s;
   animation-iteration-count: infinite;
 }
@@ -1470,7 +1472,7 @@ button {
   margin-bottom: var(--mb-0-75);
 }
 .home_description {
-  margin-bottom: var(--mb-2);
+  font-size: var(--normal-font);
 }
 
 /*TODO: Join */
@@ -1802,16 +1804,13 @@ textarea {
   .nav_list {
     column-gap: 0;
   }
-
   .list_title {
     font-size: var(--normal-font);
   }
-
   .box_container {
     justify-content: center;
     gap: 0.5rem;
   }
-
   .home_content {
     grid-template-columns: 0.25fr 3fr;
   }
@@ -1822,16 +1821,15 @@ textarea {
 }
 
 @media screen and (min-width: 600px) {
+  .nukehub-logo {
+    width: calc(300px * var(--zoom-scale));
+  }
   .home_content {
     grid-template-columns: max-content 1fr 1fr;
   }
   .home_data {
     grid-column: initial;
   }
-  .home_nukehub {
-    width: 320px;
-    transform: translateX(0);
-  }
   .home_img {
     order: 1;
     justify-self: center;
@@ -1865,7 +1863,7 @@ textarea {
     margin: 0;
   }
   .section {
-    padding: 5rem 0 2rem;
+    margin: 5rem 0 2rem;
   }
   .header {
     top: 0;
@@ -1960,13 +1958,9 @@ textarea {
     padding-top: 5.5rem;
     column-gap: 2rem;
   }
-  .home_nukehub {
-    width: 360px;
-  }
   .join_container {
     column-gap: 5rem;
   }
-
   .join_description {
     text-align: initial;
   }
@@ -2008,9 +2002,6 @@ textarea {
     left: 50%;
     transform: translate(-50%, -1%);
   }
-  .home_nukehub {
-    width: 390px;
-  }
   .home_social {
     transform: translateX(-6rem);
   }

diff --git a/css/nukehub.min.css b/css/nukehub.min.css
diff --git a/index.html b/index.html
@@ -40,7 +40,7 @@
         </a>
       </div>
       <div class="home_img">
-        {% include svg.html class="home_nukehub" %}
+        {% include svg.html class="nukehub-logo" %}
       </div>
       <div class="home_data">
         <h3 class="home_subtitle">Introducing</h3>