diff options
-rw-r--r-- | src/components/FormListing.tsx | 7 | ||||
-rw-r--r-- | src/components/HeaderBar/index.tsx | 6 |
2 files changed, 12 insertions, 1 deletions
diff --git a/src/components/FormListing.tsx b/src/components/FormListing.tsx index 055c624..58f21f8 100644 --- a/src/components/FormListing.tsx +++ b/src/components/FormListing.tsx @@ -22,7 +22,12 @@ function FormListing(props: FormListingProps) { margin-top: 20px; margin-bottom: 20px; border-radius: 10px; - transition: transform 100ms; + transition-property: transform, width; + transition-duration: 500ms; + + @media (max-width: 575px) { + width: 80%; + } &:hover { transform: scale(1.01); diff --git a/src/components/HeaderBar/index.tsx b/src/components/HeaderBar/index.tsx index 0569e3d..94dd900 100644 --- a/src/components/HeaderBar/index.tsx +++ b/src/components/HeaderBar/index.tsx @@ -45,6 +45,12 @@ function HeaderBar() { @media (max-width: 580px) { font-size: 2em; } + + @media (max-width: 400px) { + font-size: 1.5em; + text-align: center; + margin-left: 0; + } `}> Python Discord Forms </h1> |