style fullscreen messagefirefox-45-beta

6 files changed, 129 insertions, 24 deletions

diff --git a/arc-firefox-theme/chrome/browser/browser.css b/arc-firefox-theme/chrome/browser/browser.css
index dabd4cb..6d10c0e 100644
--- a/arc-firefox-theme/chrome/browser/browser.css
+++ b/arc-firefox-theme/chrome/browser/browser.css
@@ -2755,10 +2755,11 @@ toolbarbutton.chevron > .toolbarbutton-icon {
 
 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;
+  color: #BAC3CF;
+  background: rgba(53, 57, 69, 0.95);
+  border: 1px solid rgba(31, 33, 40, 0.95);
+  box-shadow: 0px 2px 6px 1px rgba(0, 0, 0, 0.2);
+  border-radius: 3px;
   padding: 24px 16px;
   font: message-box; }
 
@@ -2791,7 +2792,21 @@ html|*#fullscreen-exit-button {
   font-size: 14px;
   font-weight: lighter;
   margin: 0;
-  box-sizing: content-box; }
+  box-sizing: content-box;
+  background-clip: padding-box;
+  border: 1px solid;
+  border-radius: 3px;
+  color: #BAC3CF;
+  border-color: rgba(26, 28, 34, 0.35);
+  background-color: rgba(102, 109, 132, 0.35); }
+  html|*#fullscreen-exit-button:hover {
+    color: #BAC3CF;
+    border-color: rgba(26, 28, 34, 0.35);
+    background-color: rgba(119, 127, 151, 0.45); }
+  html|*#fullscreen-exit-button:active, html|*#fullscreen-exit-button:checked {
+    color: #ffffff;
+    border-color: rgba(26, 28, 34, 0.35);
+    background-color: #5294E2; }
 
 /* Responsive Mode */
 .browserContainer[responsivemode] {
diff --git a/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss b/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss
index 3757954..eb7726c 100644
--- a/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss
+++ b/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss
@@ -3699,10 +3699,11 @@ toolbarbutton.chevron > .toolbarbutton-icon {
 
 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;
+  color: $dark_sidebar_fg;
+  background: $dark_sidebar_bg;
+  border: 1px solid darken($dark_sidebar_bg, 10%);
+  box-shadow: 0px 2px 6px 1px rgba(0, 0, 0, 0.2);
+  border-radius: 3px;
   padding: 24px 16px;
   font: message-box;
 }
@@ -3741,6 +3742,14 @@ html|*#fullscreen-exit-button {
   font-weight: lighter;
   margin: 0;
   box-sizing: content-box;
+  background-clip: padding-box;
+  border: 1px solid;
+  border-radius: 3px;
+
+  @include button(osd);
+
+  &:hover { @include button(osd-hover); }
+  &:active, &:checked { @include button(osd-active); }
 }
 
 /* Responsive Mode */
diff --git a/arc-firefox-theme/chrome/browser/sass/_drawing.scss b/arc-firefox-theme/chrome/browser/sass/_drawing.scss
index 504dce1..06f32bf 100644
--- a/arc-firefox-theme/chrome/browser/sass/_drawing.scss
+++ b/arc-firefox-theme/chrome/browser/sass/_drawing.scss
@@ -133,4 +133,40 @@
     border-color: transparentize($selected_bg_color, 0.35);
     background-color: transparentize($selected_bg_color, 0.35);
   }
+
+  @else if $t==osd {
+  //
+  // normal osd button
+  //
+    color: $osd_fg_color;
+    border-color: $osd_button_border;
+    background-color: $osd_button_bg;
+  }
+
+  @else if $t==osd-hover {
+  //
+  // active osd button
+  //
+    color: $osd_fg_color;
+    border-color: $osd_button_border;
+    background-color: opacify(lighten($osd_button_bg, 7%), 0.1);
+  }
+
+  @else if $t==osd-active {
+  //
+  // active osd button
+  //
+    color: $selected_fg_color;
+    border-color: $osd_button_border;
+    background-color: $selected_bg_color;
+  }
+
+  @else if $t==osd-insensitive {
+  //
+  // insensitive osd button
+  //
+    color: $osd_insensitive_fg_color;
+    border-color: $osd_button_border;
+    background-color: transparentize($osd_button_bg, 0.15);
+  }
 }
diff --git a/arc-firefox-theme/chrome/browser/sass/browser-dark.css b/arc-firefox-theme/chrome/browser/sass/browser-dark.css
index fa16d69..c43bb01 100644
--- a/arc-firefox-theme/chrome/browser/sass/browser-dark.css
+++ b/arc-firefox-theme/chrome/browser/sass/browser-dark.css
@@ -2755,10 +2755,11 @@ toolbarbutton.chevron > .toolbarbutton-icon {
 
 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;
+  color: #BAC3CF;
+  background: rgba(53, 57, 69, 0.95);
+  border: 1px solid rgba(31, 33, 40, 0.95);
+  box-shadow: 0px 2px 6px 1px rgba(0, 0, 0, 0.2);
+  border-radius: 3px;
   padding: 24px 16px;
   font: message-box; }
 
