Added dockerhub (#194)

docker-compose.yml

@@ -102,6 +102,7 @@ services:
       - LINE=https://line.me/en/
       - KAKAOTALK=https://www.kakaocorp.com/page/service/service/KakaoTalk?lang=ko
       - DESIGNBYHUMANS=https://www.designbyhumans.com/
+      - DOCKERHUB=https://hub.docker.com/
       - OG_SITE_NAME=Techno Tim Live (OG)
       - OG_TITLE=Techno Tim (OG)
       - OG_DESCRIPTION=Techno Tim Link page (OG)

public/css/brands.css

@@ -497,3 +497,9 @@ button {
   background-color: #fff
 }
 
+/* Dockerhub */
+.button.button-dockerhub {
+  color: #099cec;
+  background-color: #fff
+}
+

src/components/Home/Home.js

@@ -74,6 +74,7 @@ import osuLogo from '../../icons/osu.svg';
 import lineLogo from '../../icons/linemessenger.svg';
 import kakaoLogo from '../../icons/kaokotalk.svg';
 import designByHumansLogo from '../../icons/designbyhumans.svg';
+import dockerhubLogo from '../../icons/docker.svg';
 
 function Home(props) {
   let order = [];
@@ -788,6 +789,15 @@ function Home(props) {
                   order={buttonOrder('DESIGNBYHUMANS')}
                 />
               )}
+              {runtimeConfig.DOCKERHUB && (
+                <Button
+                  name="dockerhub"
+                  href={runtimeConfig.DOCKERHUB}
+                  displayName="Dockerhub"
+                  logo={dockerhubLogo}
+                  order={buttonOrder('DOCKERHUB')}
+                />
+              )}
             </Sort>
             <div>
               <p className="footer">

src/config.js

@@ -115,6 +115,7 @@ export const runtimeConfig =
         LINE: window?.env?.LINE,
         KAKAOTALK: window?.env?.KAKAOTALK,
         DESIGNBYHUMANS: window?.env?.DESIGNBYHUMANS,
+        DOCKERHUB: window?.env?.DOCKERHUB,
         MATOMO_URL: window?.env?.MATOMO_URL,
         MATOMO_SITE_ID: window?.env?.MATOMO_SITE_ID,
         SHARE: window?.env?.SHARE,
@@ -416,6 +417,9 @@ export const runtimeConfig =
         DESIGNBYHUMANS: nodeIsProduction
           ? process.env.DESIGNBYHUMANS
           : process.env.RAZZLE_DESIGNBYHUMANS,
+        DOCKERHUB: nodeIsProduction
+          ? process.env.DOCKERHUB
+          : process.env.RAZZLE_DOCKERHUB,
         MATOMO_URL: nodeIsProduction
           ? process.env.MATOMO_URL
           : process.env.RAZZLE_MATOMO_URL,

src/icons/docker.svg

@@ -0,0 +1 @@
+<?xml version="1.0" ?><!DOCTYPE svg  PUBLIC '-//W3C//DTD SVG 1.1//EN'  'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg height="512px" style="enable-background:new 0 0 512 512;" version="1.1" viewBox="0 0 512 512" width="512px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="_x39_7-docker"><g><g><rect height="43.193" style="fill:#099CEC;" width="47.506" x="229.999" y="147.225"/><rect height="42.69" style="fill:#099CEC;" width="47.506" x="229.999" y="199.115"/><rect height="43.193" style="fill:#099CEC;" width="47.506" x="173.869" y="147.225"/><rect height="42.691" style="fill:#099CEC;" width="47.507" x="286.2" y="199.043"/><rect height="43.625" style="fill:#099CEC;" width="47.506" x="229.999" y="94.975"/><rect height="43.193" style="fill:#099CEC;" width="47.505" x="117.738" y="147.225"/><rect height="42.691" style="fill:#099CEC;" width="47.506" x="173.869" y="199.043"/><path d="M476.441,219.095c-10.35-6.972-34.21-9.487-52.537-6.036     c-2.371-17.249-12.003-32.27-29.538-45.782l-10.062-6.685l-6.685,10.062c-13.225,19.98-16.817,52.896-2.658,74.602     c-6.252,3.377-18.545,7.978-34.786,7.689H27.757c-6.252,36.511,4.169,83.945,31.624,116.501     c26.663,31.551,66.623,47.579,118.872,47.579c113.124,0,196.851-52.104,236.021-146.76c15.381,0.288,48.584,0.073,65.618-32.483     c1.078-1.797,4.743-9.488,6.107-12.291L476.441,219.095z" style="fill:#099CEC;"/><polygon points="109.186,199.043 109.113,199.043 61.68,199.043 61.68,241.734 109.186,241.734    " style="fill:#099CEC;"/><rect height="42.691" style="fill:#099CEC;" width="47.505" x="117.738" y="199.043"/></g></g></g><g id="Layer_1"/></svg>