[Pre-Release] Photonic

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

Moderators: satrow, Lootyhoof, FranklinDM

User avatar
Lootyhoof
Themeist
Themeist
Posts: 1238
Joined: 2012-02-09, 23:35
Location: United Kingdom

[Pre-Release] Photonic

Unread post by Lootyhoof » 2019-01-26, 01:39

For the past few months (in between other theme updates) I've been experimenting with porting the Firefox 57+ (Quantum) default theme, "Photon", to Pale Moon. It's been slow but productive (as I find time generally), and I've finally something I can show for it. However, before I publish on the Add-ons Site I'd like to get a beta out to people, to see if this is the quality I'd like it to be - I've tested this pretty extensively, but a few more people with their own workflows would definitely be useful here. :) Think of it as an early access.

You can grab it here: https://github.com/Lootyhoof/photonic/r ... g/v1.0.0b5

Some screenshots, for those curious:

Add-ons Manager, using Firefox 66 styling:
Image
"Small icons" mode in this theme tries to emulate the "compact" mode of Firefox, too:
Image
As most icons are using SVG now, users on HiDPI screens should find this a joy to use:
Image
In true Pale Moon style, it also has tabs-on-bottom covered. ;)
Image
Windows 7 looks as it does in Firefox too, largely:
Image
On Linux especially, dark GTK theme users should find this blends quite well (plus, Photon-themed notification bars):
Image
But even light GTK theme users on Linux should find this looks great all the same:
Image
Mac users aren't forgotten either!
Image
Hope you enjoy it. :) I'll get this on the Add-ons Site soon provided there are no major issues with this version.

I also made some userstyles for it (for use with userChrome.css or Stylem):

Windows 7 transparent tabs
"Toolbarize Menu Button" integration
Use classic loading throbber

User avatar
mrnhmath
Moonbather
Moonbather
Posts: 53
Joined: 2017-06-21, 02:37

Re: [Pre-Release] Photonic

Unread post by mrnhmath » 2019-01-26, 15:38

The only issues I've found so far:

- The Back icon looks misaligned in its surrounding circle.
A.png
A.png (3.6 KiB) Viewed 1350 times
- Combined Stop/Reload/Go button loses styling when merged on the location bar, which in turn gets taller.
B.png
B.png (3.43 KiB) Viewed 1350 times
- When the identity box's padlock is set to be hidden, the hover state doesn't fill its background
C.png
C.png (2.69 KiB) Viewed 1339 times
- Quickdial uses Australium styling

These are not exclusive to Linux and the Breeze-Dark gtk2 theme AFAICT.

User avatar
Lootyhoof
Themeist
Themeist
Posts: 1238
Joined: 2012-02-09, 23:35
Location: United Kingdom

Re: [Pre-Release] Photonic

Unread post by Lootyhoof » 2019-01-28, 22:30

mrnhmath wrote:The only issues I've found so far:

- The Back icon looks misaligned in its surrounding circle. A.png

- Combined Stop/Reload/Go button loses styling when merged on the location bar, which in turn gets taller. B.png

- When the identity box's padlock is set to be hidden, the hover state doesn't fill its background C.png

- Quickdial uses Australium styling

These are not exclusive to Linux and the Breeze-Dark gtk2 theme AFAICT.
Thanks for the reports! These should now be resolved, and I've pushed the latest beta:

https://github.com/Lootyhoof/photonic/r ... g/v1.0.0b2

Please let me know what you think.

User avatar
mrnhmath
Moonbather
Moonbather
Posts: 53
Joined: 2017-06-21, 02:37

Re: [Pre-Release] Photonic

Unread post by mrnhmath » 2019-01-29, 00:06

Lootyhoof wrote:
mrnhmath wrote:The only issues I've found so far:

- The Back icon looks misaligned in its surrounding circle. A.png

- Combined Stop/Reload/Go button loses styling when merged on the location bar, which in turn gets taller. B.png

- When the identity box's padlock is set to be hidden, the hover state doesn't fill its background C.png

- Quickdial uses Australium styling

These are not exclusive to Linux and the Breeze-Dark gtk2 theme AFAICT.
Thanks for the reports! These should now be resolved, and I've pushed the latest beta:

https://github.com/Lootyhoof/photonic/r ... g/v1.0.0b2

