The roads I take...

KaiRo's weBlog

Dezember 2016

Zeige die letzten Beiträge mit "themes" gekennzeichnet an. Zurück zu allen aktuellen Beiträgen

Populäre Tags: Mozilla, SeaMonkey, L10n, Status, Firefox

Verwendete Sprachen: Deutsch, Englisch


Dezember 2016

November 2016

Oktober 2016


11. November 2016

My Thoughts on Next-Generation Themes

One of the very first steps into my Mozilla contribution story was playing around with the CSS files that styled how the early Mozilla suite looked. Due to the user interfaces ingeniously using the the same rendering engine as Mozilla needed for websites anyhow, it meant that I actually understood some of the underpinnings and could hack them myself - like changing some colors and icons into a look similar to LCARS - which I always found to be awesome-looking, and whose creator, Mike Okuda, I have met in person meanwhile. When I later assembled those playings-around into a proper theme, I called that LCARStrek, and that one is still around for Firefox and SeaMonkey nowadays. I also did an adaptation of the theme that the Mozilla suite had in the early days, which is called EarlyBlue and only available for SeaMonkey (too much work to adopt and esp. maintain it for Firefox as well right now, though it would be a fun one as well).

Image No. 23308

Even LCARStrek, which I'm using myself on both products, is often late to release new versions as it's a real lot of work to maintain it - not just because it changes the looks of the browser rather radically and has a lot of details to pay attention to, but also because the current way how full themes work needs me to copy a whole lot of CSS from the default theme into my work, and painstakingly track all changes and adapt to them. With some larger work in Firefox recently and the constant flux of Developer Tools work, this is a real lot of work and not a lot of fun (and I already pretty much leave out any support for devtools or devedition themes as well as lightweight/wallpaper themes). I'm not alone with this, and there are only slightly over 30 complete themes on AMO that have been updated in the last 3 months - even though you need to adapt to changes in every Firefox release, i.e. every 6-8 weeks at least.

This is something that the Mozilla teams working with theming have noticed as well, and talks have been going on for a long time to change how themes work to both make it easier to maintain the themes and to also make Firefox break less significantly when a themes is not updated all the time. Also, as with add-ons in general, Mozilla wants less risk to breaking people's customization experiences with the shift to more HTML UI (instead of XUL), Project Quantum and similar updates of Firefox' technology, and themes need to be modernized in that light as well.

Having been a theme maintainer for more than a decade and a core Mozilla contributor (even on staff for a few years), I naturally have my thoughts on what the new theme architecture should be.
As a general rule, I'd like a future theme architecture to be simple where possible, but if you want to, powerful enough to make radically different designs like LCARStrek possible.
I imagine building upon what we have for "lightweight themes" (or "wallpaper themes" called "Personas" in the past, AMO just calls them "themes" now), and extending this with functionality for changing browser colors in general, potentially to exchange icons, and, for those that really need it, with in-depth CSS-powered styling.

Here's a list of things I'd like to see in the underpinnings this next-generation themes architecture:
  • Use CSS variables for all colors in Firefox, and expose some simple way for a theme to only adjust those colors. A lot of people will be happy with just potentially a "wallpaper" and a changed color scheme across the whole Firefox UI (also, not just the browser window).
  • Make all icons be SVGs (if possible), create some way to apply above-mentioned colors to those icons. It's so easy for icon colors to clash with theme colors, they should instead just fit themselves into the theme color scheme nicely.
  • Create some way to easily exchange specific icons - some themes only want to adjust certain icons and not all of them, and we also should not break when Firefox adds icons. Also, some themes only want to apply a different set of icons, e.g. to match an operating system's icon scheme, we should enable that with needing to do everything else as well.
  • For those that want to fiddle with the details, have one theme-defined CSS stylesheet in addition to (not instead of) the default theme CSS - just make sure it's always loaded after Firefox' own styles so overriding rules does not necessarily need !important (as the last rule of the same specificity wins). Support @document for those theme designers that want some rules to only apply in one HTML/XUL document of the product. Also, for those that want to define a whole lot of rules, it should be possible for them to split that one stylesheet and @import the parts in that one (but let's hope that's not needed too much).
  • Pretty please make the devedition and devtools theme selections use the actual Firefox theming mechanism and not add even more complexity for theme designers to take care of.

With that structure, we'd have easy mechanisms for those that only want to change colors and/or icons, which are use cases we see a lot from what I remember in past theme discussions.
That said, we'd also have a mechanism to go and adjust all the nasty details that I know I want to have in LCARStrek - with full knowledge that anyone who uses the advanced option of the theme CSS stylesheet makes maintenance harder for themselves - but still easier than now, as loading this in addition and after the default theme CSS eliminates all the tiring porting of the rules you need anyhow and leaves the theme author with the really interesting pieces of what their theme changes in comparison to the default.

