-
Notifications
You must be signed in to change notification settings - Fork 20
/
officers.js
66 lines (61 loc) · 2.29 KB
/
officers.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
import { NextSeo } from 'next-seo';
import Image from 'next/image';
import React from 'react';
import Banner from '../components/Banner';
import Navigation from '../components/Committees/Sidebar';
// import Archive from '../components/Committees/ArchiveSidebar';
import Layout from '../components/Layout';
import CommitteeSectionOfficers from '../components/Officers/CommitteeSectionOfficers';
import data from '../data';
import teamPhoto from '../public/images/officers/internal_compressed.jpg';
function OfficersBanner() { //fix description
return (
<div className="committee-banner-container">
<div className="banner-main-content">
<div className="image-wrapper">
<Image className='bannerpic' src={teamPhoto} alt="Group Photo of ACM Officers at the annual banquet" priority={true} />
</div>
<div className="info">
<h1>Our Team</h1>
<p className="half-size">ACM officers make the amazing events and projects that we do possible. This page recognizes our entire team across the entire board and all eight committees. Don't hesitate to get in touch with any of them!</p>
</div>
</div>
</div>
);
}
function OfficersPage() {
const { committees, board } = data;
const committeeInfo = board.concat(committees);
return (
<Layout>
<NextSeo
title="Our Team | ACM at UCLA"
description="ACM officers make the amazing events and projects that we do possible. This page recognizes our entire team across the entire board and all eight committees. Don't hesitate to get in touch with any of them!"
openGraph={{
images: [
{
url: 'https://www.uclaacm.com/images/acm_committees.png',
width: 2506,
height: 979,
alt: 'The ACM at UCLA logo, surrounded by our eight committees: Studio, ICPC, Design, Cyber, Teach LA, W, AI, and Hack.',
},
],
site_name: 'ACM at UCLA',
}}
/>
<Banner decorative />
<Navigation committees={committeeInfo} />
{/* <Archive committees={committees} /> */}
<div className="officers-page-content">
<OfficersBanner />
<div className='committee-sections-container'>
{committeeInfo.map(committee => (
<CommitteeSectionOfficers key={committee.name} committee={committee} />
))}
</div>
</div>
</Layout>
);
}
//made with love - larry
export default OfficersPage;