From b6a027cc70af6e984d15dc59f9a66cc88dde0794 Mon Sep 17 00:00:00 2001 From: Raymond Wang Date: Tue, 25 Oct 2022 13:37:35 -0700 Subject: [PATCH] fix broken asset paths --- src/public/Config.ts | 68 ++--- src/public/assets/css/styles.css | 473 +++++++++++++++-------------- src/public/committees.tsx | 12 +- src/public/components/Carousel.tsx | 4 +- src/public/components/Footer.tsx | 2 +- src/public/components/TopBar.tsx | 2 +- src/public/events.tsx | 2 +- src/public/index.tsx | 8 +- src/public/projects.tsx | 6 +- src/util/index.ts | 16 +- src/util/template.html | 2 +- 11 files changed, 299 insertions(+), 296 deletions(-) diff --git a/src/public/Config.ts b/src/public/Config.ts index ad0838d..a80bf00 100644 --- a/src/public/Config.ts +++ b/src/public/Config.ts @@ -29,17 +29,17 @@ export const EVENTS: unknown[] = []; export const SOCIALS = [ { - icon: "img/disc.svg", + icon: "/assets/img/disc.svg", url: "https://discord.gg/XxfjqZSjca", message: "Join our server", }, { - icon: "img/fab.svg", + icon: "/assets/img/fab.svg", url: "https://www.facebook.com/ieeeucsd", message: "ieeeucsd", }, { - icon: "img/inst.svg", + icon: "/assets/img/inst.svg", url: "https://www.instagram.com/ieee.ucsd", message: "@ieeeucsd", }, @@ -47,7 +47,7 @@ export const SOCIALS = [ export const EMAIL = [ { - icon: "img/email.svg", + icon: "/assets/img/email.svg", url: "mailto:ieee@eng.ucsd.edu", message: "ieee@eng.ucsd.edu", }, @@ -55,7 +55,7 @@ export const EMAIL = [ export const EMAIL_WHITE = [ { - icon: "img/email_white.svg", + icon: "/assets/img/email_white.svg", url: "mailto:ieee@eng.ucsd.edu", message: "ieee@eng.ucsd.edu", }, @@ -63,17 +63,17 @@ export const EMAIL_WHITE = [ export const SOCIALS_WHITE = [ { - icon: "img/disc_white.svg", + icon: "/assets/img/disc_white.svg", url: "https://discord.gg/XxfjqZSjca", message: "Join our server", }, { - icon: "img/fab_white.svg", + icon: "/assets/img/fab_white.svg", url: "https://www.facebook.com/ieeeucsd", message: "ieeeucsd", }, { - icon: "img/inst_white.svg", + icon: "/assets/img/inst_white.svg", url: "https://www.instagram.com/ieee.ucsd", message: "@ieeeucsd", }, @@ -83,157 +83,157 @@ export const OFFICERS = [ { name: "Darin Tsui", position: "Chair", - photo: "img/officers/darin.jpg", + photo: "/assets/img/officers/darin.jpg", email: "email@ucsd.edu", }, { name: "Brigette Hacia", position: "Vice Chair Internal", - photo: "img/officers/brigette.jpg", + photo: "/assets/img/officers/brigette.jpg", email: "email@ucsd.edu", }, { name: "Tasnia Jamal", position: "Vice Chair Events", - photo: "img/officers/tasnia.jpg", + photo: "/assets/img/officers/tasnia.jpg", email: "email@ucsd.edu", }, { name: "Kevin Chang", position: "Vice Chair Projects", - photo: "img/officers/kevin.jpg", + photo: "/assets/img/officers/kevin.jpg", email: "email@ucsd.edu", }, { name: "Arjun Sampath", position: "Vice Chair Finance", - photo: "img/officers/arjun.jpg", + photo: "/assets/img/officers/arjun.jpg", email: "email@ucsd.edu", }, { name: "Niklas Chang", position: "Events Coordinator", - photo: "img/officers/niklas.jpg", + photo: "/assets/img/officers/niklas.jpg", email: "email@ucsd.edu", }, { name: "Tien Vu", position: "Vice Chair External", - photo: "img/officers/tien.jpg", + photo: "/assets/img/officers/tien.jpg", email: "email@ucsd.edu", }, { name: "Derek Nguyen", position: "Project Space Chair", - photo: "img/officers/derek.jpg", + photo: "/assets/img/officers/derek.jpg", email: "email@ucsd.edu", }, { name: "Rafaella Gomes", position: "Robocup Chair", - photo: "img/officers/rafaella.jpg", + photo: "/assets/img/officers/rafaella.jpg", email: "email@ucsd.edu", }, { name: "Yash Puneet", position: "Robocup Chair", - photo: "img/officers/yash.jpg", + photo: "/assets/img/officers/yash.jpg", email: "email@ucsd.edu", }, { name: "Matthew Mikhailov", position: "Supercomputing Chair", - photo: "img/officers/matthew.jpg", + photo: "/assets/img/officers/matthew.jpg", email: "email@ucsd.edu", }, { name: "Josh Lapidario", position: "Quarterly Projects Chair", - photo: "img/officers/josh.jpg", + photo: "/assets/img/officers/josh.jpg", email: "email@ucsd.edu", }, { name: "Sanh Nguyen", position: "Quarterly Projects Chair", - photo: "img/officers/sanh.jpg", + photo: "/assets/img/officers/sanh.jpg", email: "email@ucsd.edu", }, { name: "Vuong Bui", position: "Professional Chair", - photo: "img/officers/vuong.jpg", + photo: "/assets/img/officers/vuong.jpg", email: "email@ucsd.edu", }, { name: "Jason Liang", position: "Professional Chair", - photo: "img/officers/jason.jpg", + photo: "/assets/img/officers/jason.jpg", email: "email@ucsd.edu", }, { name: "Mohak Vaswani", position: "Technical Chair", - photo: "img/officers/mohak.jpg", + photo: "/assets/img/officers/mohak.jpg", email: "email@ucsd.edu", }, { name: "Yusuf Morsi", position: "Technical Chair", - photo: "img/officers/yusuf.jpg", + photo: "/assets/img/officers/yusuf.jpg", email: "email@ucsd.edu", }, { name: "Shaun Garcia", position: "Technical Chair", - photo: "img/officers/shaun.jpg", + photo: "/assets/img/officers/shaun.jpg", email: "email@ucsd.edu", }, { name: "Dennis Liang", position: "Outreach Chair", - photo: "img/officers/dennis.jpg", + photo: "/assets/img/officers/dennis.jpg", email: "email@ucsd.edu", }, { name: "Daniel Chen", position: "Outreach Chair", - photo: "img/officers/daniel.jpg", + photo: "/assets/img/officers/daniel.jpg", email: "email@ucsd.edu", }, { name: "Parisa Shahabi", position: "Social Chair", - photo: "img/officers/parisa.jpg", + photo: "/assets/img/officers/parisa.jpg", email: "email@ucsd.edu", }, { name: "Matthew Yik", position: "Social Chair", - photo: "img/officers/temp.png", + photo: "/assets/img/officers/temp.png", email: "email@ucsd.edu", }, { name: "Jiliana Tiu", position: "Webmaster", - photo: "img/officers/jiliana.jpg", + photo: "/assets/img/officers/jiliana.jpg", email: "email@ucsd.edu", }, { name: "Raymond Wang", position: "Webmaster", - photo: "img/officers/raymond.jpg", + photo: "/assets/img/officers/raymond.jpg", email: "raymond@ucsd.edu", }, { name: "Sankalp Kaushik", position: "PR Chair - Media", - photo: "img/officers/sankalp.jpg", + photo: "/assets/img/officers/sankalp.jpg", email: "email@ucsd.edu", }, { name: "Stephanie Xu", position: "PR Chair - Graphics", - photo: "img/officers/stephanie.jpg", + photo: "/assets/img/officers/stephanie.jpg", email: "email@ucsd.edu", }, ]; diff --git a/src/public/assets/css/styles.css b/src/public/assets/css/styles.css index e9a0637..d9c4995 100644 --- a/src/public/assets/css/styles.css +++ b/src/public/assets/css/styles.css @@ -1,440 +1,443 @@ /* Global CSS Properties */ :root { - --main: #00629b; - --accent: #ffcd00; - --secondary: #ffffff; - --dark: #2a1a4e; + --main: #00629b; + --accent: #ffcd00; + --secondary: #ffffff; + --dark: #2a1a4e; } * { - scrollbar-width: auto; - scrollbar-color: var(--main) transparent; + scrollbar-width: auto; + scrollbar-color: var(--main) transparent; } *::-webkit-scrollbar { - width: 0.6em; - height: 0.6em; + width: 0.6em; + height: 0.6em; } *::-webkit-scrollbar-track { - background: var(--main); + background: var(--main); } *::-webkit-scrollbar-thumb { - background-color: var(--secondary); + background-color: var(--secondary); } html { - font-family: "Roboto", sans-serif; - font-weight: bold; + font-family: "Roboto", sans-serif; + font-weight: bold; } body { - margin: 0; + margin: 0; } a { - text-decoration: none; - color: var(--main); + text-decoration: none; + color: var(--main); } a:hover { - text-decoration: underline; + text-decoration: underline; } #root { - display: flex; - flex-direction: column; + display: flex; + flex-direction: column; } .topbar { - display: flex; - flex-direction: row; - justify-content: space-between; - color: var(--main); - background-color: var(--secondary); - padding: 0.5em; - align-items: center; + display: flex; + flex-direction: row; + justify-content: space-between; + color: var(--main); + background-color: var(--secondary); + padding: 0.5em; + align-items: center; } .topbar.burger-bar { - flex-direction: column; - position: relative; + flex-direction: column; + position: relative; } -.topbar.burger-bar>.img-cont { - align-self: flex-start; - display: flex; - justify-content: space-between; - width: 100%; - align-items: center; +.topbar.burger-bar > .img-cont { + align-self: flex-start; + display: flex; + justify-content: space-between; + width: 100%; + align-items: center; } .img-cont img { - width: 22em; + width: 22em; } .burger { - font-size: 2.8em; - font-weight: normal; - user-select: none; - cursor: pointer; - margin-right: 0.3em; + font-size: 2.8em; + font-weight: normal; + user-select: none; + cursor: pointer; + margin-right: 0.3em; } .link-items.burger-time { - flex-direction: column; - position: absolute; - background-color: var(--secondary); - width: 10em; - box-shadow: rgba(0, 0, 0, 0.3) 4px 4px 3px 0px; - right: 0; - margin-top: 0.36em; + flex-direction: column; + position: absolute; + background-color: var(--secondary); + width: 10em; + box-shadow: rgba(0, 0, 0, 0.3) 4px 4px 3px 0px; + right: 0; + margin-top: 0.36em; } -.link-items.burger-time>a { - margin: 0; - padding: 0.4em 0.75em; +.link-items.burger-time > a { + margin: 0; + padding: 0.4em 0.75em; } -.link-items.burger-time>a:hover { - background-color: rgba(0, 0, 0, 0.1); +.link-items.burger-time > a:hover { + background-color: rgba(0, 0, 0, 0.1); } .navlink { - font-size: 1.1em; - margin: 0.75em; + font-size: 1.1em; + margin: 0.75em; } .splash { - background-color: var(--main); - background-blend-mode: overlay; - border-radius: 0 0 50% 50% / 4rem; - background-position: center; - height: 35em; - display: flex; - justify-content: center; - align-items: center; - flex-direction: column; - background-repeat: no-repeat; - background-size: cover; + background-color: var(--main); + background-blend-mode: overlay; + border-radius: 0 0 50% 50% / 4rem; + background-position: center; + height: 35em; + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + background-repeat: no-repeat; + background-size: cover; } .call-to-action { - font-size: 3.2em; - width: 11em; - color: var(--secondary); - text-align: center; - font-family: "Montserrat"; + font-size: 3.2em; + width: 11em; + color: var(--secondary); + text-align: center; + font-family: "Montserrat"; } .splash-socials { - margin-top: 2em; + margin-top: 2em; } -.splash-socials>a { - margin-left: 1.5em; - margin-right: 1.5em; +.splash-socials > a { + margin-left: 1.5em; + margin-right: 1.5em; } .splash-socials img { - width: 4.7em; + width: 4.7em; } .default-section { - display: flex; - align-items: center; - justify-content: center; - flex-direction: column; - color: var(--main); - background-color: var(--secondary); - padding-top: 2em; - padding-bottom: 2em; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + color: var(--main); + background-color: var(--secondary); + padding-top: 2em; + padding-bottom: 2em; } .section-title { - font-size: 3em; - margin-top: 0.8em; - margin-bottom: 0.8em; + font-size: 3em; + margin-top: 0.8em; + margin-bottom: 0.8em; } -.default-section>p, -.project-space>p { - font-size: 1.8em; - width: 22em; - color: var(--dark); - text-align: center; +.default-section > p, +.project-space > p { + font-size: 1.8em; + width: 22em; + color: var(--dark); + text-align: center; } -.project-space>p { - color: var(--secondary); +.project-space > p { + color: var(--secondary); } -.default-section>p:first-child { - margin-top: 0; +.default-section > p:first-child { + margin-top: 0; } .project-space { - border-radius: 50% 50% 0 0 / 4rem; - background-color: var(--main); - background-blend-mode: overlay; - background-image: url("../img/backgrounds/ps.webp"); - height: 40em; - display: flex; - justify-content: center; - align-items: center; - flex-direction: column; - background-repeat: no-repeat; - background-size: cover; + border-radius: 50% 50% 0 0 / 4rem; + background-color: var(--main); + background-blend-mode: overlay; + background-image: url("../img/backgrounds/ps.webp"); + height: 40em; + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + background-repeat: no-repeat; + background-size: cover; } .project-space a { - color: var(--accent); + color: var(--accent); } .ps-title { - font-size: 3em; - color: white; - margin-bottom: 1em; + font-size: 3em; + color: white; + margin-bottom: 1em; } .visit-us { - font-size: 2em; - margin-bottom: 2em; + font-size: 2em; + margin-bottom: 2em; } .ex-link { - color: var(--accent); - font-size: 2em; - margin-bottom: 2em; + color: var(--accent); + font-size: 2em; + margin-bottom: 2em; } .involved { - border-radius: 50% 50% 0 0 / 4rem; - transform: translateY(-4rem); + border-radius: 50% 50% 0 0 / 4rem; + transform: translateY(-4rem); } .cards { - display: flex; - justify-content: space-around; - flex-wrap: wrap; + display: flex; + justify-content: space-around; + flex-wrap: wrap; } .involve-card { - padding: 1.75em 2.5em; - border: var(--main) solid 0.37em; - border-radius: 1.5em; - color: var(--main); - display: flex; - align-items: center; - justify-content: center; - flex-direction: column; - margin: 1em; + padding: 1.75em 2.5em; + border: var(--main) solid 0.37em; + border-radius: 1.5em; + color: var(--main); + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + margin: 1em; } .involve-title { - font-size: 3em; - color: var(--main); - margin-bottom: 0.5em; + font-size: 3em; + color: var(--main); + margin-bottom: 0.5em; } -.involve-card>img { - width: 20em; - margin-bottom: 1em; - border-radius: 0.2em; +.involve-card > img { + width: 20em; + margin-bottom: 1em; + border-radius: 0.2em; } .links { - font-size: 1.5em; + font-size: 1.5em; } .social-card { - display: flex; - align-items: center; - padding: 1em; - width: 25em; + display: flex; + align-items: center; + padding: 1em; + width: 25em; } -.social-card>img { - width: 4.7em; +.social-card > img { + width: 4.7em; } .social-message { - font-size: 2em; - padding: 0.5em; + font-size: 2em; + padding: 0.5em; } .join-scls, .footer-scls { - display: flex; - flex-direction: row; - max-width: 55em; - justify-content: space-around; - flex-wrap: wrap; - margin-left: 5em; + display: flex; + flex-direction: row; + max-width: 55em; + justify-content: space-around; + flex-wrap: wrap; + margin-left: 5em; } .carousel-item { - display: flex; - flex-direction: column; - align-items: center; - padding: 1.5em; - border: 0.35em solid var(--main); - border-radius: 1em; - margin: 1em; + display: flex; + flex-direction: column; + align-items: center; + padding: 1.5em; + border: 0.35em solid var(--main); + border-radius: 1em; + margin: 1em; } -.carousel-item>img { - width: 18.7em; - border-radius: 0.2em; +.carousel-item > img { + width: 18.7em; + border-radius: 0.2em; } .carousel-name { - font-size: 2em; - padding-top: 0.25em; + font-size: 2em; + padding-top: 0.25em; } .carousel-pos { - font-style: italic; - font-weight: normal; - font-size: 1.25em; + font-style: italic; + font-weight: normal; + font-size: 1.25em; } .carousel-email { - margin-top: 0.5em; + margin-top: 0.5em; } .carousel-page { - display: flex; - flex-wrap: wrap; - justify-content: center; + display: flex; + flex-wrap: wrap; + justify-content: center; } .carousel { - display: flex; - align-items: center; - justify-content: center; + display: flex; + align-items: center; + justify-content: center; } .carousel-left { - margin-left: 2em; - transform: scaleX(-1); + margin-left: 2em; + transform: scaleX(-1); } .carousel-right, .carousel-left { - cursor: pointer; - width: 4em; + cursor: pointer; + width: 4em; } .carousel-right { - margin-right: 2em; + margin-right: 2em; } .contact { - border-radius: 0 0 50% 50% / 4rem; - transform: translateY(4rem); + border-radius: 0 0 50% 50% / 4rem; + transform: translateY(4rem); } .footer { - background-color: var(--main); - padding-top: 7em; - display: flex; - justify-content: space-between; - align-items: start; - padding-left: 2em; - padding-right: 2em; + background-color: var(--main); + padding-top: 7em; + display: flex; + justify-content: space-between; + align-items: start; + padding-left: 2em; + padding-right: 2em; } .footer a { - color: white; + color: white; } .footer-scls { - max-width: 30em; - font-size: 0.6em; - margin-bottom: 2em; + max-width: 30em; + font-size: 0.6em; + margin-bottom: 2em; } .footer-scls img { - width: 4.7em; + width: 4.7em; } -.footer>img { - width: 30em; +.footer > img { + width: 30em; } /* Responsive queries go here */ @media screen and (max-width: 700px) { - html { - font-size: 0.85em; - } + html { + font-size: 0.85em; + } } @media screen and (max-width: 650px) { - html { - font-size: 0.8em; - } + html { + font-size: 0.8em; + } - .footer>img { - width: 15em; - } + .footer > img { + width: 15em; + } } @media screen and (max-width: 540px) { - html { - font-size: 0.6em; - } + html { + font-size: 0.6em; + } - .footer>img { - display: none; - } + .footer > img { + display: none; + } } @media screen and (max-width: 420px) { - html { - font-size: 0.5em; - } + html { + font-size: 0.5em; + } } @media screen and (max-width: 320px) { - html { - font-size: 0.45em; - } + html { + font-size: 0.45em; + } } #cal { - border: solid 1px #777; - width: 800px; - height: 600px; + border: solid 1px #777; + width: 800px; + height: 600px; } #calendar { - display: flex; - align-items: center; - justify-content: center; - flex-direction: column; - color: var(--main); - padding-top: 2em; - padding-bottom: 2em; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + color: var(--main); + padding-top: 2em; + padding-bottom: 2em; } iframe { - width: 80vw; - height: 600px; - max-width: 1000px; + width: 80vw; + height: 600px; + max-width: 1000px; } .project-desc { - display: flex; + display: flex; justify-content: center; - column-gap: 10em; + column-gap: 10em; vertical-align: middle; - flex-wrap: wrap; + flex-wrap: wrap; + padding: 2em; + align-items: center; } .project-desc img { - width: 30em; - padding-top: 3em; - padding-bottom: 3em; -} \ No newline at end of file + border-radius: 0.2em; + width: 100%; + max-width: 600px; + max-height: 400px; +} diff --git a/src/public/committees.tsx b/src/public/committees.tsx index 7f3f43c..69c841a 100644 --- a/src/public/committees.tsx +++ b/src/public/committees.tsx @@ -22,7 +22,7 @@ class Main extends React.Component { diff --git a/src/public/components/Carousel.tsx b/src/public/components/Carousel.tsx index 6bc67ea..5648432 100644 --- a/src/public/components/Carousel.tsx +++ b/src/public/components/Carousel.tsx @@ -43,7 +43,7 @@ export default class Carousel extends Component {
{
- +
{[...EMAIL_WHITE, ...SOCIALS_WHITE].map((n) => ( { >
- +
diff --git a/src/public/index.tsx b/src/public/index.tsx index 05ee1a5..121f053 100644 --- a/src/public/index.tsx +++ b/src/public/index.tsx @@ -22,7 +22,7 @@ class Main extends React.Component {
diff --git a/src/public/projects.tsx b/src/public/projects.tsx index 90bfc3f..6dcf2c6 100644 --- a/src/public/projects.tsx +++ b/src/public/projects.tsx @@ -21,7 +21,7 @@ class Main extends React.Component { @@ -33,7 +33,7 @@ class Main extends React.Component { ]} > - +
@@ -44,7 +44,7 @@ class Main extends React.Component { ]} > - +
diff --git a/src/util/index.ts b/src/util/index.ts index cef6181..fdfc5c3 100644 --- a/src/util/index.ts +++ b/src/util/index.ts @@ -24,8 +24,8 @@ const WEBSITES = [ sitename: "index", title: "IEEE at UCSD", description: "", - jsfile: "assets/js/index.js", - cssfile: "assets/css/styles.css", + jsfile: "/assets/js/index.js", + cssfile: "/assets/css/styles.css", themecolor: "", path: "/", }, @@ -33,24 +33,24 @@ const WEBSITES = [ sitename: "events", title: "IEEE at UCSD", description: "", - jsfile: "assets/js/events.js", - cssfile: "assets/css/styles.css", + jsfile: "/assets/js/events.js", + cssfile: "/assets/css/styles.css", themecolor: "", }, { sitename: "projects", title: "IEEE at UCSD", description: "", - jsfile: "assets/js/projects.js", - cssfile: "assets/css/styles.css", + jsfile: "/assets/js/projects.js", + cssfile: "/assets/css/styles.css", themecolor: "", }, { sitename: "committees", title: "IEEE at UCSD", description: "", - jsfile: "assets/js/committees.js", - cssfile: "assets/css/styles.css", + jsfile: "/assets/js/committees.js", + cssfile: "/assets/css/styles.css", themecolor: "", }, ] as Website[]; diff --git a/src/util/template.html b/src/util/template.html index d3cd658..7c9d486 100644 --- a/src/util/template.html +++ b/src/util/template.html @@ -2,7 +2,7 @@ - +