@@ -2791,7 +2792,21 @@ html|*#fullscreen-exit-button {
   font-size: 14px;
   font-weight: lighter;
   margin: 0;
-  box-sizing: content-box; }
+  box-sizing: content-box;
+  background-clip: padding-box;
+  border: 1px solid;
+  border-radius: 3px;
+  color: #BAC3CF;
+  border-color: rgba(26, 28, 34, 0.35);
+  background-color: rgba(102, 109, 132, 0.35); }
+  html|*#fullscreen-exit-button:hover {
+    color: #BAC3CF;
+    border-color: rgba(26, 28, 34, 0.35);
+    background-color: rgba(119, 127, 151, 0.45); }
+  html|*#fullscreen-exit-button:active, html|*#fullscreen-exit-button:checked {
+    color: #ffffff;
+    border-color: rgba(26, 28, 34, 0.35);
+    background-color: #5294E2; }
 
 /* Responsive Mode */
 .browserContainer[responsivemode] {
diff --git a/arc-firefox-theme/chrome/browser/sass/browser-darker.css b/arc-firefox-theme/chrome/browser/sass/browser-darker.css
index a3f4850..c7d0e50 100644
--- a/arc-firefox-theme/chrome/browser/sass/browser-darker.css
+++ b/arc-firefox-theme/chrome/browser/sass/browser-darker.css
@@ -2755,10 +2755,11 @@ toolbarbutton.chevron > .toolbarbutton-icon {
 
 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;
+  color: #BAC3CF;
+  background: rgba(53, 57, 69, 0.95);
+  border: 1px solid rgba(31, 33, 40, 0.95);
+  box-shadow: 0px 2px 6px 1px rgba(0, 0, 0, 0.2);
+  border-radius: 3px;
   padding: 24px 16px;
   font: message-box; }
 
@@ -2791,7 +2792,21 @@ html|*#fullscreen-exit-button {
   font-size: 14px;
   font-weight: lighter;
   margin: 0;
-  box-sizing: content-box; }
+  box-sizing: content-box;
+  background-clip: padding-box;
+  border: 1px solid;
+  border-radius: 3px;
+  color: #BAC3CF;
+  border-color: rgba(26, 28, 34, 0.35);
+  background-color: rgba(102, 109, 132, 0.35); }
+  html|*#fullscreen-exit-button:hover {
+    color: #BAC3CF;
+    border-color: rgba(26, 28, 34, 0.35);
+    background-color: rgba(119, 127, 151, 0.45); }
+  html|*#fullscreen-exit-button:active, html|*#fullscreen-exit-button:checked {
+    color: #ffffff;
+    border-color: rgba(26, 28, 34, 0.35);
+    background-color: #5294E2; }
 
 /* Responsive Mode */
 .browserContainer[responsivemode] {
diff --git a/arc-firefox-theme/chrome/browser/sass/browser-light.css b/arc-firefox-theme/chrome/browser/sass/browser-light.css
index dabd4cb..6d10c0e 100644
--- a/arc-firefox-theme/chrome/browser/sass/browser-light.css
+++ b/arc-firefox-theme/chrome/browser/sass/browser-light.css
@@ -2755,10 +2755,11 @@ toolbarbutton.chevron > .toolbarbutton-icon {
 
 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;
+  color: #BAC3CF;
+  background: rgba(53, 57, 69, 0.95);
+  border: 1px solid rgba(31, 33, 40, 0.95);
+  box-shadow: 0px 2px 6px 1px rgba(0, 0, 0, 0.2);
+  border-radius: 3px;
   padding: 24px 16px;
   font: message-box; }
 
@@ -2791,7 +2792,21 @@ html|*#fullscreen-exit-button {
   font-size: 14px;
   font-weight: lighter;
   margin: 0;
-  box-sizing: content-box; }
+  box-sizing: content-box;
+  background-clip: padding-box;
+  border: 1px solid;
+  border-radius: 3px;
+  color: #BAC3CF;
+  border-color: rgba(26, 28, 34, 0.35);
+  background-color: rgba(102, 109, 132, 0.35); }
+  html|*#fullscreen-exit-button:hover {
+    color: #BAC3CF;
+    border-color: rgba(26, 28, 34, 0.35);
+    background-color: rgba(119, 127, 151, 0.45); }
+  html|*#fullscreen-exit-button:active, html|*#fullscreen-exit-button:checked {
+    color: #ffffff;
+    border-color: rgba(26, 28, 34, 0.35);
+    background-color: #5294E2; }
 
 /* Responsive Mode */
 .browserContainer[responsivemode] {