cleaned up site

src/components/conference/Hero/index.js

@@ -5,10 +5,11 @@ import ThemedImage from '@theme/ThemedImage';
 import { addDarkToFileName } from "../../../util/util";
 import { SliderButton } from '@typeform/embed-react'
 export default function ConferenceHero() {
-  const communication = '/conf/communication.svg'
+  const communication = '/conf/codey-surfing-small.png'
 
   return (
-    <div className={styles.mainCard}>
+  <div className={styles.center}>
+   <div className={styles.mainCard}>
       <div>
         <div className={styles.headerSection}>
           <div className={styles.shipyardText}>
@@ -22,18 +23,19 @@ export default function ConferenceHero() {
         </div>
 
         <div className={styles.comingSoonText}>
-          COMING SOON | AUSTIN, TX
+          COMING SOON
         </div>
         <div className={styles.descriptionText}>
-          The conference for <span className={styles.extensible}>extensibility</span> on <span className={styles.sailpoint}>SailPoint</span> platforms.
+          The conference for extensibility on SailPoint platforms.
         </div>
-        <SliderButton id="gVCODdMc" className={styles.button}>
-            Learn More
-        </SliderButton >
-      </div>
-      <div className={styles.signUpSection}>
-        <ThemedImage className={styles.background} sources={{light: useBaseUrl(communication), dark: useBaseUrl(communication)}}></ThemedImage>
+
+          <SliderButton id="gVCODdMc" className={styles.button}>
+              Join the Waitlist
+          </SliderButton >
+
       </div>
     </div>
+    </div>
+ 
   );
 }

src/components/conference/Hero/styles.module.css

@@ -5,15 +5,12 @@
     grid-template-columns: 900px auto;
     align-content: center;
 }
-
-.background {
-    width: 760px;
-    height: 600px;
-}
+.center {
+    margin: 50px auto;
+    max-width: 1000px;
+  }
 
 .signUpSection {
-    min-width: 368px;
-    width: 368px;
     margin: 30px auto;
 }
 
@@ -21,8 +18,7 @@
     .signUpSection {
         display: none;
     }
