Changeset View
Changeset View
Standalone View
Standalone View
common/templates/common/home.html
| {% extends 'common/base.html' %} | {% extends 'common/base.html' %} | ||||
| {% load static %} | {% load static %} | ||||
| {% block content %} | {% block content %} | ||||
| <div class="jumbotron jumbotron-fluid jumbotron-overlay overlay-wide-content jumbotron header mb-4"> | <div class="jumbotron jumbotron-fluid jumbotron-overlay overlay-wide-content jumbotron header mb-4"> | ||||
| <div class="jumbotron-bg-wrapper"> | <div class="jumbotron-bg-wrapper"> | ||||
| <img class="jumbotron-bg" src="{% static "common/images/home/sf-background.jpg" %}"> | <img class="jumbotron-bg" src="{% static "common/images/home/sf-background.jpg" %}"> | ||||
| <!-- TODO(Mike): Impliment image sets when flat-pages are done. --> | <!-- TODO(Mike): Impliment image sets when flat-pages are done. --> | ||||
| {% comment %} | {% comment %} | ||||
| {% include "common/components/helpers/image_set.html" with classes="jumbotron-bg" img_source=XXX xsmall_width="576" small_width="758" medium_width="992" large_width="1200" xlarge_width="1920" %} | {% include "common/components/helpers/image_set.html" with classes="jumbotron-bg" img_source=XXX xsmall_width="576" small_width="758" medium_width="992" large_width="1200" xlarge_width="1920" %} | ||||
| {% endcomment %} | {% endcomment %} | ||||
| </div> | </div> | ||||
| <div class="container-xl"> | <div class="container-xl"> | ||||
| <div class="row"> | <div class="row"> | ||||
| <div class="col-lg-5 col-md-6"> | <div class="col-lg-5 col-md-6"> | ||||
| <div class="jumbotron-body"> | <div class="jumbotron-body"> | ||||
| <p class="mb-2"> | <p class="mb-2"> | ||||
| {% comment %} <span class="badge badge-primary mr-2">New</span> {% endcomment %} | {% comment %} <span class="badge badge-primary mr-2">New</span> {% endcomment %} | ||||
| <span class="subtitle">Open Movie In Development</span> | <span class="subtitle">Open Movie In Development</span> | ||||
| </p> | </p> | ||||
| <a href="/films/sprite-fright"> | <a href="/films/sprite-fright"> | ||||
| <img class="mb-2 film-logo" src="{% static "common/images/home/sf-logo.png" %}"> | <img class="mb-2 film-logo" src="{% static "common/images/home/sf-logo.png" %}"> | ||||
| </a> | </a> | ||||
| <p class="mb-3">Blender Studio’s 13th open movie will be an 80’s-inspired horror comedy, set in Britain: When | <p class="mb-3">Blender Studio’s 13th open movie will be an 80’s-inspired horror comedy, set in Britain: When | ||||
| a group of rowdy teenagers trek into an isolated forest, they discover peaceful mushroom creatures that turn | a group of rowdy teenagers trek into an isolated forest, they discover peaceful mushroom creatures that turn | ||||
| out to be an unexpected force of nature.</p> | out to be an unexpected force of nature.</p> | ||||
| <a href="/films/sprite-fright" class="btn btn-primary">Check out the project</a> | <a href="/films/sprite-fright" class="btn btn-primary">Check out the project</a> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| <div class="container-xl"> | <div class="container-xl"> | ||||
| <!-- Live Stream --> | <!-- Live Stream --> | ||||
| {% comment %} <section class="mb-4"> | {% comment %} <section class="mb-4"> | ||||
| <div class="row"> | <div class="row"> | ||||
| <div class="col-12 col-md-6 mb-3 mb-md-0"> | <div class="col-12 col-md-6 mb-3 mb-md-0"> | ||||
| <div class="rounded embed-responsive embed-responsive-16by9"> | <div class="rounded embed-responsive embed-responsive-16by9"> | ||||
| <iframe src="https://www.youtube.com/embed/KWNcQZQkyjc" title="YouTube video player" frameborder="0" | <iframe src="https://www.youtube.com/embed/KWNcQZQkyjc" title="YouTube video player" frameborder="0" | ||||
| allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | ||||
| allowfullscreen></iframe> | allowfullscreen></iframe> | ||||
| </div> | </div> | ||||
| Show All 11 Lines | <div class="row"> | ||||
| <div class="button-group"> | <div class="button-group"> | ||||
| <a href="https://www.youtube.com/watch?v=KWNcQZQkyjc" rel=”nofollow” target="_blank" | <a href="https://www.youtube.com/watch?v=KWNcQZQkyjc" rel=”nofollow” target="_blank" | ||||
| class="btn btn-danger">Watch on YouTube</a> | class="btn btn-danger">Watch on YouTube</a> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </section> {% endcomment %} | </section> {% endcomment %} | ||||
| <!-- Latest Blog Posts --> | <!-- Latest Blog Posts --> | ||||
| {% include 'common/components/cards/card_carousel.html' with title="Latest Blog Posts" subtitle="Hear the latest news about the Blender Cloud right here." slides=3 card_set=latest_posts media_type="blog" id="latestPosts" %} | {% include 'common/components/cards/card_carousel.html' with title="Latest Blog Posts" subtitle="Hear the latest news about the Blender Cloud right here." slides=3 card_set=latest_posts media_type="blog" id="latestPosts" %} | ||||
| <!-- Recently watched --> | <!-- Recently watched --> | ||||
| {% if recently_watched_sections %} | {% if recently_watched_sections %} | ||||
| {% include 'common/components/cards/card_carousel.html' with title="Continue training" subtitle="Recently watched videos appear here! Continue watching where you left off." slides=4 card_set=recently_watched_sections media_type="section" id="continueTraining" %} | {% include 'common/components/cards/card_carousel.html' with title="Continue training" subtitle="Recently watched videos appear here! Continue watching where you left off." slides=4 card_set=recently_watched_sections media_type="section" id="continueTraining" %} | ||||
| {% endif %} | {% endif %} | ||||
| <!-- Latest Training --> | <!-- Latest Training --> | ||||
| {% include 'common/components/cards/card_carousel.html' with title="Latest Training" subtitle="Want to see more? <a href='/training'>Explore all training</a>" slides=3 card_set=featured_trainings media_type="training" id="featuredTrainings" %} | {% include 'common/components/cards/card_carousel.html' with title="Latest Training" subtitle="Want to see more? <a href='/training'>Explore all training</a>" slides=3 card_set=featured_trainings media_type="training" id="featuredTrainings" %} | ||||
| <section class="mb-4"> | <section class="mb-4"> | ||||
| <div class="row justify-content-center mb-3"> | <div class="row justify-content-center mb-3"> | ||||
| <div class="col-md-6 text-center"> | <div class="col-md-6 text-center"> | ||||
| <h2 class="mb-0">Featured Open Movies</h2> | <h2 class="mb-0">Featured Open Movies</h2> | ||||
| <p class="mb-0">The Blender <a href="/films">Open Movie projects</a> are made possible by subscriptions to the | <p class="mb-0">The Blender <a href="/films">Open Movie projects</a> are made possible by subscriptions to the | ||||
| Blender Cloud.</p> | Blender Cloud.</p> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| <div class="row"> | <div class="row"> | ||||
| {% for film in featured_films|slice:':3' %} | {% for film in featured_films|slice:':3' %} | ||||
| {% include "films/components/card_film.html" with film=film %} | {% include "films/components/card_film.html" with film=film %} | ||||
| {% endfor %} | {% endfor %} | ||||
| </div> | </div> | ||||
| </section> | </section> | ||||
| {% include 'common/components/cards/card_carousel.html' with title="From The Archives" subtitle="Want to see more? <a href='/training'>Explore all training</a>" slides=4 card_set=featured_film_assets media_type="file" id="fromTheArchives" %} | {% include 'common/components/cards/card_carousel.html' with title="From The Archives" subtitle="Want to see more? <a href='/training'>Explore all training</a>" slides=4 card_set=featured_film_assets media_type="file" id="fromTheArchives" %} | ||||
| </div> | </div> | ||||
| {% endblock content %} | {% endblock content %} | ||||