fourth part of syncing LCARStrek with Firefox 29 windows theme changes
[themes.git] / LCARStrek / browser / browser.css
index 939d423c92de5ab89b3aeaa91cd28f8c6ab9acce..ac2f2bfb314e0a1bdef729541d6c3beda95fa572 100644 (file)
@@ -481,7 +481,10 @@ menuitem.bookmark-item {
 }
 
 #bookmarks-menu-button[cui-areatype="toolbar"][starred]:hover,
-#bookmarks-menu-button[cui-areatype="toolbar"][starred][open="true"] {
+#bookmarks-menu-button[cui-areatype="toolbar"][starred][open="true"],
+#bookmarks-menu-button[cui-areatype="toolbar"][starred] > .toolbarbutton-menubutton-button[open="true"] {
+  /* When starred and clicked (for edit/delete dialog),
+   * then only the menubutton-button itself is open, but not the whole menubutton. */
   -moz-image-region: rect(18px, 162px, 36px, 144px);
 }
 
@@ -815,14 +818,6 @@ toolbarpaletteitem[place="palette"] > #bookmarks-menu-button:hover {
   -moz-image-region: rect(32px, 160px, 64px, 128px);
 }
 
-#bookmarks-menu-button[starred][cui-areatype="menu-panel"] {
-  -moz-image-region: rect(0px, 192px, 32px, 160px);
-}
-
-#bookmarks-menu-button[starred][cui-areatype="menu-panel"]:hover {
-  -moz-image-region: rect(32px, 192px, 64px, 160px);
-}
-
 #history-panelmenu[cui-areatype="menu-panel"],
 toolbarpaletteitem[place="palette"] > #history-panelmenu {
   -moz-image-region: rect(0px, 224px, 32px, 192px);
@@ -1486,7 +1481,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-container > #forward-button[occlud
 }
 
 #urlbar {
-  width: 7em;
   /* make color as light as possible to deal with dark non-domain parts */
   color: #FFBFFF;
 }
@@ -2254,7 +2248,7 @@ toolbarbutton[type="socialmark"] > .toolbarbutton-icon {
 }
 
 #main-window:not([customizing]) #TabsToolbar:not(:-moz-lwtheme) {
- }
+}
 
 #main-window[tabsintitlebar] #TabsToolbar {
   background-color: transparent;
@@ -3043,6 +3037,32 @@ window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlb
   margin-top: .5em;
 }
 
+/* Sync Panel */
+
+.sync-panel-icon {
+  width: 32px;
+  background: url("chrome://browser/content/abouthome/sync.png") top left no-repeat;
+}
+
+.sync-panel-inner {
+  width: 0;
+  padding-left: 10px;
+}
+
+.sync-panel-button-box {
+  margin-top: 1em;
+}
+
+#sync-error-panel-title,
+#sync-start-panel-title {
+  font-weight: bold;
+}
+
+#sync-start-panel-subtitle,
+#sync-error-panel-subtitle {
+  margin: 0;
+}
+
 /* Status panel */
 
 .statuspanel-label {
@@ -3084,11 +3104,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlb
   outline: 1px dashed #A09090;
 }
 
-.highlighter-outline[locked]  {
-  box-shadow: 0 0 0 1px rgba(0,0,0,0.3);
-  outline-color: rgba(255,255,255,0.7);
-}
-
 /* Highlighter - Node Infobar */
 
 .highlighter-nodeinfobar {
@@ -3106,6 +3121,7 @@ window:not([chromehidden~="toolbar"]) #urlbar-container[forwarddisabled] > #urlb
 /* Highlighter - Node Infobar - text */
 
 .highlighter-nodeinfobar-text {
+  text-align: center;
   /* 100% - size of the buttons and margins */
   max-width: calc(100% - 2 * (26px + 6px));
   padding-bottom: 1px;
@@ -3123,35 +3139,6 @@ html|*.highlighter-nodeinfobar-pseudo-classes {
   color: #FF9F00;
 }
 
-/* Highlighter - Node Infobar - buttons */
-
-.highlighter-nodeinfobar-button {
-  padding: 0;
-  width: 26px;
-  min-height: 26px;
-}
-
-.highlighter-nodeinfobar-inspectbutton {
-  list-style-image: url("chrome://browser/skin/devtools/inspect-button.png");
-  -moz-image-region: rect(0px 16px 16px 0px);
-  -moz-margin-start: 0px;
-  -moz-margin-end: 2px;
-}
-
-.highlighter-nodeinfobar-inspectbutton:hover,
-.highlighter-nodeinfobar-inspectbutton:hover:active/*,
-.highlighter-nodeinfobar-container:not([locked]) >  .highlighter-nodeinfobar >  .highlighter-nodeinfobar-inspectbutton*/ {
-  -moz-image-region: rect(0px 32px 16px 16px);
-}
-
-.highlighter-nodeinfobar-menu {
-}
-
-.highlighter-nodeinfobar-menu > .toolbarbutton-menu-dropmarker {
-  -moz-box-align: center;
-  -moz-margin-start: -1px;
-}
-
 /* Highlighter - Node Infobar - box & arrow */
 
 .highlighter-nodeinfobar-arrow {
@@ -3721,6 +3708,40 @@ html|*#gcli-output-frame {
 
 /* === BEGIN chat.inc.css === */
 
+#social-sidebar-header {
+  padding: 3px;
+}
+
+#social-sidebar-button {
+  -moz-appearance: none;
+  list-style-image: url("chrome://browser/skin/social/gear_default.png");
+  border: none;
+  padding: 0;
+  margin: 2px;
+}
+#social-sidebar-button > .toolbarbutton-icon {
+  min-height: 16px;
+  min-width: 16px;
+}
+#social-sidebar-button:hover,
+#social-sidebar-button:hover:active {
+  list-style-image: url("chrome://browser/skin/social/gear_clicked.png");
+}
+#social-sidebar-button > .toolbarbutton-menu-dropmarker {
+  display: none;
+}
+
+#social-sidebar-button[loading="true"] {
+  list-style-image: url("chrome://global/skin/icons/loading.gif");
+}
+
+#social-sidebar-favico {
+  max-height: 16px;
+  max-width: 16px;
+  padding: 0;
+  margin: 2px;
+}
+
 .chat-status-icon {
   max-height: 16px;
   max-width: 16px;
@@ -4409,28 +4430,145 @@ toolbarpaletteitem[place="toolbar"] {
 
 /* UI Tour */
 
-html|div#UITourHighlight {
-  border-radius: 20px;
-  border: 2px #9C9CFF solid;
+#UITourHighlightContainer {
+  -moz-appearance: none;
+  border: none;
+  background-color: transparent;
+  /* This is a buffer to compensate for the movement in the "wobble" effect */
+  padding: 4px;
+}
+
+#UITourHighlight {
+  background-image: radial-gradient(50% 100%, rgba(0,132,132,0.4) 50%, rgba(0,132,132,0.6) 100%);
+  border-radius: 40px;
+  border: 1px solid #9C9CFF;
+  /* The box-shadow opacity needs to be < 0.5 so it doesn't appear at 100% opacity
+     on Linux without an X compositor where opacity is either 0 or 1. */
+  box-shadow: 0 0 3px 0 rgba(0,0,0,0.49);
   min-height: 32px;
   min-width: 32px;
 }
 
