bulma/docs/_sass/native.sass

100 lines
1.6 KiB
Sass
Raw Normal View History

2018-03-29 21:25:55 +00:00
.native-js
display: none
2018-03-29 21:53:26 +00:00
font-size: 1rem
2018-03-29 21:25:55 +00:00
opacity: 0
2018-06-25 08:40:00 +00:00
position: relative
2018-03-29 21:25:55 +00:00
visibility: hidden
2018-06-25 08:40:00 +00:00
&::before
+overlay
background-color: #000
bottom: 0
content: ""
display: block
left: 0
opacity: 0.02
pointer-events: none
right: 0
top: 0
2018-03-29 21:25:55 +00:00
.native-show
display: block
opacity: 1
visibility: visible
.native-flex
align-items: center
display: flex
2018-03-29 21:53:26 +00:00
justify-content: center
padding: 2em
2018-06-25 08:40:00 +00:00
position: relative
2018-03-29 21:25:55 +00:00
text-decoration: none
2018-04-10 22:10:59 +00:00
&:hover
.native-cta
box-shadow: 0 1rem 2rem 0 rgba($black, 0.1)
transform: translateY(-0.25rem)
2018-03-29 21:25:55 +00:00
.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
2018-03-29 21:53:26 +00:00
flex-grow: 0
2018-03-29 21:25:55 +00:00
flex-shrink: 1
2018-03-29 21:53:26 +00:00
max-width: 640px
2018-03-29 21:25:55 +00:00
.native-company
display: block
2018-03-29 21:53:26 +00:00
font-size: 0.625em
2018-03-29 21:25:55 +00:00
letter-spacing: 2px
margin-bottom: 4px
text-transform: uppercase
.native-desc
display: block
.native-cta
border: none
2018-04-10 22:10:59 +00:00
box-shadow: 0 0.5rem 1rem 0 rgba($black, 0.2)
2018-03-29 21:25:55 +00:00
flex-grow: 0
flex-shrink: 0
2018-04-10 22:10:59 +00:00
font-weight: $weight-semibold
height: auto
padding: 0.5em 1em
transition-duration: $speed * 2
transition-property: box-shadow, transform
will-change: box-shadow, transform
2018-03-29 21:25:55 +00:00
$native-bp: 600px
+until($native-bp)
.native-flex
display: block
text-align: center
.native-main
2018-03-29 21:53:26 +00:00
margin-bottom: 2em
2018-03-29 21:25:55 +00:00
.native-details
2018-03-29 21:53:26 +00:00
margin: 1em
2018-03-29 21:25:55 +00:00
+from($native-bp)
.native-flex
display: flex
2018-03-29 21:53:26 +00:00
padding: 4em
2018-03-29 21:25:55 +00:00
text-align: left
.native-main
display: flex
2018-03-29 21:53:26 +00:00
margin-right: 2em
2018-03-29 21:25:55 +00:00
.native-details
2018-03-29 21:53:26 +00:00
margin-left: 2em
+widescreen
.native-js
2018-04-09 13:15:31 +00:00
font-size: 1.25rem