-  }
-
+}
 
 
 .headerSection {
@@ -60,7 +56,7 @@
 .comingSoonText {
     color: var(--dev-text-color-cobalt);
     font-size: 22px;
-    font-family: input-mono;;
+    font-family: input-mono;
     letter-spacing: 5.5px;
     margin-top: -17px;
 }
@@ -69,6 +65,7 @@
     margin-top: 20px;
     color: var(--ifm-color-primary);
     font-size: 36px;
+    font-family: input-mono;
 }
 
 .extensible {
@@ -84,7 +81,7 @@
     .mainCard {
         display: none;
     }
-  }
+}
 
 .button {
 
@@ -95,12 +92,12 @@
     font-weight: bold;
     line-height: 100%;
     color: #df61ca;
-  
+    font-family: input-mono;
     /* Layout Properties */
     margin-top: 20px;
     width: 360px;
     height: 52px;
-    line-height: 52px;
+    line-height: 42px;
     /* UI Properties */
     background: transparent 0% 0% no-repeat padding-box;
     opacity: 1;

src/components/conference/Theme/index.js

@@ -8,18 +8,18 @@ export default function ConferenceTheme() {
       <ConferenceTitle           
         description={"What can you expect at the upcoming conference?"}
         title={"What to Expect"}
-        image={"/conf/calendar-star.png"}>
+        image={"/conf/calendar-star-thin.svg"}>
       </ConferenceTitle>
       <div className={styles.center}>
         <div className={styles.gridContainer}>
-          <ThemeCard name={"DEEP DIVE"} title={"A deep dive into the SailPoint platform"} image={"/conf/webdev.svg"}></ThemeCard>
-          <ThemeCard name={"EXPERT ADVICE"}  title={"The world's leading identity management speakers"} image={"/conf/travel.svg"}></ThemeCard>
+          <ThemeCard title={"A deep dive into the extensibility offerings of SailPoint platforms"} image={"/conf/deep-dive.png"}></ThemeCard>
+          <ThemeCard title={"Hear from identity experts developing real world solutions"} image={"/conf/expert-advice.png"}></ThemeCard>
         </div>
       </div>
       <div className={styles.center}>
         <div className={styles.gridContainer}>
-          <ThemeCard name={"WORKSHOPS"}  title={"In-person classes and virtual tutorials"} image={"/conf/education.svg"}></ThemeCard>
-          <ThemeCard name={"VIRTUAL"}  title={"Attend the conference from home and get full access"} image={"/conf/leisure.svg"}></ThemeCard>
+          <ThemeCard title={"Shipyard is a hands-on conference, you will build something in almost every session"} image={"/conf/workshops.png"}></ThemeCard>
+          <ThemeCard title={"Shipyard will be all-virtual, open to everyone, and at no cost"} image={"/conf/virtual.png"}></ThemeCard>
         </div>
       </div>
     </div>

src/components/conference/Theme/styles.module.css

@@ -1,13 +1,14 @@
 .gridContainer {
     display: grid;
     place-content: center;
-    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
+    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
     grid-gap: 40px;
     margin-left: 40px;
     margin-right: 40px;
+    text-align: center;
   }
   
   .center {
-    margin: 50px auto;
+    margin: 20px auto;
     max-width: 1000px;
   }

src/components/conference/ThemeCard/styles.module.css

@@ -3,7 +3,7 @@
   position:relative;
   margin-top: 20px;
   height: 493px;
-  max-width: 474px;
+  min-width: 330px;
   /* UI Properties */
   background: var(--dev-card-background);
   box-shadow: var(--dev-card-shadow);
@@ -34,7 +34,7 @@
   font-size: 16px;
   font-weight: 400;
   width: 100%;
-  top: 340px;
+  top: 350px;
   left: 0;
   letter-spacing: 0px;
   color: var(--ifm-color-primary);
@@ -47,6 +47,7 @@
   width: 100%;
   margin: 70px auto;
   padding: 20px;
+  min-width: 306px;
 }
 
 .cardFace {

src/components/conference/Title/styles.module.css

@@ -2,9 +2,10 @@
 .gettingStartedText {
     text-align: center;
     color: var(--dev-text-color-cobalt);
-    margin: 50px auto 50px auto;
+    margin: 160px auto 20px auto;
     width: calc(100% - 100px);
     max-width: 600px;
+    font-family: input-mono;
   }
   
   .gettingStartedOne {
@@ -18,7 +19,6 @@
   .gettingStartedThree {
     margin-top: 20px;
     font-size: 16px;
-    font-weight: 500;
   }
   
   
@@ -28,6 +28,7 @@
   
   .gettingStartedCardIcon {
     margin-bottom: 20px;
-    width: 80px;
-    height: 80px;
+    width: 60px;
+    height: 60px;
+    filter: invert(62%) sepia(93%) saturate(289%) hue-rotate(156deg) brightness(93%) contrast(96%);
   }

src/components/conference/Waitlist/index.js

@@ -18,12 +18,16 @@ export default function ConferenceWaitlist() {
       </div>
 
       <div className={styles.signUpSection}>
-        <div className={styles.imageContainer}>
+        <div className={styles.sailpointImageContainer}>
           <ThemedImage className={styles.sailpointImage} sources={{light: useBaseUrl(sailpointImage), dark: useBaseUrl(addDarkToFileName(sailpointImage))}}></ThemedImage>
         </div>
         <div className={styles.imageContainer}>
         <ThemedImage className={styles.shipyardLogo} sources={{light: useBaseUrl(shipyardImage), dark: useBaseUrl(addDarkToFileName(shipyardImage))}}></ThemedImage>
         </div>
+        <div className={styles.comingSoon}>
+          Coming Soon | 2023
+        </div>
+
         <div className={styles.welcomeContainer}>
           Welcome
         </div >

src/components/conference/Waitlist/styles.module.css

@@ -4,6 +4,7 @@
     grid-template-columns: 760px auto;
     align-content: center;
     margin-bottom: 80px;
+    font-family: input-mono;
 }
 
 .background {
@@ -11,6 +12,12 @@
     height: 600px;
 }
 
+
+.comingSoon {
+    padding-left: 20px;
+    color: var(--ifm-color-primary);
+}
+
 .learnDeployText {
     position: absolute;
     left: 467px;
@@ -32,7 +39,13 @@
         left: auto;
         top: 99px;
     }
-  }
+}
+
+@media only screen and (min-width: 980px) {
+    .mainCard {
+        display: none;
+    }
+}
 
 .signUpSection {
     min-width: 368px;
@@ -42,6 +55,9 @@
 .imageContainer {
     text-align: center;
 }
+.sailpointImageContainer {
+    padding-left: 32px;
+}
 .shipyardLogo {
     margin-top: 10px;
     width: 368px;
@@ -59,11 +75,11 @@
 
 .welcomeContainer {
     text-align: center;
-    margin-top: 70px;
+    margin-top: 60px;
     font-size: 30px;
     color: var(--ifm-color-primary);
     font-weight: bold;
-    font-family: input-mono;;
+    font-family: input-mono;
 }
 
 .welcomeText {
@@ -102,7 +118,7 @@
     font-weight: bold;
     line-height: 100%;
     color: #df61ca;
-  
+    font-family: input-mono;
     /* Layout Properties */
     margin-top: 20px;
     width: 360px;

src/pages/conf.js

@@ -19,9 +19,9 @@ export default function Conference() {
         <Waitlist></Waitlist>
         <Hero></Hero>
         <Theme></Theme>
-        <Speakers></Speakers>
+        {/* <Speakers></Speakers>
         <FAQ></FAQ>
-        <Sponsors></Sponsors>
+        <Sponsors></Sponsors> */}
       </main>
     </Layout>
   );

static/conf/calendar-star-thin.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M262.2 299.4L315.6 307.1C328.8 309 333.1 325.2 324.5 334.4L285.9 372.1L294.1 425.3C297.2 438.4 283.5 448.3 271.8 442.1L224 417L176.2 442.1C164.5 448.3 150.8 438.4 153 425.3L162.1 372.1L123.5 334.4C114 325.2 119.2 309 132.4 307.1L185.8 299.4L209.7 250.1C215.5 239.1 232.5 239.1 238.3 250.1L262.2 299.4zM196.4 314L134.7 322.1L179.3 366.5L168.8 427.1L224 398.1L279.2 427.1L268.7 366.5L313.3 322.1L251.6 314L223.1 258.1L196.4 314zM128 64H320V8C320 3.582 323.6 0 328 0C332.4 0 336 3.582 336 8V64H384C419.3 64 448 92.65 448 128V448C448 483.3 419.3 512 384 512H64C28.65 512 0 483.3 0 448V128C0 92.65 28.65 64 64 64H112V8C112 3.582 115.6 0 120 0C124.4 0 128 3.582 128 8V64zM16 448C16 474.5 37.49 496 64 496H384C410.5 496 432 474.5 432 448V192H16V448zM64 80C37.49 80 16 101.5 16 128V176H432V128C432 101.5 410.5 80 384 80H336V120C336 124.4 332.4 128 328 128C323.6 128 320 124.4 320 120V80H128V120C128 124.4 124.4 128 120 128C115.6 128 112 124.4 112 120V80H64z"/></svg>