Skip to content
This repository was archived by the owner on Mar 10, 2019. It is now read-only.
This repository was archived by the owner on Mar 10, 2019. It is now read-only.

Improve retina support #11

@lughino

Description

@lughino

At present support to the retina performs only the creation of sprites retina compatible.

Create a system that gives the possibility to create two different sprites for a retina and a normal, and create the correct media queries.

Media queries example:

/* CSS for devices with normal screens */
.icons {
    background-image: url(icon-sprite.png);
    background-repeat: no-repeat;
}

/* CSS for high-resolution devices */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5) {
    .icons {
        background-image: url(icon-sprite-2x.png);
        background-size: 200px 100px;
        background-repeat: no-repeat;
    }
}

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions