From 139c8a110260bc71788a654cba2b96219d23c215 Mon Sep 17 00:00:00 2001 From: Michael Fatemi Date: Fri, 11 Dec 2020 16:27:22 -0500 Subject: [PATCH] Updated font, made hero stretch full width --- public/index.html | 57 ++++++++++++++---------- src/App.css | 78 ++++++++++++--------------------- src/App.tsx | 3 +- src/components/ArticleRow.tsx | 5 +-- src/components/Layout.tsx | 10 +---- src/components/MemberRow.tsx | 5 ++- src/components/RecentNews.tsx | 2 +- src/components/Segment.tsx | 2 +- src/components/SegmentGroup.tsx | 2 +- src/css/article.css | 14 +++--- src/css/footer.css | 42 +++++++++--------- src/css/hero.css | 23 +++++----- src/css/navbar.css | 5 +++ src/css/segment.css | 19 +++++--- src/index.css | 20 ++++----- src/pages/classcouncil.tsx | 10 +++-- src/pages/committee.tsx | 14 +++--- src/pages/index.tsx | 14 +++--- src/pages/initiatives.tsx | 15 ++++--- src/pages/involved.tsx | 54 +++++++++++++---------- src/pages/mission.tsx | 4 +- src/pages/news.tsx | 4 +- src/pages/newsArticle.tsx | 42 +++++++++--------- src/pages/officers.tsx | 4 +- 24 files changed, 230 insertions(+), 218 deletions(-) diff --git a/public/index.html b/public/index.html index 1fff249..a2c4ec5 100644 --- a/public/index.html +++ b/public/index.html @@ -1,20 +1,20 @@ - - - - - - - - - - - - - - - React App - - - -
- + + + + + + TJHSST Student Government Association + + + +
+ - + diff --git a/src/App.css b/src/App.css index 23ac9cd..feaf5bc 100644 --- a/src/App.css +++ b/src/App.css @@ -1,73 +1,49 @@ -.header { - text-align: center; - font-weight: bold; - margin: 1rem 0rem; - font-size: 1.5rem; -} - .space-2 { - margin: 1rem; - padding: 1rem; + margin: 1rem; + padding: 1rem; } .space-4 { - margin: 2rem; - padding: 2rem; + margin: 2rem; + padding: 2rem; } .button { - border-color: #474849; - border-width: 2px; - border-radius: 0.25rem; - background-color: inherit; - box-shadow: none; -} - -.text-center { - text-align: center; -} - -.text-left { - text-align: left; -} - -.text-sm { - font-size: 0.75rem; -} - -.row { - display: flex; - flex-direction: row; + border-color: #474849; + border-width: 2px; + border-radius: 0.25rem; + background-color: inherit; + box-shadow: none; } .col { - display: flex; - flex-direction: column; - align-items: center; + display: flex; + flex-direction: column; + align-items: center; } .flex-1 { - flex: 1; + flex: 1; } .flex-2 { - flex: 2; + flex: 2; } .blue-button { - text-transform: uppercase; - padding: 13px 23px; - border-width: 2px; - border-radius: 0.25rem; - border-style: solid; - border-color: #38A3BD; - background-color: white; - color: #38A3BD; - display: inline-block; - cursor: pointer; + text-transform: uppercase; + padding: 13px 23px; + border-width: 2px; + border-radius: 0.25rem; + border-style: solid; + border-color: #38A3BD; + background-color: white; + color: #38A3BD; + display: inline-block; + cursor: pointer; } .clickable-link { - text-decoration: underline; - color: #38A3BD; -} + text-decoration: underline; + color: #38A3BD; +} \ No newline at end of file diff --git a/src/App.tsx b/src/App.tsx index baba821..1521bf5 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -14,10 +14,11 @@ const notfound = React.lazy(() => import('./pages/404')); const officers = React.lazy(() => import('./pages/officers')); const committee = React.lazy(() => import('./pages/committee')); const classcouncil = React.lazy(() => import('./pages/classcouncil')); +const loading = () =>

Loading...

; export default function App() { return ( - + diff --git a/src/components/ArticleRow.tsx b/src/components/ArticleRow.tsx index 801cea9..24ee7ff 100644 --- a/src/components/ArticleRow.tsx +++ b/src/components/ArticleRow.tsx @@ -1,6 +1,5 @@ import React from 'react'; import imageUrl from '../imageUrl'; -import BlockContent from '@sanity/block-content-to-react'; import { Link } from 'react-router-dom'; import '../css/article.css'; @@ -30,13 +29,13 @@ export default function ArticleRow({ to={'/news/' + article._id + '/' + slug(article.title)} className='clickable-link' > -

{article.title}

+

{article.title}

{article.publish_date}
{article.author || 'No author'}
-

{article.summary}

+

{article.summary}

); diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx index 760d4ea..cb03e5b 100644 --- a/src/components/Layout.tsx +++ b/src/components/Layout.tsx @@ -14,14 +14,8 @@ export default function Layout({ children }: { children: React.ReactNode }) { return (
- -
- {children} - -
- -
-
+ {children} +
); } diff --git a/src/components/MemberRow.tsx b/src/components/MemberRow.tsx index a31a946..e04a1c7 100644 --- a/src/components/MemberRow.tsx +++ b/src/components/MemberRow.tsx @@ -1,4 +1,5 @@ import imageUrl from '../imageUrl'; +import '../css/article.css'; export default function MemberRow({ member }: { member: SGA.MemberDocument }) { let thumbUrl: string | null = null; @@ -15,7 +16,9 @@ export default function MemberRow({ member }: { member: SGA.MemberDocument }) {

{member.name}

- {member.role}, {member.year} + + {member.role}, {member.year} +

{member.bio}

diff --git a/src/components/RecentNews.tsx b/src/components/RecentNews.tsx index b21ceea..4354ecd 100644 --- a/src/components/RecentNews.tsx +++ b/src/components/RecentNews.tsx @@ -12,7 +12,7 @@ export default function RecentNews() { return (
-

Recent News

+

Recent News

{news.map((article) => { return ; })} diff --git a/src/components/Segment.tsx b/src/components/Segment.tsx index 2c47fbb..d971e8b 100644 --- a/src/components/Segment.tsx +++ b/src/components/Segment.tsx @@ -4,7 +4,7 @@ import '../css/segment.css'; export default function InfoColumn({ title, content, imageURL, infoURL }) { return (
-

{title}

+

{title}

{title}

{content}

diff --git a/src/components/SegmentGroup.tsx b/src/components/SegmentGroup.tsx index d2e0ac4..5a35278 100644 --- a/src/components/SegmentGroup.tsx +++ b/src/components/SegmentGroup.tsx @@ -2,7 +2,7 @@ import Segment from './Segment'; export default function InfoColumnGroup() { return ( -
+
- {members && - members.map((member) => { - return ; - })} +
+ {members && + members.map((member) => { + return ; + })} +
); } diff --git a/src/pages/committee.tsx b/src/pages/committee.tsx index d1f8ac2..8ee4bcf 100644 --- a/src/pages/committee.tsx +++ b/src/pages/committee.tsx @@ -12,12 +12,14 @@ export default function Committee() { return ( <> -
- {excomm && - excomm.map((member) => { - return ; - })} -
+
+
+ {excomm && + excomm.map((member) => { + return ; + })} +
+
); } diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 99424c8..8ebb9a2 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -9,15 +9,15 @@ export default function IndexPage() { {/* Hero image */} -
+
+ {/* Info columns */} + - {/* Info columns */} - +
-
- - {/* Mission */} - + {/* Mission */} + +
); } diff --git a/src/pages/initiatives.tsx b/src/pages/initiatives.tsx index 6f5a478..079b66e 100644 --- a/src/pages/initiatives.tsx +++ b/src/pages/initiatives.tsx @@ -10,12 +10,15 @@ export default function Initiatives() { return ( <> - -
- {initiatives && initiatives.map((initiative) => { - return ; - })} -
+ +
+
+ {initiatives && + initiatives.map((initiative) => { + return ; + })} +
+
); } diff --git a/src/pages/involved.tsx b/src/pages/involved.tsx index 3a9e021..1c7253d 100644 --- a/src/pages/involved.tsx +++ b/src/pages/involved.tsx @@ -15,29 +15,37 @@ export default function GetInvolved() { }, []); return ( -
+ <> -

SGA Calendar

-