-html|div#UITourHighlight[active] {
+#UITourTooltipBody {
+  -moz-margin-end: 14px;
+}
+
+#UITourTooltipBody > vbox {
+  padding-top: 4px;
 }
 
-#UITourTooltip {
-  max-width: 20em;
+#UITourTooltipIconContainer {
+  -moz-margin-start: -16px;
+}
+
+#UITourTooltipIcon {
+  width: 48px;
+  height: 48px;
+  -moz-margin-start: 28px;
+  -moz-margin-end: 28px;
+}
+
+#UITourTooltipTitle,
+#UITourTooltipDescription {
+  max-width: 20rem;
 }
 
 #UITourTooltipTitle {
-  font-size: 130%;
+  font-size: 1.45rem;
   font-weight: bold;
-  margin: 0 0 5px 0;
+  -moz-margin-start: 0;
+  -moz-margin-end: 0;
+  margin: 0 0 9px 0;
 }
 
 #UITourTooltipDescription {
-  max-width: 20em;
+  -moz-margin-start: 0;
+  -moz-margin-end: 0;
+  font-size: 1.15rem;
+  line-height: 1.8rem;
+  margin-bottom: 0; /* Override global.css */
+}
+
+#UITourTooltipClose {
+  -moz-appearance: none;
+  border: none;
+  background-color: transparent;
+  min-width: 0;
+  -moz-margin-start: 4px;
+  margin-top: -2px;
+}
+
+#UITourTooltipClose > .toolbarbutton-text {
+  display: none;
+}
+
+#UITourTooltipButtons {
+  -moz-box-pack: end;
+  background-color: rgba(0,0,0,.2);
+  border-top: 1px solid rgba(0,0,0,.4);
+  margin: 24px -16px -16px;
+  padding: 2em 15px;
+}
+
+#UITourTooltipButtons > button {
+  margin: 0 15px;
+}
+
+#UITourTooltipButtons > button:first-child {
+  -moz-margin-start: 0;
+}
+
+#UITourTooltipButtons > button[image] > .button-box > .button-icon {
+  width: 16px;
+  height: 16px;
+  -moz-margin-end: 5px;
+}
+
+#UITourTooltipButtons > button .button-text {
+  font-size: 1.15rem;
+}
+
+#UITourTooltipButtons > button:not(.button-link) {
+  -moz-appearance: none;
+  background-color: #C09070;
+  border-radius: 3000px;
+  border: none;
+  color: #000000;
+  padding: 4px 30px;
+  transition-property: background-color, color;
+  transition-duration: 150ms;
+}
+
+#UITourTooltipButtons > button:not(.button-link):not(:active):hover {
+  background-color: #FFCF00;
+  color: #000000;
+}
+
+#UITourTooltipButtons > button.button-link {
+  -moz-appearance: none;
+  background: transparent;
+  border: none;
+  box-shadow: none;
+  color: rgba(0,0,0,0.35);
+  padding-left: 10px;
+  padding-right: 10px;
+}
+
+#UITourTooltipButtons > button.button-link:hover {
+  color: black;
+}
+
+/* The primary button gets the same color as the customize button. */
+#UITourTooltipButtons > button.button-primary {
+  background-color: #A06060; /* LCARS default button background color */
+  color: #000000;
+  padding-left: 30px;
+  padding-right: 30px;
+}
+
+#UITourTooltipButtons > button.button-primary:not(:active):hover {
+  background-color: #FFCF00;
+  color: #000000;
 }
 
 /* === END UITour.inc.css === */