diff --git a/src/App.css b/src/App.css index 410a4e1..6ef4777 100644 --- a/src/App.css +++ b/src/App.css @@ -56,36 +56,38 @@ main { background-color: rgba(0, 0, 0, 0.5); display: grid; - grid-template-rows: 1fr 2fr 2fr 1fr; - ; + align-items: center; + justify-content: center; h1 { - font-size: 2em; - margin: 1rem 0 0 0; + font-size: 1.2em; font-family: RobotoBold; - padding: 0.1em 0.2em 0.1em 0.2em; grid-row: 1/ span 1; + height: fit-content; overflow: hidden; + } - figure { + a { + display: contents; + } + + margin: 0; + grid-row: 2/ span 1; + + .chosen-movie-poster { + object-fit: cover; + height: 100%; width: 100%; - margin: 0; - grid-row: 2/ span 1; - place-self: center; - - .chosen-movie-poster { - aspect-ratio: 2/3; - max-width: 100%; - max-height: 100%; - } - + display: flex; + justify-content: center; } + #summary { overflow: scroll; - max-height: 24rem; + max-height: 100%; grid-row: 3/ span 1; } @@ -96,7 +98,9 @@ main { } footer { + font-size: 1.2rem; grid-row: 4/ span 1; + overflow: hidden; } } @@ -180,7 +184,7 @@ main { border: 1rem white; h1 { - font-size: 1.6rem; + font-size: 1.4rem; } } diff --git a/src/objects/sidebar.tsx b/src/objects/sidebar.tsx index dccb556..cc7aa00 100644 --- a/src/objects/sidebar.tsx +++ b/src/objects/sidebar.tsx @@ -11,14 +11,10 @@ export interface SidebarProps extends React.ComponentPropsWithRef<"div"> { export function Sidebar({ movie, similarMoviesAvailable, watchProviders }: SidebarProps) { return