From 63927c3115d19da59eeae0c05dfa47ba2ff52fd3 Mon Sep 17 00:00:00 2001
From: Andreas Ellewsen <ae@uio.no>
Date: Fri, 17 Dec 2021 11:25:49 +0100
Subject: [PATCH] Reduce use of red in styling
Overview buttons now have black text. Sponsor menu arrows are now black.
Links in footer has white underline on hover, otherwise nothing.
Resolves: GREG-15
---
frontend/src/routes/components/footer.tsx | 28 ++++++++++++-------
.../routes/components/sponsorGuestButtons.tsx | 4 +--
.../src/routes/sponsor/frontpage/index.tsx | 12 ++++++--
3 files changed, 29 insertions(+), 15 deletions(-)
diff --git a/frontend/src/routes/components/footer.tsx b/frontend/src/routes/components/footer.tsx
index 8187bb5c..c2af6ea7 100644
--- a/frontend/src/routes/components/footer.tsx
+++ b/frontend/src/routes/components/footer.tsx
@@ -58,6 +58,14 @@ const LogoSection = styled('div')(({ theme }) => ({
padding: '1rem 0 1rem 2rem',
}))
+const StyledLink = styled(Link)({
+ color: 'white',
+})
+
+StyledLink.defaultProps = {
+ underline: 'hover',
+}
+
const LogoContainer = styled('div')({})
function Footer() {
@@ -70,31 +78,31 @@ function Footer() {
<LinkContainer>
<LinkSection>
<LinkHeader>{t('footer:link.terms.header')}</LinkHeader>
- <Link href={ITRulesLink} sx={{ color: 'white' }}>
+ <StyledLink href={ITRulesLink}>
{t('footer:link.terms.ITRules')}
- </Link>
- <Link href={privacyPolicyLink} sx={{ color: 'white' }}>
+ </StyledLink>
+ <StyledLink href={privacyPolicyLink}>
{t('footer:link.terms.privacy')}
- </Link>
+ </StyledLink>
</LinkSection>
<LinkSection>
<LinkHeader>{t('footer:link.help.header')}</LinkHeader>
- <Link href={helpLink} sx={{ color: 'white' }}>
+ <StyledLink href={helpLink}>
{t('footer:link.help.contact')}
- </Link>
- <Link href={documentationLink} sx={{ color: 'white' }}>
+ </StyledLink>
+ <StyledLink href={documentationLink}>
{t('footer:link.help.doc')}
- </Link>
+ </StyledLink>
</LinkSection>
<LinkSection>
<LinkHeader>
{t('footer:link.responsibleOrganization.header')}
</LinkHeader>
- <Link href={responsibleOrganizationLink} sx={{ color: 'white' }}>
+ <StyledLink href={responsibleOrganizationLink}>
{responsibleOrganization}
- </Link>
+ </StyledLink>
</LinkSection>
</LinkContainer>
</InfoSection>
diff --git a/frontend/src/routes/components/sponsorGuestButtons.tsx b/frontend/src/routes/components/sponsorGuestButtons.tsx
index b713ff98..fcd2fd00 100644
--- a/frontend/src/routes/components/sponsorGuestButtons.tsx
+++ b/frontend/src/routes/components/sponsorGuestButtons.tsx
@@ -43,7 +43,7 @@ export default function SponsorGuestButtons(props: SponsorGuestButtonsProps) {
<StyledIconButton
onClick={goToOverview}
sx={{
- color: () => (yourGuestsActive ? 'primary.main' : ''),
+ color: () => (yourGuestsActive ? 'black' : undefined),
textDecorationLine: () => (yourGuestsActive ? 'underline' : ''),
}}
>
@@ -69,7 +69,7 @@ export default function SponsorGuestButtons(props: SponsorGuestButtonsProps) {
<StyledIconButton
onClick={goToRegister}
sx={{
- color: () => (registerNewGuestActive ? 'primary.main' : ''),
+ color: () => (registerNewGuestActive ? 'black' : undefined),
textDecorationLine: () => (registerNewGuestActive ? 'underline' : ''),
}}
>
diff --git a/frontend/src/routes/sponsor/frontpage/index.tsx b/frontend/src/routes/sponsor/frontpage/index.tsx
index 45cc0d99..b453b9c4 100644
--- a/frontend/src/routes/sponsor/frontpage/index.tsx
+++ b/frontend/src/routes/sponsor/frontpage/index.tsx
@@ -213,7 +213,9 @@ const InvitedGuests = ({ persons }: GuestProps) => {
setActiveExpanded(!activeExpanded)
}}
>
- <StyledAccordionSummary expandIcon={<ArrowUpwardIcon color="primary" />}>
+ <StyledAccordionSummary
+ expandIcon={<ArrowUpwardIcon sx={{ fill: 'black' }} />}
+ >
<h2>{t('common:sentInvitations')}</h2>
</StyledAccordionSummary>
<AccordionDetails>
@@ -240,7 +242,9 @@ const ActiveGuests = ({ persons }: GuestProps) => {
setActiveExpanded(!activeExpanded)
}}
>
- <StyledAccordionSummary expandIcon={<ArrowUpwardIcon color="primary" />}>
+ <StyledAccordionSummary
+ expandIcon={<ArrowUpwardIcon sx={{ fill: 'black' }} />}
+ >
<h2>{t('common:activeGuests')}</h2>
</StyledAccordionSummary>
<AccordionDetails>
@@ -268,7 +272,9 @@ const WaitingGuests = ({ persons }: GuestProps) => {
setWaitingExpanded(!waitingExpanded)
}}
>
- <StyledAccordionSummary expandIcon={<ArrowUpwardIcon color="primary" />}>
+ <StyledAccordionSummary
+ expandIcon={<ArrowUpwardIcon sx={{ fill: 'black' }} />}
+ >
<h2>
{t('common:waitingGuests')}{' '}
{guests.length > 0 && (
--
GitLab