Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

MCSS-83: Refactor About Section #86

Closed
wants to merge 5 commits into from
Closed

Conversation

NoeljToms
Copy link

What's Inside

  • [ X ] Updated to MUI components
  • [ X ] Made mobile view easier to read by removing unnecessary things.

... full details of acceptance criteria documented in the linked GitHub issue

@NoeljToms NoeljToms added the pending review requires code review label Oct 1, 2023
@NoeljToms NoeljToms requested a review from a team as a code owner October 1, 2023 23:39
@NoeljToms NoeljToms linked an issue Oct 1, 2023 that may be closed by this pull request
2 tasks
@netlify
Copy link

netlify bot commented Oct 1, 2023

Deploy Preview for mcss-website ready!

Name Link
🔨 Latest commit 5fad7d1
🔍 Latest deploy log https://app.netlify.com/sites/mcss-website/deploys/657f9bd85cf72c0008bc69e0
😎 Deploy Preview https://deploy-preview-86--mcss-website.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
1 paths audited
Performance: 96
Accessibility: 84
Best Practices: 92
SEO: 86
PWA: -
View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link
Member

@anthonytedja anthonytedja left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Btw the PR title should be MCSS-83: Refactor About Section and the ticket should be moved to in testing

components/Home/AboutUsSection.tsx Show resolved Hide resolved
Comment on lines 11 to 19
const theme = createTheme({
typography: {
fontFamily: ['Segoe UI'].join(','),
},
});

const AboutUsSection: FC = () => (
<div
id="about"
className="about-us-section flex flex-col items-center lg:items-stretch lg:flex-row gap-8"
>
<div className="header-img w-full lg:w-1/3 lg:min-h-full hidden lg:block">
<Image
src={Deerfield}
alt="Deerfield Hall"
className="min-h-full rounded-lg overflow-hidden"
draggable="false"
/>
</div>
<div className="w-4/5 mt-10 lg:mt-0 lg:w-2/3 flex flex-col justify-between xl:justify-center">
<span>
<p className="inline-block h-1/3 mr-5 text-2xl">ABOUT US</p>
<hr className="inline-block h-1 w-56 bg-purple-600" />
</span>
<div className="flex items-center my-5 lg:my-0">
<div className="w-1/2">
<p className="text-2xl md:text-4xl mt-3 mb-3 lg:text-6xl font-bold">FOR THE STUDENTS</p>
<p className="lg:hidden text-lg text-purple-700 font-semibold">Academic Society</p>
<ThemeProvider theme={theme}>
<Container
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

as for the theme, we already have a theme defined in the themes file so we can unify the theming throughout the app

components/Home/AboutUsSection.tsx Outdated Show resolved Hide resolved
@NoeljToms NoeljToms marked this pull request as draft October 13, 2023 22:17
@NoeljToms
Copy link
Author

Fixed all the mentioned issues

@NoeljToms NoeljToms changed the title 83 refactor about section MCSS-83: Refactor About Section Dec 18, 2023
@NoeljToms NoeljToms marked this pull request as ready for review December 18, 2023 01:24
Copy link
Member

@anthonytedja anthonytedja left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

a few small comments

</div>
</div>
</div>
<ThemeProvider theme={aboutSectionTheme}>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we should be using / modifying the 1 theme that we use throughout the app instead of creating multiple theme instances

FOR THE STUDENTS
</Typography>
</Box>
<Box className="md:block w-1/4 md:w-1/6 m-auto hidden">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the end goal is to remove tailwind and use the theme styling / sx inline overrides so we should remove references to tailwind classes

@NoeljToms NoeljToms closed this Jul 30, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
pending review requires code review
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Refactor About Section
2 participants