diff options
author | Horst3180 | 2016-06-06 14:31:22 +0200 |
---|---|---|
committer | Horst3180 | 2016-06-06 14:31:22 +0200 |
commit | 0202d65e3a906b05064ecd0e71e6d68202e8d4f4 (patch) | |
tree | b4ba5129a76afaddc1e91ea7a0ccea1e82610384 /arc-firefox-theme/chrome/global/narrateControls.css | |
parent | 31085a7bd32c0685ef3a87aeaff418c8ec9e9315 (diff) | |
download | solarc-firefox-theme-0202d65e3a906b05064ecd0e71e6d68202e8d4f4.tar.gz solarc-firefox-theme-0202d65e3a906b05064ecd0e71e6d68202e8d4f4.tar.xz solarc-firefox-theme-0202d65e3a906b05064ecd0e71e6d68202e8d4f4.zip |
update to 47.0rc1firefox-47-beta
Diffstat (limited to 'arc-firefox-theme/chrome/global/narrateControls.css')
-rw-r--r-- | arc-firefox-theme/chrome/global/narrateControls.css | 184 |
1 files changed, 184 insertions, 0 deletions
diff --git a/arc-firefox-theme/chrome/global/narrateControls.css b/arc-firefox-theme/chrome/global/narrateControls.css new file mode 100644 index 0000000..dc24a4c --- /dev/null +++ b/arc-firefox-theme/chrome/global/narrateControls.css @@ -0,0 +1,184 @@ +:scope { + --border-color: #e5e5e5; +} + +#narrate-toggle { + background-image: url("chrome://global/skin/narrate/narrate.svg"); +} + +.dropdown-popup button { + background-color: transparent; +} + +.dropdown-popup button:hover:not(:disabled) { + background-color: #eaeaea; +} + +.narrate-row { + display: flex; + align-items: center; + min-height: 40px; + box-sizing: border-box; +} + +.narrate-row:not(:first-child) { + border-top: 1px solid var(--border-color); +} + +/* Control buttons */ + +#narrate-control > button { + background-size: 24px 24px; + background-repeat: no-repeat; + background-position: center center; + height: 64px; + width: 100px; + border: none; + color: #666; + box-sizing: border-box; +} + +#narrate-control > button:not(:first-child) { + border-left: 1px solid var(--border-color); +} + +#narrate-skip-previous { + border-top-left-radius: 3px; + background-image: url("chrome://global/skin/narrate/back.svg#enabled"); +} + +#narrate-skip-next { + border-top-right-radius: 3px; + background-image: url("chrome://global/skin/narrate/forward.svg#enabled"); +} + +#narrate-skip-previous:disabled { + background-image: url("chrome://global/skin/narrate/back.svg#disabled"); +} + +#narrate-skip-next:disabled { + background-image: url("chrome://global/skin/narrate/forward.svg#disabled"); +} + +#narrate-start-stop { + background-image: url("chrome://global/skin/narrate/start.svg"); +} + +#narrate-start-stop.speaking { + background-image: url("chrome://global/skin/narrate/stop.svg"); +} + +/* Rate control */ + +#narrate-rate::before, #narrate-rate::after { + content: ''; + width: 48px; + height: 40px; + background-position: center; + background-repeat: no-repeat; + background-size: 24px auto; +} + +#narrate-rate::before { + background-image: url("chrome://global/skin/narrate/slow.svg"); +} + +#narrate-rate::after { + background-image: url("chrome://global/skin/narrate/fast.svg"); +} + +#narrate-rate-input { + margin: 0 1px; + flex-grow: 1; +} + +#narrate-rate-input::-moz-range-track { + background-color: #979797; + height: 2px; +} + +#narrate-rate-input::-moz-range-progress { + background-color: #2EA3FF; + height: 2px; +} + +#narrate-rate-input::-moz-range-thumb { + background-color: #808080; + height: 16px; + width: 16px; + border-radius: 8px; + border-width: 0; +} + +#narrate-rate-input:active::-moz-range-thumb { + background-color: #2EA3FF; +} + +/* Voice selection */ + +.voiceselect { + width: 100%; +} + +.voiceselect > button.select-toggle, +.voiceselect > .options > button.option { + -moz-appearance: none; + border: none; + width: 100%; + min-height: 40px; +} + +.voiceselect.open > button.select-toggle { + border-bottom: 1px solid var(--border-color); +} + +.voiceselect > button.select-toggle::after { + content: ''; + background-image: url("chrome://global/skin/narrate/arrow.svg"); + background-position: center; + background-repeat: no-repeat; + background-size: 12px 12px; + display: inline-block; + width: 1.5em; + height: 1em; + vertical-align: middle; +} + +.voiceselect > .options > button.option:not(:first-child) { + border-top: 1px solid var(--border-color); +} + +.voiceselect > .options > button.option { + box-sizing: border-box; +} + +.voiceselect > .options:not(.hovering) > button.option:focus { + background-color: #eaeaea; +} + +.voiceselect > .options:not(.hovering) > button.option:hover:not(:focus) { + background-color: transparent; +} + +.voiceselect > .options > button.option::-moz-focus-inner { + outline: none; + border: 0; +} + +.voiceselect > .options { + display: none; + overflow-y: auto; +} + +.voiceselect.open > .options { + display: block; +} + +.current-voice { + color: #7f7f7f; +} + +.voiceselect:not(.open) > button, +.option:last-child { + border-radius: 0 0 3px 3px; +} |