diff options
Diffstat (limited to 'youtube/templates')
-rw-r--r-- | youtube/templates/watch.html | 34 |
1 files changed, 28 insertions, 6 deletions
diff --git a/youtube/templates/watch.html b/youtube/templates/watch.html index ccb03e3..3421059 100644 --- a/youtube/templates/watch.html +++ b/youtube/templates/watch.html @@ -3,17 +3,39 @@ {% import "common_elements.html" as common_elements %} {% import "comments.html" as comments %} {% block style %} + {% if theater_mode %} + video{ + grid-column: 1 / span 5; + width: 100%; + max-height: 360px; + } + #related{ + margin-top: 10px; + grid-row: 2 /span 3; + width: 400px; + } + .video-info{ + margin-top: 10px; + width: 640px; + } + {% else %} + video{ + height: 360px; + width: 640px; + grid-column: 2; + } + #related{ + grid-row: 1 /span 4; + } + {% endif %} + main{ display:grid; grid-template-columns: 1fr 640px 40px 400px 1fr; grid-template-rows: auto auto auto auto; align-content: start; } - video{ - height: 360px; - width: 640px; - grid-column: 2; - } + .video-info{ grid-column: 2; grid-row: 2; @@ -99,7 +121,6 @@ } #related{ grid-column: 4; - grid-row: 1 /span 4; display: grid; grid-auto-rows: 94px; grid-row-gap: 10px; @@ -116,6 +137,7 @@ margin-top: 10px; grid-column: 2; grid-row: 3; + width: initial; } .comments-area{ grid-row: 4; |