Earlybird 29.0 - Restore White Pane in Compose Message

Discussion about official Mozilla Thunderbird builds
User avatar
L.A.R. Grizzly
Posts: 5396
Joined: March 15th, 2005, 5:32 pm
Location: Upstate Ohio, USA
Contact:

Earlybird 29.0 - Restore White Pane in Compose Message

Post by L.A.R. Grizzly »

After updating to Earlybird 29.0, I notice in the new message window that the white window for "To:" and "Subject:" now default to the background color until hovered over. Is there a way to get the old "white window" of older versions back? I have a shot of the mail window in SeaMonkey only as an example since I can't get a shot of how the TB window was before the update.

Earlybird:

Image

SeaMonkey:

Image
Win7 Pro SP1 64 Bit
Comodo Internet Security
Pale Moon 33.0.2, Epyrus Mail 2.1.2, Firefox 115.8.0esr, Thunderbird 115.8.1, and SeaMonkey 2.53.18
rsx11m
Moderator
Posts: 14404
Joined: May 3rd, 2007, 7:40 am
Location: US

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by rsx11m »

That's the result of #960672 as part of meta bug #867166 Update Composer UI. See the OSX-specific #867161 for motivation and discussion of this design change.

#msgIdentity and #msgSubject seem like good starting points for CSS tweaks. I don't know if a simple "background-color: -moz-field !important;" would suffice, but you can give it a try.
User avatar
L.A.R. Grizzly
Posts: 5396
Joined: March 15th, 2005, 5:32 pm
Location: Upstate Ohio, USA
Contact:

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by L.A.R. Grizzly »

rsx11m wrote:That's the result of #960672 as part of meta bug #867166 Update Composer UI. See the OSX-specific #867161 for motivation and discussion of this design change.

#msgIdentity and #msgSubject seem like good starting points for CSS tweaks. I don't know if a simple "background-color: -moz-field !important;" would suffice, but you can give it a try.


Thanks, rsx11m, for the heads-up! :wink: I'll give it a try.
Win7 Pro SP1 64 Bit
Comodo Internet Security
Pale Moon 33.0.2, Epyrus Mail 2.1.2, Firefox 115.8.0esr, Thunderbird 115.8.1, and SeaMonkey 2.53.18
Bozz
Posts: 2684
Joined: October 18th, 2007, 1:53 pm

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by Bozz »

Edit - See my post 6-17-14 below for an alternative display.

The codes below will give you the "white" background where you marked with the red X that you wanted. However, you will still see some space between the .textbox-addressingWidget and .dummy-row-cell:not(:first-child). It would take too much time to hack the previous default UI back in.

Code: Select all

/* ::::: addressing widget ::::: */

.textbox-addressingWidget,
.dummy-row-cell:not(:first-child) {
  background-color: -moz-field !important;
  transition: border .0s, background-color .0s !important;
}

@media not all and (-moz-windows-default-theme) {
  .textbox-addressingWidget,
  .dummy-row-cell:not(:first-child) {
    background-color: -moz-field !important;
    border: 2px solid transparent !important;
    -moz-border-top-colors: ThreeDShadow transparent !important;
    -moz-border-right-colors: ThreeDShadow transparent !important;
    -moz-border-bottom-colors: ThreeDShadow transparent !important;
    -moz-border-left-colors: ThreeDShadow transparent !important;
  }

  .textbox-addressingWidget:hover,
  .textbox-addressingWidget[focused="true"] {
    background-color: -moz-field;
    -moz-border-top-colors: ThreeDShadow transparent !important;
    -moz-border-right-colors: ThreeDShadow transparent !important;
    -moz-border-bottom-colors: ThreeDShadow transparent !important;
    -moz-border-left-colors: ThreeDShadow transparent !important;
  }
}

/* ::::: subject box ::::: */

#msgSubject {
  -moz-appearance: none;
  background-color: -moz-field !important;
  transition: border .0s, background-color .0s !important;
}

@media not all and (-moz-windows-default-theme) {
  #msgSubject {
    -moz-border-top-colors: ThreeDShadow transparent !important;
    -moz-border-right-colors: ThreeDShadow transparent !important;
    -moz-border-bottom-colors: ThreeDShadow transparent !important;
    -moz-border-left-colors: ThreeDShadow transparent !important;
  }

  #msgSubject:hover,
  #msgSubject[focused="true"] {
    background-color: -moz-field;
    -moz-border-top-colors: ThreeDShadow transparent !important;
    -moz-border-right-colors: ThreeDShadow transparent !important;
    -moz-border-bottom-colors: ThreeDShadow transparent !important;
    -moz-border-left-colors: ThreeDShadow transparent !important;
  }
}
Last edited by Bozz on June 17th, 2014, 6:36 am, edited 4 times in total.
User avatar
L.A.R. Grizzly
Posts: 5396
Joined: March 15th, 2005, 5:32 pm
Location: Upstate Ohio, USA
Contact:

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by L.A.R. Grizzly »

