
the application is now rewritten in next.js. this commit also adds the ability to see trailers, did you know, more like this, etc. on title page. BREAKING CHANGE: the whole application is rewritten from scratch.
72 lines
1.3 KiB
SCSS
72 lines
1.3 KiB
SCSS
@use '../../../abstracts' as helper;
|
|
|
|
.title {
|
|
// major whitespace properties used on title page
|
|
--doc-whitespace: var(--spacer-8);
|
|
--comp-whitespace: var(--spacer-3);
|
|
|
|
display: grid;
|
|
|
|
gap: var(--doc-whitespace);
|
|
padding: var(--doc-whitespace);
|
|
align-items: start;
|
|
|
|
grid-template-columns: repeat(8, 1fr);
|
|
grid-template-areas:
|
|
'basic basic basic basic basic basic basic basic'
|
|
'media media media media media media media media'
|
|
'cast cast cast cast cast cast cast cast'
|
|
'text text text text text info info info'
|
|
'related related related related related related related related';
|
|
|
|
@include helper.bp('bp-1200') {
|
|
grid-template-columns: none;
|
|
grid-template-areas:
|
|
'basic'
|
|
'media'
|
|
'cast'
|
|
'text'
|
|
'info'
|
|
'related';
|
|
}
|
|
|
|
@include helper.bp('bp-700') {
|
|
--doc-whitespace: var(--spacer-5);
|
|
}
|
|
|
|
@include helper.bp('bp-450') {
|
|
padding: var(--spacer-3);
|
|
}
|
|
}
|
|
|
|
.basic {
|
|
grid-area: basic;
|
|
}
|
|
|
|
.media {
|
|
grid-area: media;
|
|
}
|
|
|
|
.cast {
|
|
grid-area: cast;
|
|
}
|
|
|
|
.textarea {
|
|
grid-area: text;
|
|
display: grid;
|
|
|
|
gap: var(--doc-whitespace);
|
|
}
|
|
|
|
.infoarea {
|
|
grid-area: info;
|
|
}
|
|
|
|
.related {
|
|
grid-area: related;
|
|
}
|
|
|
|
.morelikethis {
|
|
grid-area: related;
|
|
}
|