Social Media Section in About (#372)

Neurodiversity-in-Business · Jul 31, 2023 · 840d2d7 · 840d2d7
1 parent 00f6695
commit 840d2d7
Show file tree

Hide file tree

Showing 4 changed files with 212 additions and 49 deletions.
diff --git a/src/app/about/about.component.css b/src/app/about/about.component.css
@@ -40,4 +40,4 @@ h3 {
   justify-content: space-between;
   flex-direction: column;
   display: flex;
-}
+}
diff --git a/src/app/about/about.component.html b/src/app/about/about.component.html
@@ -37,6 +37,213 @@ <h3>The Neurotypical</h3>
     </div>
   </div>
 </div>
+<br />
+
+<div class="container-fluid">
+  <div class="row">
+    <h2 id="pageHeader">Social Media</h2>
+  </div>
+  <p>
+    Neurodiversity in Business (NiB) operates across the social media landscape
+    to connect neurodiverse talent and employers. We are a not-for-profit
+    organisation and we are not a recruitment agency.
+  </p>
+  <div style="text-align: center" class="row mx-auto">
+    <div class="col">
+      <p style="font-weight: bold">Thank you for 30K followers on LinkedIn!</p>
+      <video height="480" class="videoInsert" autoplay loop muted>
+        <source
+          src="../../assets/2023-07-17_NIB_30k_FollowersAnouncement_V2.mp4"
+          type="video/mp4"
+        />
+        Your browser does not support the video tag.
+      </video>
+    </div>
+    <div class="col mx-auto">
+      <div style="padding: 10px">
+        <a
+          href="https://www.linkedin.com/company/80093288"
+          target="_blank"
+          title="LinkedIn"
+        >
+          <svg
+            viewBox="0 0 72 72"
+            height="64"
+            width="64"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <g fill="none" fill-rule="evenodd">
+              <path
+                d="M8,72 L64,72 C68.418278,72 72,68.418278 72,64 L72,8 C72,3.581722 68.418278,-8.11624501e-16 64,0 L8,0 C3.581722,8.11624501e-16 -5.41083001e-16,3.581722 0,8 L0,64 C5.41083001e-16,68.418278 3.581722,72 8,72 Z"
+                fill="#007EBB"
+              />
+              <path
+                d="M62,62 L51.315625,62 L51.315625,43.8021149 C51.315625,38.8127542 49.4197917,36.0245323 45.4707031,36.0245323 C41.1746094,36.0245323 38.9300781,38.9261103 38.9300781,43.8021149 L38.9300781,62 L28.6333333,62 L28.6333333,27.3333333 L38.9300781,27.3333333 L38.9300781,32.0029283 C38.9300781,32.0029283 42.0260417,26.2742151 49.3825521,26.2742151 C56.7356771,26.2742151 62,30.7644705 62,40.051212 L62,62 Z M16.349349,22.7940133 C12.8420573,22.7940133 10,19.9296567 10,16.3970067 C10,12.8643566 12.8420573,10 16.349349,10 C19.8566406,10 22.6970052,12.8643566 22.6970052,16.3970067 C22.6970052,19.9296567 19.8566406,22.7940133 16.349349,22.7940133 Z M11.0325521,62 L21.769401,62 L21.769401,27.3333333 L11.0325521,27.3333333 L11.0325521,62 Z"
+                fill="#FFF"
+              />
+            </g>
+          </svg>
+        </a>
+      </div>
+      <hr />
+      <div style="padding: 10px; max-height: min-content">
+        <a
+          href="https://www.youtube.com/channel/UCk0YOpwyHt8IoJMNmOUHy1g"
+          target="_blank"
+          title="Youtube"
+        >
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            xmlns:xlink="http://www.w3.org/1999/xlink"
+            version="1.1"
+            width="64"
+            height="64"
+            viewBox="0 0 256 256"
+            xml:space="preserve"
+          >
+            <defs></defs>
+            <g
+              style="
+                stroke: none;
+                stroke-width: 0;
+                stroke-dasharray: none;
+                stroke-linecap: butt;
+                stroke-linejoin: miter;
+                stroke-miterlimit: 10;
+                fill: none;
+                fill-rule: nonzero;
+                opacity: 1;
+              "
+              transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)"
+            >
+              <path
+                d="M 88.119 23.338 c -1.035 -3.872 -4.085 -6.922 -7.957 -7.957 C 73.144 13.5 45 13.5 45 13.5 s -28.144 0 -35.162 1.881 c -3.872 1.035 -6.922 4.085 -7.957 7.957 C 0 30.356 0 45 0 45 s 0 14.644 1.881 21.662 c 1.035 3.872 4.085 6.922 7.957 7.957 C 16.856 76.5 45 76.5 45 76.5 s 28.144 0 35.162 -1.881 c 3.872 -1.035 6.922 -4.085 7.957 -7.957 C 90 59.644 90 45 90 45 S 90 30.356 88.119 23.338 z"
+                style="
+                  stroke: none;
+                  stroke-width: 1;
+                  stroke-dasharray: none;
+                  stroke-linecap: butt;
+                  stroke-linejoin: miter;
+                  stroke-miterlimit: 10;
+                  fill: rgb(255, 0, 0);
+                  fill-rule: nonzero;
+                  opacity: 1;
+                "
+                transform=" matrix(1 0 0 1 0 0) "
+                stroke-linecap="round"
+              />
+              <polygon
+                points="36,58.5 59.38,45 36,31.5 "
+                style="
+                  stroke: none;
+                  stroke-width: 1;
+                  stroke-dasharray: none;
+                  stroke-linecap: butt;
+                  stroke-linejoin: miter;
+                  stroke-miterlimit: 10;
+                  fill: rgb(255, 255, 255);
+                  fill-rule: nonzero;
+                  opacity: 1;
+                "
+                transform="  matrix(1 0 0 1 0 0) "
+              />
+            </g>
+          </svg>
+        </a>
+      </div>
+      <hr />
+      <div style="padding: 10px">
+        <a
+          href="https://www.instagram.com/ndinbusiness/"
+          target="_blank"
+          title="Instagram"
+        >
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            xmlns:xlink="http://www.w3.org/1999/xlink"
+            height="64"
+            width="64"
+            viewBox="-19.5036 -32.49725 169.0312 194.9835"
+          >
+            <defs>
+              <radialGradient
+                fy="578.088"
+                fx="158.429"
+                gradientTransform="matrix(0 -1.98198 1.8439 0 -1031.399 454.004)"
+                gradientUnits="userSpaceOnUse"
+                xlink:href="#a"
+                r="65"
+                cy="578.088"
+                cx="158.429"
+                id="c"
+              />
+              <radialGradient
+                fy="473.455"
+                fx="147.694"
+                gradientTransform="matrix(.17394 .86872 -3.5818 .71718 1648.351 -458.493)"
+                gradientUnits="userSpaceOnUse"
+                xlink:href="#b"
+                r="65"
+                cy="473.455"
+                cx="147.694"
+                id="d"
+              />
+              <linearGradient id="b">
+                <stop stop-color="#3771c8" offset="0" />
+                <stop offset=".128" stop-color="#3771c8" />
+                <stop stop-opacity="0" stop-color="#60f" offset="1" />
+              </linearGradient>
+              <linearGradient id="a">
+                <stop stop-color="#fd5" offset="0" />
+                <stop stop-color="#fd5" offset=".1" />
+                <stop stop-color="#ff543e" offset=".5" />
+                <stop stop-color="#c837ab" offset="1" />
+              </linearGradient>
+            </defs>
+            <path
+              d="M65.033 0C37.891 0 29.953.028 28.41.156c-5.57.463-9.036 1.34-12.812 3.22-2.91 1.445-5.205 3.12-7.47 5.468-4.125 4.282-6.625 9.55-7.53 15.812-.44 3.04-.568 3.66-.594 19.188-.01 5.176 0 11.988 0 21.125 0 27.12.03 35.05.16 36.59.45 5.42 1.3 8.83 3.1 12.56 3.44 7.14 10.01 12.5 17.75 14.5 2.68.69 5.64 1.07 9.44 1.25 1.61.07 18.02.12 34.44.12 16.42 0 32.84-.02 34.41-.1 4.4-.207 6.955-.55 9.78-1.28a27.22 27.22 0 0017.75-14.53c1.765-3.64 2.66-7.18 3.065-12.317.088-1.12.125-18.977.125-36.81 0-17.836-.04-35.66-.128-36.78-.41-5.22-1.305-8.73-3.127-12.44-1.495-3.037-3.155-5.305-5.565-7.624-4.3-4.108-9.56-6.608-15.829-7.512C102.338.157 101.733.027 86.193 0z"
+              fill="url(#c)"
+            />
+            <path
+              d="M65.033 0C37.891 0 29.953.028 28.41.156c-5.57.463-9.036 1.34-12.812 3.22-2.91 1.445-5.205 3.12-7.47 5.468-4.125 4.282-6.625 9.55-7.53 15.812-.44 3.04-.568 3.66-.594 19.188-.01 5.176 0 11.988 0 21.125 0 27.12.03 35.05.16 36.59.45 5.42 1.3 8.83 3.1 12.56 3.44 7.14 10.01 12.5 17.75 14.5 2.68.69 5.64 1.07 9.44 1.25 1.61.07 18.02.12 34.44.12 16.42 0 32.84-.02 34.41-.1 4.4-.207 6.955-.55 9.78-1.28a27.22 27.22 0 0017.75-14.53c1.765-3.64 2.66-7.18 3.065-12.317.088-1.12.125-18.977.125-36.81 0-17.836-.04-35.66-.128-36.78-.41-5.22-1.305-8.73-3.127-12.44-1.495-3.037-3.155-5.305-5.565-7.624-4.3-4.108-9.56-6.608-15.829-7.512C102.338.157 101.733.027 86.193 0z"
+              fill="url(#d)"
+            />
+            <path
+              d="M65.003 17c-13.036 0-14.672.057-19.792.29-5.11.234-8.598 1.043-11.65 2.23-3.157 1.226-5.835 2.866-8.503 5.535-2.67 2.668-4.31 5.346-5.54 8.502-1.19 3.053-2 6.542-2.23 11.65C17.06 50.327 17 51.964 17 65s.058 14.667.29 19.787c.235 5.11 1.044 8.598 2.23 11.65 1.227 3.157 2.867 5.835 5.536 8.503 2.667 2.67 5.345 4.314 8.5 5.54 3.054 1.187 6.543 1.996 11.652 2.23 5.12.233 6.755.29 19.79.29 13.037 0 14.668-.057 19.788-.29 5.11-.234 8.602-1.043 11.656-2.23 3.156-1.226 5.83-2.87 8.497-5.54 2.67-2.668 4.31-5.346 5.54-8.502 1.18-3.053 1.99-6.542 2.23-11.65.23-5.12.29-6.752.29-19.788 0-13.036-.06-14.672-.29-19.792-.24-5.11-1.05-8.598-2.23-11.65-1.23-3.157-2.87-5.835-5.54-8.503-2.67-2.67-5.34-4.31-8.5-5.535-3.06-1.187-6.55-1.996-11.66-2.23-5.12-.233-6.75-.29-19.79-.29zm-4.306 8.65c1.278-.002 2.704 0 4.306 0 12.816 0 14.335.046 19.396.276 4.68.214 7.22.996 8.912 1.653 2.24.87 3.837 1.91 5.516 3.59 1.68 1.68 2.72 3.28 3.592 5.52.657 1.69 1.44 4.23 1.653 8.91.23 5.06.28 6.58.28 19.39s-.05 14.33-.28 19.39c-.214 4.68-.996 7.22-1.653 8.91-.87 2.24-1.912 3.835-3.592 5.514-1.68 1.68-3.275 2.72-5.516 3.59-1.69.66-4.232 1.44-8.912 1.654-5.06.23-6.58.28-19.396.28-12.817 0-14.336-.05-19.396-.28-4.68-.216-7.22-.998-8.913-1.655-2.24-.87-3.84-1.91-5.52-3.59-1.68-1.68-2.72-3.276-3.592-5.517-.657-1.69-1.44-4.23-1.653-8.91-.23-5.06-.276-6.58-.276-19.398s.046-14.33.276-19.39c.214-4.68.996-7.22 1.653-8.912.87-2.24 1.912-3.84 3.592-5.52 1.68-1.68 3.28-2.72 5.52-3.592 1.692-.66 4.233-1.44 8.913-1.655 4.428-.2 6.144-.26 15.09-.27zm29.928 7.97a5.76 5.76 0 105.76 5.758c0-3.18-2.58-5.76-5.76-5.76zm-25.622 6.73c-13.613 0-24.65 11.037-24.65 24.65 0 13.613 11.037 24.645 24.65 24.645C78.616 89.645 89.65 78.613 89.65 65S78.615 40.35 65.002 40.35zm0 8.65c8.836 0 16 7.163 16 16 0 8.836-7.164 16-16 16-8.837 0-16-7.164-16-16 0-8.837 7.163-16 16-16z"
+              fill="#fff"
+            />
+          </svg>
+        </a>
+      </div>
+      <hr />
+      <div style="padding: 10px">
+        <a
+          href="https://github.com/Neurodiversity-in-Business/neurodiversity-in-business.github.io"
+          target="_blank"
+          title="Github"
+        >
+          <svg
+            width="64"
+            height="64"
+            viewBox="0 0 1024 1024"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              fill-rule="evenodd"
+              clip-rule="evenodd"
+              d="M8 0C3.58 0 0 3.58 0 8C0 11.54 2.29 14.53 5.47 15.59C5.87 15.66 6.02 15.42 6.02 15.21C6.02 15.02 6.01 14.39 6.01 13.72C4 14.09 3.48 13.23 3.32 12.78C3.23 12.55 2.84 11.84 2.5 11.65C2.22 11.5 1.82 11.13 2.49 11.12C3.12 11.11 3.57 11.7 3.72 11.94C4.44 13.15 5.59 12.81 6.05 12.6C6.12 12.08 6.33 11.73 6.56 11.53C4.78 11.33 2.92 10.64 2.92 7.58C2.92 6.71 3.23 5.99 3.74 5.43C3.66 5.23 3.38 4.41 3.82 3.31C3.82 3.31 4.49 3.1 6.02 4.13C6.66 3.95 7.34 3.86 8.02 3.86C8.7 3.86 9.38 3.95 10.02 4.13C11.55 3.09 12.22 3.31 12.22 3.31C12.66 4.41 12.38 5.23 12.3 5.43C12.81 5.99 13.12 6.7 13.12 7.58C13.12 10.65 11.25 11.33 9.47 11.53C9.76 11.78 10.01 12.26 10.01 13.01C10.01 14.08 10 14.94 10 15.21C10 15.42 10.15 15.67 10.55 15.59C13.71 14.53 16 11.53 16 8C16 3.58 12.42 0 8 0Z"
+              transform="scale(64)"
+              fill="#1B1F23"
+            />
+          </svg>
+        </a>
+      </div>
+    </div>
+  </div>
+</div>
+
+<br />
 <div class="container-fluid">
   <div class="row">
     <h2 id="pageHeader">Our Values & Mission</h2>