Bozz wrote:I've managed to hack my previous compose window back in. That wasn't fun at all. The biggest problems I had was the up/down margin and padding spacing. I use two lines and the spacing varies with using three lines so what I have in place in conjunction with the rest of the window would not work for public consumption.

The codes below will give you the "white" background where you marked with the red X that you wanted. However, you will still see some space between the .textbox-addressingWidget and .dummy-row-cell:not(:first-child). It would take too much time to hack the previous default UI back in.

Code: Select all

/* ::::: addressing widget ::::: */

.textbox-addressingWidget,
.dummy-row-cell:not(:first-child) {
  background-color: -moz-field !important;
  transition: border .0s, background-color .0s !important;
}

@media (-moz-windows-default-theme) {
  .textbox-addressingWidget,
  .dummy-row-cell:not(:first-child) {
    background-color: -moz-field !important;
    border: 1px solid transparent !important;
    border-top-color: ThreeDShadow !important;
    border-right-color: ThreeDShadow !important;
    border-bottom-color: ThreeDShadow !important;
    border-left-color: ThreeDShadow !important;
  }

  .textbox-addressingWidget:hover,
  .textbox-addressingWidget[focused="true"] {
    background-color: -moz-field;
    border-top-color: ThreeDShadow !important;
    border-right-color: ThreeDShadow !important;
    border-bottom-color: ThreeDShadow !important;
    border-left-color: ThreeDShadow !important;
  }
}

@media not all and (-moz-windows-default-theme) {
  .textbox-addressingWidget,
  .dummy-row-cell:not(:first-child) {
    background-color: -moz-field !important;
    border: 2px solid transparent !important;
    -moz-border-top-colors: ThreeDShadow transparent !important;
    -moz-border-right-colors: ThreeDShadow transparent !important;
    -moz-border-bottom-colors: ThreeDShadow transparent !important;
    -moz-border-left-colors: ThreeDShadow transparent !important;
  }

  .textbox-addressingWidget:hover,
  .textbox-addressingWidget[focused="true"] {
    background-color: -moz-field;
    -moz-border-top-colors: ThreeDShadow transparent !important;
    -moz-border-right-colors: ThreeDShadow transparent !important;
    -moz-border-bottom-colors: ThreeDShadow transparent !important;
    -moz-border-left-colors: ThreeDShadow transparent !important;
  }
}

/* ::::: subject box ::::: */

#msgSubject {
  background-color: -moz-field !important;
  transition: border .0s, background-color .0s !important;
}

@media (-moz-windows-default-theme) {
  #msgSubject {
    border-width: 1px;
    border-bottom-color: ThreeDShadow;
  }

  #msgSubject:hover,
  #msgSubject[focused="true"] {
    background-color: -moz-field;
    border-color: ThreeDShadow;
  }
}

@media not all and (-moz-windows-default-theme) {
  #msgSubject {
    -moz-border-top-colors: ThreeDShadow transparent !important;
    -moz-border-right-colors: ThreeDShadow transparent !important;
    -moz-border-bottom-colors: ThreeDShadow transparent !important;
    -moz-border-left-colors: ThreeDShadow transparent !important;
  }

  #msgSubject:hover,
  #msgSubject[focused="true"] {
    background-color: -moz-field;
    -moz-border-top-colors: ThreeDShadow transparent !important;
    -moz-border-right-colors: ThreeDShadow transparent !important;
    -moz-border-bottom-colors: ThreeDShadow transparent !important;
    -moz-border-left-colors: ThreeDShadow transparent !important;
  }
}


Thanks, thanks, thanks! I don't mind the little space between rows. This code works great. Kudos, Bozz! =D>
Win7 Pro SP1 64 Bit
Comodo Internet Security
Pale Moon 33.0.2, Epyrus Mail 2.1.2, Firefox 115.8.0esr, Thunderbird 115.8.1, and SeaMonkey 2.53.18
Bozz
Posts: 2684
Joined: October 18th, 2007, 1:53 pm

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by Bozz »

You're welcome.
Bozz
Posts: 2684
Joined: October 18th, 2007, 1:53 pm

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by Bozz »

Hi Grizz,
I was bored so I've been playing around with the new UI and came up with a little mix of Thunderbird v24 and the latest 33.0a1.

