@import "../themes/liberty.globals";
@import "../themes/liberty.mixins";

// Float Elements
// --------------------------------------------------
// Creates float classes based on screen size

@each $breakpoint in map-keys($screen-breakpoints) {
    $infix: breakpoint-infix($breakpoint, $screen-breakpoints);

    @include media-breakpoint-up($breakpoint, $screen-breakpoints) {
        // Provide `.lu-float-{bp}-{side}` classes for floating the element based
        // on the breakpoint and side
        .lu-float#{$infix}-left,
        [float#{$infix}-left] {
            @include float(left, !important);
        }

        .lu-float#{$infix}-right,
        [float#{$infix}-right] {
            @include float(right, !important);
        }

        .lu-float#{$infix}-start,
        [float#{$infix}-start] {
            @include float(start, !important);
        }

        .lu-float#{$infix}-end,
        [float#{$infix}-end] {
            @include float(end, !important);
        }
    }
}