rewrite of LCARStrek for 0.9.8(+): big moving around and rewirting of things, see...
[themes.git] / LCARStrek / global / outliner.css
index b8b7bc62f29fe0bbd71d67d9a1bbfc507341008b..37c2eecfec363493dbefa55ae839a666751d5912 100644 (file)
 
 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
 
-/******** Outliner widget **********/
+/* ===== outliner.css ===================================================
+  == Styles used by the XUL outline element.
+  ======================================================================= */
 
-/** basic outliner ****************************************************
- *  basic outliner widget for use in main windows where no decoration
- *  is required.
- **/
+/* ::::: outliner ::::: */
 
 outliner {
-  -moz-border-radius    : 5px;
-  border-spacing        : 0px;     
-  border                : 1px solid #9C9CFF;
-  background-color      : #000000;
-  color                 : #FF9F00;
-}
-
-outliner.inset {
-/*  border: 1px inset #CCD0DD; */
+  -moz-border-radius: 5px;
+  border-spacing: 0px;     
+  border: 1px solid #9C9CFF;
+  background-color: #000000;
+  color: #FF9F00;
 }
 
-outlinerbody {
-  -moz-user-select: none;
-}
+/* ::::: outliner rows ::::: */
 
-outlinerbody:-moz-outliner-row {
-  height: 18px;
+outlinerchildren:-moz-outliner-row {
   border: 1px solid transparent;
+  height: 18px;
 }
 
-outlinerbody:-moz-outliner-row(selected) {
+outlinerchildren:-moz-outliner-row(selected) {
   background-color: #008484;
   color: #FFCF00;
 }
 
-outliner:focus > outlinerbody:-moz-outliner-row(selected, focus) {
+outlinerchildren:-moz-outliner-row(selected, focus) {
   background-color: #008484;
   color: #FFCF00;
 }
 
-outlinerbody:-moz-outliner-row(current, focus) {
+outlinerchildren:-moz-outliner-row(current, focus) {
   border: 1px dotted #008484;
 }
 
-outlinerbody:-moz-outliner-cell {
+/* ::::: outliner cells ::::: */
+
+outlinerchildren:-moz-outliner-cell {
   padding: 0px 0px 1px 2px;
 }
 
-outlinerbody:-moz-outliner-cell-text {
+outlinerchildren:-moz-outliner-cell-text {
   color: inherit;
+  border: 2px solid transparent;
 }
 
 /*
-outlinerbody:-moz-outliner-cell-text(selected) {
-  color: #000000;
+outlinerchildren:-moz-outliner-cell-text(selected) {
+  color: #FFFFFF;
 }
 
-outlinerbody:-moz-outliner-cell-text(selected, focus) {
-  color: #000000;
+outlinerchildren:-moz-outliner-cell-text(selected, focus) {
+  color: #FFFFFF;
 }
 */
 
-outlinerbody:-moz-outliner-line {
-/*  border: 1px dotted grey; */
+/* ::::: lines connecting cells ::::: */
+
+outlinerchildren:-moz-outliner-line {
+  visibility: hidden;
 }
 
-outlinerbody:-moz-outliner-line(selected) {
-/*  border: 1px dotted black; */
+/*
+outlinerchildren:-moz-outliner-line {
+  border: 1px dotted grey;
 }
 
-outlinerbody:-moz-outliner-separator {
+outlinerchildren:-moz-outliner-line(selected) {
+  border: 1px dotted black;
+}
+*/
+
+/* ::::: outliner separator ::::: */
+
+outlinerchildren:-moz-outliner-separator {
   border: 1px solid #9C9CFF;
 }
 
+/* ::::: drop feedback ::::: */
+
+outlinerchildren:-moz-outliner-cell-text(dropOn) {
+  background-color: #008484;
+  color: #FFCF00;
+}
+
+outlinerchildren:-moz-outliner-drop-feedback {
+  background-color: #008484;
+  width: 50px;
+  height: 2px;
+  margin-left: 5px;
+}
+
+outlinerchildren:-moz-outliner-drop-feedback(selected) {
+  background-color: #FFCF00;
+}
+
+/* ::::: outliner columns ::::: */
+
 outlinercol { 
-  border: 1px solid #FFCF00;
-  padding: 0px;
+  -moz-box-align: center;
+  -moz-box-pack: center;
+  border: 1px solid #FF9F00;
   background-color: #9C9CFF;
-  color: black;
+  color: #000000;
+  padding: 1px 4px;
 }
 
-.outlinercol-box,
-.outlinercol-image-box {
-/*  border: 1px solid #9C9CFF; */
+outlinercolpicker { 
+  -moz-box-align: center;
+  -moz-box-pack: center;
+  border: 1px solid transparent;
+  background-color: #000000;
+  padding: 1px 0px;
 }  
 
-.outlinercol-box {
-  padding: 0px 4px;
+.outlinercol-image {
+  padding: 1px;
 }
 
-.outlinercol-image-box {
-  padding: 0px 1px;
+.outlinercol-text {
+  margin: 0px !important;
+  padding: 0px !important;
 }
-  
+
+/* ..... internal box ..... */
+
 outlinercol:hover:active {
   border: 1px solid #FFCF00;
-}
-
-outlinercol:hover:active > .outlinercol-box,
-outlinercol:hover:active > .outlinercol-image-box {
-  border-top: 1px solid transparent;
-  border-right: none;
-  border-bottom: none;
-  border-left: 1px solid transparent;
+  padding: 2px 3px 0px 5px;
 }
   
-outlinercol:hover:active > .outlinercol-box {
-  padding: 1px 4px 0px 5px;
+outlinercolpicker:hover {
+  background-color: #FFCF00;
+}
+
+outlinercolpicker:hover:active {
+  border: 1px solid #FFCF00;
+  background-color: #FF9F00;
 }
 
-outlinercol:hover:active > .outlinercol-image-box {
-  padding: 1px 1px 0px 2px;
+.outlinercol-image:hover:active {
+  padding: 2px 0px 0px 2px;
 }
 
-/* column drag and drop styles */
+/* ::::: column drag and drop styles ::::: */
 
 outlinercol[dragging="true"] {
-/*  border: 1px solid ThreeDDarkShadow; */
+  border: 1px solid transparent;
   background-color: #008484;
   color: #000000;
 }
 
-outlinercol[dragging="true"] > .outlinercol-box {
-  border: 1px solid transparent;
-}
-
 outlinercol[insertafter="true"] {
-/*  border-right: 1px solid #FFCF00; */
-}
-
-outlinercol[insertafter="true"] > .outlinercol-box {
   border-right: 1px solid #FFCF00;
 }
 
 outlinercol[insertbefore="true"] {
-/*  border-left: 1px solid #FFCF00; */
-}
-
-outlinercol[insertbefore="true"] > .outlinercol-box {
   border-left: 1px solid #FFCF00;
 }
 
-outlinerbody:-moz-outliner-column(insertbefore) {
+outlinerchildren:-moz-outliner-column(insertbefore) {
   border-left: 1px solid #FFCF00;
 }
 
-outlinerbody:-moz-outliner-column(insertafter) {
+outlinerchildren:-moz-outliner-column(insertafter) {
   border-right: 1px solid #FFCF00;
 }
 
-/* outliner header with sort direction indicators */
+/* ::::: sort direction indicator :::::  */
 
 .outlinercol-sortdirection {
   list-style-image: none;
 }
 
-.sortDirectionIndicator[sortDirection="ascending"] > .outlinercol-box > .outlinercol-sortdirection {
-  list-style-image: url("chrome://global/skin/sortAscending.gif");
+.sortDirectionIndicator[sortDirection="ascending"] .outlinercol-sortdirection {
+  list-style-image: url("chrome://global/skin/tree/sort-asc.gif");
 }
 
-.sortDirectionIndicator[sortDirection="descending"] > .outlinercol-box > .outlinercol-sortdirection {
-  list-style-image: url("chrome://global/skin/sortDescending.gif");
+.sortDirectionIndicator[sortDirection="descending"] .outlinercol-sortdirection {
+  list-style-image: url("chrome://global/skin/tree/sort-desc.gif");
 }
 
-.outliner-colpicker-icon
-{
-  list-style-image: url("chrome://global/skin/columnselect.gif");
+/* ::::: column picker :::::  */
+
+.outliner-columnpicker-icon {
+  list-style-image: url("chrome://global/skin/tree/columnpicker.gif");
 }
 
-/* twisty rules */
-outlinerbody:-moz-outliner-twisty {
+outlinercolpicker:hover > .outliner-columnpicker-icon,
+outlinercolpicker:hover:active > .outliner-columnpicker-icon {
+  list-style-image: url("chrome://global/skin/tree/columnpicker-hover.gif");
+}
+
+/* ::::: twisty :::::  */
+
+outlinerchildren:-moz-outliner-twisty {
   padding-right: 2px;
   width: 12px; /* The image's width is 12 pixels */
-  list-style-image: url("chrome://global/skin/twisty-closed.gif");
+  list-style-image: url("chrome://global/skin/tree/twisty-closed.gif");
 }
   
-outlinerbody:-moz-outliner-twisty(open) {
+outlinerchildren:-moz-outliner-twisty(open) {
   width: 12px; /* The image's width is 12 pixels */
-  list-style-image: url("chrome://global/skin/twisty-open.gif");
+  list-style-image: url("chrome://global/skin/tree/twisty-open.gif");
 }
 
-outlinerbody:-moz-outliner-indentation {
-  width: 8px;
-}
-
-.outlinercol-text {
-   margin: 0px;
+outlinerchildren:-moz-outliner-indentation {
+  width: 10px;
 }