Services page: move to bootstrap 4

This commit is contained in:
2018-08-31 13:52:40 +02:00
parent 68d09dc886
commit fcf715b5b1

View File

@@ -20,27 +20,18 @@ meta(name="twitter:image", content="{{ url_for('static', filename='assets/img/ba
| {% endblock %} | {% endblock %}
| {% block body %} | {% block body %}
#page-container .jumbotron.jumbotron-overlay.text-white.mb-1(style="background-image: url({{ url_for('static', filename='assets/img/backgrounds/services_projects.jpg')}})")
#page-header(style="background-image: url({{ url_for('static', filename='assets/img/backgrounds/services_projects.jpg')}})")
.container .container
.page-title .row
| Blender Cloud Services .col-md-8
.page-title-summary .display-4.text-uppercase.font-weight-bold
span.text-background | Services
p. .lead.
Blender Cloud is the creative hub for your projects, powered by Free and Open Source software.
p.
On Blender Cloud you can create and share personal projects, access our texture and HDRI On Blender Cloud you can create and share personal projects, access our texture and HDRI
library (or create your own), keep track of your production, manage your renders and much more! library (or create your own), keep track of your production, manage your renders and much more!
.navbar-backdrop-overlay - var addon_text = 'Available through the <a href="{{ url_for(\'cloud.services\') }}#blender-cloud-add-on">Blender Cloud add-on</a>'
section#blender-cloud-add-on.page-card
- var addon_text = 'Available through the <a href="{{ url_for(\'cloud.services\') }}#blender-cloud-add-on">Blender Cloud add-on</a>'
#page-content
section#blender-cloud-add-on.page-card
.page-card-side .page-card-side
h2.page-card-title h2.page-card-title
| Blender Cloud add-on | Blender Cloud add-on
@@ -54,7 +45,7 @@ meta(name="twitter:image", content="{{ url_for('static', filename='assets/img/ba
small Blender Cloud add-on requires Blender 2.78 or newer small Blender Cloud add-on requires Blender 2.78 or newer
a.page-card-cta.download( a.btn-success(
href="https://cloud.blender.org/r/downloads/blender_cloud-latest-addon.zip") href="https://cloud.blender.org/r/downloads/blender_cloud-latest-addon.zip")
i.pi-download i.pi-download
| Download add-on &nbsp;<small>v</small> {{ config.BLENDER_CLOUD_ADDON_VERSION }} | Download add-on &nbsp;<small>v</small> {{ config.BLENDER_CLOUD_ADDON_VERSION }}
@@ -63,7 +54,7 @@ meta(name="twitter:image", content="{{ url_for('static', filename='assets/img/ba
img( img(
src="{{ url_for('static', filename='assets/img/features/blender_cloud_addon_thumbnail.png')}}") src="{{ url_for('static', filename='assets/img/features/blender_cloud_addon_thumbnail.png')}}")
section#blender-sync.page-card.right section#blender-sync.page-card.right
.page-card-side .page-card-side
h2.page-card-title Blender Sync h2.page-card-title Blender Sync
.page-card-summary .page-card-summary
@@ -86,7 +77,7 @@ meta(name="twitter:image", content="{{ url_for('static', filename='assets/img/ba
src="{{ url_for('static', filename='assets/img/features/sync_thumbnail.jpg')}}") src="{{ url_for('static', filename='assets/img/features/sync_thumbnail.jpg')}}")
section#texture-browser.page-card.right section#texture-browser.page-card.right
.page-card-side .page-card-side
h2.page-card-title Texture & HDRI Browser h2.page-card-title Texture & HDRI Browser
.page-card-summary .page-card-summary
@@ -97,7 +88,7 @@ meta(name="twitter:image", content="{{ url_for('static', filename='assets/img/ba
.tip !{addon_text} .tip !{addon_text}
a.page-card-cta.js-watch-video.download( a.btn-success.js-watch-video(
href="https://www.youtube.com/watch?v=-srXYv2Osjw", href="https://www.youtube.com/watch?v=-srXYv2Osjw",
data-youtube-id="-srXYv2Osjw") data-youtube-id="-srXYv2Osjw")
i.pi-play i.pi-play
@@ -108,7 +99,7 @@ meta(name="twitter:image", content="{{ url_for('static', filename='assets/img/ba
src="{{ url_for('static', filename='assets/img/features/tex_library_thumbnail.jpg')}}") src="{{ url_for('static', filename='assets/img/features/tex_library_thumbnail.jpg')}}")
section#image-sharing.page-card.right section#image-sharing.page-card.right
.page-card-side .page-card-side
h2.page-card-title Image Sharing h2.page-card-title Image Sharing
.page-card-summary .page-card-summary
@@ -117,7 +108,7 @@ meta(name="twitter:image", content="{{ url_for('static', filename='assets/img/ba
.tip !{addon_text} .tip !{addon_text}
a.page-card-cta.download.js-watch-video( a.btn-success.js-watch-video(
href="https://www.youtube.com/watch?v=yvtqeMBOAyk", href="https://www.youtube.com/watch?v=yvtqeMBOAyk",
data-youtube-id="yvtqeMBOAyk") data-youtube-id="yvtqeMBOAyk")
i.pi-play i.pi-play
@@ -132,7 +123,7 @@ meta(name="twitter:image", content="{{ url_for('static', filename='assets/img/ba
src="{{ url_for('static', filename='assets/img/features/image_sharing_thumbnail.jpg')}}") src="{{ url_for('static', filename='assets/img/features/image_sharing_thumbnail.jpg')}}")
section#projects.page-card.right section#projects.page-card.right
.page-card-side .page-card-side
h2.page-card-title Private Projects h2.page-card-title Private Projects
.page-card-summary. .page-card-summary.
@@ -148,14 +139,14 @@ meta(name="twitter:image", content="{{ url_for('static', filename='assets/img/ba
src="{{ url_for('static', filename='assets/img/features/projects_thumbnail.jpg')}}") src="{{ url_for('static', filename='assets/img/features/projects_thumbnail.jpg')}}")
section#attract.page-card.right section#attract.page-card.right
.page-card-side .page-card-side
h2.page-card-title h2.page-card-title
| Attract | Attract
.page-card-summary. .page-card-summary.
Production-management software for your film, game, or commercial projects. Production-management software for your film, game, or commercial projects.
a.page-card-cta.download.js-watch-video( a.btn-success.js-watch-video(
href="https://www.youtube.com/watch?v=b9x1rlyyt_o", href="https://www.youtube.com/watch?v=b9x1rlyyt_o",
data-youtube-id="b9x1rlyyt_o") data-youtube-id="b9x1rlyyt_o")
i.pi-play i.pi-play
@@ -171,14 +162,14 @@ meta(name="twitter:image", content="{{ url_for('static', filename='assets/img/ba
src="{{ url_for('static', filename='assets/img/features/attract_thumbnail.jpg')}}") src="{{ url_for('static', filename='assets/img/features/attract_thumbnail.jpg')}}")
section#flamenco.page-card.right section#flamenco.page-card.right
.page-card-side .page-card-side
h2.page-card-title h2.page-card-title
| Flamenco | Flamenco
.page-card-summary. .page-card-summary.
Take control of your computing infrastructure and get things done. Take control of your computing infrastructure and get things done.
a.page-card-cta.download.js-watch-video( a.btn-success.js-watch-video(
href="https://www.youtube.com/watch?v=7cnFKhsM67Q", href="https://www.youtube.com/watch?v=7cnFKhsM67Q",
data-youtube-id="7cnFKhsM67Q") data-youtube-id="7cnFKhsM67Q")
i.pi-play i.pi-play
@@ -194,30 +185,33 @@ meta(name="twitter:image", content="{{ url_for('static', filename='assets/img/ba
src="{{ url_for('static', filename='assets/img/features/flamenco_thumbnail.jpg')}}") src="{{ url_for('static', filename='assets/img/features/flamenco_thumbnail.jpg')}}")
| {% if not current_user.has_role('subscriber') %} | {% if not current_user.has_role('subscriber') %}
section.page-card.subscribe( section.page-card(
style="background-image: url({{ url_for('static', filename='assets/img/backgrounds/pattern_01.jpg')}})") style="background-image: url({{ url_for('static', filename='assets/img/backgrounds/pattern_01.jpg')}})")
.page-card-side .page-card-side
h2.page-card-title h2.page-card-title
| All of this, plus hours of training and production assets. | All of this, plus hours of training and production assets.
.page-card-summary
.page-card-summary.text-white
| Join us for only $9.90/month! | Join us for only $9.90/month!
a.page-card-cta(
href="https://store.blender.org/product/membership/") a.page-card-cta(href="https://store.blender.org/product/membership/")
| Subscribe Now | Subscribe Now
| {% endif %} | {% endif %}
| {% endblock %} | {% endblock %}
| {% block footer_scripts %} | {% block footer_scripts %}
script. script.
// Click anywhere in the page to hide the overlay // Hide the video overlay.
function hideOverlay() { function hideOverlay() {
$('#page-overlay.video').removeClass('active'); $('#page-overlay.video').removeClass('active');
$('#page-overlay.video .video-embed').html(''); $('#page-overlay.video .video-embed').html('');
} }
// Click anywhere in the page or hit Esc to hide the overlay.
$(document).click(function() { $(document).click(function() {
hideOverlay(); hideOverlay();
}); });
@@ -229,12 +223,12 @@ script.
}); });
$('a.js-watch-video').click(function(e){ $('a.js-watch-video').click(function(e){
var videoId = $(this).attr('data-youtube-id');
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
$('#page-overlay.video').addClass('active'); $('#page-overlay.video').addClass('active');
var videoId = $(this).attr('data-youtube-id');
$('#page-overlay .video-embed').html('<iframe src="https://www.youtube.com/embed/' + videoId +'?rel=0&amp;showinfo=0;autoplay=1" frameborder="0" allowfullscreen></iframe>') $('#page-overlay .video-embed').html('<iframe src="https://www.youtube.com/embed/' + videoId +'?rel=0&amp;showinfo=0;autoplay=1" frameborder="0" allowfullscreen></iframe>')
}); });