Please let me know what you think.
Thank YOU for being such an force in theming :) I have some new reports, this time on Windows 7:

- The circle background of the Back button should always be brighter than the toolbar background.
Capturar.PNG
Capturar.PNG (7.1 KiB) Viewed 1234 times
Capturar2.PNG
Capturar2.PNG (7.57 KiB) Viewed 1234 times
- Pinned site icon looks weird.
Capturar3.PNG
Capturar3.PNG (11.67 KiB) Viewed 1234 times
- When a new window is opened, the first tab looks cut off.
Capturar4.PNG
Capturar4.PNG (17.92 KiB) Viewed 1234 times
- Toolbar and urlbar icons are a bit darker than Firefox.
Capturar5.PNG
Capturar5.PNG (1.89 KiB) Viewed 1234 times
Capturar6.PNG
Capturar6.PNG (1.58 KiB) Viewed 1234 times
Quickdial could use a Photon icon for the search bar's Go button and less padding on site labels, but that's just my opinion.

User avatar
Lootyhoof
Themeist
Themeist
Posts: 1238
Joined: 2012-02-09, 23:35
Location: United Kingdom

Re: [Pre-Release] Photonic

Unread post by Lootyhoof » 2019-01-31, 22:20

mrnhmath wrote:I have some new reports, this time on Windows 7
Try the latest beta: https://github.com/Lootyhoof/photonic/r ... g/v1.0.0b3
mrnhmath wrote:- Pinned site icon looks weird. Capturar3.PNG
Not sure how..? It's exactly the same icon used in Firefox - albeit slightly darker for clarity's sake on the lighter background.

Image

mrnhmath wrote:Quickdial could use a Photon icon for the search bar's Go button
Not possible. That icon is actually the button itself; it's actually using the text character "▶". I can't change this.
mrnhmath wrote:less padding on site labels
Seems to be the same as how Firefox does it (I actually used the same padding). So I'm OK with the current styling.

Image

User avatar
adesh
Astronaut
Astronaut
Posts: 652
Joined: 2017-06-06, 07:38

Re: [Pre-Release] Photonic

Unread post by adesh » 2019-02-01, 14:44

Thank you Lootyhoof! It looks fantastic. Much better than the default theme on Mac.

EDIT: Minor things
* Preferences window doesnt't follow theme style, i.e fonts, colors etc are the default ones. I gues it applies to all other windows like Places, Bookmarks etc.
* I do not like "this" throbber. Earlier one which used to revolve was much better. Just my opinion, and I know it's just a copy of original, but change if you please.

User avatar
Lootyhoof
Themeist
Themeist
Posts: 1238
Joined: 2012-02-09, 23:35
Location: United Kingdom

Re: [Pre-Release] Photonic

Unread post by Lootyhoof » 2019-02-01, 17:31

adesh wrote:Preferences window doesnt't follow theme style, i.e fonts, colors etc are the default ones
Is there something you'd prefer it to look like? The Firefox equivalent? It's something I've been considering...
adesh wrote:I do not like "this" throbber.
There is no Firefox equivalent here but I decided to use the tab throbber since it's the closest match and does indicate progress in the same way.

User avatar
Isengrim
Keeps coming back
Keeps coming back
Posts: 804
Joined: 2015-09-08, 22:54
Location: 127.0.0.1
Contact:

Re: [Pre-Release] Photonic

Unread post by Isengrim » 2019-02-01, 18:18

I'm currently trying this out on my Win10 install. Overall it looks really good! :thumbup:

Two things:

1) I keep most of my add-on buttons in the bookmarks bar, and it looks like several of those icons are not using their proper resolutions.

2) Is there a reason the navigation and menu bars are a dark blue color when the window is active, instead of the gray that Firefox uses? I am using FF 60 ESR in the screenshot below, so that may have something to do with it.

Photonic Pale Moon:
Capture.png
Capture.png (20.06 KiB) Viewed 1037 times
Firefox:
Capture.png
Capture.png (5.11 KiB) Viewed 1037 times
Linux Mint 19.1 Cinnamon (64-bit), Windows 7 (64-bit), Windows 10 build 1803 (64-bit)
JavaScript is not Java
"As long as there is someone who will appreciate the work involved in the creation, the effort is time well spent." ~ Tetsuzou Kamadani, Cave Story