If you could test it please, I would appreciate it.

Image


Code: Select all

/* ::::: From: msgIdentity box ::::: */

#msgIdentity {
   background-color: -moz-Field !important;
   transition: border .0s, background-color .0s !important;
   border-radius: 2px !important;
}

@media not all and (-moz-windows-default-theme) {
   #msgIdentity {
     -moz-border-top-colors: ThreeDShadow ThreeDLightShadow !important;
     -moz-border-right-colors: ThreeDHighlight ThreeDLightShadow !important;
     -moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow !important;
     -moz-border-left-colors: ThreeDShadow ThreeDLightShadow !important;
  }

  #msgIdentity:hover,
  #msgIdentity[focused="true"] {
     background-color: -moz-Field !important;
     -moz-border-top-colors: ThreeDShadow ThreeDLightShadow !important;
     -moz-border-right-colors: ThreeDHighlight ThreeDLightShadow !important;
     -moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow !important;
     -moz-border-left-colors: ThreeDShadow ThreeDLightShadow !important;
  }
}


/* ::::: To, Cc, Bcc button ::::: */

@media not all and (-moz-windows-default-theme) {
  .aw-menulist {
     margin-top: 0px !important;
     -moz-margin-end: 4px !important;
     border-width: 2px !important;
     -moz-border-top-colors: ThreeDLightShadow ThreeDHighlight !important;
     -moz-border-right-colors: ThreeDDarkShadow ThreeDLightShadow !important;
     -moz-border-bottom-colors: ThreeDDarkShadow ThreeDLightShadow !important;
     -moz-border-left-colors: ThreeDLightShadow ThreeDHighlight !important;
     background-color: rgba(128, 128, 128, .15) !important;
     transition: background-color .05s ease-in !important;
     border-radius: 2px !important;
  }

  .aw-menulist:hover {
     background-color: rgba(128, 128, 128, .3) !important;
  }

  .aw-menulist[open="true"] {
     background-color: rgba(128, 128, 128, .05) !important;
  }

  .aw-menulist:-moz-window-inactive {
     opacity: .7 !important;
  }
}

.aw-menulist > .menulist-label-box {
   margin: 1px 0 -1px 0 !important;
}


/* ::::: addressing widget ::::: */

#textcol-addressingWidget {
   background-color: -moz-Field !important;
   border: 1px solid ThreeDShadow !important;
   border-radius: 2px !important;
}

.textbox-addressingWidget {
   margin-bottom: -5px !important;
   margin-bottom: -2px !important;
   transition: border .0s, background-color .0s !important;
}

.dummy-row-cell:not(:first-child) {
   margin-bottom: 0px !important;
}

@media not all and (-moz-windows-default-theme) {
  .textbox-addressingWidget {
     background-color: transparent !important;
     border: 2px solid transparent !important;
     -moz-border-top-colors: transparent transparent !important;
     -moz-border-right-colors: transparent transparent !important;
     -moz-border-bottom-colors: #CACAFF   transparent !important;
     -moz-border-left-colors: transparent transparent !important;
  }

  .dummy-row-cell:not(:first-child) {
     background-color: transparent !important;
     border: 2px solid transparent !important;
     -moz-border-top-colors: transparent transparent !important;
     -moz-border-right-colors: transparent transparent !important;
     -moz-border-bottom-colors: #CACAFF  transparent !important;
     -moz-border-left-colors: transparent transparent !important;
  }

  .textbox-addressingWidget:hover,
  .textbox-addressingWidget[focused="true"] {
     background-color: transparent !important;
     -moz-border-top-colors: transparent transparent !important;
     -moz-border-right-colors: transparent transparent !important;
     -moz-border-bottom-colors: #CACAFF   transparent !important;
     -moz-border-left-colors: transparent transparent !important;
  }
}


/* ::::: subject box ::::: */

#subject-box {
   margin-top: 1px !important;
}

#msgSubject {
   background-color: -moz-Field !important;
   transition: border .0s, background-color .0s !important;
   border-radius: 2px !important;
}

@media not all and (-moz-windows-default-theme) {
  #msgSubject {
     -moz-border-top-colors: ThreeDShadow ThreeDLightShadow !important;
     -moz-border-right-colors: ThreeDHighlight ThreeDLightShadow !important;
     -moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow !important;
     -moz-border-left-colors: ThreeDShadow ThreeDLightShadow !important;
  }

  #msgSubject:hover,
  #msgSubject[focused="true"] {
     background-color: -moz-Field !important;
     -moz-border-top-colors: ThreeDShadow ThreeDLightShadow !important;
     -moz-border-right-colors: ThreeDHighlight ThreeDLightShadow !important;
     -moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow !important;
     -moz-border-left-colors: ThreeDShadow ThreeDLightShadow !important;
  }
}
User avatar
L.A.R. Grizzly
Posts: 5396
Joined: March 15th, 2005, 5:32 pm
Location: Upstate Ohio, USA
Contact:

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by L.A.R. Grizzly »