If it's possible to get the effects that I want with LCARStrek, I'll stay one of the theme authors that use a lot of the power of what the system can do - and my time spent in maintaining will still be significant, albeit definitely less than it is now. That said, if I can't achieve a look that is neat to LCARS, I'll probably just not do themes again in the future. As I love this look though, I hope the simple but powerful architecture I'd like will be implemented - that could be what I proposed above, could potentially be achieved in different ways as well, I guess. I care mostly about the outcome.

Let's have a Firefox that can be distinguished by how powerful its customization options are while still making it fun to maintain add-ons and themes and to develop Firefox into a more modern application for using our beloved Web!

Von KaiRo, um 19:03 | Tags: EarlyBlue, Firefox, future, LCARStrek, lwthemes, Mozilla, themes | 2 Kommentare | TrackBack: 0

19. Dezember 2013

LCARStrek and Australis

The latest version of my LCARStrek theme does not just support the latest SeaMonkey and Firefox releases. As I'm using it myself on Nightly, I'm trying to keep it working in an experimental way with that as well - and with that, a pretty huge challenge came up in the last weeks: A redesign of the Firefox interface code-named "Australis".

I blogged a month ago about how it may affect my customizations and I have dealt with those to a good degree by now, even though not yet even as drastically as I thought when writing that blog post. As always, more will follow. It took me some time until I switched over actually, as I wanted to keep using my theme, but it was naturally not compatible with such a huge redesign.

But after a lot of hours of my free time in the last few weeks, I have experimental support for Australis working in LCARStrek. The new changes living together with support for pre-Australis Firefox in the same theme require quite a few hacks to have a number of styles only apply on one side or the other. But then, I have been doing theme design for long enough (about 14 years now) that I know a few tricks and could use those - thankfully, there are a few changes in attributes set on the main toolbox, for example.

There's still a lot to be done in this area to fix some details (and I see a painting issue that is triggered in the submenus of the new main menu but is probably Linux-specific and connected to transparency used in the arrowpanel), but the main things seems to work decently now. See this screenshot:
Image No. 23159

Given that I'm using it every day, I hope starting now gives me enough experience with it that I can deliver a really decent theme when Australis finally will ship, probably with Firefox 29. :)

Von KaiRo, um 23:43 | Tags: Firefox, LCARStrek, Mozilla, themes | 1 Kommentar | TrackBack: 0

18. Februar 2013

LCARStrek 2.16 Brings Updated Look

Every six weeks, it's time for a new release of Firefox and SeaMonkey, and along with them, updates for my EarlyBlue and LCARStrek themes to match those Firefox and SeaMonkey releases. Of course, I personally am using them with the Nightly versions and try to keep them working with those, so they are usable with newer versions already, but only after I incorporate changes from the beta cycle, they're really fully up to date with the release versions.

That said, I kinda had my worries with the buttons of LCARStrek being not really discoverable unless you move your mouse over them, and also about the theme feeling "too orange", esp. after I reviewed some shots of LCARS screens in Star Trek series and once again saw both the shapes of buttons there, which are very discoverable, and also the amount of colors used there.