User avatar
adesh
Astronaut
Astronaut
Posts: 652
Joined: 2017-06-06, 07:38

Re: [Pre-Release] Photonic

Unread post by adesh » 2019-02-01, 18:23

Lootyhoof wrote:Is there something you'd prefer it to look like? The Firefox equivalent? It's something I've been considering...
I'd like it to have bigger, bolder fonts like in the address box and tab titles. Current (default theme) font is anemic and very dark, see screenshot.
Screenshot 2019-02-01 at 11.44.58 PM.png
Lootyhoof wrote:There is no Firefox equivalent here but I decided to use the tab throbber since it's the closest match and does indicate progress in the same way.
I like the old style circle-like tab loading indicator. The current one to-and-fro type is not easy on my eyes. It's just my preference and but looks like I'm not alone: https://www.reddit.com/r/FirefoxCSS/com ... irefox_57/

Also, bottom border on the tab bar is missing.

User avatar
Lootyhoof
Themeist
Themeist
Posts: 1238
Joined: 2012-02-09, 23:35
Location: United Kingdom

Re: [Pre-Release] Photonic

Unread post by Lootyhoof » 2019-02-01, 20:00

Isengrim wrote:Is there a reason the navigation and menu bars are a dark blue color when the window is active, instead of the gray that Firefox uses? I am using FF 60 ESR in the screenshot below, so that may have something to do with it.
On the "default" theme (not light or dark), even on 60 as far as I know it adds this background when there's no accent colour applied to the titlebars in Windows. See below, Nightly 67:
Image
adesh wrote:I like the old style circle-like tab loading indicator.
I'll put together a userstyle for this. :)

The other issues I will look into.

User avatar
Moonraker
Board Warrior
Board Warrior
Posts: 1001
Joined: 2015-09-30, 23:02
Location: Lincolnshire.UK.

Re: [Pre-Release] Photonic

Unread post by Moonraker » 2019-02-01, 22:45

Thank you lootyhoof this is a wonderful theme and looks marvellous here on my puppy linux system.Would it be incredibly cheeky to ask for a palemoon version of ft deepdark which is my preferred dark theme as i cannot find it anywhere..thank you again. :clap:
Xenial puppy linux 32-bit.
Pale moon 28.5.0.

User avatar
Lootyhoof
Themeist
Themeist
Posts: 1238
Joined: 2012-02-09, 23:35
Location: United Kingdom

Re: [Pre-Release] Photonic

Unread post by Lootyhoof » 2019-02-01, 23:27

Moonraker wrote:Would it be incredibly cheeky to ask for a palemoon version of ft deepdark
Not possible, the license forbids it. Only the original author could work on it, and when I asked them in the past they weren't keen on the idea.

José Labán
Apollo supporter
Apollo supporter
Posts: 45
Joined: 2014-10-13, 22:12
Location: Tenochtitlan

Re: [Pre-Release] Photonic

Unread post by José Labán » 2019-02-02, 02:12

In the Add-ons manager left list I get a scroll bar at the botton because the first entry barely fits, it seems. This look somewhat awful while hovering with the mouse. Is there something that can be done? This surely will affect some translations other than Spanish.
Image

snertev
Lunatic
Lunatic
Posts: 250
Joined: 2014-09-23, 14:54
Location: Europe

Re: [Pre-Release] Photonic

Unread post by snertev » 2019-02-02, 13:56

I'm testing this theme too and so far so good.

User avatar
Lootyhoof
Themeist
Themeist
Posts: 1238
Joined: 2012-02-09, 23:35
Location: United Kingdom

Re: [Pre-Release] Photonic

Unread post by Lootyhoof » 2019-02-02, 22:15

Thanks for the feedback! Beta 4 is now out:

https://github.com/Lootyhoof/photonic/r ... g/v1.0.0b4

I decided to spruce up the sidebars and security padlocks too, in addition to fixing several of the issues mentioned above. Hope you like it. :)
adesh wrote:I'd like it to have bigger, bolder fonts like in the address box and tab titles.
I did attempt this, however I'd found the way that's needed to get this working affects too many things in too many places. I -could- style this specifically for the preferences window, but then it'd be very inconsistent with other windows. If I can't do it right, it simply won't be done.
adesh wrote:I like the old style circle-like tab loading indicator.
This is now a userstyle (use only with Beta 4 and above): https://raw.githubusercontent.com/Looty ... robber.css
José Labán wrote:In the Add-ons manager left list I get a scroll bar at the botton because the first entry barely fits, it seems.
While it isn't optimal, I decided to adopt the Firefox approach to this and truncate it in Beta 4 (see below the same, in Spanish, on Firefox):
Image
There isn't any other elegant way of handling that unfortunately, though it is still possible to hover over the button and it will display the full text.

