Fixes
This commit is contained in:
parent
1be59353d6
commit
87ca027277
2 changed files with 113 additions and 113 deletions
|
@ -1,96 +1,96 @@
|
|||
.Container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 15px;
|
||||
color: white;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 15px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.Top {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
margin-bottom: 30px;
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.Thumb {
|
||||
height: 450px;
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
.Name {
|
||||
margin-top: 10px;
|
||||
font-size: 3em;
|
||||
margin-top: 10px;
|
||||
font-size: 3em;
|
||||
}
|
||||
|
||||
.Biography {
|
||||
-webkit-box-orient: vertical;
|
||||
font-size: 1.3em;
|
||||
white-space: pre-line;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-box-orient: vertical;
|
||||
font-size: 1.3em;
|
||||
white-space: pre-line;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.Images {
|
||||
display: flex;
|
||||
overflow: scroll;
|
||||
align-items: start;
|
||||
gap: 15px;
|
||||
height: 200px;
|
||||
display: flex;
|
||||
overflow: auto;
|
||||
align-items: start;
|
||||
gap: 15px;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.Image {
|
||||
height: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.Right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.MovieTitle {
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.Collapsed {
|
||||
-webkit-line-clamp: 5;
|
||||
-webkit-line-clamp: 5;
|
||||
}
|
||||
|
||||
.Collapse {
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.Credits {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
gap: 20px;
|
||||
overflow: scroll;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
gap: 20px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.ReadMore {
|
||||
text-decoration: underline;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.Movie {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
text-decoration: none;
|
||||
color: white;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
text-decoration: none;
|
||||
color: white;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.Movie:hover {
|
||||
text-decoration: underline;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.Movie img {
|
||||
height: 300px;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.Section h1 {
|
||||
margin-top: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
|
|
@ -1,132 +1,132 @@
|
|||
.Container {
|
||||
color: white;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.Top {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
flex-direction: column;
|
||||
justify-content: flex-end;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
flex-direction: column;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.Thumb {
|
||||
position: absolute;
|
||||
left: 25px;
|
||||
bottom: 50px;
|
||||
box-shadow: 5px 5px 50px #00000030;
|
||||
position: absolute;
|
||||
left: 25px;
|
||||
bottom: 50px;
|
||||
box-shadow: 5px 5px 50px #00000030;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.Thumb {
|
||||
display: none;
|
||||
}
|
||||
.Thumb {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.Summary {
|
||||
background: linear-gradient(#00000050, black);
|
||||
font-size: 20px;
|
||||
overflow: scroll;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
background: linear-gradient(#00000050, black);
|
||||
font-size: 20px;
|
||||
overflow: auto;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.Overview {
|
||||
font-size: 1.3em;
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
.More {
|
||||
color: white;
|
||||
font-size: 1.3em;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
color: white;
|
||||
font-size: 1.3em;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.More p {
|
||||
margin: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.More:not(:hover) {
|
||||
text-decoration: none;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.Title {
|
||||
font-size: 2.75em;
|
||||
width: 40%;
|
||||
margin: 0;
|
||||
font-size: 2.75em;
|
||||
width: 40%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.Tagline {
|
||||
font-size: 1.65em;
|
||||
width: 40%;
|
||||
margin: 0;
|
||||
font-weight: bold;
|
||||
font-size: 1.65em;
|
||||
width: 40%;
|
||||
margin: 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.Bottom {
|
||||
background-color: black;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
padding: 20px 40px;
|
||||
flex-direction: column;
|
||||
background-color: black;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
padding: 20px 40px;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.Section div {
|
||||
margin-left: 10px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.Actors {
|
||||
display: flex;
|
||||
overflow: scroll;
|
||||
align-items: start;
|
||||
gap: 15px;
|
||||
display: flex;
|
||||
overflow: auto;
|
||||
align-items: start;
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.Actor {
|
||||
text-align: center;
|
||||
color: white;
|
||||
text-align: center;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.Actor img {
|
||||
height: 300px;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.Actor:not(:hover) {
|
||||
text-decoration: none;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.Tags {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
overflow: scroll;
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.Tags > * {
|
||||
background-color: var(--primary);
|
||||
padding: 5px 7px;
|
||||
border-radius: 10px;
|
||||
white-space: nowrap;
|
||||
background-color: var(--primary);
|
||||
padding: 5px 7px;
|
||||
border-radius: 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.Average {
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.Rate {
|
||||
color: white;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.RatingsLink {
|
||||
color: white;
|
||||
color: white;
|
||||
}
|
||||
|
|
Reference in a new issue