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

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;
    }
}

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions