summaryrefslogtreecommitdiff
path: root/application/basilisk/themes/shared/identity-block/identity-block.inc.css
diff options
context:
space:
mode:
Diffstat (limited to 'application/basilisk/themes/shared/identity-block/identity-block.inc.css')
-rw-r--r--application/basilisk/themes/shared/identity-block/identity-block.inc.css162
1 files changed, 162 insertions, 0 deletions
diff --git a/application/basilisk/themes/shared/identity-block/identity-block.inc.css b/application/basilisk/themes/shared/identity-block/identity-block.inc.css
new file mode 100644
index 0000000000..70b7da519d
--- /dev/null
+++ b/application/basilisk/themes/shared/identity-block/identity-block.inc.css
@@ -0,0 +1,162 @@
+%if 0
+/* 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/. */
+%endif
+
+%filter substitution
+
+%define selectorSuffix
+%define iconVariant
+%include icons.inc.css
+
+%define selectorSuffix :-moz-lwtheme
+%define iconVariant -black
+%include icons.inc.css
+
+#identity-box {
+ font-size: .9em;
+ padding: 3px 5px;
+ overflow: hidden;
+ /* The padding-left and padding-right transitions handle the delayed hiding of
+ the forward button when hovered. */
+ transition: padding-left, padding-right;
+}
+
+#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity > #identity-icon-labels {
+ color: hsl(92,100%,30%);
+}
+
+#urlbar[pageproxystate="valid"] > #identity-box.chromeUI > #identity-icon-labels {
+%ifdef MOZ_OFFICIAL_BRANDING
+ color: rgb(229,115,0);
+%else
+ color: inherit;
+%endif
+}
+
+#identity-icon-labels:-moz-locale-dir(ltr) {
+ padding-left: 2px;
+}
+
+#identity-icon-labels:-moz-locale-dir(rtl) {
+ padding-right: 2px;
+}
+
+@conditionalForwardWithUrlbar@ > #forward-button[disabled] + #urlbar > #identity-box {
+ padding-inline-start: calc(var(--backbutton-urlbar-overlap) + 5px);
+}
+
+@conditionalForwardWithUrlbar@:hover:not([switchingtabs]) > #forward-button[disabled] + #urlbar > #identity-box {
+ /* Forward button hiding is delayed when hovered, so we should use the same
+ delay for the identity box. We handle both horizontal paddings (for LTR and
+ RTL), the latter two delays here are for padding-left and padding-right. */
+ transition-delay: 100s, 100s;
+}
+
+@conditionalForwardWithUrlbar@:not(:hover) > #forward-button[disabled] + #urlbar > #identity-box {
+ /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
+ padding-inline-start: calc(var(--backbutton-urlbar-overlap) + 5.01px);
+}
+
+/* MAIN IDENTITY ICON */
+
+#identity-icon {
+ width: 16px;
+ height: 16px;
+}
+
+#urlbar[pageproxystate="invalid"] > #identity-box > #identity-icon {
+ opacity: .3;
+}
+
+#urlbar[actiontype="searchengine"] > #identity-box > #identity-icon {
+ -moz-image-region: inherit;
+ list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon);
+ width: 16px;
+ height: 16px;
+}
+
+#urlbar[actiontype="extension"] > #identity-box > #identity-icon {
+ -moz-image-region: inherit;
+ list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg);
+ width: 16px;
+ height: 16px;
+}
+
+/* SHARING ICON */
+
+#sharing-icon {
+ width: 16px;
+ height: 16px;
+ margin-inline-start: -16px;
+ position: relative;
+ display: none;
+}
+
+#identity-box[sharing="camera"] > #sharing-icon {
+ list-style-image: url("chrome://browser/skin/notification-icons.svg#camera-sharing");
+}
+
+#identity-box[sharing="microphone"] > #sharing-icon {
+ list-style-image: url("chrome://browser/skin/notification-icons.svg#microphone-sharing");
+}
+
+#identity-box[sharing="screen"] > #sharing-icon {
+ list-style-image: url("chrome://browser/skin/notification-icons.svg#screen-sharing");
+}
+
+#identity-box[sharing] > #sharing-icon {
+ display: -moz-box;
+ animation-delay: -1.5s;
+}
+
+#identity-box[sharing] > #identity-icon,
+#sharing-icon {
+ animation: 3s linear identity-box-sharing-icon-pulse infinite;
+}
+
+/* This should remain identical to tab-sharing-icon-pulse in tabs.inc.css */
+@keyframes identity-box-sharing-icon-pulse {
+ 0%, 16.66%, 83.33%, 100% {
+ opacity: 0;
+ }
+ 33.33%, 66.66% {
+ opacity: 1;
+ }
+}
+
+/* TRACKING PROTECTION ICON */
+
+#tracking-protection-icon {
+ width: 16px;
+ height: 16px;
+ margin-inline-start: 2px;
+ margin-inline-end: 0;
+}
+
+#tracking-protection-icon[animate] {
+ transition: margin-left 200ms ease-out, margin-right 200ms ease-out;
+}
+
+#tracking-protection-icon:not([state]) {
+ margin-inline-end: -18px;
+ pointer-events: none;
+ opacity: 0;
+ /* Only animate the shield in, when it disappears hide it immediately. */
+ transition: none;
+}
+
+#urlbar[pageproxystate="invalid"] > #identity-box > #tracking-protection-icon {
+ visibility: collapse;
+}
+
+/* CONNECTION ICON */
+
+#connection-icon {
+ width: 16px;
+ height: 16px;
+ margin-inline-start: 2px;
+ visibility: collapse;
+}
+