Changeset View
Changeset View
Standalone View
Standalone View
common/templates/common/welcome.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"> | <div class="jumbotron jumbotron-fluid jumbotron-overlay overlay-wide-content jumbotron header"> | ||||
| <div class="jumbotron-bg-wrapper"> | <div class="jumbotron-bg-wrapper"> | ||||
| <img class="jumbotron-bg" src="{% static "common/images/welcome/welcome-header-sprite.jpg" %}" | <img class="jumbotron-bg" src="{% static "common/images/welcome/welcome-header-sprite.jpg" %}" | ||||
| alt="3D Render of the latest Blender Open Movie"> | alt="3D Render of the latest Blender Open Movie"> | ||||
| <!-- 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-6 col-md-8"> | <div class="col-lg-6 col-md-8"> | ||||
| <div class="jumbotron-body"> | <div class="jumbotron-body"> | ||||
| <h1 class="mb-2">Learn to make Movies from the Blender Animation Team</h1> | <h1 class="mb-2">Learn to make Movies from the Blender Animation Team</h1> | ||||
| <p>Follow along with our expert team at your own pace — on every subject from Animation to UV | <p>Follow along with our expert team at your own pace — on every subject from Animation to UV | ||||
| unwrapping.</p> | unwrapping.</p> | ||||
| <p class="mb-4">With <strong>hundreds of hours of training</strong> and <strong>1000's of production | <p class="mb-4">With <strong>hundreds of hours of training</strong> and <strong>1000's of production | ||||
| files</strong>, you're getting the best resources Blender has to offer.</p> | files</strong>, you're getting the best resources Blender has to offer.</p> | ||||
| {% comment %} <div class="row mb-4 justify-content-stretch"> | {% comment %} <div class="row mb-4 justify-content-stretch"> | ||||
| <div class="col-md-4 d-flex flex-column justify-content-between"> | <div class="col-md-4 d-flex flex-column justify-content-between"> | ||||
| <h3>Learn from our expert team</h3> | <h3>Learn from our expert team</h3> | ||||
| <p class="small">Courses, workshops and production lessons with .blend files included. | <p class="small">Courses, workshops and production lessons with .blend files included. | ||||
| </p> | </p> | ||||
| </div> | </div> | ||||
| <div class="col-md-4 d-flex flex-column justify-content-between"> | <div class="col-md-4 d-flex flex-column justify-content-between"> | ||||
| <h3>Download 1000s of files and assets</h3> | <h3>Download 1000s of files and assets</h3> | ||||
| <p class="small">Production quality HDRI’s, textures and fully rigged characters.</p> | <p class="small">Production quality HDRI’s, textures and fully rigged characters.</p> | ||||
| </div> | </div> | ||||
| <div class="col-md-4 d-flex flex-column justify-content-between"> | <div class="col-md-4 d-flex flex-column justify-content-between"> | ||||
| <h3>Use our production software</h3> | <h3>Use our production software</h3> | ||||
| <p class="small">Featuring task tracking, render management and asset libraries.</p> | <p class="small">Featuring task tracking, render management and asset libraries.</p> | ||||
| </div> | </div> | ||||
| </div> {% endcomment %} | </div> {% endcomment %} | ||||
| <div class="d-flex flex-column flex-md-row align-items-start align-items-md-center"> | <div class="d-flex flex-column flex-md-row align-items-start align-items-md-center"> | ||||
| <a {% include "subscriptions/components/join_url" %} | <a {% include "subscriptions/components/join_url" %} | ||||
| class="btn btn-lg btn-primary mr-md-4 mb-2 mb-md-0">Join the Blender Cloud</a> | class="btn btn-lg btn-primary mr-md-4 mb-2 mb-md-0">Join the Blender Cloud</a> | ||||
| <div class="d-inline-block"> | <div class="d-inline-block"> | ||||
| <p class="mb-0">Access to all training, assets<br>and films for €9.90/month</p> | <p class="mb-0">Access to all training, assets<br>and films for €9.90/month</p> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| <div class="container-xl mt-4 mt-md-5"> | <div class="container-xl mt-4 mt-md-5"> | ||||
| <section class="mb-4 mb-md-5"> | <section class="mb-4 mb-md-5"> | ||||
| <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-1">From A to UV, we’ve got it covered.</h2> | <h2 class="mb-1">From A to UV, we’ve got it covered.</h2> | ||||
| <p class="mb-0">With courses covering every major topic in Blender, you get the tools to learn, explore | <p class="mb-0">With courses covering every major topic in Blender, you get the tools to learn, explore | ||||
| and grow as an artist with the Blender Cloud.</p> | and grow as an artist with the Blender Cloud.</p> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| <div class="row"> | <div class="row"> | ||||
| {% for training in featured_trainings|slice:':3' %} | {% for training in featured_trainings|slice:':3' %} | ||||
| {% include "common/components/cards/card_training.html" with training=training %} | {% include "common/components/cards/card_training.html" with training=training %} | ||||
| {% endfor %} | {% endfor %} | ||||
| </div> | </div> | ||||
| <div class="row justify-content-center mb-0"> | <div class="row justify-content-center mb-0"> | ||||
| <div class="col-md-6 text-center"> | <div class="col-md-6 text-center"> | ||||
| <p class="mb-0">Want to see more? <a href="/training">Explore all Blender Cloud Training</a>.</p> | <p class="mb-0">Want to see more? <a href="/training">Explore all Blender Cloud Training</a>.</p> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </section> | </section> | ||||
| <section class="mb-4 mb-md-5"> | <section class="mb-4 mb-md-5"> | ||||
| <div class="row"> | <div class="row"> | ||||
| {% for section in featured_sections|slice:':1' %} | {% for section in featured_sections|slice:':1' %} | ||||
| {% if section.static_asset.source_type == 'video' %} | {% if section.static_asset.source_type == 'video' %} | ||||
| {% include "common/components/video_player.html" with url=section.static_asset.source.url poster=section.thumbnail_m_url classes="col-12 col-md-6 mb-3 mb-md-0 rounded"%} | {% include "common/components/video_player.html" with url=section.static_asset.source.url poster=section.thumbnail_m_url classes="col-12 col-md-6 mb-3 mb-md-0 rounded"%} | ||||
| {% endif %} | {% endif %} | ||||
| {% endfor %} | {% endfor %} | ||||
| <div class="col-12 col-md-6 col-lg-5 offset-lg-1 d-flex flex-column justify-content-center"> | <div class="col-12 col-md-6 col-lg-5 offset-lg-1 d-flex flex-column justify-content-center"> | ||||
| <h2 class="mb-1">Learn from the Blender Team</h2> | <h2 class="mb-1">Learn from the Blender Team</h2> | ||||
| <p>Whether it’s Blender Develop Dr. Sybren teaching <a href="/training/scripting-for-artists/">Scripting for | <p>Whether it’s Blender Develop Dr. Sybren teaching <a href="/training/scripting-for-artists/">Scripting for | ||||
| Artists</a>, or Animation Director Hjalti teaching | Artists</a>, or Animation Director Hjalti teaching | ||||
| <a href="/training/animation-fundamentals/">Animation Fundamentals</a> — you’re getting industry leading | <a href="/training/animation-fundamentals/">Animation Fundamentals</a> — you’re getting industry leading | ||||
| training from the people in Blender.</p> | training from the people in Blender.</p> | ||||
| <p>Ask questions and receive replies from the Author, download resources and join the discussion.</p> | <p>Ask questions and receive replies from the Author, download resources and join the discussion.</p> | ||||
| <div class="button-group"> | <div class="button-group"> | ||||
| <a {% include "subscriptions/components/join_url" %} class="btn btn-primary">Subscribe for | <a {% include "subscriptions/components/join_url" %} class="btn btn-primary">Subscribe for | ||||
| 9.90/mo</a> | 9.90/mo</a> | ||||
| <a href="/training" class="btn btn-transparent">Explore Training</a> | <a href="/training" class="btn btn-transparent">Explore Training</a> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </section> | </section> | ||||
| <section class="mb-5"> | <section class="mb-5"> | ||||
| <div class="row mb-3"> | <div class="row mb-3"> | ||||
| <div class="col"> | <div class="col"> | ||||
| <div class="jumbotron jumbotron-overlay overlay-wide-content jumbotron-inline header"> | <div class="jumbotron jumbotron-overlay overlay-wide-content jumbotron-inline header"> | ||||
| <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" %}" | ||||
| alt="3D Render of the latest Blender Open Movie"> | alt="3D Render of the latest Blender Open Movie"> | ||||
| <!-- 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="row"> | <div class="row"> | ||||
| <div class="col-md-7 col-lg-6"> | <div class="col-md-7 col-lg-6"> | ||||
| <div class="jumbotron-body"> | <div class="jumbotron-body"> | ||||
| <img class="mb-3 film-logo" src="{% static "common/images/home/sf-logo.png" %}" | <img class="mb-3 film-logo" src="{% static "common/images/home/sf-logo.png" %}" | ||||
| alt="Sprite Fright Logo"> | alt="Sprite Fright Logo"> | ||||
| {% comment %} <h1>Coffee Run</h1> {% endcomment %} | {% comment %} <h1>Coffee Run</h1> {% endcomment %} | ||||
| <p class="mb-4">Blender Studio’s 13th open movie will be an 80’s-inspired horror comedy, set in Britain: | <p class="mb-4">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 | When 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> | creatures that turn out to be an unexpected force of nature.</p> | ||||
| <a {% include "subscriptions/components/join_url" %} | <a {% include "subscriptions/components/join_url" %} | ||||
| class="btn btn-primary mb-2 mb-md-0">Subscribe for €9.90/month</a> | class="btn btn-primary mb-2 mb-md-0">Subscribe for €9.90/month</a> | ||||
| <a href="/films/sprite-fright" class="btn btn-transparent">Explore the Film</a> | <a href="/films/sprite-fright" class="btn btn-transparent">Explore the Film</a> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </section> | </section> | ||||
| <section class="mb-4 mb-md-5"> | <section class="mb-4 mb-md-5"> | ||||
| <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-1">Support Blender Open Movies</h2> | <h2 class="mb-1">Support Blender Open Movies</h2> | ||||
| <p class="mb-0">The Blender Open Movie projects are made possible by subscriptions to the Blender | <p class="mb-0">The Blender Open Movie projects are made possible by subscriptions to the Blender | ||||
| Studio.</p> | Studio.</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> | ||||
| <div class="row justify-content-center mb-0"> | <div class="row justify-content-center mb-0"> | ||||
| <div class="col-md-6 text-center"> | <div class="col-md-6 text-center"> | ||||
| <p class="mb-0">Learn more about our other <a href="/films">open movies</a> and <a | <p class="mb-0">Learn more about our other <a href="/films">open movies</a> and <a | ||||
| href="#faqHeadingHowIsMyMoneySpent">how your | href="#faqHeadingHowIsMyMoneySpent">how your | ||||
| contribution is used</a>.</p> | contribution is used</a>.</p> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </section> | </section> | ||||
| {% include 'common/components/cards/card_carousel.html' with title="Access all our production assets!" subtitle="You can access all the production files from our films with a Blender Cloud subscription." slides=4 card_set=featured_film_assets media_type="file" id="fromTheArchives" %} | {% include 'common/components/cards/card_carousel.html' with title="Access all our production assets!" subtitle="You can access all the production files from our films with a Blender Cloud subscription." slides=4 card_set=featured_film_assets media_type="file" id="fromTheArchives" %} | ||||
| <section class="my-5"> | <section class="my-5"> | ||||
| <div class="row mb-3"> | <div class="row mb-3"> | ||||
| <div class="col"> | <div class="col"> | ||||
| <div class="jumbotron jumbotron-overlay jumbotron-inline overlay-flipped header"> | <div class="jumbotron jumbotron-overlay jumbotron-inline overlay-flipped header"> | ||||
| <div class="jumbotron-bg-wrapper"> | <div class="jumbotron-bg-wrapper"> | ||||
| <img class="jumbotron-bg" src="{% static "common/images/welcome/dweebs-bg.png" %}" | <img class="jumbotron-bg" src="{% static "common/images/welcome/dweebs-bg.png" %}" | ||||
| alt="A 3D cartoon dog enjoying tasty treats"> | alt="A 3D cartoon dog enjoying tasty treats"> | ||||
| <!-- 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="row"> | <div class="row"> | ||||
| <div class="col-md-7 col-lg-6 offset-md-5 offset-lg-6"> | <div class="col-md-7 col-lg-6 offset-md-5 offset-lg-6"> | ||||
| <div class="jumbotron-body py-4"> | <div class="jumbotron-body py-4"> | ||||
| <h2 class="h1">Subscribe to Blender Cloud today</h2> | <h2 class="h1">Subscribe to Blender Cloud today</h2> | ||||
| <p class="mb-4">Join Blender Cloud and get access to hundreds of hours of training, | <p class="mb-4">Join Blender Cloud and get access to hundreds of hours of training, | ||||
| production assets and files from the Open Movies as well as a platform to learn at | production assets and files from the Open Movies as well as a platform to learn at | ||||
| your own pace, in your own time.</p> | your own pace, in your own time.</p> | ||||
| <a {% include "subscriptions/components/join_url" %} | <a {% include "subscriptions/components/join_url" %} | ||||
| class="btn btn-lg btn-primary">Subscribe for €9.90/month</a> | class="btn btn-lg btn-primary">Subscribe for €9.90/month</a> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </section> | </section> | ||||
| {% include 'common/components/faq.html' with classes="mb-5" %} | {% include 'common/components/faq.html' with classes="mb-5" %} | ||||
| </div> | </div> | ||||
| {% endblock content %} | {% endblock content %} | ||||