This morning, TB wants me to update from 115.13 to 128.0. The last time I looked at any version around that number, they had screwed up the mail-list Cards View, and it had an extra, wasted line just for the star.
Could one of you who has 128 or above please do me the favor of opening your Inbox so that it shows all of your current mail, and changing from Table View to Cards View, to see whether Cards View is still three lines deep, not just the two lines of 115.13?
Could one of you who has 128 or above please do me the favor of opening your Inbox so that it shows all of your current mail, and changing from Table View to Cards View, to see whether Cards View is still three lines deep, not just the two lines of 115.13?
I'm on 128.0.1esr, I don't use Cards View, but switched to check it out and my messages were 2 lines.
Could see no settings to change the number of lines.
Me, too. I have no complaints about 115.13, but 128.0 just breaks the hell out of my (highly customised with userChrome.css) 115, and I can't permit that. I'll try again down the road, and maybe I'll be forced to switch from Cards View back to Table View for my message lists, but for now, I'm standing good on 115.13.
@laforgeotte jfi:, as far as I know the dafault folder names are hard coded so there is no way to change them. However, with some css rules, in my limited tests, it seems to be possible to change them to a certain degree.
But first a word of caution. I tested the name changes on my some of my live emails I have absolutely no idea if altering the folder names using the following css has any consequences, so proceed with the usual caution & backup procedures before trying it! Also, it may not be a workable solution if you make use of "Unified Folders" display, as all sub-folders within a particular Unified folder group like say Inbox will have the same name (so it will be hard to distinguish between individual accounts.
Code:
/* Experimental - change name of Inbox to say In-Tray */
/* make the name part hidden, and then give it new content and make visible again*/
#folderTree li[data-folder-type="inbox"] > .container .name {
visibility: hidden !important;
}
#folderTree li[data-folder-type="inbox"] > .container .name::before {
content: "In-Tray" !important;
visibility: initial !important;
}
I hope it works in principle at least.
You can change the generic names of folders like "drafts", "outbox", "trash", "templates", "sent" (all lowercase) etc., similarly, using matching pairs of the above CSS rules-the names seem to be those shown in the Thunderbird GUI, otherwise look for 'data-folder-type="xyz"' using either the BrowserToolbox inspector, or, search at about3Pane.css - mozsearch
Inbox folder changed to In-Tray and Drafts changed to Drafting.
Note the names of all In-Tray folders shown under "Unified Foders" at the top where you would see individual account names cf. "All Folders" display where names show correctly. Thunderbird Nebula 128.0.1esr.
@Wisewiz, jfi:
I attempted removing that 3rd line completely, or condensing it and fitting it to the right hand side of the 2nd line. However, I had to abandon the attempt completely, after I found that reducing the height of the Cards using userChrome.css broke the scroll action in an odd way.
Apparently in Thunderbird, the Cards need to have a fixed height (set according to the "Density" setting), so eg. either clicking or using the arrow key on a particular Card, the Focussed/Active Card can be scrolled by the pre-calculated height within the Pane.
As such, I found that by using userChrome.css to reduce the heights, clicking on a Card would focus it OK but it might not be visible 'right' under the mouse position as expected in the Messages Pane. This was really noticeable if I was somewhere in the middle of the Pane as the clicked Card could have moved completely out of view.
Possible explanation in this bug report - (WONTFIX)
RESOLVED (nobody) in Thunderbird - Folder and Message Lists. Last updated 2023-09-05.
bugzilla.mozilla.org
"...... The tree items need to have a fixed height because that's needed for the scrolling virtualization.
If you change it, everything breaks. ......
Resolution: WONTFIX "
However, it may be a possibility through an Add-on which can use javascript to perform such calculation.
Me, too. I have no complaints about 115.13, but 128.0 just breaks the hell out of my (highly customised with userChrome.css) 115, and I can't permit that. I'll try again down the road, and maybe I'll be forced to switch from Cards View back to Table View for my message lists, but for now, I'm standing good on 115.13.
115.13 is an ESR I am on 127 which is not and I plan on staying on it. It functions like I want it to. I had some issues getting all of my folders back from 115.13 esr but I did.
Hooolp! In 129 beta, with my old CSS applied, the selected message in the Inbox is white-on-white (unreadable) and the hovered-on message in any folder is white-on-white. I can't believe they set it this way, so it must be in my userChrome.css file somewhere. Can you tell me what to edit?
@laforgeotte jfi:, as far as I know the dafault folder names are hard coded so there is no way to change them. However, with some css rules, in my limited tests, it seems to be possible to change them to a certain degree.
But first a word of caution. I tested the name changes on my some of my live emails I have absolutely no idea if altering the folder names using the following css has any consequences, so proceed with the usual caution & backup procedures before trying it! Also, it may not be a workable solution if you make use of "Unified Folders" display, as all sub-folders within a particular Unified folder group like say Inbox will have the same name (so it will be hard to distinguish between individual accounts.
Code:
/* Experimental - change name of Inbox to say In-Tray */
/* make the name part hidden, and then give it new content and make visible again*/
#folderTree li[data-folder-type="inbox"] > .container .name {
visibility: hidden !important;
}
#folderTree li[data-folder-type="inbox"] > .container .name::before {
content: "In-Tray" !important;
visibility: initial !important;
}
I hope it works in principle at least.
You can change the generic names of folders like "drafts", "outbox", "trash", "templates", "sent" (all lowercase) etc., similarly, using matching pairs of the above CSS rules-the names seem to be those shown in the Thunderbird GUI, otherwise look for 'data-folder-type="xyz"' using either the BrowserToolbox inspector, or, search at about3Pane.css - mozsearch
Inbox folder changed to In-Tray and Drafts changed to Drafting.
Note the names of all In-Tray folders shown under "Unified Foders" at the top where you would see individual account names cf. "All Folders" display where names show correctly. Thunderbird Nebula 128.0.1esr. View attachment 102729
@Wisewiz, jfi:
I attempted removing that 3rd line completely, or condensing it and fitting it to the right hand side of the 2nd line. However, I had to abandon the attempt completely, after I found that reducing the height of the Cards using userChrome.css broke the scroll action in an odd way.
Apparently in Thunderbird, the Cards need to have a fixed height (set according to the "Density" setting), so eg. either clicking or using the arrow key on a particular Card, the Focussed/Active Card can be scrolled by the pre-calculated height within the Pane.
As such, I found that by using userChrome.css to reduce the heights, clicking on a Card would focus it OK but it might not be visible 'right' under the mouse position as expected in the Messages Pane. This was really noticeable if I was somewhere in the middle of the Pane as the clicked Card could have moved completely out of view.
Possible explanation in this bug report - (WONTFIX)
RESOLVED (nobody) in Thunderbird - Folder and Message Lists. Last updated 2023-09-05.
bugzilla.mozilla.org
"...... The tree items need to have a fixed height because that's needed for the scrolling virtualization.
If you change it, everything breaks. ......
Resolution: WONTFIX "
However, it may be a possibility through an Add-on which can use javascript to perform such calculation.
Thanks for your help.
I am really just wanting to put numbers at the start of each folder name, e.g. 01Inbox, 02Trash etc.
Would that work as you suggest above?
/* Experimental - add numbers before default name of Inbox to say 01Inbox & Drafts to 02Drafts */
/* Insert extra text before a default folder eg inbox */
#folderTree li[data-folder-type="inbox"] > .container .name::before {
content: "01 \00a0" !important; /*use unicode \00a0 if you want a space between the number & the def. name as a space at end won't work*/
content: "01" !important; /*otherwise use this for no space*/
}
/* Insert extra text before a default folder eg drafts */
#folderTree li[data-folder-type="drafts"] > .container .name::before {
content: "02 \00a0" !important; /*use unicode \00a0 if you want a space between the number & the def. name as a space at end won't work*/
content: "02" !important; /*otherwise use this for no space*/
}
Note: I don't know of a method to increment such numbers. Plus, the same issue with Unified vs All Folders as illustrated.
129.0b6. I got it from PortableApps and extracted the working files, so I wouldn't have to install it. All of the other .css code seems to be working. The white-on-white is the only immediately obvious problem.
Also, in Cards, the background color for each message (dark for selected; light for hovered) is according to my scheme, but the real message information seems to be on a pasted-on label with rounded corners.
@Wisewiz, could you please give this a try (it is/was my wip so it has several deliberatley broken rules & I am unable to clean it up as I am still suffering from brain fog from some ongoing mysterious illness).
Perhaps you can clean it up. I was only able to get 129 beta 3 Portable, and I'll try to update it manually later if this does not work.
userChrome.css
Code:
/* folders list background - this is for the folder tree */
#folderPane {
background-color: #336699 !important;
color: white !important;
}
/* folders list HOVER color */
/* can change the background-color value to ay particular value */
#folderTree li > .container:hover {
background-color: #4080BF !important;
color: white !important;
}
/* folder selected color - make sure icons and twisty dont get washed out */
#folderTree li.selected > .container {
background-color: #29116e !important;
color: white !important;
}
#folderTree li[data-server-type] > .container > .icon {
--icon-color: white !important;
}
/* TABLE Message Pane - Hover Message background/foreground-color */
#threadPane [is="tree-view-table-body"] :hover {
background-color: #4080BF !important;
color: white !important;
}
/* TABLE Message Pane - Selected Message background/foreground-color */
#threadPane [is="tree-view-table-body"] >.selected {
background-color: #29116e !important;
color: white !important;
}
/* CARD Message Hover area """around""" the message */
#threadPane tr[is="thread-card"] :hover {
background-color: white !important;
}
/* CARD message HOVER */
#threadPane [is="thread-card"] td :hover {
background-color: #4080BF !important;
color: white !important;
}
/* CARD SELECTED message */
/*#threadPane tr[is="thread-card"] .selected {
background-color: #33619e !important;
color: white !important;
}*/
/* SELECTED MESSAGE CARD - the area around the MESSAGE */
#threadPane [is="thread-card"].selected {
background-color: inherit !important;
color: initial !important;
}
/* SELECTED CARD message itself */
#threadPane [is="thread-card"].selected .card-container {
background-color: #29116e !important;
color: white !important;
}
/* \/ SELECTED CARD message itself HOVER ===================*/
#threadPane [is="thread-card"].selected:hover div {
background-color: #4080BF !important;
color: white !important;
}
#threadPane [is="thread-card"].selected:hover div span {
background-color: #4080bf !important;
}
/* /\ SELECTED CARD message itself HOVER ===================*/
/* \/NOT SELECTED CARD message itself HOVER ===================*/
#threadPane [is="thread-card"]:not(.selected):hover div {
background-color: #4080BF !important;
color: white !important;
}
#threadPane [is="thread-card"]:not(.selected):hover div span {
background-color: #4080bf !important;
}
/* /\ NOT SELECTED CARD message itself HOVER ===================*/
/* default CARD messages */
#threadPane [is="thread-card"] .card-container {
border: 1px solid #336999 !important;
b order-radius: 3px !important;
o utline: 1px solid orange !important;
background-color: aliceblue !important;
}
#folderTree li[data-folder-type="outbox"] { display: N one !important; }
#unifiedToolbar {
height: 24px !important;
padding-block: 1px !important;
margin-block: 0px !important;
background: #29116e !important;
color: white !important;
}
#unifiedToolbar .button:is(.toolbar-button, .unified-toolbar-button):hover {
padding-block: 1px !important;
background: white !important; /* color of background */
color: #29116e !important; /* color of text/icons */
}
toolbar#toolbar-menubar {
Order: -1 !important;
background-color: #336699 !important; /* Color of menu bar */
color: white !important; /* Color of the text - if needed */
height: 24px !important;
padding-top: 0px !important;
padding-bottom: 0px !important;
margin: 0px !important;
}
/* Menu Bar captions - the hover effect */
/* Change the background / foreground to match what you require */
menubar > menu:hover {
background-color: #29116e !important;
color: white !important;
}
/* Separtor Lines between messages in Cards View and Table View */
/* table[is="tree-view-table"],
table[is="thread-card-table"] {
border-collapse: collapse !important;
}
tr[is="thread-row"],
tr[is="thread-card"] {
border-bottom: 2px solid black !important;
} */
/* USE Separtor Lines between messages in Table View ONLY as cards are already outlined in new tbird*/
table[is="tree-view-table"] {
border-collapse: collapse !important;
}
tr[is="thread-row"] {
border-bottom: 2px solid black !important;
}
toolbar#tabs-toolbar {
background-color: #336699 !important;
color: white !important;
height: fit-content !important;
max-height: 24px !important;
padding-top: 3px !important;
padding-bottom: 3px !important;
align-items: center !important;
}
#tabs-toolbar:not([brighttext]) button.tab-close-button:hover {
background-color: #29116e !important;
color: White !important;
}
/* Whole Header Box with From & To Subject Cc etc. b-ground & text */
#MsgHeadersToolbar {
background-color: #336699 !important;
height: min-content !important;
color: White !important;
padding-block: 0px !important;
}
/* The To: email addresses */
#MsgHeadersToolbar .address-pill {
background-color: #336699 !important;
color: White !important;
height: 23px !important;
}
/* The To: address "input" box (ie with cursor) */
#MsgHeadersToolbar .recipients-container input {
border-radius: 3px !important;
color: white !important;
background-color: #336699 !important;
padding-inline: 2px !important;
}
/* The To: address "container" */
#MsgHeadersToolbar .recipients-container .address-container {
background-color: white !important;
border-color: white !important;
border-width: 0px !important;
border-radius: 2px !important;
padding-left: 2px !important;
padding-right: 1px !important;
}
/* The From: address box */
#msgIdentity {
background-color: #336699 !important;
color: White !important;
border-color: White !important;
border: 3px groove !important;
}
/* Contacts - Side panel */
#abContactsPanel,
#contactsSidebar .sidebar-header {
background-color: #336699 !important;
color: white !important;
}
/* Write window Contacts - Hover color. */
#abResultsTree > treechildren::-moz-tree-row(hover) {
background-color: #4080BF !important;
}
/* Write window Contacts - Selected color. */
/* note: use a light color here (when using the default */
/* System theme, the text color will be white when selected */
/* & black when focus moves away from Contacts List). */
/* - can't find a way to change text color. */
#abResultsTree > treechildren::-moz-tree-row(selected) {
background-color: #29116e !important;
color: white !important;
outline: none !important;
}
/* The whole of From To Subject Cc etc toolbar */
#compose-toolbox toolbar {
background-color: #29116e !important;
height: min-content !important;
padding-block: 0px !important;
margin-block: 0px !important;
color: white !important;
}
/* to do */
#compose-toolbox > menubar menu {
color: lightgray !important;
}
#compose-toolbox menubar menu:hover {
background-color: #336699 !important;
color: lightgray !important;
}
/* Format toolbar */
#FormatToolbox,
#FormatToolbar > menulist {
background-color: #29116e !important;
color: white !important;
}
/* folder pane icons were white ??? */
#folderPaneHeaderBar:not([hidden]) {
color: initial !important;
}
/* wip*/
