Add @c29wan 's changes

pages/resources/advice/coop.tsx

@@ -23,7 +23,7 @@ export function Advice(props: { children: ReactNode }) {
     <>
       <div className={styles.titleContainer}>
         <h1 className={styles.title}>Waterloo Undergraduate Advice</h1>
-        <Image src="/resources/advice/codey.svg" className={styles.codey} />
+        <Image src="/images/advice.svg" className={styles.codey} />
       </div>
       <div className={styles.adviceBarContainer}>
         <Link href="/resources/advice/coop">

pages/resources/tech-talks.mdx

@@ -1 +0,0 @@
-# Tech Talks Page

pages/resources/tech-talks.module.css

@@ -0,0 +1,36 @@
+.headerContainer {
+  display: flex;
+  flex-direction: row;
+  align-items: flex-end;
+  padding-bottom: 1rem;
+  border-bottom: calc(1rem / 16) solid var(--primary-heading);
+}
+
+.header {
+  padding-right: calc(82rem / 16);
+}
+
+.header h1 {
+  color: var(--primary-heading);
+  font-size: calc(48rem / 16);
+  margin: 0 1rem 0 0;
+  text-align: left;
+}
+
+.headerContent {
+  max-width: calc(450rem / 16);
+}
+
+.image {
+  width: calc(260rem / 16);
+  height: calc(165rem / 16);
+  object-fit: cover;
+}
+
+.miniCards > *:nth-child(odd) {
+  background: var(--secondary-accent-light);
+}
+
+.miniCards {
+  margin: calc(60rem / 16) 0;
+}

pages/resources/tech-talks.tsx

@@ -0,0 +1,39 @@
+import React from "react";
+
+import { Image } from "../../components/Image";
+import { MiniTechTalkCard } from "../../components/MiniTechTalkCard";
+import { metadata as tempTechTalkMetadata } from "../../content/playground/temp.talk.mdx";
+
+import styles from "./tech-talks.module.css";
+
+export default function TechTalks() {
+  return (
+    <>
+      <div className={styles.headerContainer}>
+        <section className={styles.header}>
+          <h1>Tech Talks</h1>
+          <p className={styles.headerContent}>
+            These are the audio and video recordings of past CSC and other
+            university-related talks. Our public events can also be found on our
+            YouTube channel.
+          </p>
+        </section>
+        <Image src="images/tech-talks.svg" className={styles.image} />
+      </div>
+      <div className={styles.miniCards}>
+        <MiniTechTalkCard
+          {...tempTechTalkMetadata}
+          poster={tempTechTalkMetadata.thumbnails.small}
+        />
+        <MiniTechTalkCard
+          {...tempTechTalkMetadata}
+          poster={tempTechTalkMetadata.thumbnails.small}
+        />
+        <MiniTechTalkCard
+          {...tempTechTalkMetadata}
+          poster={tempTechTalkMetadata.thumbnails.small}
+        />
+      </div>
+    </>
+  );
+}

public/images/tech-talks.svg

@@ -0,0 +1,55 @@
+<svg width="703" height="465" viewBox="0 0 703 465" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="path-1-inside-1" fill="white">
+<rect x="15" y="79" width="396" height="255" rx="13.0346"/>
+</mask>
+<rect x="15" y="79" width="396" height="255" rx="13.0346" fill="#525284" stroke="#2A2A62" stroke-width="35.9558" mask="url(#path-1-inside-1)"/>
+<path d="M147.838 170.619C131.57 173.691 118.517 184.97 113.382 200.376C109.639 211.655 110.311 223.317 115.254 233.684C117.893 239.203 120.677 242.899 125.428 247.458C137.809 259.121 156.284 262.624 172.264 256.337L174.76 255.329L179.655 257.009C196.211 262.48 213.198 258.593 225.436 246.45C234.121 237.859 238.009 228.788 239.016 214.534C239.256 210.983 239.832 206.855 240.264 205.415C241.656 200.808 244.391 196.248 248.038 192.505L251.445 188.953L253.413 190.489C257.972 194.089 262.435 201.72 263.826 208.295C265.266 215.11 264.018 223.413 260.515 230.132C258.596 233.732 251.781 240.643 248.23 242.563C246.79 243.331 244.103 244.435 242.279 245.011L239.016 246.066L241.896 248.706C245.687 252.114 251.637 255.473 257.06 257.201C273.232 262.432 290.172 258.353 302.217 246.45C310.087 238.675 314.454 229.316 315.606 217.798C316.326 210.359 313.926 199.848 309.751 192.505C307.112 187.849 301.305 181.466 296.89 178.299C284.941 169.756 269.345 167.644 255.428 172.731L251.589 174.123L248.758 172.971C243.383 170.811 239.736 170.187 232.586 170.187C225.244 170.187 222.124 170.763 215.646 173.259C205.472 177.195 195.731 186.65 191.46 196.824C189.3 201.96 188.196 206.999 187.717 214.054C187.477 217.606 186.949 221.733 186.517 223.173C185.221 228.069 182.534 232.676 178.791 236.564L175.288 240.211L173.944 239.443C171.784 238.195 167.321 232.58 165.45 228.788C163.242 224.277 162.283 220.102 162.283 214.774C162.283 209.255 163.242 205.271 165.738 200.136C169.241 193.033 176.871 186.506 184.117 184.298C185.173 184.01 186.325 183.626 186.709 183.53C187.237 183.386 187.045 182.906 185.989 181.85C182.15 177.771 173.56 173.067 166.842 171.291C161.803 169.996 152.829 169.66 147.838 170.619ZM161.035 183.146C161.611 183.386 161.227 184.154 159.163 186.794C152.205 195.72 148.798 206.423 149.47 217.366C150.094 227.205 154.125 237.091 160.267 243.907C161.179 244.915 161.803 245.874 161.659 246.018C161.515 246.21 159.451 246.45 157.148 246.546C142.128 247.362 128.067 236.804 124.66 222.213C123.604 217.798 123.7 211.175 124.852 206.663C127.635 195.672 136.561 186.698 147.502 183.818C150.909 182.954 159.355 182.522 161.035 183.146ZM237.817 183.146C238.392 183.386 238.009 184.154 235.945 186.794C229.707 194.809 226.107 204.839 226.107 214.39C226.107 218.998 224.812 224.373 222.652 228.932C221.069 232.244 219.917 233.78 216.558 237.139C213.198 240.499 211.663 241.651 208.352 243.235C202.353 246.114 195.155 247.314 189.54 246.402L187.765 246.066L189.828 243.619C196.594 235.652 199.714 227.253 200.625 214.534C201.393 203.927 203.649 198.6 210.031 192.217C216.414 185.834 223.324 182.954 232.442 182.906C234.985 182.858 237.385 183.002 237.817 183.146ZM278.271 183.578C287.629 185.786 295.211 191.929 299.578 200.856C303.993 209.879 303.945 219.526 299.434 228.932C297.85 232.244 296.698 233.78 293.339 237.139C289.98 240.499 288.444 241.651 285.133 243.235C279.135 246.114 271.936 247.314 266.322 246.402L264.546 246.066L266.61 243.619C274.528 234.308 278.367 221.781 276.975 209.879C275.919 201 272.032 191.881 266.85 186.026C264.882 183.866 264.642 183.386 265.314 183.194C267.281 182.666 275.536 182.906 278.271 183.578Z" fill="#FDF8F5"/>
+<path d="M15.0862 334.994H410.914C418.984 334.994 425.527 341.536 425.527 349.607V364.433H0.473103V349.607C0.473103 341.536 7.01561 334.994 15.0862 334.994Z" fill="#525284" stroke="#525284" stroke-width="0.946205"/>
+<rect y="355.182" width="426" height="9.72325" fill="#2A2A62"/>
+<rect x="329.375" y="326.62" width="41.9315" height="7.90014" rx="2.70219" fill="#FDF8F5"/>
+<rect x="137.931" y="326.653" width="177.802" height="7.5431" rx="2.70219" fill="#FDF8F5"/>
+<rect x="39.8706" y="326.653" width="24.7845" height="7.5431" rx="2.70219" fill="#FDF8F5"/>
+<rect x="70.0432" y="326.653" width="24.7845" height="7.5431" rx="2.70219" fill="#FDF8F5"/>
+<rect x="100.215" y="326.653" width="24.7845" height="7.5431" rx="2.70219" fill="#FDF8F5"/>
+<ellipse cx="643.525" cy="268.933" rx="59.0354" ry="64.767" fill="#1482E3"/>
+<path d="M382.456 256.303L446.183 287.483C446.183 287.483 382.989 404.974 379.262 405.632C375.535 406.29 341.906 390.829 339.432 386.144C338.064 383.553 352.838 339.559 366.526 305.561C376.442 271.377 382.456 256.303 382.456 256.303Z" fill="#1482E3"/>
+<path d="M401.474 61.6198C401.474 61.6198 418.713 69.5001 427.225 77.7753C439.343 89.556 447.851 115.821 447.851 115.821L385.148 131.061C385.148 131.061 381.765 103.676 387.125 87.5215C390.766 76.5461 401.474 61.6198 401.474 61.6198Z" fill="#5CAFF9"/>
+<path d="M405.27 77.8095C405.27 77.8095 417.451 82.6081 423.389 87.8143C431.843 95.226 437.464 112.073 437.464 112.073L392.393 123.028C392.393 123.028 390.453 105.367 394.565 94.82C397.358 87.6546 405.27 77.8095 405.27 77.8095Z" fill="white"/>
+<path d="M511.653 61.6239C511.653 61.6239 494.414 69.5041 485.902 77.7793C473.784 89.56 465.276 115.825 465.276 115.825L527.979 131.065C527.979 131.065 531.362 103.68 526.002 87.5255C522.361 76.5501 511.653 61.6239 511.653 61.6239Z" fill="#5CAFF9"/>
+<path d="M507.023 78.1796C507.023 78.1796 493.941 83.7395 487.524 89.6693C478.387 98.111 472.144 117.108 472.144 117.108L520.143 128.774C520.143 128.774 522.464 108.915 518.22 97.1299C515.337 89.1232 507.023 78.1796 507.023 78.1796Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M529.944 400.526C515.966 409.537 500.002 414.514 482.48 414.514C417.271 414.514 347.788 377.259 355.169 256.322C356.621 247.11 357.951 238.26 359.225 229.781C372.54 141.189 379.787 92.9713 456.618 92.9713C520.172 92.9713 539.684 141.834 559.684 191.921C565.892 207.467 572.147 223.131 579.78 237.489C625.007 254.161 648.701 289.244 648.701 330.822C648.701 384.603 605.15 398.684 529.944 400.526Z" fill="#5CAFF9"/>
+<mask id="mask0" mask-type="alpha" maskUnits="userSpaceOnUse" x="354" y="92" width="295" height="323">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M529.413 400.513C515.435 409.525 499.471 414.502 481.948 414.502C416.739 414.502 347.255 377.246 354.637 256.31C356.089 247.097 357.419 238.248 358.693 229.769C372.008 141.177 379.255 92.9592 456.086 92.9592C519.64 92.9592 539.152 141.822 559.152 191.909C565.36 207.455 571.614 223.119 579.248 237.476C624.474 254.149 648.168 289.231 648.168 330.809C648.168 384.589 604.617 398.67 529.413 400.513Z" fill="#5CAFF9"/>
+</mask>
+<g mask="url(#mask0)">
+<path d="M446.372 304.187C451.158 373.14 488.213 437.427 426.8 411.821C411.204 410.623 388.493 373.14 383.708 304.187C378.922 235.235 393.024 173.528 437.678 170.429C461.949 168.744 489.113 183.396 482.198 224.932C478.782 245.455 444.757 280.921 446.372 304.187Z" fill="white"/>
+</g>
+<path d="M574.594 304.124L643.092 314.336C643.092 314.336 651.761 340.471 642.716 365.117C633.67 389.762 611.709 402.602 611.709 402.602C611.709 402.602 540.79 449.972 538.026 449.37C535.262 448.769 514.639 428.803 513.839 424.924C513.396 422.779 527.857 396.989 544.387 377.747C531.06 316.579 574.594 304.124 574.594 304.124Z" fill="#5CAFF9"/>
+<path d="M447.079 296.597L507.808 327.215C507.808 327.215 448.763 433.407 445.232 433.901C441.7 434.394 409.661 419.15 407.276 414.764C405.957 412.338 419.629 372.307 432.35 341.438C441.491 310.285 447.079 296.597 447.079 296.597Z" fill="#5CAFF9"/>
+<ellipse cx="410.762" cy="148.281" rx="9.17055" ry="5.7316" transform="rotate(-9.26095 410.762 148.281)" fill="white"/>
+<ellipse rx="9.17055" ry="5.7316" transform="matrix(-0.981752 -0.190165 -0.190165 0.981752 485.303 148.515)" fill="white"/>
+<path d="M459.347 205.445C460.71 223.91 438.165 227.613 423.479 224.326C408.795 220.924 403.956 203.427 406.476 192.529C408.996 181.631 422.83 175.567 437.513 178.969C444.248 182.213 445.334 185.577 449.284 189.804C453.914 194.62 455.343 198.105 459.347 205.445Z" fill="white"/>
+<path d="M427.356 191.551C433.4 191.671 438.361 188.673 438.436 184.856C438.511 181.039 433.673 177.847 427.629 177.728C421.585 177.608 416.624 180.606 416.549 184.423C416.473 188.24 421.312 191.432 427.356 191.551Z" fill="#2A2A62"/>
+<path d="M458.716 214.074C455.782 216.782 451.822 218.893 448.103 220.433C443.222 222.526 438.575 224.393 432.484 223.581C416.971 221.316 407.403 209.833 408.81 196.954C409.803 187.524 417.434 180.414 427.389 178.191C414.031 177.696 406.027 186.181 404.622 198.945C403.081 212.744 414.346 225.873 429.858 228.139C442.613 230.005 454.141 224.01 458.716 214.074Z" fill="#2A2A62"/>
+<path opacity="0.5" d="M427.25 196.738L435.251 205.885L425.83 216.071L417.561 203L427.25 196.738Z" fill="#5CAFF9"/>
+<path d="M427.355 191.554C427.355 191.554 426.444 208.477 443.519 201.669" stroke="#2A2A62" stroke-width="4.82387" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M427.404 189.136C427.404 189.136 427.023 208.373 413.034 198.993" stroke="#2A2A62" stroke-width="4.82387" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M435.308 203.345C435.308 203.345 426.225 231.4 417.019 201.601" stroke="#2A2A62" stroke-width="4.82387" stroke-linecap="round" stroke-linejoin="round"/>
+<g opacity="0.25">
+<circle cx="388.457" cy="156.071" r="42.987" transform="rotate(1.13298 388.457 156.071)" fill="#FDF8F5"/>
+<circle cx="484.781" cy="155.69" r="42.987" transform="rotate(1.13298 484.781 155.69)" fill="#FDF8F5"/>
+<path d="M425.501 167.13C425.501 167.13 432.47 165.548 436.996 165.638C441.522 165.727 448.423 167.583 448.423 167.583L448.287 174.46C448.287 174.46 441.347 173.176 436.849 173.087C432.351 172.998 425.365 174.007 425.365 174.007L425.501 167.13Z" fill="#FDF8F5"/>
+</g>
+<circle cx="388.457" cy="156.071" r="40.575" transform="rotate(1.13298 388.457 156.071)" stroke="#2A2A62" stroke-width="4.82387"/>
+<circle cx="484.781" cy="155.69" r="40.575" transform="rotate(1.13298 484.781 155.69)" stroke="#2A2A62" stroke-width="4.82387"/>
+<path d="M425.501 167.13C425.501 167.13 432.47 165.548 436.996 165.638C441.522 165.727 448.423 167.583 448.423 167.583L448.287 174.46C448.287 174.46 441.347 173.176 436.849 173.087C432.351 172.998 425.365 174.007 425.365 174.007L425.501 167.13Z" fill="#2A2A62"/>
+<ellipse cx="411.724" cy="168.577" rx="9.17055" ry="10.3169" transform="rotate(1.13298 411.724 168.577)" fill="#2A2A62"/>
+<ellipse cx="477.055" cy="169.869" rx="9.17055" ry="10.3169" transform="rotate(1.13298 477.055 169.869)" fill="#2A2A62"/>
+<path d="M345.565 42.9475L361.225 89.1195C361.838 90.9272 363.743 91.9551 365.59 91.4755C367.389 91.0087 368.548 89.2629 368.28 87.4241L361.25 39.1783C360.506 34.073 355.243 30.9552 350.408 32.7564C346.304 34.2854 344.159 38.7999 345.565 42.9475Z" fill="#4ED4B2"/>
+<path d="M299.226 69.9645L337.019 100.767C338.498 101.973 340.658 101.832 341.969 100.445C343.245 99.0936 343.299 96.9989 342.096 95.5832L310.513 58.4398C307.171 54.5093 301.056 54.6637 297.916 58.7576C295.251 62.233 295.831 67.1975 299.226 69.9645Z" fill="#4ED4B2"/>
+<path d="M277.357 115.037L325.141 124.721C327.012 125.1 328.858 123.971 329.373 122.132C329.874 120.343 328.947 118.463 327.223 117.77L281.987 99.5842C277.2 97.6598 271.858 100.642 270.984 105.726C270.241 110.043 273.065 114.167 277.357 115.037Z" fill="#4ED4B2"/>
+<g opacity="0.25">
+<path d="M584 76.4754H633" stroke="#1482E3" stroke-width="6.81502" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M608.476 101V52" stroke="#1482E3" stroke-width="6.81502" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>