@@ -48,7 +255,7 @@ <h2 id="pageHeader">Our Values & Mission</h2>
   </p>
 
   <div class="row">
-    <div class="col">
+    <div class="col" style="padding-bottom: 20px;">
       <div class="card mx-auto">
         <div class="card-body" style="text-align: center">
           <svg
@@ -101,7 +308,7 @@ <h5 class="card-title">Demonstrate</h5>
   </div>
   <br />
   <div class="row">
-    <div class="col">
+    <div class="col" style="padding-bottom: 20px;">
       <div class="card mx-auto">
         <div class="card-body" style="text-align: center">
           <svg
@@ -222,6 +429,7 @@ <h2>Why focus on Neurodiversity?</h2>
       </div>
     </div>
   </span>
+
   <div class="row">
     <p>
       Neurodiversity describes the amazing variety in human neurology, thinking,

diff --git a/src/app/footer/footer.component.html b/src/app/footer/footer.component.html
@@ -35,40 +35,6 @@
       </p>
     </div>
     <div class="col">
-      <span>
-        <a
-          href="https://twitter.com/NDinBusiness"
-          target="_blank"
-          title="Twitter"
-        >
-          <svg
-            height="32px"
-            width="32px"
-            version="1.1"
-            id="Layer_1"
-            xmlns="http://www.w3.org/2000/svg"
-            xmlns:xlink="http://www.w3.org/1999/xlink"
-            viewBox="0 0 512.002 512.002"
-            xml:space="preserve"
-          >
-            <path
-              style="fill: #73a1fb"
-              d="M500.398,94.784c-8.043,3.567-16.313,6.578-24.763,9.023c10.004-11.314,17.631-24.626,22.287-39.193
-       c1.044-3.265-0.038-6.839-2.722-8.975c-2.681-2.137-6.405-2.393-9.356-0.644c-17.945,10.643-37.305,18.292-57.605,22.764
-       c-20.449-19.981-48.222-31.353-76.934-31.353c-60.606,0-109.913,49.306-109.913,109.91c0,4.773,0.302,9.52,0.9,14.201
-       c-75.206-6.603-145.124-43.568-193.136-102.463c-1.711-2.099-4.347-3.231-7.046-3.014c-2.7,0.211-5.127,1.734-6.491,4.075
-       c-9.738,16.709-14.886,35.82-14.886,55.265c0,26.484,9.455,51.611,26.158,71.246c-5.079-1.759-10.007-3.957-14.711-6.568
-       c-2.525-1.406-5.607-1.384-8.116,0.054c-2.51,1.439-4.084,4.084-4.151,6.976c-0.012,0.487-0.012,0.974-0.012,1.468
-       c0,39.531,21.276,75.122,53.805,94.52c-2.795-0.279-5.587-0.684-8.362-1.214c-2.861-0.547-5.802,0.456-7.731,2.638
-       c-1.932,2.18-2.572,5.219-1.681,7.994c12.04,37.591,43.039,65.24,80.514,73.67c-31.082,19.468-66.626,29.665-103.939,29.665
-       c-7.786,0-15.616-0.457-23.279-1.364c-3.807-0.453-7.447,1.795-8.744,5.416c-1.297,3.622,0.078,7.66,3.316,9.736
-       c47.935,30.735,103.361,46.98,160.284,46.98c111.903,0,181.907-52.769,220.926-97.037c48.657-55.199,76.562-128.261,76.562-200.451
-       c0-3.016-0.046-6.061-0.139-9.097c19.197-14.463,35.724-31.967,49.173-52.085c2.043-3.055,1.822-7.094-0.545-9.906
-       C507.7,94.204,503.76,93.294,500.398,94.784z"
-            />
-          </svg>
-        </a>
-      </span>
       <span>
         <a
           href="https://www.linkedin.com/company/80093288"

diff --git a/src/app/member-start/member-start.component.html b/src/app/member-start/member-start.component.html
@@ -2,17 +2,6 @@
   <div class="row">
     <h1 id="pageHeader">Membership Zone</h1>
   </div>
-
-  <div style="text-align: center" class="row mx-auto" >
-    <p style="font-weight: bold;">Thank you for 30K followers on LinkedIn!</p>
-    <video height="480" class="videoInsert" autoplay loop muted>
-      <source
-        src="../../assets/2023-07-17_NIB_30k_FollowersAnouncement_V2.mp4"
-        type="video/mp4"
-      />
-      Your browser does not support the video tag.
-    </video>
-  </div>
   <p>
     Neurodiversity in Business (NiB) will recognise three main types of
     membership:
@@ -246,7 +235,7 @@ <h1 id="pageHeader">Corporates</h1>
   <div class="row">
     <h1 id="pageHeader">Individual Member Signup</h1>
   </div>
-  <p style="font-weight: bold;">
+  <p style="font-weight: bold">
     Thousands of individual supporters of NiB are already receiving our regular
     member newsletter to keep in touch with our latest activities. Join our
     mailing list by completing the form below to hear about events, thought