first part of sync for LCARStrek with browser windows/shared theme changes in Firefox...
authorRobert Kaiser <robert@widebook.box.kairo.at>
Sun, 29 Dec 2013 20:01:42 +0000 (21:01 +0100)
committerRobert Kaiser <robert@widebook.box.kairo.at>
Sun, 29 Dec 2013 20:01:42 +0000 (21:01 +0100)
LCARStrek/browser/browser.css
LCARStrek/browser/devtools/computedview.css
LCARStrek/browser/devtools/dark-theme.css
LCARStrek/browser/devtools/debugger.css
LCARStrek/browser/devtools/light-theme.css
LCARStrek/browser/devtools/ruleview.css
LCARStrek/browser/devtools/scratchpad.css
LCARStrek/browser/devtools/tool-scratchpad.png [new file with mode: 0644]
LCARStrek/browser/devtools/widgets.css
LCARStrek/browser/downloads/indicator.css
LCARStrek/browser/newtab/newTab.css

index 368f2823194f2a36c8e7db5d7b1cd012448463df..5a8a85a6c44d13ed94f1fe35268c2fa338133ffd 100644 (file)
@@ -942,13 +942,11 @@ menuitem.bookmark-item {
 }
 
 #downloads-button[cui-areatype="menu-panel"],
-#downloads-indicator[cui-areatype="menu-panel"],
 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #downloads-button {
   -moz-image-region: rect(0px, 256px, 32px, 224px);
 }
 
 #downloads-button[cui-areatype="menu-panel"]:hover,
-#downloads-indicator[cui-areatype="menu-panel"]:hover,
 :-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #downloads-button:hover {
   -moz-image-region: rect(32px, 256px, 64px, 224px);
 }
@@ -3029,6 +3027,29 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] {
   list-style-image: url("chrome://browser/skin/Secure24.png");
 }
 
+#identity-popup-help-icon {
+  border: none;
+  margin: 7px 0 0 -3px;
+  background: none;
+  min-width: 0;
+  list-style-image: url("chrome://global/skin/icons/question-16.png");
+  cursor: pointer;
+}
+
+#identity-popup-help-icon > .button-box > .button-text {
+  display: none;
+}
+
+#identity-popup-help-icon > .button-box > .button-icon {
+  height: 16px;
+  width: 16px;
+}
+
+#identity-popup-help-icon:-moz-focusring {
+  outline: 1px dotted;
+  outline-offset: 1px;
+}
+
 #identity-popup-more-info-button {
   margin-top: 6px;
   margin-bottom: 0;
index dd2470ad2174a9335f00fafd9dc25ee237a23b3d..780ddfcb1d0223628d7fc05cc99fc29fd81cf162 100644 (file)
@@ -63,6 +63,7 @@ body {
   overflow-x: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
+  outline: 0;
 }
 
 .property-value {
@@ -76,6 +77,7 @@ body {
   background-size: 5px 8px;
   background-position: 2px center;
   padding-left: 10px;
+  outline: 0;
 }
 
 .other-property-value {
@@ -167,3 +169,12 @@ body {
   cursor: pointer;
   float: right;
 }
+
+.computedview-colorswatch {
+  display: inline-block;
+  border-radius: 50%;
+  width: 1em;
+  height: 1em;
+  vertical-align: text-top;
+  -moz-margin-end: 5px;
+}
index 83ec47c3f3b7dfb66477338802b9ff810f06d960..1d29413d128f473607a687fe14685bebc00aceb2 100644 (file)
   background-color: rgba(0,0,0,0.5);
 }
 
+.theme-bg-contrast { /* contrast bg color to attract attention on a container */
+  background: #404000;
+}
+
 .theme-link { /* original: blue */
   color: #3333FF;
 }
 .theme-fg-color7 { /* original: Red */
   color: #FF0000;
 }
+
+.theme-fg-contrast { /* To be used for text on theme-bg-contrast */
+  color: #FFCF00;
+}
+
+.ruleview-colorswatch,
+.computedview-colorswatch,
+.markupview-colorswatch {
+/*  box-shadow: 0 0 0 1px rgba(0,0,0,0.5); */
+}
index 0802089e0b6bb27af266023dc0455a16dbd86e1a..44f2d91248839aebf5a7d9f096e546c41a04f121 100644 (file)
@@ -16,11 +16,16 @@ window {
   min-width: 50px;
 }
 
-#sources-pane + .devtools-side-splitter {
+#sources-and-editor-splitter {
   -moz-border-start-color: transparent;
 }
 