User avatar
Moonraker
Board Warrior
Board Warrior
Posts: 1001
Joined: 2015-09-30, 23:02
Location: Lincolnshire.UK.

Re: [Pre-Release] Photonic

Unread post by Moonraker » 2019-02-03, 15:02

Im assuming this theme will go on our add on site so i shall wait until a final version is out.
Xenial puppy linux 32-bit.
Pale moon 28.5.0.

User avatar
mrnhmath
Moonbather
Moonbather
Posts: 53
Joined: 2017-06-21, 02:37

Re: [Pre-Release] Photonic

Unread post by mrnhmath » 2019-02-03, 17:38

Thanks for working on the issues I pointed out, Lootyhoof. Found a regression in the latest beta:
1.PNG
1.PNG (35.45 KiB) Viewed 776 times
I also noticed that the tools button in the Add-ons Manager lacks the photonified look that Firefox 66+ has. Aside from these it's a green-light from me!

User avatar
tribaljet
Lunatic
Lunatic
Posts: 463
Joined: 2012-06-06, 19:45
Location: Portugal
Contact:

Re: [Pre-Release] Photonic

Unread post by tribaljet » 2019-02-04, 01:18

First of all, congratulations on the great job on this theme, it's looking great so far :)

I do have a few things to note, though. For users who happen to run a dark/black Windows theme alongside GlassMyFox, the open tab white text has very little contrast with the near white tab background. Additionally, when using the theme in combination with GlassMyFox and a dark/black theme, the option for white navbar-button icons turns the back/forward, home, downloads, new tab and left/right tab scroll buttons completely blank/black against the black background, an issue that did occur when Pale Moon's button icons changed to svg.

Screenshot added for reference:
photonic_ss.PNG
Also, am wondering if you're considering releasing a few color variations of the theme, not unlike the whole Firefox's color variations it has by default, but as separate themes, of course.

Anyway, nicely done :thumbup:
Portuguese translator of Pale Moon

User avatar
adesh
Astronaut
Astronaut
Posts: 652
Joined: 2017-06-06, 07:38

Re: [Pre-Release] Photonic

Unread post by adesh » 2019-02-04, 09:34

Thank you for another revision, Lootyhoof! I see that there is some border now below the tab bar, but it is white-ish. Because of that there is no clear demarcation between the active tab and the page content, which doesn't look good. See screenshot. I think the border color should be more dark. Thank you again!
Screenshot 2019-02-04 at 3.00.28 PM.png

User avatar
Isengrim
Keeps coming back
Keeps coming back
Posts: 804
Joined: 2015-09-08, 22:54
Location: 127.0.0.1
Contact:

Re: [Pre-Release] Photonic

Unread post by Isengrim » 2019-02-04, 12:53

Trying out b4 now, the add-on icons on the bookmarks menu look much better! Thanks Lootyhoof!

One issue I neglected to mention before involves the bookmarks menu. If you open the bookmarks menu from the Pale Moon button, the generic bookmark icons and other "system icons" are dark-colored and they look great. However, if you open the bookmarks menu from the menu bar, these icons are white and difficult to see against the menu's gray background.
bookmarks.png
Also, I figured out why the menu bar and location bar appear gray on my Firefox install: I believe there are some about:config preferences left over from when I still had CTR installed, and at some point I must have set "browser.tabs.drawInTitlebar" to "false". In Firefox, this forces the titlebar to appear and changes the dark blue color to the gray shown in my previous screenshot (which also looks close to the gray that I see in Pale Moon when the window is inactive). Not sure if that's something you would be able to replicate with your theme, though.
Linux Mint 19.1 Cinnamon (64-bit), Windows 7 (64-bit), Windows 10 build 1803 (64-bit)
JavaScript is not Java
"As long as there is someone who will appreciate the work involved in the creation, the effort is time well spent." ~ Tetsuzou Kamadani, Cave Story

Locked