Theme UI issues on PM 28

Anything about browser themes, both Full Themes and Lightweight Themes (personas) should go here.

Moderators: satrow, FranklinDM, Lootyhoof

User avatar
Utnapishtim
Hobby Astronomer
Hobby Astronomer
Posts: 22
Joined: Thu, 12 Jul 2018, 02:42

Theme UI issues on PM 28

Unread postby Utnapishtim » Thu, 23 Aug 2018, 03:46

Since updating to PM 28 I'm having two UI issues with themes

  • There's a very thin black line between the tab bar and the bookmarks toolbar above it

  • The find bar is not themed

Goodydino
Lunatic
Lunatic
Posts: 348
Joined: Tue, 10 Oct 2017, 21:20

Re: Theme UI issues on PM 28

Unread postby Goodydino » Mon, 27 Aug 2018, 23:34

For the findbar, I had to add a couple of settings to global/findbar.css. In the element "findbar", I had to add a background colour and a text colour. It fixed that for my theme, so it should fix it for other themes as well.

unknownone
Moongazer
Moongazer
Posts: 12
Joined: Wed, 29 Mar 2017, 00:15

Re: Theme UI issues on PM 28

Unread postby unknownone » Fri, 31 Aug 2018, 07:49

This issue is discussed also in this topic https://forum.palemoon.org/viewtopic.php?f=3&t=19930

spline
Hobby Astronomer
Hobby Astronomer
Posts: 17
Joined: Thu, 07 Nov 2013, 16:29
Location: Canada

Re: Theme UI issues on PM 28

Unread postby spline » Thu, 06 Sep 2018, 10:28

Goodydino wrote:For the findbar, I had to add a couple of settings to global/findbar.css. In the element "findbar", I had to add a background colour and a text colour. It fixed that for my theme, so it should fix it for other themes as well.


Can you post specifically/exactly what you added? Having trouble getting my old theme to work with the findbar now...

User avatar
Lootyhoof
Themeist
Themeist
Posts: 1127
Joined: Thu, 09 Feb 2012, 23:35
Location: United Kingdom

Re: Theme UI issues on PM 28

Unread postby Lootyhoof » Thu, 06 Sep 2018, 12:49

To clear up some confusion here: the OP is referring to lightweight themes (personas), not the complete themes like are on https://addons.palemoon.org/themes/.

@OP: The issue you describe was filed in Issue #713 (UXP).

Off-topic:
spline wrote:
Goodydino wrote:For the findbar, I had to add a couple of settings to global/findbar.css. In the element "findbar", I had to add a background colour and a text colour. It fixed that for my theme, so it should fix it for other themes as well.


Can you post specifically/exactly what you added? Having trouble getting my old theme to work with the findbar now...

I would suggest checking the Complete Theme Changes for Pale Moon wiki page. This provides detailed information on what changed per Pale Moon version.
Last edited by Lootyhoof on Thu, 06 Sep 2018, 12:54, edited 1 time in total.

User avatar
Utnapishtim
Hobby Astronomer
Hobby Astronomer
Posts: 22
Joined: Thu, 12 Jul 2018, 02:42

Re: Theme UI issues on PM 28

Unread postby Utnapishtim » Fri, 07 Sep 2018, 02:27

Lootyhoof wrote:To clear up some confusion here: the OP is referring to lightweight themes (personas), not the complete themes like are on https://addons.palemoon.org/themes/.

@OP: The issue you describe was filed in Issue #713 (UXP).

Off-topic:
spline wrote:
Goodydino wrote:For the findbar, I had to add a couple of settings to global/findbar.css. In the element "findbar", I had to add a background colour and a text colour. It fixed that for my theme, so it should fix it for other themes as well.


Can you post specifically/exactly what you added? Having trouble getting my old theme to work with the findbar now...

I would suggest checking the Complete Theme Changes for Pale Moon wiki page. This provides detailed information on what changed per Pale Moon version.


Where is this findbar.css located? I'd like to change this so that I can finally upgrade from PM27.9.4. The gray find bar looks incredibly ugly on my colorful theme.

User avatar
Lootyhoof
Themeist
Themeist
Posts: 1127
Joined: Thu, 09 Feb 2012, 23:35
Location: United Kingdom

Re: Theme UI issues on PM 28

Unread postby Lootyhoof » Fri, 07 Sep 2018, 06:02

It's not possible to apply a lightweight theme to the findbar anymore, since it is now per-tab and not part of the main window.

User avatar
Utnapishtim
Hobby Astronomer
Hobby Astronomer
Posts: 22
Joined: Thu, 12 Jul 2018, 02:42

