diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
commit | 36d22d82aa202bb199967e9512281e9a53db42c9 (patch) | |
tree | 105e8c98ddea1c1e4784a60a5a6410fa416be2de /toolkit/components/normandy/skin/shared/Heartbeat.css | |
parent | Initial commit. (diff) | |
download | firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.zip |
Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'toolkit/components/normandy/skin/shared/Heartbeat.css')
-rw-r--r-- | toolkit/components/normandy/skin/shared/Heartbeat.css | 106 |
1 files changed, 106 insertions, 0 deletions
diff --git a/toolkit/components/normandy/skin/shared/Heartbeat.css b/toolkit/components/normandy/skin/shared/Heartbeat.css new file mode 100644 index 0000000000..fdf5f1b75c --- /dev/null +++ b/toolkit/components/normandy/skin/shared/Heartbeat.css @@ -0,0 +1,106 @@ +/* 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/. */ + +/* Notification overrides for Heartbeat UI */ + +@keyframes pulse-onshow { + 0% { + opacity: 0; + transform: scale(1); + } + + 25% { + opacity: 1; + transform: scale(1.1); + } + + 50% { + transform: scale(1); + } + + 75% { + transform: scale(1.1); + } + + 100% { + transform: scale(1); + } +} + +@keyframes pulse-twice { + 0% { + transform: scale(1.1); + } + + 50% { + transform: scale(0.8); + } + + 100% { + transform: scale(1); + } +} + +.messageImage.heartbeat { + /* Needed for the animation to not get clipped when pulsing. */ + margin-inline: 8px; +} + +.messageImage.heartbeat.pulse-onshow { + animation-duration: 1.5s; + animation-iteration-count: 1; + animation-name: pulse-onshow; + animation-timing-function: cubic-bezier(0.7, 1.8, 0.9, 1.1); +} + +.messageImage.heartbeat.pulse-twice { + animation-duration: 1s; + animation-iteration-count: 2; + animation-name: pulse-twice; + animation-timing-function: linear; +} + +/* Learn More link styles */ +.heartbeat > hbox > .text-link { + margin-inline-start: 0 !important; +} + +.heartbeat > hbox > .text-link:hover { + text-decoration: none !important; +} + +/* Heartbeat UI Rating Star Classes */ +#star-rating-container { + display: flex; + margin-bottom: 4px; +} + +#star-rating-container > #star5 { + order: 5; +} + +#star-rating-container > #star4 { + order: 4; +} + +#star-rating-container > #star3 { + order: 3; +} + +#star-rating-container > #star2 { + order: 2; +} + +#star-rating-container > .star-x { + background: url("resource://normandy/skin/shared/heartbeat-star-off.svg"); + cursor: pointer; + height: 16px; + margin-inline-end: 4px !important; /* Overrides the margin-inline-end for all platforms defined in the .plain class */ + width: 16px; +} + +#star-rating-container > .star-x:hover, +#star-rating-container > .star-x:hover ~ .star-x { + background: url("resource://normandy/skin/shared/heartbeat-star-lit.svg"); +} |