Bozz wrote:Hi Grizz,

I was bored so I've been playing around with the new UI and came up with a little mix of Thunderbird v24 and the latest 33.0a1.

If you could test it please, I would appreciate it.


Hi Bozz,

Here's how it looks on my system with TB 29.0:

Image

Thanks!
Win7 Pro SP1 64 Bit
Comodo Internet Security
Pale Moon 33.0.2, Epyrus Mail 2.1.2, Firefox 115.8.0esr, Thunderbird 115.8.1, and SeaMonkey 2.53.18
Bozz
Posts: 2684
Joined: October 18th, 2007, 1:53 pm

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by Bozz »

You're welcome.

I can see the bottom dummy row border and a couple of other alignments that are not quite the same as my setup in your screen shot. I guess it's the theme and/or font sizes your using making a difference. I have no idea how to adjust the codes to compensate.

It is a hack job so it looks like it won't be just right for everyone. Sorry 'bout that. :|
User avatar
L.A.R. Grizzly
Posts: 5396
Joined: March 15th, 2005, 5:32 pm
Location: Upstate Ohio, USA
Contact:

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by L.A.R. Grizzly »

Bozz wrote:You're welcome.

I can see the bottom dummy row border and a couple of other alignments that are not quite the same as my setup in your screen shot. I guess it's the theme and/or font sizes your using making a difference. I have no idea how to adjust the codes to compensate.

It is a hack job so it looks like it won't be just right for everyone. Sorry 'bout that. :|


Strange, but after opening the mail window again, the dummy row has re-aligned itself:

Image

Everything looks fine to me. Maybe the other differences you notice are due to our Windows Themes and/or screen resolutions (as well as font choices).
Win7 Pro SP1 64 Bit
Comodo Internet Security
Pale Moon 33.0.2, Epyrus Mail 2.1.2, Firefox 115.8.0esr, Thunderbird 115.8.1, and SeaMonkey 2.53.18
Bozz
Posts: 2684
Joined: October 18th, 2007, 1:53 pm

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by Bozz »

Yeah, the border is better now. The other spot was the To: in the selector looks a little low but that looks like theme or font size doing that. If it's good enough for you, I'm satisified.
User avatar
L.A.R. Grizzly
Posts: 5396
Joined: March 15th, 2005, 5:32 pm
Location: Upstate Ohio, USA
Contact:

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by L.A.R. Grizzly »

Bozz wrote:Yeah, the border is better now. The other spot was the To: in the selector looks a little low but that looks like theme or font size doing that. If it's good enough for you, I'm satisified.


I disabled your code and the "To:" is still a little low with the default window. It may be my fonts. I'm using the default fonts that TB uses. I haven't changed any. I'm not fussy. If you hadn't pointed it out, I would never have noticed. Good job! =D>
Last edited by L.A.R. Grizzly on September 3rd, 2014, 9:35 am, edited 1 time in total.
Win7 Pro SP1 64 Bit
Comodo Internet Security
Pale Moon 33.0.2, Epyrus Mail 2.1.2, Firefox 115.8.0esr, Thunderbird 115.8.1, and SeaMonkey 2.53.18
Bozz
Posts: 2684
Joined: October 18th, 2007, 1:53 pm

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by Bozz »

Good enough. At least I know now that it's more of a system thing and not so much the codes.

later
plittlefield
Posts: 4
Joined: July 25th, 2014, 7:16 am

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by plittlefield »

Alas, this does not work for me.

I have created a file UserChrome.css in my TB 31 profile folder, pasted the code from the post above and restarted TB.

It still shows the grey text boxes in the Compose window.

Paully
rsx11m
Moderator
Posts: 14404
Joined: May 3rd, 2007, 7:40 am
Location: US

Re: Earlybird 29.0 - Restore White Pane in Compose Message

Post by rsx11m »

If it doesn't show any effect at all, it may be at the wrong location or the spelling may be wrong. On Linux, this should be located at ~/.thunderbird/random.default/chrome/userChrome.css (also watch for correct capitalization of the file name).
plittlefield wrote:I have created a file UserChrome.css in my TB 31 profile folder

Another problem may be a typo somewhere when copy-pasting the code. In Tools > Error Console, do you see any warnings or errors pointing to the userChrome.css file?
Post Reply