feat(button): Added Instant Gaming (#94) (#95)

README.md

@@ -148,6 +148,7 @@ services:
       - GITEA=https://gitea.io/
       - POLYWORK=https://www.polywork.com/
       - SIGNAL=https://signal.org/
+      - INSTANTGAMING=https://www.instant-gaming.com/
     ports:
       - 8080:3000
     restart: unless-stopped

docker-compose.yml

@@ -75,6 +75,7 @@ services:
       - SIGNAL=https://signal.org/
       - UNTAPPD=https://untappd.com/
       - BUTTON_TARGET=_blank
+      - INSTANTGAMING=https://www.instant-gaming.com/
     ports:
       - 8080:3000
     restart: unless-stopped

public/css/brands.css

@@ -525,7 +525,17 @@ button:hover,
   color: #000;
   background-color: #FFCE0D;
 }
-.button.button-signal:hover,
-.button.button-signal:focus {
+.button.button-untappd:hover,
+.button.button-untappd:focus {
   filter: brightness(90%)
-}
+}
+
+/* Instant Gaming */
+.button.button-instantgaming {
+  color: #f50;
+  background-color: #000;
+}
+.button.button-instantgaming:hover,
+.button.button-instantgaming:focus {
+  filter: brightness(90%)
+}

src/components/Home/Home.js

@@ -48,6 +48,7 @@ import giteaLogo from '../../icons/gitea.svg';
 import polyworkLogo from '../../icons/polywork.svg';
 import signalLogo from '../../icons/signal.svg';
 import untappdLogo from '../../icons/untappd.svg';
+import instantGamingLogo from '../../icons/instantgaming.svg';
 
 function Home(props) {
   let order = [];
@@ -528,6 +529,15 @@ function Home(props) {
                   order={buttonOrder('UNTAPPD')}
                 />
               )}
+              {runtimeConfig.INSTANTGAMING && (
+                <Button
+                  name="instantgaming"
+                  href={runtimeConfig.INSTANTGAMING}
+                  displayName="Instant Gaming"
+                  logo={instantGamingLogo}
+                  order={buttonOrder('INSTANTGAMING')}
+                />
+              )}
             </Sort>
             <div>
               <p className="footer">{runtimeConfig.FOOTER}</p>

src/config.js

@@ -77,6 +77,7 @@ export const runtimeConfig =
         SIGNAL: window?.env?.SIGNAL,
         UNTAPPD: window?.env?.UNTAPPD,
         BUTTON_TARGET: window?.env?.BUTTON_TARGET,
+        INSTANTGAMING: window?.env?.INSTANTGAMING,
       }
     : {
         // server
@@ -273,4 +274,7 @@ export const runtimeConfig =
         BUTTON_TARGET: nodeIsProduction
           ? process.env.BUTTON_TARGET
           : process.env.RAZZLE_BUTTON_TARGET,
+        INSTANTGAMING: nodeIsProduction
+          ? process.env.INSTANTGAMING
+          : process.env.RAZZLE_INSTANTGAMING,
       };