Re: Theme UI issues on PM 28

Unread postby Utnapishtim » Fri, 07 Sep 2018, 18:15

Lootyhoof wrote:It's not possible to apply a lightweight theme to the findbar anymore, since it is now per-tab and not part of the main window.


That blows :thumbdown: Is it possible to make my theme not lightweight then? Would that fix this?

Goodydino
Lunatic
Lunatic
Posts: 348
Joined: Tue, 10 Oct 2017, 21:20

Re: Theme UI issues on PM 28

Unread postby Goodydino » Fri, 07 Sep 2018, 23:37

You can edit a theme to make the findbar any colour you like. In global > findbar.css, edit the item called "findbar".

Code: Select all

findbar {
  -moz-appearance: none !important;
  background: black;
  color: #FFBB44;
<etc.>
}
Last edited by Goodydino on Fri, 07 Sep 2018, 23:41, edited 3 times in total.

User avatar
Utnapishtim
Hobby Astronomer
Hobby Astronomer
Posts: 22
Joined: Thu, 12 Jul 2018, 02:42

Re: Theme UI issues on PM 28

Unread postby Utnapishtim » Sat, 08 Sep 2018, 05:03

Goodydino wrote:You can edit a theme to make the findbar any colour you like. In global > findbar.css, edit the item called "findbar".

Code: Select all

findbar {
  -moz-appearance: none !important;
  background: black;
  color: #FFBB44;
<etc.>
}


I couldn't find any findbar.css on my system.

I've got this theme, FWIW.

Goodydino
Lunatic
Lunatic
Posts: 348
Joined: Tue, 10 Oct 2017, 21:20

Re: Theme UI issues on PM 28

Unread postby Goodydino » Sat, 08 Sep 2018, 19:54

You have to unarchive the .xpi installer file for the theme you are using and find it in the main global subdirectory. Once you have changed it, you save the archive and install it again.

User avatar
Utnapishtim
Hobby Astronomer
Hobby Astronomer
Posts: 22
Joined: Thu, 12 Jul 2018, 02:42

Re: Theme UI issues on PM 28

Unread postby Utnapishtim » Sat, 08 Sep 2018, 22:40

Goodydino wrote:You have to unarchive the .xpi installer file for the theme you are using and find it in the main global subdirectory. Once you have changed it, you save the archive and install it again.


Oh you mean in the theme. It's a lightweight theme, there doesn't seem to be an .xpi.

Looking at the install page, it seems all the data is in the Install button

Code: Select all

<button class="Button Button--action InstallButton-button Button--action Button--puffy" type="submit" data-browsertheme="{&quot;accentcolor&quot;:&quot;#111c2e&quot;,&quot;author&quot;:&quot;MaDonna&quot;,&quot;category&quot;:&quot;Nature&quot;,&quot;description&quot;:&quot;Theme Designed by MaD♥nna&quot;,&quot;detailURL&quot;:&quot;https://addons.mozilla.org/en-US/firefox/addon/sunrise_by_madonna/&quot;,&quot;footer&quot;:&quot;https://addons.cdn.mozilla.net/user-media/addons/710410/footer.png?modified=a5c8d287&quot;,&quot;footerURL&quot;:&quot;https://addons.cdn.mozilla.net/user-media/addons/710410/footer.png?modified=a5c8d287&quot;,&quot;header&quot;:&quot;https://addons.cdn.mozilla.net/user-media/addons/710410/header.png?modified=a5c8d287&quot;,&quot;headerURL&quot;:&quot;https://addons.cdn.mozilla.net/user-media/addons/710410/header.png?modified=a5c8d287&quot;,&quot;iconURL&quot;:&quot;https://addons.cdn.mozilla.net/user-media/addons/710410/icon.png?modified=a5c8d287&quot;,&quot;id&quot;:&quot;710410&quot;,&quot;name&quot;:&quot;SUNRISE  by MaDonna&quot;,&quot;previewURL&quot;:&quot;https://addons.cdn.mozilla.net/user-media/addons/710410/preview.png?modified=a5c8d287&quot;,&quot;textcolor&quot;:&quot;#c9e6ff&quot;,&quot;updateURL&quot;:&quot;https://versioncheck.addons.mozilla.org/en-US/themes/update-check/710410&quot;,&quot;version&quot;:&quot;1.0&quot;}"><span class="Icon Icon-plus"></span>Install Theme</button>


Looks like I'll have to figure out how to turn this into an .xpi

