aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/@next/components
diff options
context:
space:
mode:
authorEzekiel Aquino <ezekiel@bakkenbaeck.no>2018-12-13 00:03:32 +0800
committerEzekiel Aquino <ezekiel@bakkenbaeck.no>2018-12-13 00:03:32 +0800
commitd1ceb2e561e8600867e4585d3b25384e4830a826 (patch)
tree4c595d41d02e83f14aa4e7534833d911cfd8b168 /packages/website/ts/@next/components
parentec2bb616e17ebcc691f14d6df592f36bbbcd3e26 (diff)
downloaddexon-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/@next/components')
-rw-r--r--packages/website/ts/@next/components/footer.tsx14
-rw-r--r--packages/website/ts/@next/components/siteWrap.tsx6
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',
},
};