So I finally decided to something about it and added some gradual changes to LCARStrek 2.16, see e.g. the buttons, tab and scrollbars colors in those two screenshots (left is a Firefox release with 2.15, right is a Nightly with 2.16, that's why it also has an additional "Data Choices" tab):

Image No. 23116Image No. 23120

The new colors are taken directly from video screenshots of the series, so they should be pretty "true to the original". Actually, I copied the colors for buttons and default buttons directly from buttons in those screen shots. Trying to apply the same color to more button-like elements, I also converted buttons to that color and a larger border radius similar to that of the fully-rounded buttons.

While I was at it, I also took the orange off the primary toolbars and replaced it with a gray color taken from some screen that I think I saw on Voyager shots. And I always wanted to get some more of the connected horizontal and vertical borders found usually in LCARS screens, but that needs to have enough elements to construct, so it's hard to do in a theme. I found a way to get this design into the SeaMonkey sidebar though - and also used that new button color for its headers which act similarly to buttons as well. See those two screenshots from LCARStrek 2.0 (left) and now 2.16 (right) on SeaMonkey (of course, some small non-theme-reated changes in SeaMonkey UI are visible as well, as the application itself saw some development since 2.0):

Image No. 23114Image No. 23117

I hope I caught all the fine details that come along with far-reaching changes like esp. the one for the buttons, I've done a number of corrective changes along with this.
Still I had some time left and enough elements to play with to give SeaMonkey's profile switcher some real beauty in LCARS terms (you also see the different color for default buttons in there):

Image No. 23119

Unfortunately, this only applies to "Switch Profile…" from within a running SeaMonkey profile, as a theme like LCARStrek can only apply in that situation and not on the profile manager seen on application startup, where no profile and therefore no add-on or theme is loaded yet.

The new LCARStrek 2.16 version has been submitted to AMO, but is waiting for review now. Once that is granted, all users of this theme will see that updated look, and I hope they'll like it! :)

I probably will work on updating the look of more parts of this theme as time allows and I find things that should look differently.

Von KaiRo, um 18:46 | Tags: Firefox, LCARStrek, Mozilla, SeaMonkey, themes | keine Kommentare | TrackBack: 0

12. März 2009

EarlyBlue and LCARStrek for SeaMonkey 2.0 Alpha 3

Yesterday, I updated my LCARStrek and EarlyBlue themes to SeaMonkey 2.0 Alpha 3 and did official releases of those updated versions.

On AMO, you need to log in to get those versions from the sandbox - alternatively, my theme downloads page offers them without login.

Those versions made good improvements apart from the usual updates to fit with the newer SeaMonkey version: Both also feature updated DOM inspector and ChatZilla support, highly improved support for right-to-left language display, full support for customizable navigator toolbars, controls in <video> elements, and new history window and sidebar as well as some other bugfixes and improvements.

The full changelog as well as the complete source of the themes are available from my public git repos.

Von KaiRo, um 16:09 | Tags: EarlyBlue, LCARStrek, Mozilla, SeaMonkey, themes | 1 Kommentar | TrackBack: 0

10. März 2009

Help Wanted for Modern Theme Improvements

The "Modern" theme in SeaMonkey 2 needs your help:

We have a bug on file for updating the Modern theme for SeaMonkey 2.0, and we even have some good work from Kuden, who volunteered in mozillaZine forums to help with theme design in the missing areas.

So, this sounds like success? Well, almost. As you might know, the only way to get changes into the Mozilla repositories is by doing patches, getting reviews and addressing the review comments.
And that's where we're stuck right now: We need someone to take Kuden's work, bring it up as patches, submit those for review and address review comments coming up. Ideally, this would be someone who uses Modern and has some knowledge of CSS and theme work as well as our review process.

The work to be done is basically picking up existing pieces and driving them into the tree. Sounds easy? Might be something for you!

Even if you don't know the review process that well, as long as you know or are able to learn how to create patches and you are able to address requests for changes in theme CSS, you should be able to help.

Please contact us if you can give us a hand with this and make Modern fit for the future!

Von KaiRo, um 16:37 | Tags: helpwanted, Mozilla, SeaMonkey, themes | keine Kommentare | TrackBack: 0

24. Dezember 2008

My XMas Gift: New Theme Versions

After uploading a 2.0 Alpha 2 version of LCARStrek about 10 days ago, I now could also update my EarlyBlue theme for SeaMonkey 2.0 Alpha 2 a few minutes ago, at the right time to hand them to the Mozilla community as Christmas presents. ;-)

On AMO, you need to log in to get those versions from the sandbox - alternatively, my theme downloads page offers them without login.

As said before, the tri-licensed source of the themes is available from my public git repos.

Von KaiRo, um 00:29 | Tags: EarlyBlue, LCARStrek, Mozilla, SeaMonkey, themes | 4 Kommentare | TrackBack: 0

20. Oktober 2008

Both EarlyBlue and LCARStrek Now Have 2.0a1 Versions!

I mentioned in my status updates a bit ago that I updated my EarlyBlue theme for SeaMonkey 2.0 Alpha 1 - and a few minutes ago I finally also was content enough with what I have to do the same for LCARStrek, which is actually used more, AMO reports double the downloads and more than four times the users for LCARStrek compared to EarlyBlue.

You now can make the look of your SeaMonkey 2.0 Alpha 1 build go back to the days of the early Mozilla M4-M8 days, or jump forward to the 24th century!

(Those preview images are actually from SeaMonkey 1.x, but the current versions look strikingly similar.)

If you want to try them, see EarlyBlue versions or LCARStrek versions on AMO (2.0a1 versions are sandboxed, so you need to log in to get them!) or theme dowloads.

By the way, both themes are tri-licensed and the source is available from my public git repos - and if I find the time, I have plans to make them support Firefox in the future (probably not before a FF 3.1 release though).

Von KaiRo, um 18:10 | Tags: EarlyBlue, LCARStrek, Mozilla, SeaMonkey, themes | keine Kommentare | TrackBack: 1

Feeds: RSS/Atom