bulma/docs/_sass/native.sass
Jeremy Thomas cd8503762c Fix native
2018-04-10 23:10:59 +01:00

88 lines
1.5 KiB
Sass

.native-js
border-top: 2px solid $background
display: none
font-size: 1rem
opacity: 0
visibility: hidden
.native-show
display: block
opacity: 1
visibility: visible
.native-flex
align-items: center
display: flex
justify-content: center
padding: 2em
text-decoration: none
&:hover
.native-cta
box-shadow: 0 1rem 2rem 0 rgba($black, 0.1)
transform: translateY(-0.25rem)
.native-img
border-radius: 3px
flex-grow: 0
flex-shrink: 0
height: 50px
width: 125px
.native-details
flex-grow: 1
flex-shrink: 1
.native-main
align-items: center
flex-grow: 0
flex-shrink: 1
max-width: 640px
.native-company
display: block
font-size: 0.625em
letter-spacing: 2px
margin-bottom: 4px
text-transform: uppercase
.native-desc
display: block
.native-cta
border: none
box-shadow: 0 0.5rem 1rem 0 rgba($black, 0.2)
flex-grow: 0
flex-shrink: 0
font-weight: $weight-semibold
height: auto
padding: 0.5em 1em
transition-duration: $speed * 2
transition-property: box-shadow, transform
will-change: box-shadow, transform
$native-bp: 600px
+until($native-bp)
.native-flex
display: block
text-align: center
.native-main
margin-bottom: 2em
.native-details
margin: 1em
+from($native-bp)
.native-flex
display: flex
padding: 4em
text-align: left
.native-main
display: flex
margin-right: 2em
.native-details
margin-left: 2em
+widescreen
.native-js
font-size: 1.25rem