1 files changed, 146 insertions, 90 deletions
diff --git a/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss b/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss
index dfb78a4..5779eae 100644
--- a/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss
+++ b/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss
@@ -1734,6 +1734,11 @@ toolbar[brighttext] #PanelUI-menu-button.thumburger {
 
 .urlbar-history-dropmarker {
   -moz-appearance: toolbarbutton-dropdown;
+  transition: opacity 0.15s ease;
+}
+
+#urlbar:not(:hover) > .urlbar-textbox-container > .urlbar-history-dropmarker {
+  opacity: 0;
 }
 
 #urlbar-container {
@@ -1853,7 +1858,6 @@ toolbar[brighttext] #PanelUI-menu-button.thumburger {
 
 #PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > button {
   -moz-appearance: none;
-  -moz-user-focus: ignore;
   min-width: 80px;
   border-radius: 3px;
   padding: 4px 16px;
@@ -2149,11 +2153,20 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box
 //  padding-left: 7px;
 //}
 
+/* This changes the direction of the main notification box on the url bar. */
 #notification-popup-box:-moz-locale-dir(rtl),
+/* This adds a second flip for the notification anchors, as they don't switch direction
+   for RTL mode. */
 .notification-anchor-icon:-moz-locale-dir(rtl) {
   transform: scaleX(-1);
 }
 
+/* For the anchor icons in the chat window, we don't have the notification popup box,
+   so we need to cancel the RTL transform. */
+.notification-anchor-icon.chat-toolbarbutton:-moz-locale-dir(rtl) {
+  transform: none;
+}
+
 .notification-anchor-icon {
   list-style-image: url(moz-icon://stock/gtk-dialog-info?size=16);
   width: 16px;
@@ -2593,8 +2606,7 @@ notification[value="loop-sharing-notification"] .messageImage {
 
 .ac-result-type-bookmark,
 .autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) {
-  list-style-image: url("chrome://browser/skin/places/star-icons.png");
-  -moz-image-region: rect(0px 32px 16px 16px);
+  list-style-image: url("chrome://browser/skin/places/autocomplete-star.png");
   width: 16px;
   height: 16px;
 }
@@ -3672,6 +3684,14 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-
   box-shadow: inset -5px 0 ThreeDShadow;
 }
 
+.alltabs-endimage[muted] {
+  list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted);
+}
+
+.alltabs-endimage[soundplaying] {
+  list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio);
+}
+
 /* Sidebar */
 #sidebar-throbber[loading="true"] {
   list-style-image: url("chrome://global/skin/icons/loading_16.png");
@@ -3753,15 +3773,13 @@ toolbarbutton.chevron > .toolbarbutton-icon {
   margin-top: 1em;
 }
 
-#sync-error-panel-title,
 #sync-start-panel-title {
   font-size: 120%;
   font-weight: bold;
   margin-bottom: 5px;
 }
 
-#sync-start-panel-subtitle,
-#sync-error-panel-subtitle {
+#sync-start-panel-subtitle {
   margin: 0;
 }
 
@@ -3791,23 +3809,52 @@ toolbarbutton.chevron > .toolbarbutton-icon {
   margin-left: 1em;
 }
 
-#full-screen-warning-message {
-  background-image: url("chrome://browser/skin/fullscreen-darknoise.png");
-  color: white;
-  border-radius: 4px;
-  margin-top: 30px;
-  padding: 30px 50px;
-  box-shadow: 0 0 2px white;
+
+html|*#fullscreen-warning {
+  align-items: center;
+  background: rgba(45, 62, 72, 0.9);
+  border: 2px solid #fafafa;
+  box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.5);
+  border-radius: 8px;
+  padding: 24px 16px;
+  font: message-box;
+}
+
+html|*#fullscreen-warning::before {
+  margin: 0;
+  width: 24px; height: 24px;
 }
 
-.full-screen-description {
-  font-size: 150%;
+html|*#fullscreen-warning.verifiedIdentity::before,
+html|*#fullscreen-warning.verifiedDomain::before {
+  content: url("chrome://browser/skin/fullscreen/secure.svg");
 }
 