-.side-menu-widget-item-checkbox {
+#pretty-print {
+  min-width: 0;
+  font-weight: bold;
+}
+
+#sources .side-menu-widget-item-checkbox {
   -moz-margin-end: -6px;
   padding: 0;
   opacity: 0;
@@ -29,14 +34,14 @@ window {
 
 /* Only show the checkbox when the source is hovered over, is selected, or if it
  * is not checked. */
-.side-menu-widget-item:hover > .side-menu-widget-item-checkbox,
-.side-menu-widget-item.selected > .side-menu-widget-item-checkbox,
-.side-menu-widget-item-checkbox:not([checked]) {
+#sources .side-menu-widget-item:hover > .side-menu-widget-item-checkbox,
+#sources .side-menu-widget-item.selected > .side-menu-widget-item-checkbox,
+#sources .side-menu-widget-item-checkbox:not([checked]) {
   opacity: 1;
   transition: opacity .15s ease-out 0s;
 }
 
-.side-menu-widget-item-checkbox > .checkbox-check {
+#sources .side-menu-widget-item-checkbox > .checkbox-check {
   -moz-appearance: none;
   background: none;
   background-image: url("itemToggle.png");
@@ -49,28 +54,43 @@ window {
   border: 0;
 }
 
-.side-menu-widget-item-checkbox[checked] > .checkbox-check {
+#sources .side-menu-widget-item-checkbox[checked] > .checkbox-check {
   background-position: 0 0;
 }
 
-.side-menu-widget-item-checkbox:not([checked]) ~ .side-menu-widget-item-contents {
+#sources .side-menu-widget-item-checkbox:not([checked]) ~ .side-menu-widget-item-contents {
   color: #8050B0;
 }
 
-.side-menu-widget-item-checkbox:not([checked]) ~ .side-menu-widget-item-contents > .dbg-breakpoint {
+#sources .side-menu-widget-item-checkbox:not([checked]) ~ .side-menu-widget-item-contents > .dbg-breakpoint {
   display: none;
 }
 
-/* Black box message */
+#sources .side-menu-widget-item.selected > .side-menu-widget-item-checkbox:not([checked]) ~ .side-menu-widget-item-arrow:-moz-locale-dir(ltr) {
+  background-image: none;
+/*  box-shadow: inset -1px 0 0 #222426; */
+}
+
+#sources .side-menu-widget-item.selected > .side-menu-widget-item-checkbox:not([checked]) ~ .side-menu-widget-item-arrow:-moz-locale-dir(rtl) {
+  background-image: none;
+/*  box-shadow: inset 1px 0 0 #222426; */
+}
+
+/* Black box message and source progress meter */
 
-#black-boxed-message {
+#black-boxed-message,
+#source-progress-container {
+  background-color: #A09090;
   /* Prevent the container deck from aquiring the height from this message. */
   min-height: 1px;
-  background-color: #A09090;
-  padding: 25vh 0;
   color: #000000;
 }
 
+#source-progress {
+  min-height: 2em;
+  min-width: 40em;
+}
+
 #black-boxed-message-label,
 #black-boxed-message-button {
   text-align: center;
@@ -150,6 +170,17 @@ window {
   margin: 2px;
 }
 
+/* Instruments pane (watch expressions, variables, event listeners...) */
+
+#instruments-pane > tabs > tab {
+  min-height: 25px !important;
+  padding: 0 !important;
+}
+
+#instruments-pane > tabpanels > tabpanel {
+  background: #000000;
+}
+
 /* Watch expressions view */
 
 #expressions {
@@ -164,13 +195,35 @@ window {
 .dbg-expression-arrow {
   width: 16px;
   height: auto;
-  background: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16);
+  background: -moz-image-rect(url("commandline-icon.png"), 0, 32, 16, 16);
 }
 
 .dbg-expression-input {
   -moz-padding-start: 2px !important;
 }
 
