metro4/source/components/default-icons/default-icons.less

The front-end framework for Build responsive, mobile-first projects on the web with the first front-end component library in Metro Style

@import (once) "../../include/default-icons";
@import (once) "../../include/vars";
@import (once) "../../include/mixins";

[class*=default-icon] {
    display: block;
    height: 16px;
    width: 16px;
    border: none!important;
    background-size: cover;
    background-color: transparent;
    opacity: .5;
    transition: @transition-base;
    margin: auto;

    &:hover {
        opacity: 1;
    }
}

.default-icon-check {background-image: url(@checkIcon);}
.default-icon-cross {background-image: url(@crossIcon);}
.default-icon-search {background-image: url(@searchIcon);}
.default-icon-eye {background-image: url(@eyeIcon);}
.default-icon-plus {background-image: url(@plusIcon);}
.default-icon-minus {background-image: url(@minusIcon);}
.default-icon-help {background-image: url(@helpIcon);}
.default-icon-left-arrow {background-image: url(@leftArrowIcon);}
.default-icon-right-arrow {background-image: url(@rightArrowIcon);}
.default-icon-calendar {background-image: url(@calendarIcon);}
.default-icon-clock {background-image: url(@clockIcon);}
.default-icon-menu {background-image: url(@menuIcon);}
.default-icon-upload {background-image: url(@uploadIcon);}
.default-icon-pencil {background-image: url(@pencilIcon);}
.default-icon-chevron-left {background-image: url(@chevronLeftIcon);}
.default-icon-chevron-right {background-image: url(@chevronRightIcon);}

.default-icon-loop {background-image: url(@loopIcon);}
.default-icon-play {background-image: url(@playIcon);}
.default-icon-pause {background-image: url(@pauseIcon);}
.default-icon-stop {background-image: url(@stopIcon);}
.default-icon-mute {background-image: url(@muteIcon);}
.default-icon-low-volume {background-image: url(@volumeLowIcon);}
.default-icon-medium-volume {background-image: url(@volumeMediumIcon);}
.default-icon-high-volume {background-image: url(@volumeHighIcon);}
.default-icon-enlarge {background-image: url(@enlargeIcon);}
.default-icon-shrink {background-image: url(@shrinkIcon);}
.default-icon-playlist {background-image: url(@playlistIcon);}
.default-icon-next {background-image: url(@nextIcon);}
.default-icon-prev {background-image: url(@prevIcon);}
.default-icon-first {background-image: url(@firstIcon);}
.default-icon-last {background-image: url(@lastIcon);}
.default-icon-forward {background-image: url(@forwardIcon);}
.default-icon-backward {background-image: url(@backwardIcon);}
.default-icon-share {background-image: url(@shareIcon);}
.default-icon-equalizer {background-image: url(@equalizerIcon);}
.default-icon-eject {background-image: url(@ejectIcon);}
.default-icon-shuffle {background-image: url(@shuffleIcon);}
.default-icon-random {background-image: url(@randomIcon);}