Files
pillar/src/styles/_welcome.sass

271 lines
4.1 KiB
Sass
Raw Normal View History

.join
position: relative
2017-10-18 20:04:41 +02:00
nav.navbar
background-color: white
2017-10-18 20:04:41 +02:00
.navbar-brand
color: $color-text
2017-10-18 20:04:41 +02:00
li a.navbar-item
color: $color-text
2017-10-18 20:04:41 +02:00
.navbar-container
+container-behavior
2017-10-18 20:04:41 +02:00
#page-header
2017-10-24 15:43:20 +02:00
+media-lg
min-height: 600px
2017-10-23 15:35:31 +02:00
+media-xs
background-size: cover
background-position: right
2017-10-18 20:04:41 +02:00
min-height: 500px
2017-10-18 20:04:41 +02:00
.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
2016-09-12 18:00:20 +02:00
li.special
color: $color-success
2016-09-12 18:00:20 +02:00
font-weight: bold
2017-10-18 20:04:41 +02:00
.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
2017-10-23 15:35:31 +02:00
&.summary-action
font-size: .8em
a.page-card-cta
font-size: .9em
2017-10-18 20:04:41 +02:00
a
color: white
text-decoration: underline
2017-10-23 15:35:31 +02:00
2017-10-18 20:04:41 +02:00
a.page-card-cta
background: #ff4970
border-radius: 3px
border: none
box-shadow: 1px 1px 0 rgba(black, .2)
font-weight: bold
2017-10-23 15:35:31 +02:00
margin-right: 15px
2017-10-18 20:04:41 +02:00
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
2017-10-23 15:35:31 +02:00
text-decoration: underline
&:hover
color: $color-text-dark-primary
2017-10-18 20:04:41 +02:00
.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%