scss 伪IMG-mixins.scss

Posted 2021-05-18

// IPSUM image generator [http://ipsumimage.appspot.com]
$ipsum-img-api: 'http://ipsumimage.appspot.com' !default;

@mixin ipsum-img($width, $height, $label: false) {
    @if $label {
        background-image: url($ipsum-img-api + '/' + $width + 'x' + $height + '?l=' + $label);
    } @else {
        background-image: url($ipsum-img-api + '/' + $width + 'x' + $height);
    }
    background-position: center center;
}

// PLACEIMG generator [http://placeimg.com]
$place-img-api: 'http://placeimg.com' !default;

@mixin place-img($width, $height, $category, $filter: false) {
    @if $filter {
        background-image: url($place-img-api + '/' + $width + '/' + $height + '/' + $category + '/' + $filter);
    } @else {
        background-image: url($place-img-api + '/' + $width + '/' + $height + '/' + $category);
    }
    background-position: center center;
}

// FPOIMG generator [http://fpoimg.com]
$fpoi-img-api: 'http://fpoimg.com' !default;

@mixin fpoi-img($width, $height, $label: false) {
    @if $label {
        background-image: url($fpoi-img-api + '/' + $width + 'x' + $height + '?text=' + $label);
    } @else {
        background-image: url($fpoi-img-api + '/' + $width + 'x' + $height);
    }
    background-position: center center;
}