Rename LTR mixins

This commit is contained in:
Jeremy Thomas 2020-01-22 09:14:04 +00:00
parent 0ca264016b
commit a5f9266997
15 changed files with 45 additions and 62 deletions

View File

@ -24,7 +24,7 @@ $breadcrumb-item-separator-color: $border-hover !default
align-items: center
display: flex
&:first-child a
+directioner("padding", 0, false)
+ltr-property("padding", 0, false)
&.is-active
a
color: $breadcrumb-item-active-color
@ -41,9 +41,9 @@ $breadcrumb-item-separator-color: $border-hover !default
justify-content: flex-start
.icon
&:first-child
+directioner("margin", 0.5em)
+ltr-property("margin", 0.5em)
&:last-child
+directioner("margin", 0.5em, false)
+ltr-property("margin", 0.5em, false)
// Alignment
&.is-centered
ol,

View File

@ -70,7 +70,7 @@ $card-media-margin: $block-spacing !default
justify-content: center
padding: $card-footer-padding
&:not(:last-child)
border-right: $card-footer-border-top
+ltr-property("border", $card-footer-border-top)
// Combinations

View File

@ -38,7 +38,7 @@ $dropdown-divider-background-color: $border-light !default
.dropdown-menu
display: none
left: 0
+ltr-position(0, false)
min-width: $dropdown-menu-min-width
padding-top: $dropdown-content-offset
position: absolute
@ -62,7 +62,7 @@ $dropdown-divider-background-color: $border-light !default
a.dropdown-item,
button.dropdown-item
+directioner("padding", 3rem)
+ltr-property("padding", 3rem)
text-align: inherit
white-space: nowrap
width: 100%

View File

@ -20,7 +20,7 @@ $level-item-spacing: ($block-spacing / 2) !default
.level-item
&:not(:last-child)
margin-bottom: 0
+directioner("margin", $level-item-spacing)
+ltr-property("margin", $level-item-spacing)
&:not(.is-narrow)
flex-grow: 1
// Responsiveness
@ -57,7 +57,7 @@ $level-item-spacing: ($block-spacing / 2) !default
// Responsiveness
+tablet
&:not(:last-child)
+directioner("margin", $level-item-spacing)
+ltr-property("margin", $level-item-spacing)
.level-left
align-items: center

View File

@ -35,6 +35,12 @@ $media-spacing-large: 1.5rem
flex-grow: 0
flex-shrink: 0
.media-left
+ltr-property("margin", $media-spacing)
.media-right
+ltr-property("margin", $media-spacing, false)
.media-content
flex-basis: auto
flex-grow: 1
@ -44,15 +50,3 @@ $media-spacing-large: 1.5rem
+mobile
.media-content
overflow-x: auto
+ltr
.media-left
margin-right: $media-spacing
.media-right
margin-left: $media-spacing
+rtl
.media-left
margin-left: $media-spacing
.media-right
margin-right: $media-spacing

View File

@ -42,9 +42,9 @@ $menu-label-spacing: 1em !default
color: $menu-item-active-color
li
ul
border-left: $menu-list-border-left
+ltr-property("border", $menu-list-border-left, false)
margin: $menu-nested-list-margin
padding-left: $menu-nested-list-padding-left
+ltr-property("padding", $menu-nested-list-padding-left, false)
.menu-label
color: $menu-label-color

View File

@ -79,7 +79,7 @@ $message-colors: $colors !default
.delete
flex-grow: 0
flex-shrink: 0
+directioner("margin", 0.75em, false)
+ltr-property("margin", 0.75em, false)
& + .message-body
border-width: $message-header-body-border-width
border-top-left-radius: 0

View File

@ -63,7 +63,7 @@ $modal-card-body-padding: 20px !default
background: none
height: $modal-close-dimensions
position: fixed
right: $modal-close-right
+ltr-position($modal-close-right)
top: $modal-close-top
width: $modal-close-dimensions
@ -102,7 +102,7 @@ $modal-card-body-padding: 20px !default
border-top: $modal-card-foot-border-top
.button
&:not(:last-child)
margin-right: 0.5em
+ltr-property("margin", 0.5em)
.modal-card-body
+overflow-touch

View File

@ -88,7 +88,7 @@ $panel-colors: $colors !default
justify-content: flex-start
padding: 0.5em 0.75em
input[type="checkbox"]
+directioner("margin", 0.75em)
+ltr-property("margin", 0.75em)
& > .control
flex-grow: 1
flex-shrink: 1
@ -113,7 +113,7 @@ label.panel-block
.panel-icon
+fa(14px, 1em)
color: $panel-icon-color
+directioner("margin", 0.75em)
+ltr-property("margin", 0.75em)
.fa
font-size: inherit
line-height: inherit

View File

