bulma/sass/components/media.sass
2020-08-22 11:19:21 +02:00

56 lines
1.2 KiB
Sass

$media-border-color: rgba(var(--border-rgb, #{bulmaToRGB($grey-lighter)}), 0.5) !default
$media-spacing: 1rem
$media-spacing-large: 1.5rem
.media
--media-border-color: #{$media-border-color}
--media-spacing: #{$media-spacing}
--media-spacing-large: #{$media-spacing-large}
align-items: flex-start
display: flex
text-align: inherit
.content:not(:last-child)
margin-bottom: 0.75rem
.media
border-top: 1px solid var(--media-border-color)
display: flex
padding-top: 0.75rem
.content:not(:last-child),
.control:not(:last-child)
margin-bottom: 0.5rem
.media
padding-top: 0.5rem
& + .media
margin-top: 0.5rem
& + .media
border-top: 1px solid var(--media-border-color)
margin-top: var(--media-spacing)
padding-top: var(--media-spacing)
// Sizes
&.is-large
& + .media
--media-spacing: var(--media-spacing-large)
.media-left,
.media-right
flex-basis: auto
flex-grow: 0
flex-shrink: 0
.media-left
+ltr-property("margin", var(--media-spacing))
.media-right
+ltr-property("margin", var(--media-spacing), false)
.media-content
flex-basis: auto
flex-grow: 1
flex-shrink: 1
text-align: inherit
+mobile
.media-content
overflow-x: auto