git.iko.soy/urbit.org
on master help sign in
Merge pull request #190 from urbit/feat/full-video
2e05183Matilde Park
sass/_main.scss+18
compare with master
unifiedsplit
@@ -533,3 +533,21 @@ hr {
533.scroll-smooth {
533.scroll-smooth {
534 scroll-behavior: smooth;
534 scroll-behavior: smooth;
535}
535}
536+
537+.vid-insert-wrap {
538+ position: relative;
539+ width: 100vw;
540+ height: 850px;
541+}
542+
543+.vid-insert {
544+ position: absolute;
545+ right: 0;
546+ bottom: 0;
547+ // USE CONTAINER TO CONTROL HEIGHT + WIDTH
548+ width: 100%;
549+ height: 100%;
550+ object-fit: cover;
551+ overflow: hidden;
552+ z-index:-99;
553+}
templates/index.html+17−8
@@ -11,15 +11,24 @@ content: " ↗";
11
11
12{% block content %}
12{% block content %}
13
13
14−<section class="full video-container bg-black full-bleed relative" id="video" style="
14+<section class="full p0 vid-insert-wrap full-bleed">
15−">
15+
16−<h1 class="white mt0 mb0 dib fw4 absolute" id="vid-header"
16+ <video class="vid-insert bg-black" autoplay muted loop>
17−style="z-index: 2; top: 50%;">
17+ <source
18+ src="https://storage.googleapis.com/media.urbit.org/site/sea30-1440.mp4"
19+ type="video/mp4">
20+ Your browser does not support the video tag.
21+ </video>
22+
23+ <div class='grid12' style='height: 100%; width:100%;'>
24+ <div class='full c4-10-lg flex items-center align-center z10 white'>
18−Urbit is your last computer.
25+ Urbit is your last computer.
19−</h1>
26+ </div>
27+ </div>
28+ <!-- VIMEO VERSION KEPT AS SHIM -->
20− <iframe src="https://player.vimeo.com/video/365181756?background=1"
29+ <!-- <iframe src="https://player.vimeo.com/video/365353672?background=1"
21 class="w-100 ma0 h-100" frameborder="0" allow="autoplay;fullscreen" allowfullscreen="" style="
30 class="w-100 ma0 h-100" frameborder="0" allow="autoplay;fullscreen" allowfullscreen="" style="
22−"></iframe>
31+"></iframe> -->
23</section>
32</section>
24
33
25<nav class="home full c4-10-lg mt6 mb5 grid12">
34<nav class="home full c4-10-lg mt6 mb5 grid12">