diff options
| author | Ezekiel Aquino <ezekiel@bakkenbaeck.no> | 2018-12-13 00:03:32 +0800 |
|---|---|---|
| committer | Ezekiel Aquino <ezekiel@bakkenbaeck.no> | 2018-12-13 00:03:32 +0800 |
| commit | d1ceb2e561e8600867e4585d3b25384e4830a826 (patch) | |
| tree | 4c595d41d02e83f14aa4e7534833d911cfd8b168 /packages/website/ts | |
| parent | ec2bb616e17ebcc691f14d6df592f36bbbcd3e26 (diff) | |
| download | dexon-sol-tools-d1ceb2e561e8600867e4585d3b25384e4830a826.tar dexon-sol-tools-d1ceb2e561e8600867e4585d3b25384e4830a826.tar.gz dexon-sol-tools-d1ceb2e561e8600867e4585d3b25384e4830a826.tar.bz2 dexon-sol-tools-d1ceb2e561e8600867e4585d3b25384e4830a826.tar.lz dexon-sol-tools-d1ceb2e561e8600867e4585d3b25384e4830a826.tar.xz dexon-sol-tools-d1ceb2e561e8600867e4585d3b25384e4830a826.tar.zst dexon-sol-tools-d1ceb2e561e8600867e4585d3b25384e4830a826.zip | |
Adds themed footer styling
Diffstat (limited to 'packages/website/ts')
| -rw-r--r-- | packages/website/ts/@next/components/footer.tsx | 14 | ||||
| -rw-r--r-- | packages/website/ts/@next/components/siteWrap.tsx | 6 |
2 files changed, 16 insertions, 4 deletions
diff --git a/packages/website/ts/@next/components/footer.tsx b/packages/website/ts/@next/components/footer.tsx index 75944c910..defc4ba81 100644 --- a/packages/website/ts/@next/components/footer.tsx +++ b/packages/website/ts/@next/components/footer.tsx @@ -111,11 +111,15 @@ const LinkList = (props: LinkListProps) => ( const FooterSection = styled.footer` padding: 40px 30px 30px 30px; margin-top: 30px; - background-color: #181818; + background-color: ${props => props.theme.footerBg}; `; const FooterWrap = styled(FooterSection)` - color: ${colors.white}; + color: ${props => props.theme.footerColor}; + + path { + fill: ${props => props.theme.footerColor}; + } @media (min-width: ${BREAKPOINTS.mobile}) { height: 350px; @@ -140,10 +144,11 @@ const FooterSectionWrap = styled(FooterColumn)` `; const RowHeading = styled.h3` - color: ${colors.white}; + color: inherit; font-weight: 700; font-size: 16px; margin-bottom: 1.25em; + opacity: 0.75; `; const List = styled.ul` @@ -153,7 +158,8 @@ const List = styled.ul` `; const Link = styled(ReactRouterLink)` - color: rgba(255, 255, 255, 0.5); + color: inherit; + opacity: 0.5; display: block; font-size: 16px; line-height: 20px; diff --git a/packages/website/ts/@next/components/siteWrap.tsx b/packages/website/ts/@next/components/siteWrap.tsx index eb2569f3d..fab917eeb 100644 --- a/packages/website/ts/@next/components/siteWrap.tsx +++ b/packages/website/ts/@next/components/siteWrap.tsx @@ -34,6 +34,8 @@ const GLOBAL_THEMES: ThemeInterface = { dropdownButtonBg: '#003831', dropdownColor: '#FFFFFF', headerButtonBg: '#00AE99', + footerBg: '#181818', + footerColor: '#FFFFFF', }, light: { bgColor: '#FFFFFF', @@ -44,6 +46,8 @@ const GLOBAL_THEMES: ThemeInterface = { dropdownColor: '#003831', dropdownBorderColor: '#E4E4E4', headerButtonBg: '#003831', + footerBg: '#F2F2F2', + footerColor: '#000000', }, gray: { bgColor: '#e0e0e0', @@ -53,6 +57,8 @@ const GLOBAL_THEMES: ThemeInterface = { dropdownButtonBg: '#F3F6F4', dropdownColor: '#003831', headerButtonBg: '#003831', + footerBg: '#181818', + footerColor: '#FFFFFF', }, }; |