archive/blender-cloud
0
1
Fork 1
Code Issues 24 Pull Requests Projects Releases Wiki Activity
Files
01b6693324b3ab297848b3120c668e70e558a1a0
blender-cloud/src/styles/_welcome.sass

400 lines
6.2 KiB
Sass
Raw Normal View History

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.
2017-11-07 16:56:45 +01:00
.join
position: relative
nav.navbar
background-color: white
.navbar-brand
color: $color-text
li a.navbar-item
color: $color-text
.navbar-container
+container-behavior
Fix navbar-toggle not visible on mobile
2017-11-28 16:06:11 +01:00
.navbar-toggle
border: 2px solid $color-text-dark-primary
color: $color-text
.navbar-nav
+media-xs
padding: 10px
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.
2017-11-07 16:56:45 +01:00
#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
New Homepage: Featuring more in the blog posts
2017-11-09 18:37:25 +01:00
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.
2017-11-07 16:56:45 +01:00
.supported-by
New Homepage: Featuring more in the blog posts
2017-11-09 18:37:25 +01:00
padding: 50px 0
text-align: center
background-color: $color-background
border-top: 5px solid $color-background-dark
img.logos
padding: 60px 0 100px 0
max-height: 500px
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.
2017-11-07 16:56:45 +01:00
max-width: 100%
New Homepage: Featuring more in the blog posts
2017-11-09 18:37:25 +01:00
+media-xs
max-width: 100%
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.
2017-11-07 16:56:45 +01:00
.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%
Home: In Production section for ongoing projects
2017-11-24 19:36:43 +01:00
section.pricing
padding: 50px 0
margin-bottom: 25px
background-color: $color-background-light
+clearfix
+media-xs
padding: 0
h2
text-align: center
font-size: 2.3em
text-shadow: 1px 1px 0 white
margin:
top: 10px
bottom: 50px
padding: 0
+media-xs
font-size: 1.6em
.box
margin-top: 40px
padding: 20px 20px 60px 20px
border: 1px solid $color-text-dark-hint
background-color: white
position: relative
text-align: center
border-top: 3px solid rgba($color-text-dark-secondary, .5)
border-bottom-left-radius: 3px
border-bottom-right-radius: 3px
+media-xs
margin-bottom: 15px
&.yearly
border-top: 3px solid $color-info
transform: scale(1.1)
+media-xs
transform: scale(1)
a.sign-up-now
+button($color-primary, 3px, true)
h3
Cleanup styling. Use bootstrap classes instead
2018-08-27 16:56:38 +02:00
font-size: 1.8em
Home: In Production section for ongoing projects
2017-11-24 19:36:43 +01:00
padding-bottom: 0
margin: 25px 0 0 10px
.pricing-display
position: relative
color: $color-info
padding: 10px 0
.currency-sign,
.digit-dec
font-size: 1.7em
position: relative
top: -25px
font-weight: 100
.digit-int
font-size: 4.5em
font-weight: 100
.pricing-caption
color: $color-text-dark-hint
text-align: center
padding-bottom: 25px
ul
text-align: left
+list-bullets
ul
color: $color-text-dark-primary
padding-left: 10px
margin-top: 15px
li
padding-bottom: 8px
.sign-up-now
position: absolute
bottom: 25px
width: 65%
left: 50%
transform: translateX(-50%)
font-size: 1.2em
+button($color-primary, 3px)
padding: 5px 25px
white-space: nowrap
text-align: center
.education
color: $color-text-dark-primary
font-size: 1.1em
padding: 25px 15px 0
text-align: center
h3
color: $color-primary-dark
.btn
margin-top: 15px
min-width: 200px
Reference in New Issue Copy Permalink