Join the AMA (Ask Me Anything) with the Firefox leadership team to celebrate Firefox 20th anniversary and discuss Firefox’s future on Mozilla Connect. Mark your calendar on Thursday, November 14, 18:00 - 20:00 UTC!

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

userChrome.css questions

more options

I have been tinkering with userChrome.css to fix some of the "features" of the display in 78 and have had some success and some puzzles. See the current iteration at the end of this post.

Questions: Removing the folder pane options worked and the margin moved, but it seem like it should move more. Does anyone have an idea of the limit of the margin?

The vertical spacing did seem to reduce a little ... how can I reduce it more. I confess to having no idea what this piece is doing.

Likewise in the message window. We got a little reduction, but it could be much more compressed.

The new unread mail is peculiar. If the mail is redirected by message filters to another folder, sure enough it turns red. But, if the mail just goes into the account mail inbox, then the folder flashes red for a few seconds and then returns to black.

Documentation sure would be helpful ...

/* Remove folder pane icons and reduce left margin */

  1. folderTree treechildren::-moz-tree-image {

list-style-image: none !important; margin-left: -20px; }

/* Reduce vertical alignment display width to compact folders */

  1. folderTree treechildren::-moz-tree-indentation {

width: 1px !important; }

/* Reduce vertical spacing in message window */

  1. threadTree treechildren::-moz-tree-row {

height: 10pt !important; }

/* Make folders with new unread mail red */

  1. folderTree > treechildren::-moz-tree-cell-text(folderNameCol, newMessages-true) {
 color: #FF0000 !important;

}

I have been tinkering with userChrome.css to fix some of the "features" of the display in 78 and have had some success and some puzzles. See the current iteration at the end of this post. Questions: Removing the folder pane options worked and the margin moved, but it seem like it should move more. Does anyone have an idea of the limit of the margin? The vertical spacing did seem to reduce a little ... how can I reduce it more. I confess to having no idea what this piece is doing. Likewise in the message window. We got a little reduction, but it could be much more compressed. The new unread mail is peculiar. If the mail is redirected by message filters to another folder, sure enough it turns red. But, if the mail just goes into the account mail inbox, then the folder flashes red for a few seconds and then returns to black. Documentation sure would be helpful ... /* Remove folder pane icons and reduce left margin */ #folderTree treechildren::-moz-tree-image { list-style-image: none !important; margin-left: -20px; } /* Reduce vertical alignment display width to compact folders */ #folderTree treechildren::-moz-tree-indentation { width: 1px !important; } /* Reduce vertical spacing in message window */ #threadTree treechildren::-moz-tree-row { height: 10pt !important; } /* Make folders with new unread mail red */ #folderTree > treechildren::-moz-tree-cell-text(folderNameCol, newMessages-true) { color: #FF0000 !important; }

Chosen solution

Annoying ... all those number dot space instances are actually #

Read this answer in context 👍 0

All Replies (6)

more options

Try this:

/* Hide Folder pane icons */
#folderTree treechildren::-moz-tree-image {
list-style-image: none !important;
margin-left: -20px !important;
 }

/* Reduce vertical alignment display width */
#folderTree treechildren::-moz-tree-indentation {
width: 1px !important;
}

/* Threads and Folder Panes spacing */
#threadTree treechildren::-moz-tree-row {
   height: 12pt !important;
   min-height: 12pt !important;

#folderTree treechildren::-moz-tree-row {
   height: 12pt !important;
   min-height: 12pt !important;
}

/* Highlight Folders if subfolders have unread messages */
treechildren::-moz-tree-cell-text(subfoldersHaveUnreadMessages-true) {
  color: red !important;
}

/* Make Folders having Unread_Messages distinct from others */
treechildren::-moz-tree-cell-text(hasUnreadMessages-true, newMessages-false) {
  color: green !important;
}

/* Change Folder Display to indicate New Message(s) arrived */
treechildren::-moz-tree-cell-text(folderNameCol, newMessages-true) {
  color: orange !important;
  font-weight: bold !important;
}
more options

We will give this a try, thanks. But, to clarify, we are happy with the way that folders with unread messages are currently displayed (in bold). Some folders are left like this for long periods of time because their content is suitable for processing in a batch. Our only issue is with folders with *new* unread mail so that we are aware there is something new to process.

So, I'm going to omit the subfoldersHaveUnreadMessages-true and hasUnreadMessages-true in the test.

more options

For the record, this is what we ended up with.

/* Remove folder pane icons and reduce left margin */

  1. folderTree treechildren::-moz-tree-image {

list-style-image: none !important; margin-left: -25px; }

/* Reduce vertical alignment display width to compact folders */

  1. folderTree treechildren::-moz-tree-indentation {

width: 1px !important; }

/* Reduce vertical spacing in message window */

  1. threadTree treechildren::-moz-tree-row {

height: 12pt !important; min-height: 12pt !important }

/*Reduce vertical spacing in folder window */

  1. folderTree treechildren::-moz-tree-row {
  height: 11pt !important;
  min-height: 11pt !important;

}

/* Make folders with new unread mail red */ treechildren::-moz-tree-cell-text(folderNameCol, newMessages-true) {

 color: #FF0000 !important;
 font-weight: bold !important;

}

I am not sure of the impact of moz-tree-indentation, but the rest of it really worked to tighten up the folder display and the message display so that there is a lot more information shown and folders with new mail stand out nicely.

more options

Chosen Solution

Annoying ... all those number dot space instances are actually #

more options

To avoid display errors when posting code in this forum, surround the code with < pre > and < /pre > tags (without the spaces).

more options

Ah, yes, familiar with that from other forums ... but haven't posted much here.