diff options
-rw-r--r-- | public/fonts/unisans.otf | bin | 0 -> 113772 bytes | |||
-rw-r--r-- | src/App.tsx | 5 | ||||
-rw-r--r-- | src/components/FormListing.tsx | 2 | ||||
-rw-r--r-- | src/components/HeaderBar/index.tsx | 11 | ||||
-rw-r--r-- | src/pages/LandingPage.tsx | 3 |
5 files changed, 12 insertions, 9 deletions
diff --git a/public/fonts/unisans.otf b/public/fonts/unisans.otf Binary files differnew file mode 100644 index 0000000..facd333 --- /dev/null +++ b/public/fonts/unisans.otf diff --git a/src/App.tsx b/src/App.tsx index 3505dc1..d372e2f 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -7,6 +7,11 @@ import colors from "./colors"; const globalStyles = css` @import url('https://fonts.googleapis.com/css2?family=Hind:wght@700&display=swap'); +@font-face { + font-family: 'Uni Sans'; + src: url(fonts/unisans.otf) format('opentype'); +} + body { background-color: ${colors.notQuiteBlack}; color: white; diff --git a/src/components/FormListing.tsx b/src/components/FormListing.tsx index 66860da..99ba866 100644 --- a/src/components/FormListing.tsx +++ b/src/components/FormListing.tsx @@ -21,7 +21,7 @@ function FormListing(props: FormListingProps) { padding: 20px; margin-top: 20px; margin-bottom: 20px; - border-radius: 20px; + border-radius: 10px; transition: filter 100ms; &:hover { diff --git a/src/components/HeaderBar/index.tsx b/src/components/HeaderBar/index.tsx index 97dbb8c..f14a504 100644 --- a/src/components/HeaderBar/index.tsx +++ b/src/components/HeaderBar/index.tsx @@ -12,8 +12,8 @@ position: absolute; width: 100%; transition: height 1s; -@media (max-width: 660px) { - height: 140px; +@media (max-width: 770px) { + height: 180px; } `; @@ -26,18 +26,19 @@ function HeaderBar() { <h1 css={css` font-size: 4em; margin: 0; - margin-top: 10px; + margin-top: 30px; margin-left: 30px; margin-bottom: 200px; transition-property: font-size, margin-bottom; transition-duration: 1s; + font-family: "Uni Sans"; - @media (max-width: 660px) { + @media (max-width: 770px) { margin-bottom: 100px; font-size: 3em; } - @media (max-width: 510px) { + @media (max-width: 580px) { font-size: 2em; } `}> diff --git a/src/pages/LandingPage.tsx b/src/pages/LandingPage.tsx index 16d40c4..37785a6 100644 --- a/src/pages/LandingPage.tsx +++ b/src/pages/LandingPage.tsx @@ -3,7 +3,6 @@ import { jsx } from "@emotion/core"; import HeaderBar from "../components/HeaderBar"; import FormListing from "../components/FormListing"; -import OAuth2Button from "../components/OAuth2Button"; function LandingPage() { return <div> @@ -11,8 +10,6 @@ function LandingPage() { <div css={{marginLeft: "20px"}}> <h1>Welcome to Python Discord Forms</h1> - <OAuth2Button/> - <h3>Available forms</h3> <FormListing title="Ban Appeals" description="Appealing bans from the Discord server" open={true}/> |