[class^="icon-"], [class*=" icon-"] { background-repeat: no-repeat; background-position: center; min-width: 16px; min-height: 16px; } /* general assets */ .icon-breadcrumb { background-image: url('../img/breadcrumb.svg'); } .loading, .loading-small, .icon-loading, .icon-loading-dark, .icon-loading-small, .icon-loading-small-dark { position: relative; } .loading:after, .loading-small:after, .icon-loading:after, .icon-loading-dark:after, .icon-loading-small:after, .icon-loading-small-dark:after { z-index: 2; content: ""; height: 32px; width: 32px; margin: -17px 0 0 -17px; position: absolute; top: 50%; left: 50%; border-radius: 100%; -webkit-animation: rotate .8s infinite linear; animation: rotate .8s infinite linear; -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; } .loading:after, .loading-small:after, .icon-loading:after, .icon-loading-dark:after, .icon-loading-small:after, .icon-loading-small-dark:after { border: 2px solid rgba(150, 150, 150, .5); border-top-color: rgb(100, 100, 100); } .icon-loading-dark:after, .icon-loading-small-dark:after { border: 2px solid rgba(187, 187, 187, .5); border-top-color: #bbb; } .icon-loading-small:after, .icon-loading-small-dark:after { height: 16px; width: 16px; margin: -9px 0 0 -9px; } /* Css replaced elements don't have ::after nor ::before */ img.icon-loading, object.icon-loading, video.icon-loading, button.icon-loading, textarea.icon-loading, input.icon-loading, select.icon-loading { background-image: url("../img/loading.gif"); } img.icon-loading-dark, object.icon-loading-dark, video.icon-loading-dark, button.icon-loading-dark, textarea.icon-loading-dark, input.icon-loading-dark, select.icon-loading-dark { background-image: url("../img/loading-dark.gif"); } img.icon-loading-small, object.icon-loading-small, video.icon-loading-small, button.icon-loading-small, textarea.icon-loading-small, input.icon-loading-small, select.icon-loading-small { background-image: url("../img/loading-small.gif"); } img.icon-loading-small-dark, object.icon-loading-small-dark, video.icon-loading-small-dark, button.icon-loading-small-dark, textarea.icon-loading-small-dark, input.icon-loading-small-dark, select.icon-loading-small-dark { background-image: url("../img/loading-small-dark.gif"); } @-webkit-keyframes rotate { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes rotate { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .icon-32 { background-size: 32px !important; } /* action icons */ .icon-add { background-image: url('../img/actions/add.svg'); } .icon-caret { background-image: url('../img/actions/caret.svg'); } .icon-caret-dark { background-image: url('../img/actions/caret-dark.svg'); } .icon-checkmark { background-image: url('../img/actions/checkmark.svg'); } .icon-checkmark-white { background-image: url('../img/actions/checkmark-white.svg'); } .icon-checkmark-color { background-image: url('../img/actions/checkmark-color.svg'); } .icon-close { background-image: url('../img/actions/close.svg'); } .icon-comment { background-image: url('../img/actions/comment.svg'); } .icon-confirm { background-image: url('../img/actions/confirm.svg'); } .icon-delete, .icon-delete.no-permission:hover, .icon-delete.no-permission:focus { background-image: url('../img/actions/delete.svg'); } .icon-delete:hover, .icon-delete:focus { background-image: url('../img/actions/delete-hover.svg'); } .icon-delete-white { background-image: url('../img/actions/delete-white.svg'); } .icon-details { background-image: url('../img/actions/details.svg'); } .icon-download { background-image: url('../img/actions/download.svg'); } .icon-download-white { background-image: url('../img/actions/download-white.svg'); } .icon-edit { background-image: url('../img/actions/edit.svg'); } .icon-error { background-image: url('../img/actions/error.svg'); } .icon-error-white { background-image: url('../img/actions/error-white.svg'); } .icon-error-color { background-image: url('../img/actions/error-color.svg'); } .icon-external { background-image: url('../img/actions/external.svg'); } .icon-history { background-image: url('../img/actions/history.svg'); } .icon-info { background-image: url('../img/actions/info.svg'); } .icon-info-white { background-image: url('../img/actions/info-white.svg'); } .icon-logout { background-image: url('../img/actions/logout.svg'); } .icon-mail { background-image: url('../img/actions/mail.svg'); } .icon-menu { background-image: url('../img/actions/menu.svg'); } .icon-more { background-image: url('../img/actions/more.svg'); } .icon-password { background-image: url('../img/actions/password.svg'); } .icon-pause { background-image: url('../img/actions/pause.svg'); } .icon-pause-big { background-image: url('../img/actions/pause-big.svg'); } .icon-play { background-image: url('../img/actions/play.svg'); } .icon-play-add { background-image: url('../img/actions/play-add.svg'); } .icon-play-big { background-image: url('../img/actions/play-big.svg'); } .icon-play-next { background-image: url('../img/actions/play-next.svg'); } .icon-play-previous { background-image: url('../img/actions/play-previous.svg'); } .icon-public { background-image: url('../img/actions/public.svg'); } .icon-rename { background-image: url('../img/actions/rename.svg'); } .icon-search { background-image: url('../img/actions/search.svg'); } .icon-search-white { background-image: url('../img/actions/search-white.svg'); } .icon-settings { background-image: url('../img/actions/settings.svg'); } .icon-share { background-image: url('../img/actions/share.svg'); } .icon-shared { background-image: url('../img/actions/shared.svg'); } .icon-sound { background-image: url('../img/actions/sound.svg'); } .icon-sound-off { background-image: url('../img/actions/sound-off.svg'); } .icon-star, .icon-starred:hover, .icon-starred:focus { background-image: url('../img/actions/star.svg'); } .icon-starred, .icon-star:hover, .icon-star:focus { background-image: url('../img/actions/starred.svg'); } .icon-toggle { background-image: url('../img/actions/toggle.svg'); } .icon-triangle-e { background-image: url('../img/actions/triangle-e.svg'); } .icon-triangle-n { background-image: url('../img/actions/triangle-n.svg'); } .icon-triangle-s { background-image: url('../img/actions/triangle-s.svg'); } .icon-upload { background-image: url('../img/actions/upload.svg'); } .icon-upload-white { background-image: url('../img/actions/upload-white.svg'); } .icon-user { background-image: url('../img/actions/user.svg'); } .icon-view-close { background-image: url('../img/actions/view-close.svg'); } .icon-view-download { background-image: url('../img/actions/view-download.svg'); } .icon-view-next { background-image: url('../img/actions/view-next.svg'); } .icon-view-pause { background-image: url('../img/actions/view-pause.svg'); } .icon-view-play { background-image: url('../img/actions/view-play.svg'); } .icon-view-previous { background-image: url('../img/actions/view-previous.svg'); } /* places icons */ .icon-calendar-dark { background-image: url('../img/places/calendar-dark.svg'); } .icon-contacts-dark { background-image: url('../img/places/contacts-dark.svg'); } .icon-files { background-image: url('../img/places/files.svg'); } .icon-file, .icon-filetype-text { background-image: url('../img/filetypes/text.svg'); } .icon-folder, .icon-filetype-folder { background-image: url('../img/filetypes/folder.svg'); } .icon-filetype-folder-drag-accept { background-image: url('../img/filetypes/folder-drag-accept.svg')!important; } .icon-home { background-image: url('../img/places/home.svg'); } .icon-link { background-image: url('../img/places/link.svg'); } .icon-music { background-image: url('../img/places/music.svg'); } .icon-picture { background-image: url('../img/places/picture.svg'); }