User avatar
FranklinDM
Add-ons Team
Add-ons Team
Posts: 146
Joined: Sat, 14 Jan 2017, 02:40
Location: Manila, Philippines
Contact:

Re: Theme UI issues on PM 28

Unread postby FranklinDM » Sat, 08 Sep 2018, 23:46

You can add the piece of code that Goodydino gave using Stylem (and add a new user style) or by adding it to your userChrome.css file.
Last edited by FranklinDM on Sat, 08 Sep 2018, 23:49, edited 1 time in total.

User avatar
Utnapishtim
Hobby Astronomer
Hobby Astronomer
Posts: 22
Joined: Thu, 12 Jul 2018, 02:42

Re: Theme UI issues on PM 28

Unread postby Utnapishtim » Sun, 09 Sep 2018, 19:29

FranklinDM wrote:You can add the piece of code that Goodydino gave using Stylem (and add a new user style) or by adding it to your userChrome.css file.


Nice, thanks :) needed some tinkering (apparently background-image doesn't work without background??), but works! Unfortunately, for my theme on the other PC I'll have to crop the footer image to get the find bar edge to line up with status bar. What an annoying idea, per-tab findbar...

User avatar
Utnapishtim
Hobby Astronomer
Hobby Astronomer
Posts: 22
Joined: Thu, 12 Jul 2018, 02:42

Re: Theme UI issues on PM 28

Unread postby Utnapishtim » Mon, 10 Sep 2018, 20:08

Coming back to this, anyone got advice for this problem?

Utnapishtim wrote:
  • There's a very thin black line between the tab bar and the bookmarks toolbar above it

User avatar
FranklinDM
Add-ons Team
Add-ons Team
Posts: 146
Joined: Sat, 14 Jan 2017, 02:40
Location: Manila, Philippines
Contact:

Re: Theme UI issues on PM 28

Unread postby FranklinDM » Mon, 10 Sep 2018, 22:35

This was fixed 27 days ago in trunk but there's a workaround that you can include in your userChrome.css or by creating a new user style with the following:

Code: Select all

menubar:-moz-lwtheme,
toolbox:-moz-lwtheme,
toolbar:-moz-lwtheme {
  border-style: none;
}

Remove this when a stable version containing the fix gets released.

User avatar
Utnapishtim
Hobby Astronomer
Hobby Astronomer
Posts: 22
Joined: Thu, 12 Jul 2018, 02:42

Re: Theme UI issues on PM 28

Unread postby Utnapishtim » Mon, 10 Sep 2018, 23:56

Thanks. Hope the fix gets pushed out soon.

User avatar
Utnapishtim
Hobby Astronomer
Hobby Astronomer
Posts: 22
Joined: Thu, 12 Jul 2018, 02:42

Re: Theme UI issues on PM 28

Unread postby Utnapishtim » Tue, 11 Sep 2018, 05:41

Actually, it doesn't seem that this does anything. I've just noticed that the black line only shows up when the window is maximized in PM28.0.1.

I've applied the fix in userChrome.css, and later in Stylem as well and no combination of fixes changes the fact that the line shows in maximized windows and doesn't show in non-maximized ones.

User avatar
loxodont
Lunatic
Lunatic
Posts: 410
Joined: Sat, 26 Jul 2014, 23:03
Location: Mare Serenitatis

Re: Theme UI issues on PM 28

Unread postby loxodont » Wed, 12 Sep 2018, 11:40

FranklinDM wrote:This was fixed 27 days ago in trunk but there's a workaround that you can include in your userChrome.css or by creating a new user style with the following:
...
Remove this when a stable version containing the fix gets released.


thanks FranklinDM,
I added these lines to Stylem add-on in Pale Moon 28.0.1 portable x86 and the black lines have been zapped. :)

User avatar
Utnapishtim
Hobby Astronomer
Hobby Astronomer
Posts: 22
Joined: Thu, 12 Jul 2018, 02:42

Re: Theme UI issues on PM 28

Unread postby Utnapishtim » Fri, 21 Sep 2018, 21:21

Pale Moon 28.1.0 release notes wrote:Changed the find bar to be a browser-global toolbar again (like in Pale Moon 27) instead of per-tab. For people who prefer search terms to be saved on a per-tab basis (like with the per-tab findbar previously), this is possible by setting findbar.termPerTab to true. This resolves a number of issues, including styling with lightweight themes not applying to the find bar, and status pop-ups overlapping the find bar.


Thanks!!! :thumbup:


Return to “Themes”

Who is online

Users browsing this forum: No registered users and 2 guests