@ -78,9 +78,9 @@ $tabs-toggle-link-active-color: $link-invert !default
padding-left: 0.75em
.icon
&:first-child
+directioner("margin", 0.5em)
+ltr-property("margin", 0.5em)
&:last-child
+directioner("margin", 0.5em, false)
+ltr-property("margin", 0.5em, false)
// Alignment
&.is-centered
ul
@ -122,7 +122,7 @@ $tabs-toggle-link-active-color: $link-invert !default
z-index: 2
li
& + li
+directioner("margin", -#{$tabs-toggle-link-border-width}, false)
+ltr-property("margin", -#{$tabs-toggle-link-border-width}, false)
&:first-child a
+ltr
border-radius: $tabs-toggle-link-radius 0 0 $tabs-toggle-link-radius

View File

@ -71,11 +71,11 @@ $button-static-border-color: $border !default
height: 1.5em
width: 1.5em
&:first-child:not(:last-child)
+directioner("margin", calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width}), false)
+directioner("margin", $button-padding-horizontal / 4)
+ltr-property("margin", calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width}), false)
+ltr-property("margin", $button-padding-horizontal / 4)
&:last-child:not(:first-child)
+directioner("margin", $button-padding-horizontal / 4, false)
+directioner("margin", calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width}))
+ltr-property("margin", $button-padding-horizontal / 4, false)
+ltr-property("margin", calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width}))
&:first-child:last-child
margin-left: calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width})
margin-right: calc(#{-1 / 2 * $button-padding-horizontal} - #{$button-border-width})
@ -269,7 +269,7 @@ $button-static-border-color: $border !default
.button
margin-bottom: 0.5rem
&:not(:last-child):not(.is-fullwidth)
+directioner("margin", 0.5rem)
+ltr-property("margin", 0.5rem)
&:last-child
margin-bottom: -0.5rem
&:not(:last-child)

View File

@ -67,11 +67,11 @@ $content-table-foot-cell-color: $text-strong !default
margin-bottom: 1em
blockquote
background-color: $content-blockquote-background-color
+directioner("border", $content-blockquote-border-left, false)
+ltr-property("border", $content-blockquote-border-left, false)
padding: $content-blockquote-padding
ol
list-style-position: outside
+directioner("margin", 2em, false)
+ltr-property("margin", 2em, false)
margin-top: 1em
&:not([type])
list-style-type: decimal
@ -85,7 +85,7 @@ $content-table-foot-cell-color: $text-strong !default
list-style-type: upper-roman
ul
list-style: disc outside
+directioner("margin", 2em, false)
+ltr-property("margin", 2em, false)
margin-top: 1em
ul
list-style-type: circle
@ -93,7 +93,7 @@ $content-table-foot-cell-color: $text-strong !default
ul
list-style-type: square
dd
+directioner("margin", 2em, false)
+ltr-property("margin", 2em, false)
figure
margin-left: 2em
margin-right: 2em

View File

@ -25,7 +25,7 @@ $notification-padding-rtl: 1.25rem 1.5rem 1.25rem 2.5rem !default
pre code
background: transparent
& > .delete
+right(0.5rem)
+ltr-position(0.5rem)
position: absolute
top: 0.5rem
.title,

View File

@ -38,7 +38,7 @@ $help-size: $size-small !default
justify-content: flex-start
.control
&:not(:last-child)
+directioner("margin", -1px)
+ltr-property("margin", -1px)
&:not(:first-child):not(:last-child)
.button,
.input,
@ -96,7 +96,7 @@ $help-size: $size-small !default
flex-shrink: 0
&:not(:last-child)
margin-bottom: 0
+directioner("margin", 0.75rem)
+ltr-property("margin", 0.75rem)
&.is-expanded
flex-grow: 1
flex-shrink: 1
@ -127,7 +127,7 @@ $help-size: $size-small !default
flex-basis: 0
flex-grow: 1
flex-shrink: 0
+directioner("margin", 1.5rem)
+ltr-property("margin", 1.5rem)
text-align: right
&.is-small
font-size: $size-small
@ -156,7 +156,7 @@ $help-size: $size-small !default
&:not(.is-narrow)
flex-grow: 1
&:not(:last-child)
+directioner("margin", 0.75rem)
+ltr-property("margin", 0.75rem)
.control
box-sizing: border-box
@ -202,7 +202,7 @@ $help-size: $size-small !default
&::after
@extend %loader
position: absolute !important
+right(0.625em)
+ltr-position(0.625em)
top: 0.625em
z-index: 4
&.is-small:after

View File

@ -136,32 +136,21 @@
@if $rtl
@content
// $directions: ("left": "right", "right": "left")
=directioner($property, $spacing, $right: true)
=ltr-property($property, $spacing, $right: true)
$normal: if($right, "right", "left")
$opposite: if($right, "left", "right")
@if $rtl
/* RTL */
#{$property}-#{$opposite}: $spacing
@else
/* LTR */
#{$property}-#{$normal}: $spacing
=right($spacing)
=ltr-position($spacing, $right: true)
$normal: if($right, "right", "left")
$opposite: if($right, "left", "right")
@if $rtl
left: $spacing
#{$opposite}: $spacing
@else
right: $spacing
// =directioner($spacing)
// @supports (margin-inline-end: 1px)
// margin-inline-end: $spacing
// @supports
// @if $rtl
// margin-left: $spacing
// @else
// margin-right: $spacing
#{$normal}: $spacing
// Placeholders