roleypoly/v3
1
0
Fork 0
mirror of https://github.com/roleypoly/roleypoly.git synced 2025-06-17 18:09:09 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

chore: restructure project into yarn workspaces, remove next

Browse source
This commit is contained in:
41666 2021-03-09 23:25:16 -05:00
parent 49e308507e
commit 8d06327c03
266 changed files with 16466 additions and 3350 deletions
Download patch file Download diff file Expand all files Collapse all files

94
packages/design-system/molecules/footer/Flags.tsx Normal file
View file

@ -0,0 +1,94 @@
import * as React from 'react';
type FlagsProps = {
width?: number | string;
height?: number | string;
};
export const Flags = (props: FlagsProps) => (
<svg width={props.width} height={props.height} viewBox="0 0 3372 900" version="1.1">
<defs>
<rect id="path-3" x="1772" y="0" width="1600" height="900" rx="100"></rect>
</defs>
<g id="Page-1" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
<g id="Rectangle-6"></g>
<g id="Trans">
<rect
id="Rectangle"
fill="#55CDFC"
x="0"
y="0"
width="1600"
height="900"
rx="100"
></rect>
<rect
id="Rectangle-2"
fill="#F7A8B8"
x="0"
y="170"
width="1600"
height="560"
></rect>
<rect
id="Rectangle-3"
fill="#FFFFFF"
x="0"
y="350"
width="1600"
height="200"
></rect>
</g>
<mask id="mask-4" fill="white">
<use href="#path-3"></use>
</mask>
<g id="Rectangle-5"></g>
<g id="Geyy" mask="url(#mask-4)">
<g transform="translate(1772.000000, 0.000000)" id="Rectangle-4">
<rect
fill="#F9238B"
x="0"
y="0"
width="1600"
height="151.006711"
></rect>
<rect
fill="#FB7B04"
x="0"
y="150"
width="1600"
height="151.006711"
></rect>
<rect
fill="#FFCA66"
x="0"
y="300"
width="1600"
height="151.006711"
></rect>
<rect
fill="#00B289"
x="0"
y="450"
width="1600"
height="151.006711"
></rect>
<rect
fill="#5A38B5"
x="0"
y="598.993289"
width="1600"
height="151.006711"
></rect>
<rect
fill="#B413F5"
x="0"
y="748.993289"
width="1600"
height="151.006711"
></rect>
</g>
</g>
</g>
</svg>
);

9
packages/design-system/molecules/footer/Footer.stories.tsx Normal file
View file

@ -0,0 +1,9 @@
import * as React from 'react';
import { Footer as FooterComponent } from './Footer';
export default {
title: 'Molecules',
component: FooterComponent,
};
export const Footer = (args) => <FooterComponent {...args} />;

30
packages/design-system/molecules/footer/Footer.styled.ts Normal file
View file

@ -0,0 +1,30 @@
import { palette } from '@roleypoly/design-system/atoms/colors';
import { transitions } from '@roleypoly/design-system/atoms/timings';
import styled from 'styled-components';
export const FooterWrapper = styled.div`
display: flex;
align-items: center;
justify-content: center;
text-align: center;
a {
color: ${palette.taupe500};
text-decoration: none;
transition: color ${transitions.actionable}s ease-in-out;
&:hover {
color: ${palette.taupe600};
}
}
`;
export const HoverColor = styled.div`
opacity: 0.3;
filter: saturate(0);
transition: all ${transitions.in2in}s ease-in-out;
&:hover {
opacity: 1;
filter: none;
}
`;

27
packages/design-system/molecules/footer/Footer.tsx Normal file
View file

@ -0,0 +1,27 @@
import { AmbientLarge } from '@roleypoly/design-system/atoms/typography';
import * as React from 'react';
import { FaHeart } from 'react-icons/fa';
import { Flags } from './Flags';
import { FooterWrapper, HoverColor } from './Footer.styled';
const year = new Date().getFullYear();
export const Footer = () => (
<FooterWrapper>
<AmbientLarge>
<div>
&copy; {year} Roleypoly &ndash; Made with{' '}
<FaHeart size={'0.8em'} color={'#fe4365'} />
&nbsp;in Raleigh, NC
</div>
<div>
<a href="https://discord.gg/Xj6rK3E">Discord/Support</a> &ndash;&nbsp;
<a href="https://patreon.com/kata">Patreon</a> &ndash;&nbsp;
<a href="https://github.com/roleypoly">GitHub</a>
</div>
<HoverColor>
<Flags height={'1em'} />
</HoverColor>
</AmbientLarge>
</FooterWrapper>
);

1
packages/design-system/molecules/footer/index.ts Normal file
View file

@ -0,0 +1 @@
export * from './Footer';