-#full-screen-domain-text {
-  font-size: 300%;
+html|*#fullscreen-warning.unknownIdentity::before {
+  content: url("chrome://browser/skin/fullscreen/insecure.svg");
 }
 
+html|*#fullscreen-domain-text,
+html|*#fullscreen-generic-text {
+  font-size: 21px;
+  font-weight: lighter;
+  color: #fafafa;
+  margin: 0 16px;
+}
+
+html|*#fullscreen-domain {
+  font-weight: bold;
+  margin: 0;
+}
+
+html|*#fullscreen-exit-button {
+  padding: 5px 30px;
+  font: message-box;
+  font-size: 14px;
+  font-weight: lighter;
+  margin: 0;
+  box-sizing: content-box;
+}
 
 /* Responsive Mode */
 
@@ -3960,7 +4007,7 @@ toolbarbutton.chevron > .toolbarbutton-icon {
   list-style-image: url("chrome://browser/skin/devtools/responsiveui-rotate.png");
 }
 
-@media (min-resolution: 1.25dppx) {
+@media (min-resolution: 1.1dppx) {
   .devtools-responsiveui-close {
     list-style-image: url("chrome://browser/skin/devtools/close@2x.png");
   }
@@ -3979,7 +4026,7 @@ toolbarbutton.chevron > .toolbarbutton-icon {
   -moz-image-region: rect(0px,32px,16px,16px);
 }
 
-@media (min-resolution: 1.25dppx) {
+@media (min-resolution: 1.1dppx) {
   .devtools-responsiveui-touch {
     list-style-image: url("chrome://browser/skin/devtools/responsiveui-touch@2x.png");
     -moz-image-region: rect(0px,32px,32px,0px);
@@ -3994,7 +4041,7 @@ toolbarbutton.chevron > .toolbarbutton-icon {
   list-style-image: url("chrome://browser/skin/devtools/responsiveui-screenshot.png");
 }
 
-@media (min-resolution: 1.25dppx) {
+@media (min-resolution: 1.1dppx) {
   .devtools-responsiveui-screenshot {
     list-style-image: url("chrome://browser/skin/devtools/responsiveui-screenshot@2x.png");
   }
@@ -4069,12 +4116,14 @@ toolbarbutton.chevron > .toolbarbutton-icon {
 }
 
 .devtools-responsiveui-home-button {
+  -moz-user-focus: ignore;
   width: 40px;
   height: 30px;
   list-style-image: url("chrome://browser/skin/devtools/responsiveui-home.png");
 }
 
 .devtools-responsiveui-sleep-button {
+  -moz-user-focus: ignore;
   -moz-appearance: none;
   /* compensate browserStack top padding */
   margin-top: -67px;
@@ -4102,6 +4151,7 @@ toolbarbutton.chevron > .toolbarbutton-icon {
 
 .devtools-responsiveui-volume-up-button,
 .devtools-responsiveui-volume-down-button {
+  -moz-user-focus: ignore;
   -moz-appearance: none;
   border: 1px solid red;
   min-width: 8px;
@@ -4126,7 +4176,7 @@ toolbarbutton.chevron > .toolbarbutton-icon {
   border-bottom-left-radius: 12px;
 }
 
-@media (min-resolution: 1.25dppx) {
+@media (min-resolution: 1.1dppx) {
   .devtools-responsiveui-resizebarV {
     background-image: url("chrome://browser/skin/devtools/responsive-vertical-resizer@2x.png");
   }
@@ -4218,7 +4268,7 @@ toolbarbutton.chevron > .toolbarbutton-icon {
   -moz-image-region: rect(0px, 64px, 16px, 48px);
 }
 
-@media (min-resolution: 1.25dppx) {
+@media (min-resolution: 1.1dppx) {
   #developer-toolbar-toolbox-button {
     list-style-image: url("chrome://browser/skin/devtools/toggle-tools@2x.png");
     -moz-image-region: rect(0px, 32px, 32px, 0px);
@@ -4247,7 +4297,7 @@ toolbarbutton.chevron > .toolbarbutton-icon {
   opacity: 0.6;
 }
 
-@media (min-resolution: 1.25dppx) {
+@media (min-resolution: 1.1dppx) {
   #developer-toolbar-closebutton {
     list-style-image: url("chrome://browser/skin/devtools/close@2x.png");
   }
@@ -4335,7 +4385,7 @@ html|*#gcli-output-frame {
   background-position: -16px center;
 }
 
-@media (min-resolution: 1.25dppx) {
+@media (min-resolution: 1.1dppx) {
   .gclitoolbar-input-node::before {
     background-image: url("chrome://browser/skin/devtools/commandline-icon@2x.png");
   }
@@ -4826,14 +4876,6 @@ toolbar[brighttext] #downloads-indicator-counter {
   background: none;
 }
 
-.chat-toolbarbutton:hover {
-  background-color: rgba(255,255,255,.35);
-}
-
-.chat-toolbarbutton:hover:active {
-  background-color: rgba(255,255,255,.5);
-}
-
 .chat-toolbarbutton > .toolbarbutton-text {
   display: none;
 }
@@ -4847,7 +4889,11 @@ toolbar[brighttext] #downloads-indicator-counter {
   list-style-image: url("chrome://browser/skin/social/chat-icons.svg#close");
 }
 
-.chat-close-button:-moz-any(:hover,:hover:active) {
+.chat-close-button:hover {
+  list-style-image: url("chrome://browser/skin/social/chat-icons.svg#close-hover");
+}
+
+.chat-close-button:hover:active {
   list-style-image: url("chrome://browser/skin/social/chat-icons.svg#close-active");
 }
 
@@ -4855,7 +4901,11 @@ toolbar[brighttext] #downloads-indicator-counter {
   list-style-image: url("chrome://browser/skin/social/chat-icons.svg#minimize");
 }
 
-.chat-minimize-button:-moz-any(:hover,:hover:active) {
+.chat-minimize-button:hover {
+  list-style-image: url("chrome://browser/skin/social/chat-icons.svg#minimize-hover");
+}
+
+.chat-minimize-button:hover:active {
   list-style-image: url("chrome://browser/skin/social/chat-icons.svg#minimize-active");
 }
 
@@ -4864,7 +4914,11 @@ toolbar[brighttext] #downloads-indicator-counter {
   transform: rotate(180deg);
 }
 
-.chat-swap-button:-moz-any(:hover,:hover:active) {
+.chat-swap-button:hover {
+  list-style-image: url("chrome://browser/skin/social/chat-icons.svg#expand-hover");
+}
+
+.chat-swap-button:hover:active {
   list-style-image: url("chrome://browser/skin/social/chat-icons.svg#expand-active");
 }
 
@@ -4872,22 +4926,46 @@ chatbar > chatbox > .chat-titlebar > .chat-swap-button {
   transform: none;
 }
 
+.chat-loop-hangup {
+  list-style-image: url("chrome://browser/skin/social/chat-icons.svg#exit-white");
+  background-color: #d13f1a;
+  border: 1px solid #d13f1a;
+  border-top-right-radius: 4px;
+  width: 32px;
+  height: 26px;
+  margin-top: -6px;
+  margin-bottom: -5px;
+  -moz-margin-start: 6px;
+  -moz-margin-end: -5px;
+}
+
+.chat-toolbarbutton.chat-loop-hangup:-moz-any(:hover,:hover:active) {
+  background-color: #ef6745;
+  border-color: #ef6745;
+}
+
 .chat-title {
-  font-weight: bold;
-  color: black;
+  color: #666;
   text-shadow: none;
   cursor: inherit;
 }
 
 .chat-titlebar {
-  height: 30px;
-  min-height: 30px;
+  height: 26px;
+  min-height: 26px;
   width: 100%;
   margin: 0;
-  padding: 7px 6px;
-  border: none;
-  border-bottom: 1px solid #ccc;
+  padding: 5px 4px;
+  border: 1px solid #ebebeb;
+  border-bottom: 0;
+  border-top-left-radius: 4px;
+  border-top-right-radius: 4px;
   cursor: pointer;
+  background-color: #ebebeb;
+}
+
+.chat-titlebar[selected] {
+  background-color: #f0f0f0;
 }
 
 .chat-titlebar > .notification-anchor-icon {
@@ -4906,18 +4984,6 @@ chatbar > chatbox > .chat-titlebar > .chat-swap-button {
   background-position: 0 -10px;
 }
 
-chatbox[dark=true] > .chat-titlebar,
-chatbox[dark=true] > .chat-titlebar[selected] {
-  border-bottom: none;
-  background-color: #000;
-  background-image: none;
-}
-
-chatbox[dark=true] > .chat-titlebar > hbox > .chat-title {
-  font-weight: normal;
-  color: #c1c1c1;
-}
-
 .chat-frame {
   padding: 0;
   margin: 0;
@@ -4932,6 +4998,10 @@ chatbox[dark=true] > .chat-titlebar > hbox > .chat-title {
   width: 21px;
   border: 1px solid #ccc;
   border-bottom: none;
+  background-color: #d9d9d9;
+  background-image: linear-gradient(rgba(255,255,255,.43), transparent);
+  border-top-left-radius: 3px;
+  border-top-right-radius: 3px;
 }
 
 @media (min-resolution: 2dppx) {
@@ -4940,6 +5010,15 @@ chatbox[dark=true] > .chat-titlebar > hbox > .chat-title {
   }
 }
 
+.chatbar-button:hover,
+.chatbar-button[open="true"] {
+  background-color: #f0f0f0;
+}
+
+.chatbar-button[activity]:not([open]) {
+  background-image: radial-gradient(circle farthest-corner at center 2px, rgb(254,254,255) 3%, rgba(210,235,255,0.9) 12%, rgba(148,205,253,0.6) 30%, rgba(148,205,253,0.2) 70%);
+}
+
 .chatbar-button > .toolbarbutton-icon {
   width: 16px;
 }
@@ -4975,9 +5054,18 @@ chatbar {
 
 chatbox {
   -moz-margin-start: 4px;
-  background-color: white;
-  border: 1px solid #ccc;
-  border-bottom: none;
+  background-color: transparent;
+}
+
+chatbar > chatbox {
+  /* Apply the same border-radius as the .chat-titlebar to make the box-shadow
+     go round nicely. */
+  border-top-left-radius: 4px;
+  border-top-right-radius: 4px;
+  box-shadow: 0 0 5px rgba(0,0,0,.3);
+  /* Offset the chatbox the same amount as the box-shadows' spread, to make it
+     visible. */
+  -moz-margin-end: 5px;
 }
 
 window > chatbox {
@@ -4985,39 +5073,7 @@ window > chatbox {
   margin: 0px;
   border: none;
   padding: 0px;
-}
-
-.chat-titlebar {
-  background-color: #d9d9d9;
-  background-image: linear-gradient(rgba(255,255,255,.3), transparent);
-}
-
-.chat-titlebar[selected] {
-  background-color: #f0f0f0;
-}
-
-.chatbar-button {
-  -moz-appearance: none;
-  background-color: #d9d9d9;
-  background-image: linear-gradient(rgba(255,255,255,.3), transparent);
-}
-
-.chatbar-button > .toolbarbutton-icon {
-  -moz-margin-end: 0;
-}
-
-.chatbar-button:hover,
-.chatbar-button[open="true"] {
-  background-color: #f0f0f0;
-}
-
-.chatbar-button[activity] {
-  background-image: radial-gradient(circle farthest-corner at center 3px, rgb(233,242,252) 3%, rgba(172,206,255,0.75) 40%, rgba(87,151,201,0.5) 80%, transparent);
-}
-
-chatbox {
-  border-top-left-radius: 2.5px;
-  border-top-right-radius: 2.5px;
+  border-radius: 4px;
 }
 
 /* Customization mode */