diff --git a/src/assets/pics/team/blake-bray.jpg b/src/assets/pics/team/blake-bray.jpg new file mode 100644 index 0000000..2e96d0e Binary files /dev/null and b/src/assets/pics/team/blake-bray.jpg differ diff --git a/src/assets/pics/team/david-fiel.jpg b/src/assets/pics/team/david-fiel.jpg new file mode 100644 index 0000000..772b626 Binary files /dev/null and b/src/assets/pics/team/david-fiel.jpg differ diff --git a/src/assets/pics/team/jacob-shin.jpg b/src/assets/pics/team/jacob-shin.jpg new file mode 100644 index 0000000..644f1e4 Binary files /dev/null and b/src/assets/pics/team/jacob-shin.jpg differ diff --git a/src/assets/pics/team/john-helferty.jpg b/src/assets/pics/team/john-helferty.jpg new file mode 100644 index 0000000..11bca25 Binary files /dev/null and b/src/assets/pics/team/john-helferty.jpg differ diff --git a/src/assets/pics/team/mark-stitch.png b/src/assets/pics/team/mark-stitch.png new file mode 100644 index 0000000..266501f Binary files /dev/null and b/src/assets/pics/team/mark-stitch.png differ diff --git a/src/assets/pics/team/max-johnson.jpg b/src/assets/pics/team/max-johnson.jpg new file mode 100644 index 0000000..faee716 Binary files /dev/null and b/src/assets/pics/team/max-johnson.jpg differ diff --git a/src/assets/pics/team/ryan-hodge.jpg b/src/assets/pics/team/ryan-hodge.jpg new file mode 100644 index 0000000..c90d6d8 Binary files /dev/null and b/src/assets/pics/team/ryan-hodge.jpg differ diff --git a/src/assets/pics/team/thomas-demianovich.jpg b/src/assets/pics/team/thomas-demianovich.jpg new file mode 100644 index 0000000..4e7114f Binary files /dev/null and b/src/assets/pics/team/thomas-demianovich.jpg differ diff --git a/src/pages/general/photo-gallery/PhotoGallery.tsx b/src/pages/general/photo-gallery/PhotoGallery.tsx index 609ab87..206b469 100644 --- a/src/pages/general/photo-gallery/PhotoGallery.tsx +++ b/src/pages/general/photo-gallery/PhotoGallery.tsx @@ -74,7 +74,7 @@ export default class PhotoGallery extends React.Component + {this.props.title ?? 'Photo Gallery'} @@ -101,7 +101,7 @@ class GallerySlide extends React.Component {
-

{gallery.title}

+

{gallery.title}

{gallery.description}

) diff --git a/src/pages/general/photo-gallery/PhotoGalleryStyles.tsx b/src/pages/general/photo-gallery/PhotoGalleryStyles.tsx index a7a336c..d6a56ac 100644 --- a/src/pages/general/photo-gallery/PhotoGalleryStyles.tsx +++ b/src/pages/general/photo-gallery/PhotoGalleryStyles.tsx @@ -11,6 +11,7 @@ export interface GalleryImage { export type PhotoGalleryProps = { id?: string, title?: string, + className?: string, galleryInfo: GalleryImage[] } @@ -69,15 +70,17 @@ export default class PhotoGalleryStyles { & > h3 { ${FONT_FAMILY.SECONDARY_TITLE} + font-size: calc(var(--vh) * 0.03); text-align: center; } & > .gallery-image-container { overflow: hidden; + border-radius: calc(var(--vh) * 0.01); } & > .gallery-image-container > img { - width:100%; + width: 100%; min-height: 100%; object-fit: cover; } diff --git a/src/pages/robotic-mining/RoboticMining.tsx b/src/pages/robotic-mining/RoboticMining.tsx index cea4c61..3974b95 100644 --- a/src/pages/robotic-mining/RoboticMining.tsx +++ b/src/pages/robotic-mining/RoboticMining.tsx @@ -6,7 +6,7 @@ import PhotoGallery from '../general/photo-gallery/PhotoGallery' import Contact from '../general/contact/Contact' // Custom styles -import Styles from './RoboticMiningStyles' +import Styles, { MEET_THE_TEAM } from './RoboticMiningStyles' import GALLERY_INFO from '../../data/RoboticsPhotoGalleryInfo' // Images @@ -17,7 +17,6 @@ import outreachPhoto2 from '../../assets/pics/outreach/expo.jpeg' import outreachPhoto3 from '../../assets/pics/outreach/interview.jpeg' import title from '../../assets/pics/logos/robotics-red.png' import RmcDescription from './SectionDescription' -//import JaredsFace from '../../assets/pics/Leads/jareds_face.jpg' const RoboticMining = (): React.ReactElement => { return ( @@ -43,6 +42,8 @@ const RoboticMining = (): React.ReactElement => { video/> + +

Outreach and Events

diff --git a/src/pages/robotic-mining/RoboticMiningStyles.tsx b/src/pages/robotic-mining/RoboticMiningStyles.tsx index 1f44e24..49d38da 100644 --- a/src/pages/robotic-mining/RoboticMiningStyles.tsx +++ b/src/pages/robotic-mining/RoboticMiningStyles.tsx @@ -1,6 +1,19 @@ import styled from 'styled-components' -import { FONT_FAMILY } from '../../tools/Constants' +import { FONT_FAMILY, RMC_TEAM } from '../../tools/Constants' +import { GalleryImage } from '../general/photo-gallery/PhotoGalleryStyles' import spaceBackground from '../../assets/pics/outreach/space-background.jpeg' +import PhotoGallery from '../general/photo-gallery/PhotoGallery' + +export const MEET_THE_TEAM: GalleryImage[] = [ + { image: RMC_TEAM[0], title: 'Dr. John Helferty', description: 'Head Advisor' }, + { image: RMC_TEAM[1], title: 'Rocco Gruzman', description: 'Robotic\'s President' }, + { image: RMC_TEAM[2], title: 'Malin Kussi', description: 'Vice President' }, + { image: RMC_TEAM[3], title: 'Jared Levin', description: 'Electrical Lead' }, + { image: RMC_TEAM[4], title: 'Alessia Smith', description: 'Mechanical Lead' }, + { image: RMC_TEAM[5], title: 'Nasier Fowlkes', description: 'Web Manager' }, + { image: RMC_TEAM[6], title: 'Brian Ervin', description: 'Programming Lead' }, + { image: RMC_TEAM[7], title: 'Tanishka Shah', description: 'Project Manager' } +] export default class RoboticMiningStyles { static readonly RmcContainer = styled.div` @@ -9,7 +22,7 @@ export default class RoboticMiningStyles { grid-template-rows: calc(var(--vh) * .4) /* Intro heading */ calc(var(--vh) * .4) /* Robot and competition description */ - calc(var(--vh) * 1.7) /* Outreach gallery and photo gallery */ + calc(var(--vh) * 2.15) /* Outreach gallery and photo gallery */ max(calc(var(--vh) * .15), 100px); /* Contact info */ justify-content: center; align-content: center; @@ -90,8 +103,14 @@ export default class RoboticMiningStyles { background-size: cover; display: grid; grid-template-columns: 100%; - grid-template-rows: calc(var(--vh) * 1.2) calc(var(--vh) * 0.5); + grid-template-rows: calc(var(--vh) * 0.45) calc(var(--vh) * 1.2) calc(var(--vh) * 0.5); justify-items: center; align-items: center; ` + + static readonly MeetTheTeam = styled(PhotoGallery)` + & .gallery-title { + font-size: calc(var(--vh) * .02) !important; + } + ` } diff --git a/src/pages/sponsors/Sponsors.tsx b/src/pages/sponsors/Sponsors.tsx index c6e15b0..d0b9834 100644 --- a/src/pages/sponsors/Sponsors.tsx +++ b/src/pages/sponsors/Sponsors.tsx @@ -22,7 +22,7 @@ const Sponsors = (): React.ReactElement => {

Sponsors

-
+

Current Sponsors

-
+

Previous Sponsors

diff --git a/src/pages/sponsors/SponsorsStyles.tsx b/src/pages/sponsors/SponsorsStyles.tsx index b089920..6507bbb 100644 --- a/src/pages/sponsors/SponsorsStyles.tsx +++ b/src/pages/sponsors/SponsorsStyles.tsx @@ -5,7 +5,7 @@ export class SponsorImages { static readonly arrow = require('../../assets/pics/sponsors/arrow.png') static readonly nasa = require('../../assets/pics/sponsors/nasa-name.png') static readonly hillock = require('../../assets/pics/sponsors/hillock-anodizing.png') - static readonly Amtrack = require('../../assets/pics/sponsors/Amtrack-png.svg') + static readonly Amtrack = require('../../assets/pics/sponsors/Amtrak.svg') } export default class SponsorsStyles { @@ -42,13 +42,13 @@ export default class SponsorsStyles { text-align: center; } - .centered-img { + & > #centered-img { background: #000000a0; - display: 'flex'; - justify-content: 'center'; - align-items: 'center'; - flex-direction: 'column'; - row-gap: '3rem'; + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + row-gap: 3rem; } ` diff --git a/src/tools/Constants.tsx b/src/tools/Constants.tsx index 4449565..a2d0a91 100644 --- a/src/tools/Constants.tsx +++ b/src/tools/Constants.tsx @@ -30,6 +30,17 @@ export class COLORS { static readonly SECONDARY_SCROLLBAR: Color = '#9d22357f' } +export const RMC_TEAM = [ + require('../assets/pics/team/john-helferty.jpg'), + require('../assets/pics/Leads/roccos_face.jpg'), + require('../assets/pics/Leads/Malins_face.jpg'), + require('../assets/pics/Leads/jareds_face.jpg'), + require('../assets/pics/Leads/Alessia_headshot.png'), + require('../assets/pics/Leads/Nasiers_face.jpg'), + require('../assets/pics/Leads/Brians_face.jpg'), + require('../assets/pics/Leads/Tanishkas_face.jpg') +] + export const RMC_PHOTO_GALLERY = [ require('../assets/pics/photo-gallery/rmc/comp-team-2023.jpg'), require('../assets/pics/photo-gallery/rmc/arena-3.jpeg'), @@ -102,6 +113,7 @@ export class FONT_FAMILY { font-size: calc(var(--vh) * .05); letter-spacing: 1px; line-height: 1.1; + margin: 0; ` static readonly SECONDARY_TITLE = `