Source code
Revision control
Copy as Markdown
Other Tools
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
.img {
display: inline-block;
width: 16px;
height: 16px;
vertical-align: middle;
/* use background-color for the icon color, and mask-image for its shape */
background-color: var(--theme-icon-color);
mask-size: contain;
mask-repeat: no-repeat;
mask-position: center;
/* multicolor icons use background-image */
background-position: center;
background-repeat: no-repeat;
background-size: contain;
/* do not let images shrink when used as flex children */
flex-shrink: 0;
}
/* Expand arrow icon */
.img.arrow {
width: 10px;
height: 10px;
/* we may override the width/height in specific contexts to make the
clickable area bigger, but we should always keep the mask size 10x10 */
mask-size: 10px 10px;
background-color: var(--theme-icon-dimmed-color);
transform: rotate(-90deg);
transition: transform 180ms var(--animation-curve);
}
.img.arrow:dir(rtl) {
transform: rotate(90deg);
}
.img.arrow.expanded {
/* icon should always point to the bottom (default) when expanded,
regardless of the text direction */
transform: none !important;
}
.img.arrow-down {
}
.img.arrow-up {
}
.img.blackBox {
}
.img.breadcrumb {
}
.img.close {
}
.img.disable-pausing {
}
.img.enable-pausing {
background-color: var(--theme-icon-checked-color);
}
.img.globe {
}
.img.globe-small {
mask-size: 12px 12px;
}
.img.window {
}
.img.file {
mask-size: 12px 12px;
}
.img.folder {
}
.img.home {
}
.img.info {
}
.img.loader {
-moz-context-properties: fill;
fill: var(--theme-icon-color);
background-color: unset;
}
.img.more-tabs {
}
html[dir="rtl"] .img.more-tabs {
transform: scaleX(-1);
}
.img.sourcemap {
-moz-context-properties: fill;
fill: var(--theme-icon-warning-color);
background-color: unset;
}
.img.next {
}
.img.next-circle {
}
.img.pane-collapse {
}
.img.pane-expand {
}
.img.pause {
}
.img.plus {
}
.img.prettyPrint {
background-size: 14px 14px;
background-color: transparent !important;
fill: var(--theme-icon-color);
-moz-context-properties: fill;
}
.img.removeAll {
}
.img.refresh {
}
.img.resume {
}
.img.search {
}
.img.shortcuts {
}
.img.spin {
animation: spin 0.5s linear infinite;
}
.img.stepIn {
}
.img.stepOut {
}
.img.stepOver {
}
.img.tab {
}
.img.worker {
}