From 742a16fb9fed2c322df51ea6470c54f130975bf3 Mon Sep 17 00:00:00 2001 From: Pablo Vazquez Date: Wed, 30 Nov 2016 22:11:27 +0100 Subject: [PATCH] Better 403 error message --- src/styles/_error.sass | 91 +++++++++++++++++++++++++---- src/templates/errors/403_embed.jade | 64 +++++++++++++++++--- 2 files changed, 136 insertions(+), 19 deletions(-) diff --git a/src/styles/_error.sass b/src/styles/_error.sass index 5e9c517f..3835d0af 100644 --- a/src/styles/_error.sass +++ b/src/styles/_error.sass @@ -2,6 +2,27 @@ body.error width: 100% height: 100% +.error-watchamissing + padding: 0 15px + + h2 + color: $color-danger + font-size: 1.5em + + h3 + margin-top: 5px + font-size: 1.4em + p + color: $color-text-light-primary + font-size: .95em + + a:hover + text-decoration: none + h3 + color: lighten($color-primary, 10%) + p + color: $color-text-light + #error_container display: flex justify-content: center @@ -11,7 +32,6 @@ body.error left: 0 right: 0 bottom: 0 - background-color: darken($color-background-nav, 3%) &.standalone width: 100% @@ -28,11 +48,13 @@ body.error &.extra padding-top: 0 + a + color: $color-primary #error_box min-width: 60% - max-width: 500px - text-align: center + width: 100% + max-width: 800px display: flex justify-content: center align-items: center @@ -43,28 +65,71 @@ body.error box-shadow: 0 0 15px rgba(black, .2) padding: 0 background-color: $color-background-nav + border-top-left-radius: 3px + border-top-right-radius: 3px + overflow: hidden .error-top-container position: relative width: 100% background-color: $color-background-nav - background: repeating-linear-gradient(-45deg, lighten($color-background-nav, 2%), lighten($color-background-nav, 2%) 10px, $color-background-nav 10px, $color-background-nav 20px) + + .error-top-header-overlay + background: repeating-linear-gradient(-45deg, rgba(white, .1), rgba(white, .1) 10px, transparent 10px, transparent 20px) + position: absolute + top: 0 + left: 0 + right: 0 + bottom: 0 + width: 100% + z-index: 1 + + + .error-top-header + width: 100% + position: absolute + top: 0 + bottom: 0 + background: + size: cover + position-y: 12% + z-index: 0 .error-title + position: relative + z-index: 2 + width: auto + display: flex + margin: 0 auto padding: 25px 0 10px 0 color: white font: - size: 2em + size: 1.8em weight: 300 + span.icon + display: flex + align-items: center + font-size: 2em + + span.text + display: flex + align-items: center + text-align: left + line-height: 1.2em + margin-right: auto + + .error-lead + position: relative + z-index: 1 + display: block width: 100% - padding: 0 25px 25px 0 line-height: 1.6em - color: $color-text-light-primary + color: $color-text-light-secondary font: - family: $font-body + size: .9em weight: 300 a @@ -73,7 +138,7 @@ body.error text-decoration: underline &.extra - padding: 25px 20px + padding: 15px font-size: .9em color: $color-text-light-secondary @@ -86,15 +151,17 @@ body.error background-color: lighten($color-background-nav, 5%) .buttons - margin: 0 15px 25px 0 + position: relative + z-index: 2 + margin: 5px 0 20px 5px a font-size: 1.2em margin: 0 15px &.sign-up - +button($color-primary, 999em, true) + +button($color-primary, 3px, true) &.sign-in - +button($color-background, 999em) + +button($color-background, 3px) border-color: transparent diff --git a/src/templates/errors/403_embed.jade b/src/templates/errors/403_embed.jade index c6d74242..80dce4bc 100644 --- a/src/templates/errors/403_embed.jade +++ b/src/templates/errors/403_embed.jade @@ -1,16 +1,19 @@ #error_container.403 #error_box .error-top-container - .error-title Sorry to bother you, but... + .error-top-header-overlay + .error-top-header( + style="background-image: url({{ url_for('static', filename='assets/img/backgrounds/background_agent327_02.jpg')}})") - .error-lead. - This content is only available to Cloud subscribers.
- Get full access to the Blender Cloud for only $9.90 per month. + .error-title + span.icon + i.pi-lock-open + span.text Get this and more with your
Blender Cloud subscription. .buttons a.sign-up.btn.btn-outline(href="https://store.blender.org/product/membership/") i.pi-check - | Subscribe Now + | Subscribe | {% if not current_user.is_authenticated %} a.sign-in.btn.btn-empty(href="{{ url_for('users.login') }}") @@ -20,6 +23,53 @@ hr + section.error-watchamissing + h2 Support Blender and get awesome stuff. + + .row + .col-md-4 + a(href="{{ url_for('main.training') }}") + h3 Training & Tutorials + p. + Character modeling, 3D printing, VFX, rigging and more. We offer + 12 complete training series with +100 hours of training. + + .col-md-4 + a(href="{{ url_for('main.open_projects') }}") + h3 Open Projects + p. + The iconic Blender Institute Open Movies, + featuring all the production files, assets, artwork, and never-seen-before content. + + .col-md-4 + a(href="{{ url_for('main.services') }}") + h3 Services & Tools + p. + Create your personal projects, collaborate with other members, store + and sync your Blender settings across multiple workstations. + + .row + .col-md-4 + a(href="{{ url_for('main.redir_textures') }}") + h3 Textures + p. + More than 1500 texture maps to browse online or within Blender via our awesome add-on. + Create your own Texture libraries! + + .col-md-4 + a(href="{{ url_for('main.redir_hdri') }}") + h3 HDRI + p. + Up to 8K and 18 EVs (extremely high) HDR images to light your renders. + + .col-md-4 + a(href="{{ url_for('main.redir_characters') }}") + h3 Characters + p. + Production quality, fully rigged and shaded characters ready to animate. + + hr + .error-lead.extra. - If you have just subscribed, please log out and in again.
- For any other issue get in touch with cloudsupport@blender.org + If you have just subscribed, please log out and in again. + For any other issue get in touch via cloudsupport@blender.org