+/* Event listeners view */
+
+.dbg-event-listener {
+  padding: 4px 8px;
+}
+
+.dbg-event-listener-type {
+  font-weight: 600;
+}
+
+.dbg-event-listener-separator {
+  color: #A09090;
+}
+
+.dbg-event-listener-targets {
+  color: #9C9CFF;
+}
+
+.dbg-event-listener-location {
+  color: #E7ADE7;
+}
+
 /* Searchbox and the search operations help panel */
 
 .devtools-searchinput {
@@ -319,7 +372,7 @@ window {
   transform: scale(1.75, 1.75);
 }
 
-/* Toolbar Controls */
+/* Toolbar controls */
 
 #toggle-panes {
   list-style-image: url("chrome://browser/skin/devtools/debugger-expand.png");
@@ -402,3 +455,23 @@ window {
 #instruments-pane-toggle:hover:active {
   -moz-image-region: rect(0px,32px,16px,16px);
 }
+
+/* Horizontal vs. vertical layout */
+
+#vertical-layout-panes-container {
+  min-height: 35vh;
+  max-height: 80vh;
+}
+
+#body[layout=vertical] #instruments-pane {
+  margin: 0 !important;
+  /* To prevent all the margin hacks to hide the sidebar. */
+}
+
+#body[layout=vertical] .side-menu-widget-container {
+  box-shadow: none !important;
+}
+
+#body[layout=vertical] .side-menu-widget-item-arrow {
+  background-image: none !important;
+}
index 83ec47c3f3b7dfb66477338802b9ff810f06d960..41569dc7f1d8f26bd654f532b1576457e620dd18 100644 (file)
@@ -1,98 +1,2 @@
-/* vim:set ts=2 sw=2 sts=2 et: */
-/* 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/. */
-
-/* According to:
- * https://bugzilla.mozilla.org/show_bug.cgi?id=715472#c17
- */
-.theme-body {
-  background: #000000;
-  color: #FF9F00;
-}
-
-.theme-twisty {
-  cursor: pointer;
-  width: 14px;
-  height: 14px;
-  background-repeat: no-repeat;
-  background-image: url("chrome://browser/skin/devtools/controls.png");
-  background-position: 0 -14px;
-}
-
-.theme-twisty:-moz-focusring {
-  outline-style: none;
-}
-
-.theme-twisty[open] {
-  background-position: -14px -14px;
-}
-
-.theme-checkbox {
-  display: inline-block;
-  border: 0;
-  width: 14px;
-  height: 14px;
-  padding: 0;
-  outline: none;
-  background-image: url("chrome://browser/skin/devtools/controls.png");
-  background-position: 0 0;
-}
-
-.theme-checkbox[checked] {
-  background-position: -14px 0;
-}
-
-.theme-selected {
-  background: #004242;
-}
-
-.theme-bg-darker {
-  background-color: rgba(0,0,0,0.5);
-}
-
-.theme-link { /* original: blue */
-  color: #3333FF;
-}
-
-.theme-comment { /* original: grey */
-  color: #A09090;
-}
-
-.theme-gutter {
-  background-color: #000000;
-  color: #FF9F00;
-  border-color: #9C9CFF;
-}
-
-.theme-separator { /* original: grey */
-  border-color: #8050B0;
-}
-
-.theme-fg-color1 { /* original: green */
-  color: #008484;
-}
-
-.theme-fg-color2 { /* original: blue */
-  color: #9C9CFF;
-}
-
-.theme-fg-color3 { /* original: pink/lavender */
-  color: #E7ADE7;
-}
-
-.theme-fg-color4 { /* original: purple/violet */
-  color: #C09070;
-}
-
-.theme-fg-color5 { /* original: Yellow */
-  color: #FFCF00;
-}
-
-.theme-fg-color6 { /* original: Orange */
-  color: #FF9F00;
-}
-
-.theme-fg-color7 { /* original: Red */
-  color: #FF0000;
-}
+/* In LCARStrek, we do not support dark and light devtools themes, it's all one. */
+@import url("dark-theme.css");
index 4a248be814fe74c584253645b3d92196f4cef153..6e36558e9b1d6e6c956f22620829981a6f3587c3 100644 (file)
   -moz-margin-start: 35px;
 }
 
+.ruleview-colorswatch {
+  border-radius: 50%;
+  width: 1em;
+  height: 1em;
+  vertical-align: text-top;
+  -moz-margin-end: 5px;
+}
+
 .ruleview-overridden {
   text-decoration: line-through;
 }
index 0354e6e669e4f89079ce48b2bca848b2ed73a5df..29683edafd38759cfa0e6f296303da6be79a3fff 100644 (file)
@@ -2,7 +2,13 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this\r
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */\r
 \r
+/* === EQUALS scratchpad.inc.css === */\r
+\r
 #scratchpad-sidebar > tabs {\r
   height: 0;\r
   border: none;\r
 }\r
