Dark times are coming: HabraDarkAge theme

It's night now. It's time for the presentation of the dark theme of Habr's styles.

For the ZenComment styles are dark times. In the age of the dominance of laptops, smartphones and tablets of great importance to the battery is what color you show the background of the site. If you do not use a CRT monitor, the brightness of the LED screen affects energy consumption. White business dudes start to eat a resource - and lose. The white-collar workers with limited technical background, one after the other, begin to fade screens in the dark, in a stuck train wagon, when true geeks, making fun of their attempts to turn on the phone, finish reading the last article from Habr for 20 minutes longer, waiting for rescuers quietly than everyone else . Unless, of course, they once installed a dark theme of user style ...

Therefore, dark themes are deservedly popular. There have been several of them in recent years, but not all of them survived to synchronization and harmony with the current version of the site. Even the end of August of this year for the styles of “New Habr: night mode” did not become a moment of truth: in September perestroika (site), geektimes and other layers of the eternally current world struck.
')

HabraDarkAge

Therefore, to synchronize the dark theme with reality, there was an expansion of styles: HabraDarkAge . It is based on the very styles of " New Habr: night mode " as the most developed in terms of shadow usability. Judging by Gitkhub, it was created by 4 authors, with modifications for 3 months. But there were so many changes in the code of styles that it was impossible to speak about the usual pull request. Styles were placed in your address on the hosting and Github . You can install from any of these sites, but the first one still knows how to control the synchronicity of styles and shows a download counter.

(A small educational program to install usersystems: you need to put the Stylish extension in Firefox, for Chrome it’s the same , for the old Opera it is set as a file .)

There was a proposal to the author of "Night Mode" ( issue ) to synchronize our codes, but apparently, really, he does not have time now. During the week, there was no movement in his repo. For me, on the contrary, over the past week there have been some developments of the code and documentation (the last link contains many screenshots of the dark theme).

The scripts began to support the “microchab” (“mobile version”: a useless thing, but it didn’t take much effort). The main thing is that the styles have corrected the site's bug, which consists in the impossibility of navigating it in low windows, less than 530 pixels: the menu “flies up”, i.e. in the presence of scrolling page - it is not visible. And some amenities were added in the form of balanced, muted colors of overly bright elements in this dark design that couldn’t be fixed in the “Night Fashion”. Checkboxes, a comment or article preview frame, comment icons and the like.

Separately, it should be mentioned that the styles are applicable not only to Geektimes (which is logical), but also to saved copies of pages in the Google cache. For example, at http://webcache.googleusercontent.com/search?q=cache:http://geektimes.ru/ with the installed styles, we will see a dark theme too. And even the menu will work. This is especially useful for viewing remote pages. Here's an example that will soon disappear from the cache, but it still works: http://webcache.googleusercontent.com/search?q=cache:http://habrahabr.ru/post/241533/ (this is the October 27 page, not err from the date "yesterday"). The same trick is applied in the ZenComment + HabrAjax script, which automatically provides links to the Google cache on a closed publication page (sic).

The format of the site in the styles of HabraDarkAge largely repeats the format of the original site. This is just a familiar copy of all in the dark version, with minor improvements. For example, in the captions for the article - the fonts are slightly larger, the click area covers the surrounding elements, so as not to aim precisely at the author's name or the number of comments. Giktaimovsky title does not catch the eye and does not occupy space at the top of the page. It is simply superimposed on the page and reminds of itself with a barely noticeable shadow. The height of the input fields can be changed manually. Avatars - less noticeable, but when you hover on the title - doubled. Buttons of page numbers are larger and are on the left, always in sight. Footer - denser. Basically - everything.

Further, it is expected that HabrAjax will get into these styles, master its automation of minor improvements that are inaccessible to styles. Script settings will learn to manage styles and include them as required. And more styles of ZenComment will penetrate the styles. (Several of them are already there: an invisible top menu, large page number buttons.) For example, for wide screens, ZenComment has a always-visible menu. In the meantime, the HabrAjax scripts are incompatible with the dark theme, because they always "believed in" that the background of the page is white, and the theme is light. Therefore, they have a lot of improvements with the light backgrounds of the elements sewn into them.

Styles, most likely, will require not only the planned modifications. For example, literally now I discovered an element of the autocomplex of tags hiding from modernization when preparing an article. Styles were promptly supplemented. (You also have to do something with div.footer_panel: before, and body: after — I don’t think it was a good decision).

Therefore, improvements that can be expressed in pull-requests to the Github code are welcome.

But the main thing is that these styles are familiar to everyone. It is only necessary that a person be interested in possible cases in the subway and prepare to read Habr there in advance. Well, and in combination, they will be useful for evening reading on dark winter evenings. Unlike ZenComment.

What does ZenComment do at this time?

Fashionable left panel styles ZenComment authority was not. On the contrary, the philosophy of these styles was and remained the principle of “read, not scroll”, and the powerful square buttons reduced the reading area, and therefore increased the length of the scroll bar. Yin and Yang between the air voids of the site and the length of the tunnel to the end of the article, overcome by the scroll - there is the same balance that we now have between the whiteness of the screen and the battery life. ZenComment accepted this reality of the balance of life and death - and plunged into dark times.

If you just take and mix both styles, and even impose HabrAjax scripts (however, you can do without them), you will see that there are a lot of white spots - blocks in which light colors were pre-written. Therefore, it is not possible to simply follow the recommendation to install both. Need a number of improvements. They will make up the changes in ZenComment styles to DarkAge styles. As a result, in the plans , ZenComment styles will exist in 2 incarnations: ZenComment and DarkAge.

According to joint revisions of this style - many were called upon to them, to begin by putting it on Gitkhab. Laying out is . But it should be noted that they are structured much worse than the same DarkAge now. First, the structure needs to be refined, then - in the plans - to build source codes for generating “deployes” in different places - just styles, dark version just styles, custom build (not all features to be used), option inside scripts (such as already available in HabrAjax, if you enable the “inline ZenComment styles” setting there). Ie, besides completions of elements, some system work is needed.

Then the geeks in the subway car will have even more advantages over white collars: they will not only shine their screen less, but scroll less, read more. The output to the end of the tunnel in each article will be reduced, and it will not be as blindingly white as for all.