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
* file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */
/**
* Variant of DebuggerImage used in sources list and tabs.
* Define the different source type / framework / library icons here.
*/
.source-icon {
margin-inline-end: 4px;
}
/* Icons for frameworks and libs */
.dbg-img.dbg-img-aframe {
background-image: url(chrome://devtools/content/debugger/images/sources/aframe.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-angular {
background-image: url(chrome://devtools/content/debugger/images/sources/angular.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-babel {
mask-image: url(chrome://devtools/content/debugger/images/sources/babel.svg);
}
.dbg-img.dbg-img-backbone {
mask-image: url(chrome://devtools/content/debugger/images/sources/backbone.svg);
}
.dbg-img.dbg-img-coffeescript {
background-image: url(chrome://devtools/content/debugger/images/sources/coffeescript.svg);
background-color: transparent !important;
fill: var(--theme-icon-color);
-moz-context-properties: fill;
}
.dbg-img.dbg-img-dojo {
background-image: url(chrome://devtools/content/debugger/images/sources/dojo.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-ember {
background-image: url(chrome://devtools/content/debugger/images/sources/ember.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-express {
mask-image: url(chrome://devtools/content/debugger/images/sources/express.svg);
}
.dbg-img.dbg-img-extension {
mask-image: url(chrome://devtools/content/shared/components/images/extension.svg);
}
.dbg-img.dbg-img-immutable {
mask-image: url(chrome://devtools/content/debugger/images/sources/immutable.svg);
}
.dbg-img.dbg-img-javascript {
background-image: url(chrome://devtools/content/debugger/images/sources/javascript.svg);
background-size: 14px 14px;
background-color: transparent !important;
fill: var(--theme-icon-color);
-moz-context-properties: fill;
}
.dbg-img.has-network-override::after {
content: "";
display: block;
height: 5px;
width: 5px;
background-color: var(--purple-30);
border-radius: 100%;
outline: 1px solid var(--theme-sidebar-background);
translate: 12px 10px;
}
.node.focused .dbg-img.has-network-override::after {
outline-color: var(--theme-selection-background);
}
.dbg-img.dbg-img-jquery {
mask-image: url(chrome://devtools/content/debugger/images/sources/jquery.svg);
}
.dbg-img.dbg-img-lodash {
mask-image: url(chrome://devtools/content/debugger/images/sources/lodash.svg);
}
.dbg-img.dbg-img-marko {
background-image: url(chrome://devtools/content/debugger/images/sources/marko.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-mobx {
background-image: url(chrome://devtools/content/debugger/images/sources/mobx.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-nextjs {
background-image: url(chrome://devtools/content/debugger/images/sources/nextjs.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-node {
background-image: url(chrome://devtools/content/debugger/images/sources/node.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-nuxtjs {
background-image: url(chrome://devtools/content/debugger/images/sources/nuxtjs.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-preact {
background-image: url(chrome://devtools/content/debugger/images/sources/preact.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-pug {
background-image: url(chrome://devtools/content/debugger/images/sources/pug.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-react {
background-image: url(chrome://devtools/content/debugger/images/sources/react.svg);
background-color: transparent !important;
fill: var(--theme-highlight-bluegrey);
-moz-context-properties: fill;
}
.dbg-img.dbg-img-redux {
mask-image: url(chrome://devtools/content/debugger/images/sources/redux.svg);
}
.dbg-img.dbg-img-rxjs {
background-image: url(chrome://devtools/content/debugger/images/sources/rxjs.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-sencha-extjs {
background-image: url(chrome://devtools/content/debugger/images/sources/sencha-extjs.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-typescript {
background-image: url(chrome://devtools/content/debugger/images/sources/typescript.svg);
background-color: transparent !important;
fill: var(--theme-icon-color);
-moz-context-properties: fill;
}
.dbg-img.dbg-img-underscore {
mask-image: url(chrome://devtools/content/debugger/images/sources/underscore.svg);
}
/* We use both 'Vue' and 'VueJS' when identifying frameworks */
.dbg-img.dbg-img-vue,
.dbg-img.dbg-img-vuejs {
background-image: url(chrome://devtools/content/debugger/images/sources/vuejs.svg);
background-color: transparent !important;
}
.dbg-img.dbg-img-webpack {
background-image: url(chrome://devtools/content/debugger/images/sources/webpack.svg);
background-color: transparent !important;
}