+\r
+#sp-toolbar {\r
+  border: none;\r
+}\r
diff --git a/LCARStrek/browser/devtools/tool-scratchpad.png b/LCARStrek/browser/devtools/tool-scratchpad.png
new file mode 100644 (file)
index 0000000..4a4dd17
Binary files /dev/null and b/LCARStrek/browser/devtools/tool-scratchpad.png differ
index fe3157f657797c8918749a1311e9d6415d73f58d..b5b8d06dd29f7edae6bc77487e15953539dd2d47 100644 (file)
   color: #FF9F00;
 }
 
-.side-menu-widget-container[with-arrow=true]:-moz-locale-dir(ltr),
-.side-menu-widget-group[with-arrow=true]:-moz-locale-dir(ltr),
-.side-menu-widget-item[with-arrow=true]:-moz-locale-dir(ltr) {
+.side-menu-widget-container[with-arrows=true]:-moz-locale-dir(ltr) {
 }
 
-.side-menu-widget-container[with-arrow=true]:-moz-locale-dir(rtl),
-.side-menu-widget-group[with-arrow=true]:-moz-locale-dir(rtl),
-.side-menu-widget-item[with-arrow=true]:-moz-locale-dir(rtl) {
+.side-menu-widget-container[with-arrows=true]:-moz-locale-dir(rtl) {
 }
 
 .side-menu-widget-group-title {
-  background-color: #A09090;
   padding: 4px;
+
+  background-color: #A09090;
   color: #000000;
-  transition-property: background-color;
-  transition-duration: 0.3s;
 }
 
-.side-menu-widget-group:hover > .side-menu-widget-group-title {
-  background-color: #FFCF00;
+.side-menu-widget-group-checkbox {
+  margin: 0;
+  padding: 0;
 }
 
 .side-menu-widget-item {
   border-top: 1px solid #9C9CFF;
   margin-top: -1px;
   margin-bottom: -1px;
-  cursor: pointer;
 }
 
 .side-menu-widget-item:last-of-type {
 
 .side-menu-widget-item-label {
   padding: 4px 0px;
-  cursor: inherit;
 }
 
 .side-menu-widget-item-arrow {
   width: 8px;
 }
 
+.side-menu-widget-item-checkbox {
+  -moz-margin-start: 4px;
+  -moz-margin-end: -6px;
+}
+
 .side-menu-widget-item-other {
   background-color: #000000;
   margin: 0 -4px;
 }
 
 .side-menu-widget-empty-notice-container {
-  background-color: #000000;
   padding: 12px;
-  color: #A09090;
+
+  background-color: #000000;
   font-weight: 600;
+  color: #A09090;
 }
 
 /* VariablesView */
 /* Custom configurable/enumerable/writable or frozen/sealed/extensible
  * variables and properties */
 
-.variable-or-property[non-enumerable]:not([self]):not([exception]):not([return]) > .title > .name {
+.variable-or-property[non-enumerable]:not([self]):not([exception]):not([return]):not([scope]) > .title > .name {
   opacity: 0.5;
 }
 
   color: #008484;
 }
 
+.variable-or-property[scope]:not(:focus) > .title > .name {
+  color: #9C9CFF;
+}
+
 /* Variables and properties tooltips */
 
 .variable-or-property > tooltip > label {
index 8be313c8340d39a2037ac79c450c642dbf702124..dcb023f3902574138d525532454c53c27357d3d9 100644 (file)
@@ -4,11 +4,17 @@
 
 /*** Status and progress indicator ***/
 
-#downloads-indicator-anchor {
-  /* Makes the outermost stack element positioned, so that its contents are
-     rendered over the main browser window in the Z order.  This is required by
-     the animated event notification. */
+#downloads-animation-container {
+  min-height: 1px;
+  min-width: 1px;
+  height: 1px;
+  margin-bottom: -1px;
+  /* Makes the outermost animation container element positioned, so that its
+     contents are rendered over the main browser window in the Z order.
+     This is required by the animated event notification. */
   position: relative;
+  /* The selected tab may overlap #downloads-indicator-notification */
+  z-index: 5;
 }
 
 /*** Main indicator icon ***/
@@ -20,9 +26,6 @@
   min-height: 18px;
 }
 
-#downloads-indicator:hover > #downloads-indicator-anchor > #downloads-indicator-icon,
-#downloads-indicator[open="true"] > #downloads-indicator-anchor > #downloads-indicator-icon,
-#downloads-indicator[attention]:hover > #downloads-indicator-anchor > #downloads-indicator-icon,
 #downloads-button:hover > #downloads-indicator-anchor > #downloads-indicator-icon,
 #downloads-button[open="true"] > #downloads-indicator-anchor > #downloads-indicator-icon,
 #downloads-button[attention]:hover > #downloads-indicator-anchor > #downloads-indicator-icon {
@@ -36,7 +39,6 @@
                               0, 108, 18, 90) center no-repeat;*/
 }
 
-#downloads-indicator[attention] > #downloads-indicator-anchor > #downloads-indicator-icon,
 #downloads-button[attention] > #downloads-indicator-anchor > #downloads-indicator-icon {
   background-image: url("chrome://browser/skin/downloads/download-glow.png");
 }
 /* In the next few rules, we use :not([counter]) as a shortcut that is
    equivalent to -moz-any([progress], [paused]). */
 
