mirror of
https://github.com/jgthms/bulma.git
synced 2024-11-28 12:24:23 +00:00
127 lines
2.2 KiB
Sass
127 lines
2.2 KiB
Sass
.bd-testimonials
|
|
background-color: $background
|
|
|
|
.bd-testimonial
|
|
align-items: flex-start
|
|
display: flex
|
|
justify-content: center
|
|
|
|
.bd-testimonial-tweet
|
|
background-color: $white
|
|
|
|
.bd-more-loves
|
|
align-items: center
|
|
display: flex
|
|
justify-content: center
|
|
margin-top: 1.5rem
|
|
text-align: center
|
|
.button
|
|
height: auto
|
|
padding: 0.75em 1.5em
|
|
span
|
|
transform-origin: center center
|
|
transition: transform $speed $easing
|
|
&:hover
|
|
span
|
|
transform: scale(1.04)
|
|
|
|
+mobile
|
|
.bd-testimonials
|
|
padding: 1.5rem
|
|
.bd-testimonial
|
|
margin-bottom: 1.5rem
|
|
|
|
+tablet
|
|
.bd-testimonials
|
|
padding: 3rem
|
|
.bd-testimonial + .bd-testimonial
|
|
margin-top: 1.5rem
|
|
|
|
+desktop
|
|
.bd-testimonials
|
|
min-height: 595px
|
|
|
|
+widescreen
|
|
.bd-testimonials
|
|
min-height: 653px
|
|
|
|
+fullhd
|
|
.bd-testimonials
|
|
min-height: 632px
|
|
|
|
.bd-rainbow
|
|
animation: rainbow 8s ease infinite
|
|
background-image: linear-gradient(124deg, $orange, $red, $purple, $blue)
|
|
background-size: 800% 800%
|
|
|
|
.hero.bd-is-love
|
|
.title,
|
|
.subtitle
|
|
color: $white
|
|
|
|
@keyframes rainbow
|
|
0%
|
|
background-position: 1% 80%
|
|
50%
|
|
background-position: 99% 20%
|
|
100%
|
|
background-position: 1% 80%
|
|
|
|
.bd-hug
|
|
align-items: flex-start
|
|
display: flex
|
|
justify-content: center
|
|
|
|
+mobile
|
|
.bd-hug
|
|
margin: 1.5rem
|
|
.bd-embrace
|
|
text-align: center
|
|
&:not(:first-child)
|
|
margin-top: 1.5rem
|
|
&:not(:last-child)
|
|
margin-bottom: 1.5rem
|
|
.bd-embrace-button
|
|
margin-top: 0.75rem
|
|
|
|
+tablet
|
|
.bd-embrace
|
|
align-items: center
|
|
display: flex
|
|
justify-content: center
|
|
&:not(:first-child)
|
|
margin-top: 3rem
|
|
&:not(:last-child)
|
|
margin-bottom: 3rem
|
|
.bd-embrace-button
|
|
margin-left: 1.5rem
|
|
.bd-hugs
|
|
display: flex
|
|
flex-wrap: wrap
|
|
padding-bottom: 3rem
|
|
.bd-hug
|
|
margin-top: 1.5rem
|
|
width: calc(33.3333% - 1rem)
|
|
&:nth-child(1),
|
|
&:nth-child(2),
|
|
&:nth-child(3)
|
|
margin-top: 0
|
|
&:nth-child(3n-1),
|
|
&:nth-child(3n)
|
|
margin-left: 1.5rem
|
|
|
|
.bd-shoutout
|
|
background-color: $background
|
|
padding: 2rem
|
|
text-align: center
|
|
&:not(:last-child)
|
|
margin-bottom: 3rem
|
|
|
|
.bd-shoutout-text
|
|
&.title
|
|
opacity: 0.8
|
|
&.subtitle
|
|
opacity: 0.5
|
|
|
|
.bd-shoutout-button
|
|
margin-top: -0.75rem |