@mixin white-space($device: "") {
    %#{$device}wrap {
        white-space: normal;
    }

    %#{$device}no-wrap {
        white-space: nowrap;
    }

    %#{$device}pre {
        white-space: pre;
    }

    %#{$device}pre-line {
        white-space: pre-line;
    }

    %#{$device}pre-wrap {
        white-space: pre-wrap;
    }

    %#{$device}word-wrap {
        word-wrap: break-word;
    }

    %#{$device}word-wrap-none {
        word-wrap: normal;
    }

    %#{$device}word-break-all {
        word-break: break-all;
    }

    %#{$device}word-break-word {
        word-break: break-word;
    }

    %#{$device}word-break-none {
        word-break: normal;
    }

    @if $classes {
        .#{$device}wrap {
            @extend %#{$device}wrap;
        }

        .#{$device}no-wrap {
            @extend %#{$device}no-wrap;
        }

        .#{$device}pre {
            @extend %#{$device}pre;
        }

        .#{$device}pre-line {
            @extend %#{$device}pre-line;
        }

        .#{$device}pre-wrap {
            @extend %#{$device}pre-wrap;
        }

        .#{$device}word-wrap {
            @extend %#{$device}word-wrap;
        }

        .#{$device}word-wrap-none {
            @extend %#{$device}word-wrap-none;
        }

        .#{$device}word-break-all {
            @extend %#{$device}word-break-all;
        }

        .#{$device}word-break-word {
            @extend %#{$device}word-break-word;
        }

        .#{$device}word-break-none {
            @extend %#{$device}word-break-none;
        }
    }
}

@include white-space;

@each $device, $pixels in $devices {
    @include media($device) {
        @include white-space($device + "-");
    }
}

@include mobile {
    @include white-space("mobile-");
}