-#downloads-indicator:not([counter]) > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
 #downloads-button:not([counter]) > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter {
   background: -moz-image-rect(url("chrome://browser/skin/FxToolbar.png"),
                               0, 108, 18, 90) center no-repeat;
   background-size: 12px;
 }
 
-#downloads-indicator:not([counter])[attention] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
 #downloads-button:not([counter])[attention] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter {
   background-image: url("chrome://browser/skin/downloads/download-glow.png");
 }
 
-#downloads-indicator:not([counter]):hover > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
-#downloads-indicator[open="true"]:not([counter]) > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
-#downloads-indicator:not([counter])[attention]:hover > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
 #downloads-button:not([counter]):hover > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
 #downloads-button[open="true"]:not([counter]) > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
 #downloads-button:not([counter])[attention]:hover > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter {
@@ -74,6 +71,8 @@
   background-size: 16px;
   background-position: center;
   background-repeat: no-repeat;
+  width: 16px;
+  height: 16px;
 }
 
 @keyframes downloadsIndicatorNotificationStartRight {
   to   { opacity: 0; transform: translate(0) scale(1); }
 }
 
-#downloads-indicator[notification="start"] > #downloads-indicator-anchor > #downloads-indicator-notification,
-#downloads-button[notification="start"] > #downloads-indicator-anchor > #downloads-indicator-notification {
+#downloads-notification-anchor[notification="start"] > #downloads-indicator-notification {
   background-image: url("chrome://browser/skin/downloads/download-notification-start.png");
   animation-name: downloadsIndicatorNotificationStartRight;
   animation-duration: 1s;
 }
 
-#downloads-indicator[notification="start"]:-moz-locale-dir(rtl) > #downloads-indicator-anchor > #downloads-indicator-notification,
-#downloads-button[notification="start"]:-moz-locale-dir(rtl) > #downloads-indicator-anchor > #downloads-indicator-notification {
+#downloads-notification-anchor[notification="start"]:-moz-locale-dir(rtl) > #downloads-indicator-notification {
   animation-name: downloadsIndicatorNotificationStartLeft;
 }
 
   to   { opacity: 0; transform: scale(8); }
 }
 
-#downloads-indicator[notification="finish"] > #downloads-indicator-anchor > #downloads-indicator-notification,
-#downloads-button[notification="finish"] > #downloads-indicator-anchor > #downloads-indicator-notification {
+#downloads-notification-anchor[notification="finish"] > #downloads-indicator-notification {
   background-image: url("chrome://browser/skin/downloads/download-notification-finish.png");
   animation-name: downloadsIndicatorNotificationFinish;
   animation-duration: 1s;
                0 1px 1.5px rgba(0,0,0,.5);*/
 }
 
-#downloads-indicator[counter]:hover > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
-#downloads-indicator[counter][open="true"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
 #downloads-button[counter]:hover > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
 #downloads-button[counter][open="true"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter {
   color: #000000;
   border-radius: 0 2px 2px 0;
 }
 
-#downloads-indicator[paused] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-progress > .progress-bar,
 #downloads-button[paused] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-progress > .progress-bar {
   background-color: #8050B0;
 }
 
-#downloads-indicator[paused] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-progress > .progress-remainder,
 #downloads-button[paused] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-progress > .progress-remainder {
   background-color: #404048;
 }
 
-toolbar[mode="full"] > #downloads-indicator > .toolbarbutton-text {
+toolbar[mode="full"] > #downloads-button > .toolbarbutton-text {
   margin: 0;
   text-align: center;
 }
index 73c559b35269e3a549a1b9a0e3daa6cf9f3d43a8..8597bd7cdb53e0a4e24ea18dd2edc91102fc6bcd 100644 (file)
@@ -7,6 +7,7 @@
 
 /* SCROLLBOX */
 #newtab-scrollbox:not([page-disabled]) {
+  color: #FF9F00;
   background-color: #000000;
 }