diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
tree | f435a8308119effd964b339f76abb83a57c29483 /browser/components/newtab/content-src/styles/_icons.scss | |
parent | Initial commit. (diff) | |
download | firefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz firefox-26a029d407be480d791972afb5975cf62c9360a6.zip |
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'browser/components/newtab/content-src/styles/_icons.scss')
-rw-r--r-- | browser/components/newtab/content-src/styles/_icons.scss | 211 |
1 files changed, 211 insertions, 0 deletions
diff --git a/browser/components/newtab/content-src/styles/_icons.scss b/browser/components/newtab/content-src/styles/_icons.scss new file mode 100644 index 0000000000..4074f0a6a6 --- /dev/null +++ b/browser/components/newtab/content-src/styles/_icons.scss @@ -0,0 +1,211 @@ +.icon { + background-position: center center; + background-repeat: no-repeat; + background-size: $icon-size; + -moz-context-properties: fill; + display: inline-block; + color: var(--newtab-text-primary-color); + fill: currentColor; + height: $icon-size; + vertical-align: middle; + width: $icon-size; + + // helper classes + &.icon-spacer { + margin-inline-end: 8px; + } + + &.icon-small-spacer { + margin-inline-end: 6px; + } + + &.icon-button-style { + fill: var(--newtab-text-secondary-color); + border: 0; + + &:focus, + &:hover { + fill: var(--newtab-text-primary-color); + } + } + + // icon images + &.icon-bookmark-added { + background-image: url('chrome://browser/skin/bookmark.svg'); + } + + &.icon-bookmark-hollow { + background-image: url('chrome://browser/skin/bookmark-hollow.svg'); + } + + &.icon-clear-input { + background-image: url('chrome://global/skin/icons/close-fill.svg'); + } + + &.icon-delete { + background-image: url('chrome://global/skin/icons/delete.svg'); + } + + &.icon-search { + background-image: url('chrome://global/skin/icons/search-glass.svg'); + } + + &.icon-modal-delete { + flex-shrink: 0; + background-image: url('chrome://activity-stream/content/data/content/assets/glyph-modal-delete-20.svg'); + background-size: $larger-icon-size; + height: $larger-icon-size; + width: $larger-icon-size; + } + + &.icon-mail { + background-image: url('chrome://activity-stream/content/data/content/assets/glyph-mail-16.svg'); + } + + &.icon-dismiss { + background-image: url('chrome://global/skin/icons/close.svg'); + } + + &.icon-info { + background-image: url('chrome://global/skin/icons/info.svg'); + } + + &.icon-new-window { + @include flip-icon; + + background-image: url('chrome://activity-stream/content/data/content/assets/glyph-newWindow-16.svg'); + } + + &.icon-new-window-private { + background-image: url('chrome://browser/skin/privateBrowsing.svg'); + } + + &.icon-settings { + background-image: url('chrome://global/skin/icons/settings.svg'); + } + + &.icon-pin { + @include flip-icon; + + background-image: url('chrome://activity-stream/content/data/content/assets/glyph-pin-16.svg'); + } + + &.icon-unpin { + @include flip-icon; + + background-image: url('chrome://activity-stream/content/data/content/assets/glyph-unpin-16.svg'); + } + + &.icon-edit { + background-image: url('chrome://global/skin/icons/edit.svg'); + } + + &.icon-pocket { + background-image: url('chrome://global/skin/icons/pocket.svg'); + } + + &.icon-pocket-save { + background-image: url('chrome://global/skin/icons/pocket.svg'); + fill: $white; + } + + &.icon-pocket-delete { + background-image: url('chrome://activity-stream/content/data/content/assets/glyph-pocket-delete-16.svg'); + } + + &.icon-pocket-archive { + background-image: url('chrome://activity-stream/content/data/content/assets/glyph-pocket-archive-16.svg'); + } + + &.icon-history-item { + background-image: url('chrome://browser/skin/history.svg'); + } + + &.icon-trending { + background-image: url('chrome://browser/skin/trending.svg'); + transform: translateY(2px); // trending bolt is visually top heavy + } + + &.icon-now { + background-image: url('chrome://browser/skin/history.svg'); + } + + &.icon-topsites { + background-image: url('chrome://browser/skin/topsites.svg'); + } + + &.icon-pin-small { + @include flip-icon; + + background-image: url('chrome://browser/skin/pin-12.svg'); + background-size: $smaller-icon-size; + height: $smaller-icon-size; + width: $smaller-icon-size; + } + + &.icon-check { + background-image: url('chrome://global/skin/icons/check.svg'); + } + + &.icon-download { + background-image: url('chrome://browser/skin/downloads/downloads.svg'); + } + + &.icon-copy { + background-image: url('chrome://global/skin/icons/edit-copy.svg'); + } + + &.icon-open-file { + background-image: url('chrome://activity-stream/content/data/content/assets/glyph-open-file-16.svg'); + } + + &.icon-webextension { + background-image: url('chrome://activity-stream/content/data/content/assets/glyph-webextension-16.svg'); + } + + &.icon-highlights { + background-image: url('chrome://global/skin/icons/highlights.svg'); + } + + &.icon-arrowhead-down { + background-image: url('chrome://global/skin/icons/arrow-down.svg'); + } + + &.icon-arrowhead-down-small { + background-image: url('chrome://global/skin/icons/arrow-down-12.svg'); + background-size: $smaller-icon-size; + height: $smaller-icon-size; + width: $smaller-icon-size; + } + + &.icon-arrowhead-forward-small { + background-image: url('chrome://global/skin/icons/arrow-right-12.svg'); + background-size: $smaller-icon-size; + height: $smaller-icon-size; + width: $smaller-icon-size; + + &:dir(rtl) { + background-image: url('chrome://global/skin/icons/arrow-left-12.svg'); + } + } + + &.icon-arrowhead-up { + background-image: url('chrome://global/skin/icons/arrow-up.svg'); + } + + &.icon-add { + background-image: url('chrome://global/skin/icons/plus.svg'); + } + + &.icon-minimize { + background-image: url('chrome://activity-stream/content/data/content/assets/glyph-minimize-16.svg'); + } + + &.icon-maximize { + background-image: url('chrome://activity-stream/content/data/content/assets/glyph-maximize-16.svg'); + } + + &.icon-arrow { + background-image: url('chrome://global/skin/icons/arrow-right-12.svg'); + } +} |