Introducing main.sass stylesheet
Blender Cloud used main.css from Pillar As we try to strip Blender Cloud-specific content from Pillar, this commit brings three .sass files over to this repository. There are still plenty of Blender Cloud classes all over Pillar, they will be brought here over time.
This commit is contained in:
1078
src/styles/_homepage.sass
Normal file
1078
src/styles/_homepage.sass
Normal file
File diff suppressed because it is too large
Load Diff
39
src/styles/_services.sass
Normal file
39
src/styles/_services.sass
Normal file
@@ -0,0 +1,39 @@
|
||||
.services
|
||||
#page-header
|
||||
text-shadow: 1px 1px 0 rgba(black, .2)
|
||||
border-bottom: none
|
||||
align-items: initial
|
||||
|
||||
.page-title
|
||||
text-align: left
|
||||
font-size: 3em
|
||||
margin: 0
|
||||
|
||||
.page-title-summary
|
||||
max-width: 900px
|
||||
text-align: left
|
||||
font-size: 1.4em
|
||||
|
||||
.page-card-side
|
||||
img
|
||||
max-width: 100%
|
||||
border-radius: 3px
|
||||
|
||||
.tip
|
||||
margin-top: 15px
|
||||
color: $color-text-dark-secondary
|
||||
font-size: .8em
|
||||
|
||||
a
|
||||
color: $color-primary
|
||||
text-decoration: underline
|
||||
|
||||
span.text-background
|
||||
+text-background(white, #358, 2px, 5px 0)
|
||||
|
||||
.navbar-backdrop-overlay
|
||||
background-image: linear-gradient(rgba(black, .3), rgba(black, .8))
|
||||
|
||||
#blender-sync
|
||||
small strong
|
||||
color: $color-success
|
270
src/styles/_welcome.sass
Normal file
270
src/styles/_welcome.sass
Normal file
@@ -0,0 +1,270 @@
|
||||
.join
|
||||
position: relative
|
||||
|
||||
nav.navbar
|
||||
background-color: white
|
||||
|
||||
.navbar-brand
|
||||
color: $color-text
|
||||
|
||||
li a.navbar-item
|
||||
color: $color-text
|
||||
|
||||
.navbar-container
|
||||
+container-behavior
|
||||
|
||||
#page-header
|
||||
+media-lg
|
||||
min-height: 600px
|
||||
+media-xs
|
||||
background-size: cover
|
||||
background-position: right
|
||||
min-height: 500px
|
||||
|
||||
.page-title,
|
||||
.page-title-summary
|
||||
line-height: 1.2em
|
||||
text-align: left
|
||||
text-shadow: 1px 1px 0 rgba(black, .5), 0 0 25px rgba(black, .5)
|
||||
|
||||
.page-title-summary
|
||||
font-size: 1.4em
|
||||
|
||||
li.special
|
||||
color: $color-success
|
||||
font-weight: bold
|
||||
|
||||
.page-card
|
||||
&:nth-child(even)
|
||||
background-color: white
|
||||
|
||||
&-header
|
||||
margin-bottom: 0
|
||||
|
||||
&-side
|
||||
+media-xs
|
||||
width: 100%
|
||||
max-width: 100%
|
||||
|
||||
&.text
|
||||
+media-xs
|
||||
padding-left: 50px
|
||||
padding:
|
||||
bottom: 150px
|
||||
top: 150px
|
||||
|
||||
&.right
|
||||
background-color: $color-background-light
|
||||
|
||||
.page-card-title,
|
||||
.page-card-summary
|
||||
padding-left: 25px
|
||||
|
||||
.page-card-title:after
|
||||
left: 25px
|
||||
|
||||
.text
|
||||
+media-xs
|
||||
padding-left: 25px
|
||||
|
||||
&.intro
|
||||
+media-xs
|
||||
margin-left: 50px
|
||||
|
||||
.page-card-side
|
||||
+media-sm
|
||||
max-width: 500px
|
||||
max-width: 600px
|
||||
|
||||
padding:
|
||||
bottom: 0
|
||||
top: 50px
|
||||
|
||||
&+.page-card-header
|
||||
padding-top: 0
|
||||
|
||||
.page-card-summary
|
||||
font-size: 1.2em
|
||||
|
||||
.page-card-image
|
||||
align-items: center
|
||||
display: flex
|
||||
height: 100%
|
||||
justify-content: center
|
||||
|
||||
&.light
|
||||
overflow: hidden
|
||||
position: relative
|
||||
|
||||
.learn
|
||||
color: white
|
||||
text-decoration: underline
|
||||
|
||||
.page-card
|
||||
&-title
|
||||
color: white
|
||||
font-weight: bold
|
||||
|
||||
&:after
|
||||
border-color: white
|
||||
|
||||
&-summary
|
||||
color: white
|
||||
position: relative
|
||||
text-shadow: 1px 1px 0 rgba(black, .5), 0 0 25px rgba(black, .2)
|
||||
z-index: 1
|
||||
|
||||
p
|
||||
font-size: .9em
|
||||
|
||||
&.summary-action
|
||||
font-size: .8em
|
||||
|
||||
a.page-card-cta
|
||||
font-size: .9em
|
||||
|
||||
a
|
||||
color: white
|
||||
text-decoration: underline
|
||||
|
||||
|
||||
a.page-card-cta
|
||||
background: #ff4970
|
||||
border-radius: 3px
|
||||
border: none
|
||||
box-shadow: 1px 1px 0 rgba(black, .2)
|
||||
font-weight: bold
|
||||
margin-right: 15px
|
||||
margin-top: 25px
|
||||
padding: 7px 20px
|
||||
text-decoration: none
|
||||
text-shadow: none
|
||||
|
||||
&:hover
|
||||
background: lighten(#ff4970, 5%)
|
||||
|
||||
.page-card-image
|
||||
img
|
||||
+media-xs
|
||||
display: none
|
||||
max-width: initial
|
||||
position: absolute
|
||||
width: initial
|
||||
z-index: 0
|
||||
|
||||
&.training
|
||||
margin-top: 45px
|
||||
|
||||
a.page-card-cta
|
||||
background: #0082ff
|
||||
|
||||
.page-card-image
|
||||
img
|
||||
right: 50px
|
||||
top: 50%
|
||||
transform: translateY(-50%)
|
||||
|
||||
&.open-movies
|
||||
.page-card-image
|
||||
img
|
||||
top: 50px
|
||||
left: 50px
|
||||
|
||||
&.services
|
||||
.page-card-image
|
||||
img
|
||||
left: 50px
|
||||
|
||||
&.subscribe
|
||||
padding: 40px 0
|
||||
text-align: center
|
||||
|
||||
span strong
|
||||
color: $color-danger
|
||||
|
||||
.page-card-side
|
||||
width: 100%
|
||||
max-width: 100%
|
||||
|
||||
.page-card-title
|
||||
line-height: 1.5em
|
||||
color: white
|
||||
text-align: center
|
||||
padding-bottom: 15px
|
||||
|
||||
&:after
|
||||
border: none
|
||||
|
||||
.page-card-summary
|
||||
color: $color-text-light-primary
|
||||
|
||||
.page-card-cta
|
||||
text-align: center
|
||||
font-size: 1.3em
|
||||
padding: 7px 35px
|
||||
margin-right: initial
|
||||
border: thin solid rgba(white, .8)
|
||||
border-radius: 3px
|
||||
|
||||
|
||||
.training-other
|
||||
color: $color-text-dark-secondary
|
||||
font-size: .9em
|
||||
padding: 30px
|
||||
text-align: center
|
||||
|
||||
a
|
||||
color: $color-text-dark-secondary
|
||||
text-decoration: underline
|
||||
|
||||
&:hover
|
||||
color: $color-text-dark-primary
|
||||
|
||||
.pricing
|
||||
+media-xs
|
||||
padding-top: 30px
|
||||
margin-bottom: 0
|
||||
padding-bottom: 100px
|
||||
|
||||
.supported-by
|
||||
img
|
||||
max-width: 100%
|
||||
|
||||
.assets
|
||||
padding-bottom: 80px
|
||||
|
||||
.flex
|
||||
+media-xs
|
||||
flex-direction: column
|
||||
|
||||
display: flex
|
||||
|
||||
.box
|
||||
flex: 1
|
||||
margin: 20px
|
||||
|
||||
.page-triplet-container
|
||||
.triplet-card
|
||||
+media-xs
|
||||
margin-top: 20px
|
||||
|
||||
.navbar
|
||||
.nav-item-sign-in
|
||||
a.navbar-item
|
||||
background-color: $color-primary
|
||||
border: none
|
||||
border-radius: 3px
|
||||
color: white
|
||||
height: auto
|
||||
font-weight: bold
|
||||
margin-top: 5px
|
||||
margin-left: 10px
|
||||
padding: 10px 20px
|
||||
|
||||
&:hover
|
||||
background-color: lighten($color-primary, 10%)
|
||||
box-shadow: none
|
||||
|
||||
.container.wide-on-sm
|
||||
+media-sm
|
||||
width: 100%
|
26
src/styles/main.sass
Normal file
26
src/styles/main.sass
Normal file
@@ -0,0 +1,26 @@
|
||||
@import ../../../pillar/src/styles/_normalize
|
||||
@import ../../../pillar/src/styles/_config
|
||||
@import ../../../pillar/src/styles/_utils
|
||||
|
||||
/* Generic styles (comments, notifications, etc) come from base.css */
|
||||
|
||||
/* Blender Cloud specific styles */
|
||||
@import ../../../pillar/src/styles/_project
|
||||
@import ../../../pillar/src/styles/_project-sharing
|
||||
@import ../../../pillar/src/styles/_project-dashboard
|
||||
@import ../../../pillar/src/styles/_user
|
||||
@import _welcome
|
||||
@import _homepage
|
||||
@import _services
|
||||
@import _stats
|
||||
@import ../../../pillar/src/styles/_search
|
||||
@import ../../../pillar/src/styles/_organizations
|
||||
|
||||
/* services, about, etc */
|
||||
@import ../../../pillar/src/styles/_pages
|
||||
|
||||
/* plugins are included here, don't include in base unless needed by other pillar apps */
|
||||
@import ../../../pillar/src/styles/plugins/_jstree
|
||||
@import ../../../pillar/src/styles/plugins/_js_select2
|
||||
|
||||
/* CSS for pillar-font comes from fontello.com using static/assets/font/config.json */
|
@@ -55,7 +55,7 @@ html(lang="en")
|
||||
| {% if title == 'blog' %}
|
||||
link(href="{{ url_for('static_pillar', filename='assets/css/blog.css', v=17320171) }}", rel="stylesheet")
|
||||
| {% else %}
|
||||
link(href="{{ url_for('static_pillar', filename='assets/css/main.css', v=17320171) }}", rel="stylesheet")
|
||||
link(href="{{ url_for('static', filename='cloud/assets/css/main.css', v=17320171) }}", rel="stylesheet")
|
||||
| {% endif %}
|
||||
| {% endblock css %}
|
||||
|
||||
|
Reference in New Issue
Block a user