From 1beb3ca488e0aa8fb1ae0671518dc79ced9d27c3 Mon Sep 17 00:00:00 2001 From: Pablo Vazquez Date: Fri, 2 Dec 2016 16:18:17 +0100 Subject: [PATCH] Better join page for the agent project --- src/styles/_project.sass | 60 +++++++++++++ src/styles/project-main.sass | 1 - src/templates/join_agent.jade | 153 +++++++--------------------------- 3 files changed, 92 insertions(+), 122 deletions(-) diff --git a/src/styles/_project.sass b/src/styles/_project.sass index bac7f588..1ee6e3ed 100644 --- a/src/styles/_project.sass +++ b/src/styles/_project.sass @@ -2674,3 +2674,63 @@ section.node-children .blog_index-header border-radius: 0 + +.join-project + display: flex + flex-direction: column + width: 100% + height: 100% + color: white + + background-position-x: 64% + + a.cta + padding: 5px 35px + +button($color-primary, 3px, true) + + a.cta-learn-more + padding: 5px 20px + +button(white, 3px) + display: inline-block + margin: 25px 0 25px 15px + padding: 5px 35px + + &__title + display: flex + padding: 25px 0 10px 10px + font: + size: 2.5em + weight: 300 + + span.icon + display: flex + align-items: center + + span.text + display: flex + align-items: center + text-align: left + line-height: 1.2em + margin-right: auto + + &__lead + font-size: 1.4em + font-weight: 300 + padding: 0 25px 25px + max-width: 800px + + &__summary + font-size: 1.1em + padding: 0 25px + max-width: 500px + + ul + margin: 0 + padding-left: 20px + + &-cta-container + a.cta + display: inline-block + margin: 25px 0 0 0 + padding: 5px 35px + text-align: center diff --git a/src/styles/project-main.sass b/src/styles/project-main.sass index 56d53ada..7854143b 100644 --- a/src/styles/project-main.sass +++ b/src/styles/project-main.sass @@ -9,7 +9,6 @@ @import _error @import _search -@import _pages @import plugins/_jstree @import plugins/_js_select2 diff --git a/src/templates/join_agent.jade b/src/templates/join_agent.jade index edef0d4f..b17c9093 100644 --- a/src/templates/join_agent.jade +++ b/src/templates/join_agent.jade @@ -1,133 +1,44 @@ | {% set title = 'join' %} -link(href="{{ url_for('static_pillar', filename='assets/css/main.css', v=11220163) }}", rel="stylesheet") | {% block body %} -#page-container.join -.navbar-backdrop.join( +.join-project( style="background-image: url({{ url_for('static', filename='assets/img/backgrounds/background_agent327_02.jpg')}})") - #page-header - .page-title Support the Agent 327 project - .page-title-summary - p Join us as we make the Agent 327 "Barbershop" scene - ul - li Exclusive production insight & walk-throughs - li High-quality assets ready to use - li All the open movies files & tutorials - li 100+ hours of training + .join-project__title + span.icon + i.pi-lock-open + span.text Get Your Backstage Pass - .page-header-cta-container - a.page-header-cta(href="https://store.blender.org/product/membership/") + .join-project__lead. + Subscribe, be part of the action and join us
as we make the Agent 327 "Barbershop" scene. + + .join-project__summary + p By becoming a Blender Cloud member, you will gain access to: + ul + li All the artwork being developed for the short + li Animation tests and reviews + li New versions of the film every week + li Follow us closely via Attract, our project management software + + .join-project__summary-cta-container + a.cta(href="https://store.blender.org/product/membership/") | Join Now + a.cta-learn-more(href="https://cloud.blender.org/p/agent-327/about") + | Learn more - a.page-header-cta-extra(href="https://store.blender.org/product/membership/") - | for only €9.90 - i.pi-angle-right + .join-project__summary + p On top of that, you will get full Blender Cloud access to: + ul + li Exclusive production insight & walk-throughs + li High-quality assets ready to use + li All the open movies files & tutorials + li 100+ hours of training + li Blender Cloud add-on with texture browsing & Blender Sync + li All of this and more for only USD 9.90/month! - #page-content - .page-triplet-container.homepage - .row - .col-md-6 - .triplet-card(data-url="{{ url_for('main.open_projects') }}") - .triplet-card-thumbnail - img( - alt="Open Projects", - src="{{ url_for('static', filename='assets/img/features/open_movies_02.jpg')}}") - .triplet-card-info - h3 Open Projects - p. - The iconic Blender Institute Open Movies, - featuring all the production files, assets, artwork, and never-seen-before content. - a.triplet-cta(href="{{ url_for('main.open_projects') }}") - | LEARN MORE - - .col-md-6 - .triplet-card(data-url="{{ url_for('main.training') }}") - .triplet-card-thumbnail - img( - alt="Training and Tutorials", - src="{{ url_for('static', filename='assets/img/features/training_02.jpg')}}") - .triplet-card-info - h3 Training & Tutorials - p. - Character modeling, 3D printing, VFX, rigging and more. We offer - 12 complete training series with +100 hours of training. - a.triplet-cta(href="{{ url_for('main.training') }}") - | LEARN MORE - - .row - .col-md-6 - .triplet-card(data-url="{{ url_for('main.redir_hdri') }}") - .triplet-card-thumbnail - img( - alt="HDRI", - src="{{ url_for('static', filename='assets/img/features/hdri_01.jpg')}}") - .triplet-card-info - h3 HDRI - p. - Up to 8K and 18 EVs (extremely high) HDR images to light your renders. - a.triplet-cta(href="{{ url_for('main.redir_hdri') }}") - | LEARN MORE - .col-md-6 - .triplet-card(data-url="{{ url_for('main.redir_textures') }}") - .triplet-card-thumbnail - img( - alt="Textures", - src="{{ url_for('static', filename='assets/img/features/textures_01.jpg')}}") - .triplet-card-info - h3 Textures - p. - More than 1500 texture maps. - Browse online or from Blender with our awesome add-on. - a.triplet-cta(href="{{ url_for('main.redir_textures') }}") - | LEARN MORE - - .row - .col-md-6 - .triplet-card(data-url="{{ url_for('main.redir_characters') }}") - .triplet-card-thumbnail - img( - alt="Characters", - src="{{ url_for('static', filename='assets/img/features/characters_01.jpg')}}") - .triplet-card-info - h3 Characters - p. - Production quality, fully rigged and shaded characters ready to animate. - a.triplet-cta(href="{{ url_for('main.redir_characters') }}") - | LEARN MORE - .col-md-6 - .triplet-card(data-url="{{ url_for('main.services') }}") - .triplet-card-thumbnail - img( - alt="Services and Tools", - src="{{ url_for('static', filename='assets/img/features/services_01.jpg')}}") - .triplet-card-info - h3 Services & Tools - p. - Create your personal projects, collaborate with other members, store - and sync your Blender settings across multiple workstations. - a.triplet-cta(href="{{ url_for('main.services') }}") - | LEARN MORE - - section.page-card.subscribe( - style="background-image: url({{ url_for('static', filename='assets/img/backgrounds/background_services.jpg')}});") - .page-card-side - h2.page-card-title - | Get inspiration, knowledge, and tools in one place. - .page-card-summary - | Join us for only $9.90/month! - a.page-card-cta( - href="https://store.blender.org/product/membership/") - | Subscribe Now - -| {% endblock %} - -| {% block footer_scripts %} -script. - - $('.triplet-card').click(function(){ - window.location.href = $(this).attr('data-url'); - }); + .join-project__summary-cta-container + a.cta-learn-more(href="https://cloud.blender.org/services") + | Blender Cloud Services | {% endblock %}