add logo and order speaker by time

OliviaJSmith · Feb 4, 2024 · a52d431 · a52d431
1 parent 4170bf1
commit a52d431
Show file tree

Hide file tree

Showing 5 changed files with 117 additions and 75 deletions.
diff --git a/index.html b/index.html
@@ -14,7 +14,8 @@
     </header>
     <div class="container">
         <main role="main" class="pb-3">
-            <div class="text-center pt-4">
+            <div class="text-center pt-3">
+                <div><img src="wwwroot/assets/IntellitedxLogo.png" class="rounded-circle shadow-lg"style="width: 10rem;" /></div>
                 <h1 class="display-4 text-white">IntelliTEDx</h1>
                 <p class="text-white">Get ready to be inspired Thursday February 8th 4:00-6:00pm at the Intellitect Office</p>
                 <button class="btn btn-light"><a href="https://forms.office.com/r/wjejJrSCLT" target="_blank">Sign up to speak here!</a></button>
@@ -25,7 +26,7 @@ <h1 class="display-4 text-white">IntelliTEDx</h1>
 
     <footer class="border-top footer text-muted">
         <div class="container">
-            &copy; 2024 - IntelliTEDxSolution
+            &copy; 2024 - IntelliTEDx
         </div>
     </footer>
 

diff --git a/wwwroot/assets/IntellitedxLogo.png b/wwwroot/assets/IntellitedxLogo.png
diff --git a/wwwroot/css/site.css b/wwwroot/css/site.css
@@ -20,6 +20,10 @@ html {
 body {
     margin-bottom: 60px;
     background-image: url("../assets/fun-space-bg.png");
+    background-repeat: no-repeat;
+    background-attachment: fixed;
+    background-position: center;
+    background-size: cover;    
 }
 
 .footer {
@@ -30,18 +34,12 @@ body {
     line-height: 60px;
 }
 
-.grid-container {
-    display: grid;
-    grid-template-columns: 1fr 1fr 1fr;
-    margin-top: 2rem;
-}
-
 .speaker {
     width: 10rem;
     height: 10rem;
     padding: 1rem;
 }
 
 speaker-card {
-    max-width: 25rem;
+    width: 100%;
 }
diff --git a/wwwroot/js/components.js b/wwwroot/js/components.js
@@ -4,6 +4,8 @@ class SpeakerCard extends HTMLElement {
     this.talkTitle = null;
     this.speakerImageUrl = null;
     this.speakerName = null;
+    this.time = null;
+    this.bio = null;
   }
 
   connectedCallback() {
@@ -16,13 +18,14 @@ class SpeakerCard extends HTMLElement {
                 <div class="card-body">
                   <span class="fw-bold">${this.speakerName}</span> will be talking about <span class="fw-bold">${this.talkTitle}</span>!
                 </div>
+                <div class="card-footer">Talk Time: ${this.time}</div>
             </div>
         </div>
         `;
   }
 
   static get observedAttributes() {
-    return ["speaker-name", "speaker-image-url", "talk-title"];
+    return ["speaker-name", "speaker-image-url", "talk-title", "time", "bio"];
   }
 
   attributeChangedCallback(property, oldValue, newValue) {

diff --git a/wwwroot/js/presentations.json b/wwwroot/js/presentations.json
@@ -1,68 +1,108 @@
 [
-    {
-        "talkTitle": "Krav Ma-what???",
-        "speakerName": "Mikaella",
-        "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/Mikella-SWR-300x300-1.jpg"
-    },
-    {
-        "talkTitle": "The Joy of Ice Cream Making",
-        "speakerName": "Olivia",
-        "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2022/07/olivia_smith_square_web-1.jpg"
-    },
-    {
-        "talkTitle": "Looking for Hope in a Hopeless World",
-        "speakerName": "Reese",
-        "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/Reese-SWR-300x300-1.jpg"
-    },
-    {
-        "talkTitle": "Life Lessons from a Cat",
-        "speakerName": "Meg",
-        "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/08/Meg-SWR-300x300-1.jpg"
-    },
-    {
-        "talkTitle": "Don't be Afraid to Re-invent Yourself",
-        "speakerName": "Skyler",
-        "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/skyler_johnson_square_web.jpg"
-    },
-    {
-        "talkTitle": "How to be Inspired Alone",
-        "speakerName": "Dan",
-        "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/Dan-SWR-300x300-1.jpg"
-    },
-    {
-        "talkTitle": "Three Social Ties",
-        "speakerName": "Ray",
-        "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/RaySWR-300x300-1.jpg"
-    },
-    {
-        "talkTitle": "Life Lessons Learned from the Cars I've Owned",
-        "speakerName": "Joe",
-        "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/Joseph-SWR-300x300jpg.jpg"
-    },
-    {
-        "talkTitle": "Plastic! What do we do about it?",
-        "speakerName": "Kelsey + Olivia",
-        "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/Kelsey-SWR-300x3001-1.jpg"
-    },
-    {
-        "talkTitle": "Thrifting is a Lifestyle",
-        "speakerName": "Wendy",
-        "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2022/03/Wendy-SWR-300x300-1.jpg"
-    },
-    {
-        "talkTitle": "TBD",
-        "speakerName": "Mark",
-        "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2010/03/Mark-SWR.jpg"
-    },
-    {
-        "talkTitle": "Miles and Cents",
-        "speakerName": "Grant",
-        "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2015/01/Grant-SWR-1.jpg"
-    },
-    {
-        "talkTitle": "Insights Gained from a Lifetime of Barbeque",
-        "speakerName": "Phil",
-        "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2015/01/Phil-SWR.jpg"
-    }
+  {
+    "talkTitle": "Life Lessons from a Cat",
+    "speakerName": "Meg",
+    "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/08/Meg-SWR-300x300-1.jpg",
+    "time": "4:10pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "Krav Ma-what???",
+    "speakerName": "Mikaella",
+    "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/Mikella-SWR-300x300-1.jpg",
+    "time": "4:20pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "How to be Inspired Alone",
+    "speakerName": "Dan",
+    "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/Dan-SWR-300x300-1.jpg",
+    "time": "4:25pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "Don't be Afraid to Re-invent Yourself",
+    "speakerName": "Skyler",
+    "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/skyler_johnson_square_web.jpg",
+    "time": "4:30pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "Insights Gained from a Lifetime of Barbeque",
+    "speakerName": "Phil",
+    "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2015/01/Phil-SWR.jpg",
+    "time": "4:40pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "Life Lessons Learned from the Cars I've Owned",
+    "speakerName": "Joe",
+    "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/Joseph-SWR-300x300jpg.jpg",
+    "time": "4:45pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "Plastic! What do we do about it?",
+    "speakerName": "Kelsey + Olivia",
+    "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/Kelsey-SWR-300x3001-1.jpg",
+    "time": "4:50pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "TBD",
+    "speakerName": "Jake",
+    "speakerImage": "https://intellitect.com/wp-content/uploads/2021/10/Jake-SWR-300x300-1.jpg",
+    "time": "4:55pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "~ Intermission ~",
+    "speakerName": "",
+    "speakerImageUrl": "",
+    "time": "5:00pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "Three Social Ties",
+    "speakerName": "Ray",
+    "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/RaySWR-300x300-1.jpg",
+    "time": "5:10pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "Miles and Cents",
+    "speakerName": "Grant",
+    "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2015/01/Grant-SWR-1.jpg",
+    "time": "5:20pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "Looking for Hope in a Hopeless World",
+    "speakerName": "Reese",
+    "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2021/10/Reese-SWR-300x300-1.jpg",
+    "time": "5:25pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "Thrifting is a Lifestyle",
+    "speakerName": "Wendy",
+    "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2022/03/Wendy-SWR-300x300-1.jpg",
+    "time": "5:35pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "TBD",
+    "speakerName": "Mark",
+    "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2010/03/Mark-SWR.jpg",
+    "time": "5:40pm",
+    "bio": ""
+  },
+  {
+    "talkTitle": "The Joy of Ice Cream Making",
+    "speakerName": "Olivia",
+    "speakerImageUrl": "https://intellitect.com/wp-content/uploads/2022/07/olivia_smith_square_web-1.jpg",
+    "time": "5:50pm",
+    "bio": ""
+  }
 ]