Ghacks New Theme is finally there
You may have noticed already that we have activated the new Ghacks theme finally on the site. I hope you like it as much as I do, and I'd like to take the opportunity to point out a couple of things about the new theme.
Before I do that, I'd like to thank Daniel Pataki for his awesome work in creating this new theme for the site. This theme would not be possible without him.
One of my main requirements for the new theme was that it should not diverge too much from the current one. I wanted to keep the general layout and order on the site so that it would not be a shock to users.
I know how hardcore some users are when it comes to changes, and keeping the general layout would certainly reduce the number of complaints and criticism.
Some things have changed however and I'd like to point those quickly:
- The site should load a lot faster.
- The main content ad unit was moved to the header. This means, no ads in content anymore.
- The top nav menu was changed. It consists of a main menu and a submenu now. Most main menu items are still there so that there is not much change in that regard. The submenu lists the other categories, all major tags, and some important articles as well. Basically, we moved all entries from the sidebar to the top.
- Text and headings are improved. Readability should be better on all devices.
- We have added a "support us" box below articles. This is one of the way that you can support us. Once we get enough support this way, we will get rid of ads on this site. Supporters may get a Ghacks account, and when they are signed in, won't see any ads on the site.
- The comment section has a new design. We still use a locally hosted solution, so no third-party tracking going on. The new design should make it easier to find your way around in the comment section, and distinguish threads.
- Update: Forgot to add, we have new sidebar widgets. A "this day in history" widget that lists posts of previous years, and the new last updated widget that lists articles that were updated the last.
We work on the display of thumbnails as we speak. They are blurry and that is something that needs to change.
Feel free to add comments, positive or negative, to the comment section below. I will read all of them and will take all comments into consideration. If you notice any issues, let me know specifically, as we will correct those asap then.
There is still a chance that we may need to restore the old theme. This will be the case if something unforeseen happens, for instance if issues cause traffic to drop.
https://i.imgur.com/NYuhXJ3.png I check every ur website few some work back and still broke new theme test on difference browser, my phone and latest router please fix this :/
I created a new profile yesterday in Basilisk and it seems to have corrected the problem I was having with the display. So now the comments section for example spans half the width of the page.
Why it centred itself previously remains a mystery I’m afraid.
My Dark Saffron RC1 (:P Couple things still not happy with like hover, works on page buttons but not comment, search or reply buttons. Also noticed text in the search box and comment box is black on this pc but white on a different laptop…go figure.
@-moz-document domain(www.ghacks.net) {
body {
#Sitewide Colors
color: #FFFFFF !important;
background: #272727 !important;
}
#Heading right
.heading–tiny {
color: #f3b434 !important;
background: #272727 !important;
}
#Heading “WE NEED…”
.heading–small {
color: #f3b434 !important;
background: #272727 !important;
}
#Heading home
.heading–medium {
color: #f3b434 !important;
background: #272727 !important;
}
#Heading blog
.heading–large {
color: #f3b434 !important;
background: #272727 !important;
}
#Link Color Top
.row-title {
color: #f3b434 !important;
}
#Link Color Left Side
.post-list > div:nth-child(3) > ul:nth-child(17) {
color: #f3b434 !important;
}
#Link Underline Color
.user-content a, .widget_text .textwidget a {
color: #f3b434 !important;
border-bottom: 2px solid #272727 !important;
}
#Input Fields
input:not([type=”submit”]), textarea, select {
border: 1px solid #f3b434 !important;
background-color: #272727 !important;
}
#Blog inline heading
.user-content h2 {
color: #f3b434 !important;
background: #272727 !important;
}
#Blog inline heading
.user-content h3 {
color: #f3b434 !important;
background: #272727 !important;
}
#Donate button
.button–orange {
color: #f3b434 !important;
background: #272727 !important;
}
#Comment Reply button
.comment-reply-link {
color: #f3b434 !important;
background: #272727 !important;
}
#Search button
.search-submit {
color: #f3b434 !important;
background: #272727 !important;
}
#Post Comment button
.submit {
color: #f3b434 !important;
background: #272727 !important;
}
#Page number buttons
.navigation {
color: #f3b434 !important;
background: #272727 !important;
}
#Top Selection Bar
.bg–black {
background: #000000 !important;
}
#Bottom of Page
.bg–darkGray {
background: #272727 !important;
}
#To fix comment header
.comment-item .comment-item__header {
background: #272727 !important;
}
#Comment header
.comment-item .comment-item__header > .row > .row {
color: #f3b434 !important;
background: #272727 !important;
}
#To fix author comment header
.bypostauthor > .comment-item .comment-item__header {
background: #272727 !important;
}
#Author comment header
.bypostauthor > .comment-item .comment-item__header > .row > .row {
color: #272727 !important;
background: #f3b434 !important;
}
#Page Number Buttons Border
.nav-links a.page-numbers:not(.next):not(.prev), .nav-links a.next, .nav-links a.prev {
border-color: #f3b434 !important;
}
#Hide News Letter til sorted.
div#ghacks_ad_code-6.widget.ghacks_ad_code.mt–30.mt–first–0.ghacks-links–nounderline {
display: none !important;
}
#Right Side Width Shrink
.ghacks-sidebar {
width: 250px !important;
margin-left: 60px !important;
}
#Left Side Width Gain
.ghacks-content {
width: calc(100% – 250px – 60px) !important;
}
#Page Padding Far Left Right
.container {
padding-right: 1rem !important;
padding-left: 1rem !important;
}
}
If anyone uses this userContent.css the #s need removed or the whole line can be for that matter.
Slip these in to resize the left side thumbnails, really helps on smaller displays.
/*Left Thumbnail Allocated*/
.post-list .image {
width: 90px !important;
height: 75px !important;
}
/*Left Thumbnail Size*/
.post-list .image img {
width: 75px !important;
height: 75px !important;
}
/*Left Thumbnail Margin*/
.mr–40 {
margin-right: 0px !important;
}
To make that annoying cookie notice disappear. For me it pops up on every page I load.
/*Cookie Notice Hide*/
#cookie-notice {
height: 0px !important;
}
I’ve noticed that the scrollbar in the message box can’t be moved up and down by either grabbing it with the mouse, or by clicking the up and down arrows. This means the only way a user has to scroll is by placing the cursor inside the box and then using the mouse wheel.
In this example https://imgur.com/a/Bbifk I’ve already added one paragraph and was thinking about adding another one. But I wanted to see how the initial part of the message looked first. The only way of getting to the top is to use the mouse wheel.
Not a big problem as long as you’re using a mouse, but some laptop users don’t have one and that means writing a long message could become a little irritating after a while.
2 finger scrolling working ok here on linux
In the right column together with the THIS DAY IN HISTORY, POPULAR POSTS and LAST UPDATED you must add one more section with the most “Recent Comments” on X threads, This way we’ll keep track where the conversation is happening.
That’s a really interesting suggestion–sounds like it could be a fantastic idea.
I am surprised how often I receive email follow-ups from article threads from months and even years ago. I suppose it’s often from someone arriving later via a search. Those past articles and discussion threads are very useful as they serve as a permanent place for information about, discussion of, and updates on topics of perennial interest and relevance, e.g., Windows telemetry, Firefox, etc., even this very article on ghacks new theme.
I’ve also been meaning for awhile to post and say: I’ve gotten used to the new theme and realize that I can live with it. I still prefer the previous theme and definitely find this newer one harsher and harder on the eyes, but I can live with it if I must.
One thing I notice since the new theme change is that comments sometimes seem to take longer, sometimes much longer, to appear. I do hope that this will be fixed!
Just to be certain it wasn’t an addon causing the problem, I restarted Basilisk in safe mode. But as can be seen from the screenshot it doesn’t change anything: https://imgur.com/a/9Diwa
By the way Martin, is it really necessary to cause the cookie warning to reappear every time your site is accessed? Maybe that’s what’s causing the problem.
The cookie warning should only be shown once provided that you click on ok (unless you delete the cookie_notice_accepted cookie, then it will be shown again)
It doesn’t come back again provided the browser remains open, but I use session cookies for practically all sites I visit. https://imgur.com/a/0Ybmw
But on other sites where the same policy applies, the cookie warning doesn’t reappear again even after the browser has been closed. It only behaves that way on your site. ;)
If you retain images as part of the article i.e. within the text then OK, but not when the accompanying image appears alongside the summary as can be seen here: https://imgur.com/a/DZKBG
It looks too squashed and difficult to read when each sentence in the summary contains only three words with reams of wasted blank space on either side.
This does not look right. I have added this as a bug report. Can you let me know which resolution you run the browser window in? Any add-on that may interfere with the display?
According to https://whatismyscreenresolution.com/ my browser window is 1440 x 810.
But I always use a free floating window size which allows me to grab the title bar and move an offending video / image or other annoyance out of the way so that I can enjoy the part I want to read without interference. My actual monitor size is 1920×1080.
NoSquint Plus stopped working again this morning (the developer includes expiry dates in each version which causes that) and out of frustration I removed it completely and have switched to “Grey to black font” https://addons.mozilla.org/en-US/firefox/addon/gray-font-to-black-font/ and Zoom Page WE instead now: https://addons.mozilla.org/en-US/firefox/addon/zoom-page-we/
I can zoom the page so that the text enlarges, but it doesn’t resolve the layout problem unfortunately.
Great new look! How are you achieving the “This Day in History” widget content…very cool and would like to know how you implemented? Thank you Martin.
I love the new theme! Thanks Martin for all the great content!
Martin,
The Lego Millenium Falcon 75192 you were looking for is on offer in the US at $399 (International Shipping free). https://theinsiderstoys.com/products/lego-starwarsmillenniumfalcon
They accept credit cards so if something goes wrong and they don’t dispatch it, the credit card company will refund your money provided you claim within three months of purchase.
Wow, that’s very cheap. I bought one already a couple of days ago on the German Lego store (for the retail price of €799). Ouch. Thanks so much for bringing this to my attention.
Ouch indeed! It just goes to show how much these businesses make that they can afford to discount it so much and still make a profit.
HTML codes that were previously accepted for comments under the old theme no longer work in the new theme, but are stripped out instead. Is this a bug, or deliberate ?
For instance, “strong” or “b” [bold], as well as “em” or “i” [italics]. I did not try the HTML code for embedded links.
On the other hand, there are instances of “strong” in the HTML page source for the articles under the new theme.
broke theme again
https://i.imgur.com/oaZe3ke.png
“BM†said: “…everyone has a different set of tastes…
So far, the changes have been a net positive and are refreshing for the site.â€
What a pile of BM! The changes have been a net positive? Based on what? YOUR subjective taste? But as you rightly point out everyone has a different set of tastes! It’s so funny that you present your own subjective taste as a standard pronouncement (“the changes have been a net positiveâ€).
For me and for numerous others the changes have NOT been a net positive–the site wasn’t broken to begin with, the background now seems too bright and harsh and hard on the eyes for many people, and the comments section seems worse and harder to read for many people as well.
With the previous theme I never heard people complain and ask that the background be made brighter, that the site be made to look harsher and harder on the eyes, that the comments section be made less clear and less readable and more like an amorphous blob of text on a harsh bright background. In fact, I never heard complaints about it at all when the old site theme was being used. Now since this change, some people say they like it but many also say they don’t like it, for the aforementioned reasons and others. Thus, comparing the new theme to the previous theme, the changes have not been a “net positive†but a net negative, and far from “refreshing†the site, they have damaged and diminished it for a number of people.
As far as being “bright” goes, I don’t remember the old design & layout being any less bright. In that regard they look pretty much the same to me.
I would, however, wish that–like lots of other sites do–Ghacks would offer the option of a dark theme (not black like ArsTechnica, but more of a charcoal like DSLReports). Dark themes are so much easier on the eyes.
We are working on improving the situation for users who dislike the new theme based on it being too bright
@Martin – Really do like the new theme.
But, heads up… found a problem with comments. If a comment is posted, but then edited again before the countdown runs out, the “button” to save is missing – instead there is one clickable area with the words (running together) “SaveCancelDelete”. Clicking on that seems to delete the comment altogether.
Don’t know if it is just my setup – will need to test it further – or a common problem.
Hi, this is already filed as a bug. Thanks for reporting it nevertheless.
Regarding the new theme – my basic approach is that unless a change creates a clear usability issue, I don’t care all that much (i.e. it is up to the author/owner to decide), as it is otherwise a matter of aesthetics, and everyone has a different set of tastes – it is impossible to please everyone.
Some might try to argue that their aesthetic preference is really a usability issue – maybe. I’d rather rely on usability models and practices to determine what really is a comment about usability.
So far, the changes have been a net positive and are refreshing for the site.
I’ve put together some userscripts if anyone is interested. They all have reduced padding and margins and the dark themes are dark grey not black.The links will be up for awhile.
gHacks Dark: Dark grey background, blue accents.
https://drive.google.com/open?id=1LyM40s8ZxlvSMZNhVV6e-7uQNzZLzkf0
gHacks Dark – Blue Trim: Same as ‘gHacks Dark’ with blue headers on article page.
https://drive.google.com/open?id=1EsmT5qjx2iDcrlDLn0xYkf78YAX-gBwK
gHacks Dark – Blue: Blue accents, blue headers on article and home pages.
https://drive.google.com/open?id=1nJNHWX1WyJP8-bMrTFjYRtp5H0DHSoAU
gHacks Dark – Gold: Default gold accents, gold headers on article and home pages.
https://drive.google.com/open?id=14ICY37FMHSp5ao12ayOMBZV_nym7RFjV
ghacks Lite: Slightly darker white background, default gold accents.
https://drive.google.com/open?id=13OOM04AcNO9UktMXoqQS-C34ViZajOvf
All of the themes have been updated. Sidebar is slightly narrower and user content is slightly wider. Home page has slightly bigger medium headers in the Dark, Blue Trim and Lite themes for us vision challenged individuals but it can be changed, the other themes use colored home page headers and those were left at the default header font size of 22. Hover effect and colors were toned down on the buttons. Lite theme background (white) was not made very dark because it makes the text harder to see in chromium browsers because of the thinner and lighter appearing text in those browsers. The Lite theme background uses #F7F7F7 but I personally would prefer a slightly darker white like #F4F4F4 but that was a compromise. Lots of little tweaks in the themes that I’m liking a lot. ;)
Themes updated.
Thank you, I will try these one too
PS: With the “Dark – Blues style” there is something wrong on that article:
https://www.ghacks.net/2018/01/12/powershell-vs-powershell-core-what-you-need-to-know/
Under “The differences between PowerShell and PowerShell Core”..
Wow, that page was ugly. That was caused by rules not seen yet or new rules. No biggie. Add this line:
.user-content table tbody tr:nth-of-type(2n+1) td, .widget_text .textwidget table tbody tr:nth-of-type(2n+1) td { background: #2F2F2F !important;
}
or download the “gHacks Dark – Blue” style again, I added the line above to it. The others will be updated in a few minutes. Look for the date at the top of the file.
For the new line that is added to the dark themes I instead used #2a2a2a which gives that section a two-tone background which is the default look. I actually like the effect. Did the same thing on the Lite style but it was working without the new rule. I would bet every style out there not using a white-ish background needs that rule added to it.
@Martin
In case you don’t know. The newspaper widget(?) is still not rendering right in Firefox browsers, it’s fine in Chromium browsers.
https://s14.postimg.org/rf4fm3xv5/g_Hacks_Newsletter.png
Thanks Richard, will fix it in the coming days :)
@Richard
Is it possible to include a link in the dark theme to add a transparent Ghacks Logo instead of the regular. https://cdn.ghacks.net/wp-content/uploads/2005/10/ghacks-technology-news.jpg
I changed the ‘gHacks Dark – Blue’ style for FF based browsers because there is a weird dark spot under the left bottom corner of the summary box on the ‘default’ theme, with a dark theme that spot ends up being white which is why I originally removed it. The gHacks Dark – Blue style is the only one I’ve changed for the report errors container. Screenshots:
https://s14.postimg.org/vf0idsyqp/g_Hacks_Blue_Theme_update.png
https://s14.postimg.org/n9igfni7l/g_Hacks_Blue_Theme_update2.png
“https://drive.google.com/file/d/1nJNHWX1WyJP8-bMrTFjYRtp5H0DHSoAU/view”
That’s funny, fix one issue with text being too dark and create another one. To be honest I hadn’t even noticed yet. Anyway, the rule below will work in any dark theme. I’ll update the themes later today. You can of course change the color to whatever. ;)
.ghacks-logo, .color–orange { color: #8d8d8d !important;
}
Better like that, thanks. Screenshots by Martin are like the non-transparent favicon, white corners! he should try WinSnap.. :)
The new theme is fine and loads faster – thank you.
I noticed an issue with /page/2, which looks as if css or whatever isn’t applied correctly. /page/3 looks as expected.
nevermind – now it works ¯\_(ツ)_/¯
@Martin Brinkmann
I’ve noticed something else with the comments and or the site cookie. The old site theme would remember where in the comments I was last if I had been scrolling down a long list of comments, so if I kept the tab open and then come back to it later and refreshed it would jump back down to the same place. So you can then carry on reading any new comments added since the last visit to the tab.
Not sure if this is browser side (Opera) or your site side. All I know is the new theme does not act the same way so I’m guessing its in the cookie??
Still remembers for me on Firefox.
Firefox yes, Opera no.
This post is an experiment to determine whether the page hangs like it normally does with “pagead2.googlesyndication.com” displayed on the status bar in normal mode when using Firefox Private Browsing mode instead.
EDIT: OK, so in Private Browsing mode, the page doesn’t hang anymore.
Since the introduction of the new ghacks theme last week I’ve noticed a number of improvements, and the site definitely looks better to me today in many ways than it did when the new theme was first introduced.
However I still have to agree with comments like these:
Earl said on January 5, 2018 at 7:34 pm
“..all of the comments just look like one big blobby mess of text.â€
KeZa said on January 8, 2018 at 5:48 pm
Too “white for my taste. Also the site may be a little wider and the comments are not so clear anymore as it used to be. It’s more closer together and more in one line now. No not my taste.â€
Anonymous said on January 9, 2018 at 2:34 am
“After trying it few days, I must admit that this new theme is a real pain for eyes Too white, comments too confusing.â€
I find the background of this new theme too white/bright, and the dark text and graphics on this white/bright background give a much starker, harsher, harder-on-the-eyes look overall than the previous theme. Use the web archive link above (in one of the first comments on this page) and scroll through the years and look at how ghacks looked before. The softer, much-less-bright, much-less-harsh tans of the previous theme was much easier on the eyes, and the comments section especially was very clear and very easy to skim/scan/read. The comments section now is painful on the eyes to read or even scroll through, with the harsher black-on-white, and with not much real discernible delineation between comments. The delineation between comments was much clearer with the previous theme, making it much more readable.
Also the headers of each page now take up more precious vertical space than they did with the previous theme. I can see only three articles “above the fold†on the main page now, where before I could see four or even five, as I recall.
Some people go on and on in these comments about modifying the look of the page themselves, and I am happy for them that they have that option and enjoy endlessly engaging in that. But if we are honest we must admit that such users who are going to go to these lengths are in the vast minority. Most people are not going to do this, and my wish is that the site look good “out of the boxâ€, as it were, to everyone who should happen upon it, without the need for endlessly modifying user styles. Ghacks looked fine and very readable with the previous theme, and I do not ever recall such lengthy discussions before about how to modify the look of the previous theme as I do now that this new theme has been introduced. The fact that there is so much discussion of how to modify the appearance of this new theme should tell us something…
P.S. Just as I was about to post this, I notice a change in the comments section with a tan bar highlighting the name of the commenter and time of the post. This improves delineation between comments considerably.
I will use the very nice style made by Richard Allen, thanks to him… except I would like to change on the home page the color of the title of the threads, instead of white I would like to have blue too, how I can do that please? :)
Sorry, there is no easy way, with ‘gHacks Dark – Blue Trim’, to get the article headers on the home page blue without ALL of the links being blue also, which I don’t want. I would have to figure out which lines to remove and which ones to modify, it would be easier for me to start over because the ‘Blue Trim’ userstyle has been poked, prodded, added to and modified too often. Here is a link to one with Lots more blue. I took the ‘Gold Trim’ userstyle and changed the header colors, reduced the large header font size, added more of the entries used in the original ‘Blue Trim’ to further reduce padding and margins and it still has some default hover effects. Used a nice two-tone comment header effect (thanks to Tom Hawack) with some added padding. On line #40 you can change the font size, I have it set to 16. Finally got time to get this finished, some of us can only pretend to multi-task. BOOM Shaka Laka! ;)
Screenshots:
https://s14.postimg.org/igcj3xzwh/g_Hacks_Dark_-_Blues.png
https://s14.postimg.org/dugevkji9/g_Hacks_Dark_-_Blues.2.png
https://s14.postimg.org/i3l4xrpch/g_Hacks_Dark_-_Blues.3.png
https://s14.postimg.org/h1ayf7bo1/g_Hacks_Dark_-_Blues.4.png
https://s14.postimg.org/tfxqfjilt/g_Hacks_Dark_-_Blues.5.png
https://s14.postimg.org/vx9hmsush/g_Hacks_Dark_-_Blues.6.png
gHacks Dark – Blues userstyle:
“https://drive.google.com/open?id=1nJNHWX1WyJP8-bMrTFjYRtp5H0DHSoAU”
Dude! 0.0 what in the f%@* are you on about!?! I tore my own css code apart JUST to be sure I knew what I was putting out there!!! Which, by the way, I am doing the same with yours!!! (:@ RELAX is this not to be fun? I find it to…
So… have you noticed yet?
No but I been planning on getting around to it. It may help if you clue me in?
It’s all good! LoL
Well Crap… I gave credit to Tom for the two-tone header effect, I just realized, that I saw it first on a post by “leanon”. I sincerely apologize for my lost and confused-ness! SMH ;)
Try this and if its to much post back. This will change all headings. Open the .css and search for
.heading, .heading–huge, .heading–large, .user-content h2, .widget_text .textwidget h2, .heading–big, .heading–medium,
.user-content h3, .widget_text .textwidget h3, .heading–normal, .heading–small, .user-content h5, .widget_text .textwidget h5,
.heading–tiny { font-weight: 300 !important; line-height: 1.2 !important; color: #f2f2f2 !important;
}
and change the #f2f2f2 to #34a3f3 so it looks like
.heading, .heading–huge, .heading–large, .user-content h2, .widget_text .textwidget h2, .heading–big, .heading–medium,
.user-content h3, .widget_text .textwidget h3, .heading–normal, .heading–small, .user-content h5, .widget_text .textwidget h5,
.heading–tiny { font-weight: 300 !important; line-height: 1.2 !important; color: #34a3f3 !important;
}
I downloaded the “gHacks Dark – Blues userstyle” from Richard and its perfect to me. Another big thank you, you saved my eyes, so my life too :)
You’re welcome and I’m glad it worked for you. I’ve updated all of the scripts, it might be worth taking a look, ;)
Thank you !
After trying it few days, I must admit that this new theme is a real pain for eyes Too white, comments too confusing.
It is to flat and to white for my taste. Also the site may be a little wider and the comments are not so clear anymore as it used to be. It’s more closer together and more in one line now. No not my taste.
Kz from Belgium
Black or Dark Mode please…
Too white. Nothing for eye coordination. I will make my own css.
This is my css. Makes it easier for me to read the site.
https://imgur.com/a/NXO9N
It sucks donkey butt!
Now that I have your attention,
I like it.
It’s clean, sharp, fast, and simple.
Nicely done.
Quote: “Supporters may get a Ghacks account, and when they are signed in, won’t see any ads on the site.”
Excellent Idea!
Can’t the WHOLE COLUMN on the right (where the “SEARCH” and “SIGN UP NOW!” buttons are), made a bit narrower (less pixel width), so that the article is alligned more to the centre please? (or put stuff on the left AND right to make the article show more in the centre) This from a desktop view ofcourse :-)
Everything else is just fine Martin, thanks!
Am working on this now and looks like css will do this
Much much better ! Great job.
Images often aren’t loading for me. When I try to open an individual image, I get the infamous Cloudflare CAPTCHA. I don’t know if it is related to the new theme or if something else is going on.
Thank you, Martin. I liked it! Congratulations!
I like it nice clean and fresh
On link hover in the comment section, if the link is displayed on more than one line, only the first line display the hover orange effect.
https://i.imgur.com/D5GfXgd.png
Found out how to do my first ever userstyles.org submission :)
https://userstyles.org/styles/153799/ghacks-net-2018-tweaks
Congratulations pd! I’m corruptible, buy me a beer and I’ll comment all the best about it :=)
Looks very nice. Agree ‘flat’ is not always good but in this case it looks very clean.
One improvement I would make for usability is to improve the hover effect on the main menu. It’s not visible enough ATM. Perhaps switch to a style that changes the entire background colour. Same with the :active pseudo class.
Second-level menu not yet catered for but I can add that if anyone likes this.
@-moz-document domain(“ghacks.net”) {
.top-navigation {
line-height: 1;
}
.top-navigation .top-level a {
border-bottom:none;
padding: 10px;
}
.top-navigation .top-level a:hover, .top-navigation .top-level a.active {
border-bottom: none;
background-color: #F3B434;
color: #272727;
padding: 10px;
}
.pt–10 {
padding: 0;
}
}
Drop that into Stylish see what you think. For Stylus users you may need to trim the first and last lines.
Is there a way to add this to userstyles.org through Stylus? If so it’s not obvious to me :)
Congratulations on all the hard work Martin. People don’t understand how much fiddly, non-laborious (except for RSI and so forth) work goes into web theming.
Nice! I’ve added it to my dark theme and I like the look. Thank you!
Screenshot: https://s14.postimg.org/9lnkzk7sh/g_Hacks_Dark_Theme_With_Hover_Effect.png
I had to remove the quotation marks from the first line to get it to work, by itself, in Stylish, I didn’t try it anywhere else other than part of it in my dark theme.
Here’s my quick DIRTY fix to save my eyes and be able to find what I’ve look for….
I’ve just concatenated the old CSS in one file and apply it with Stylish/Stylus/xStyle
https://mega.nz/#!Zhol1Aya!E3QWl0iB-fz0qorfbD86L8D4UetuBjod_iBGXXqap_c
Here’s the look it give:https://i.imgur.com/8uj20Aj.png AND https://i.imgur.com/xZOOzMy.png
Lot more easy to read and efficient â˜ºï¸ .
This is amazing, touching and amazing. We (myself included) forget the articles, the content of Ghacks and focus more than I would have thought on its appearance, design so called theme. The main thing, the reason why we come here day after day, year after year for some of us are the articles, we don’t come for the interior design, and yet we have our word to say about that design; we have our ideas and express them. Normal, but what amazes me is the proportion it takes. Touching because it means how much we are committed to Ghacks. Like when a good friend invites us to his new flat, sometimes we forget him and start having our words on this and that about the flat, etc etc Am I naive, slightly (only slightly!) retarded or do you guys agree?!
Seems like we like your Web flat quite a lot, Martin, that much that we happen to forget it’s yours!
Totally agree Tom and it is amazing that a website theme has garnered almost 200 comments. Wow! And I’m surprised so many people are willing to get their fingers dirty playing with css. Excellent!
Personally, I like it!! I think it deserved a refresh and looked a little tired, but that never bothered me, because the articles are the main thing that counts.
I say well done to all who were involved in the new design. It’s fresh! Nice!
Thanks.
I’m amazed by the positive response and the length some of you go to suggest changes, and the modifications of the site that you make for yourself.
More modern look but lot less usable and functional sadly.
Everything is flat and confusing can difference the comment and many other things.
When you just look overall it’s more appealing but as soon you begin to read or look for something it’s not functional at all.
At least I’m able to use Stylish to correct it and being back the functionality.
Also things are to big with lot of wasting space and lot of pure white that give headaches.
Here is a design idea for the comments section.
https://screenshots.firefox.com/ypvWGUpEfqBbjM5K/www.ghacks.net
Best regards
Another design for the comments’ headers : http://hpics.li/925fe97
/* Comments’ colors */
.comment-item .comment-item__header {padding: 0px 0px 0px 8px !important; background: #D0D0FF !important;}
.bypostauthor > .comment-item .comment-item__header { background: #2030A0 !important;}
/* REPLY button */
.comment-reply-link {border-color:transparent !important; border-radius:0 !important; font-weight:600 !important;}
.comment-reply-link:hover {background: #FF8000 !important;}
Background same width for all, light blue for users’, dark blue for the boss (dark blue suits are so elegant!)
REPLY border is hidden and its font-weight set to 600
This is fun :=)
You really like blue ;)
Well… I do, how did you notice?! Point is I’ve set the header to blue yesterday so the theme has to follow. I call it “The Blue Horizon”, very fashion, class, haute-couture Sring/Summer 2018!
I like the use of block colour to break up long sea of text that comments can easily become. Think I’ll add that to userstyle.
Thank you Martin, the link for the comments takes me straight to the comments again. Noticed there are two drop down arrows for the ‘Don’t subscribe box’.
For those that don’t know, in Firefox you can change the background color for some pages in about:config, it works on a lot of pages but not all. The default is white (#FFFFFF) but I use #F4F4F4 which is a little darker, you can see the difference between the gHacks background color and the search box which will stay white. The about:config entry is: (browser.display.background_color). One site I use to see what the color values are is: “http://www.colorhexa.com/”.
I came up with some css that can be added to the userContent.css file in the chrome folder of FF, or it can be added to Stylish/Stylus whatever, I did all three. The css is just a tiny bit darker than what the above does, I reduced the font size (default is 18), reduced the line height (default is 1.6), changed the comment header color (slightly darker) and toned down the bright orange header color (*blowing chunks) for the post author. LoL
Screenshot with the change in the foreground browser: https://s14.postimg.org/ru2bzqib5/2018-01-05_g_Hacks.png
@-moz-document domain(‘www.ghacks.net’){
body { background-color: #f1f1f1 !important;}
.user-content { font-size: 16px !important; line-height: 1.2 !important;}
.comment-item .comment-item__header { background: #dadada !important;}
.bypostauthor > .comment-item .comment-item__header { background: #c4b79e !important;}
}
Modified the “Simple Modern Dark Ghacks 2017” a few times and right now this is the dark theme I’m using, seems to have always been a permanent work in progress for me: https://s14.postimg.org/kxcr0wdy9/A_work_in_progress_dark_theme_for_ghacks.png
Looks like SOMEBODY reduced the default font size which in my opinion is a good thing because I would rather it be a little small that way in Firefox I can set the zoom to 105% and it makes the content wider. I changed my css making the font size smaller, I was going to reduce the line height again but because I reduced some margins and padding I left the line height alone, and I again changed the comment header background color for the post author to a dark grey color. The comment section seems to waste a lot more vertical space than the previous version and now it’s ‘more better’. BOOM Shaka Laka! ;)
Screenshot: https://s14.postimg.org/5ftub14lt/g_Hacks_Theme_Redone.png
@-moz-document domain(‘www.ghacks.net’){
body { background-color: #f1f1f1 !important;}
.user-content { font-size: 15px !important; line-height: 1.2 !important;}
.comment-item .comment-item__header { background: #dadada !important;}
.bypostauthor > .comment-item .comment-item__header { background: #3B3B3B !important;}
.comment-item__header { margin-bottom: 8px; }
.comment-item__content { border-bottom: 1px solid #ddd; margin-bottom: 8px; padding-bottom: 10px; }
}
Thanks Richard that comment header helps.
By the way I needed to change this
@-moz-document domain(‘www.ghacks.net’){
into this
@-moz-document domain(www.ghacks.net){
before it would work.
@leanon
Thanks. It’s weird because with or without the apostrophes in the moz-document line it works for me in Stylish and in the userContent.css file, in Stylus I didn’t need to use the moz-document line or the brace } in the last line. I’ve been playing with the css in too many browsers use different methods, sorry.
I Just Noticed that reducing the margins and padding would NOT work in the userContent.css file because I did not add !important to the line even though it worked in Stylish and Stylus without !important being added. What a maroon! ;)
Martin, I removed some of the top navigation and would rather see it in the footer, just saying. So… this is working for me in userContent, Stylish and Stylus in numereous browsers:
@-moz-document domain(www.ghacks.net){
body { background-color: #f7f7f7 !important; }
.user-content { font-size: 15px !important; line-height: 1.2 !important; }
.comment-item__header { background: #dadada !important; margin-bottom: 8px !important; }
.comment-item__content { border-bottom: 1px solid #ddd; margin-bottom: 8px !important; padding-bottom: 10px !important; }
.bypostauthor > .comment-item .comment-item__header { background: #3B3B3B !important; }
div.top-navigation div.bg–darkGray { display: none!important; }
}
Ignore that I had the wrong copy or rather it didnt copy, been test driving quit a few. Yea that looks good Richard. Where you learn this at?
Here’s the progress on my dark theme, still a ways to go. That css does not like to be found.
postimg.org/image/6vtu1nhjf/
postimg.org/image/nu527yter/
postimg.org/image/z57pwc09v/
@leanon
Nice start on the dark theme. It’s taken me years to become even halfway competent with css. I started using FF the day v3 was released and starting that day I’ve been using content blockers, about:config, userstyles and userscripts. Basically learned from my many many mistakes. LoL
I first started out by modifing existing userstyles, colors, fonts, margins, padding, whatever. I’ve had to delete the userstyle and reinstall the original a few times over the years because I effed it up. I use the dev tools to find the css that is needed to make whatever changes I want. I mostly use the FF dev tools but the chromium one is similar. Right-click on an area you want to modify and choose ‘Inspect Element’. CTRL+SHIFT+I will open the dev tools with whatever you were using last, Inspector, Console, Network and so forth. Also with the inspector you can pick an element and grab a color from the page.
I usually include the full URL for my screenshots because I use a userscript (Mouseover Popup Image Viewer) which most of the time allows me to view an image link with a mouseover, don’t have to leave the page, and also view and enlarge an existing image on the page with a mouseover, I love that script. Screenshots:
https://s14.postimg.org/fudyq63y9/g_Hacks_new_theme_in_foreground.png
https://s14.postimg.org/jqram8oyp/g_Hacks_new_theme_in_foreground_2.png
https://s14.postimg.org/j18i9zyqp/g_Hacks_Dark_Compact.png
https://s14.postimg.org/v4dtx3jy9/g_Hacks_Dark_Compact_2.png
Below is my updated css light theme, made the container wider (default is 76rem and 1200px, I think) increased the line height because I reduced a bunch of margins and padding. The more lines you use in the useContent.css file the harder it is to get everything working right, for rookies like me anyway. It’s working in userContent, Stylish. With Stylus you need to remove the moz-document line and the brace at the bottom. My dark theme is done but it’s 146 lines. I would put it up on dropbox but don’t know how Martin would feel about that, so…
@-moz-document domain(www.ghacks.net) {
body { background-color: #f4f4f4 !important; }
div.top-navigation div.bg–darkGray { display: none!important; }
.container { width: 80rem !important; }
.container-fluid, .container { max-width: 1600px !important; }
.text–large, .user-content, .widget_text .textwidget { font-size: 16px !important; line-height: 1.4 !important; }
.heading, .heading–huge, .heading–large, .user-content h2, .widget_text .textwidget h2, .heading–big, .heading–medium,
.user-content h3, .widget_text .textwidget h3, .heading–normal, .heading–small, .user-content h5, .widget_text .textwidget h5,
.heading–tiny { font-weight: 300 !important; line-height: 1.2 !important; }
.comment-item__header { background: #dadada !important; margin-bottom: 12px !important; }
.comment-item__content { border-bottom: 1px solid #ddd; margin-bottom: 12px !important; padding-bottom: 12px !important; }
.bypostauthor > .comment-item .comment-item__header { background: #3B3B3B !important; }
.mt–20 { margin-top: 12px !important; }
.mb–20 { margin-bottom: 12px !important; }
.mb–30 { margin-bottom: 30px !important; }
.mt–40 { margin-top: 20px !important; }
.pt–40 { padding-top: 20px !important; }
.user-content blockquote, .widget_text .textwidget blockquote { border-left: 8px solid #727272 !important; padding: 2px 8px !important; margin: 0 0px 12px !important; }
.user-content h2, .widget_text .textwidget h2 { margin-bottom: 12px !important; margin-top: 12px !important; }
}
Richard, feel free to publish it. Perfect if users find it useful!
I’m not really sure if I should upload it or not. I started using a userstyle almost a year ago but then I’ve been modifying since day one. A lot of lines have been deleted, lines modified and many lines added. Nothing like it was a year ago. Decisions, decisions! I haven’t tried adding the dark theme in the userContent.css file, some lines probably won’t work without adding !important to a bunch of lines, it works for me as is in Stylish and Stylus. It won’t be up long.
https://drive.google.com/file/d/1EsmT5qjx2iDcrlDLn0xYkf78YAX-gBwK/view?usp=sharing
Thanks for posting your dark theme Richard am going to try it out within a few days. Here is what I have so far on what im simply calling Dark Saffron.
@-moz-document domain(www.ghacks.net) {
body {
color: #FFFFFF !important;
background: #272727 !important;
}
.heading–tiny {
color: #f3b434 !important;
background: #272727 !important;
}
.heading–small {
color: #f3b434 !important;
background: #272727 !important;
}
.heading–medium {
color: #f3b434 !important;
background: #272727 !important;
}
.heading–large {
color: #f3b434 !important;
background: #272727 !important;
}
.button–orange {
color: #f3b434 !important;
background: #272727 !important;
}
.comment-reply-link {
color: #f3b434 !important;
background: #272727 !important;
}
.search-submit {
color: #f3b434 !important;
background: #272727 !important;
}
.submit {
color: #f3b434 !important;
background: #272727 !important;
}
.navigation {
color: #f3b434 !important;
background: #272727 !important;
}
.comment-item .comment-item__header > .row > .row {
color: #f3b434 !important;
background: #272727 !important;
}
.bypostauthor > .comment-item .comment-item__header {
background: #272727 !important;
}
.bypostauthor > .comment-item .comment-item__header > .row > .row {
color: #272727 !important;
background: #f3b434 !important;
}
}
And here is the damage it causes
https://s17.postimg.org/r2g62eanz/ds1.png
https://s17.postimg.org/wqmgtamq7/ds2.png
https://s17.postimg.org/ol4ev5tcf/ds3.png
https://s17.postimg.org/a1x9u1akv/ds4.png
https://s17.postimg.org/f0ks8owf3/ds5.png
As you can see all I changed was color. Have no class for newsletter so… Also looking for a way to make the comment reply buttons to look like the search button.
You donated .bypostauthor and .comment-item they came from your post, I just slightly modifide them. Like I said earlier am new to this and am very much open to opinions.
Missed a couple
@-moz-document domain(www.ghacks.net) {
body {
color: #FFFFFF !important;
background: #272727 !important;
}
.heading–tiny {
color: #f3b434 !important;
background: #272727 !important;
}
.heading–small {
color: #f3b434 !important;
background: #272727 !important;
}
.heading–medium {
color: #f3b434 !important;
background: #272727 !important;
}
.heading–large {
color: #f3b434 !important;
background: #272727 !important;
}
.user-content h2 {
color: #f3b434 !important;
background: #272727 !important;
}
.user-content h3 {
color: #f3b434 !important;
background: #272727 !important;
}
.button–orange {
color: #f3b434 !important;
background: #272727 !important;
}
.comment-reply-link {
color: #f3b434 !important;
background: #272727 !important;
}
.search-submit {
color: #f3b434 !important;
background: #272727 !important;
}
.submit {
color: #f3b434 !important;
background: #272727 !important;
}
.navigation {
color: #f3b434 !important;
background: #272727 !important;
}
.comment-item .comment-item__header > .row > .row {
color: #f3b434 !important;
background: #272727 !important;
}
.bypostauthor > .comment-item .comment-item__header {
background: #272727 !important;
}
.bypostauthor > .comment-item .comment-item__header > .row > .row {
color: #272727 !important;
background: #f3b434 !important;
}
}
Add this in there to hide the underline link til ya hover.
.user-content a, .widget_text .textwidget a {
border-bottom: 2px solid #272727 !important;
}
@leanon
You’re getting it. Whoop whoop! ;)
I finally got around to finishing my userscript, which is a lie because it’s never really done, only temporarily. I ‘finished’ a dark theme with blue accent and made some progress on one with gold accents using some of your css, I actually like the way it turned out. I’m going to post links to both of them anyone is welcome to use and do whatever with them, I’m not going to upload them to ‘userstlyes.org’ or anything, if anyone ever wants to do that it’s fine by me.
gHacks Dark – Gold Trim:
https://s14.postimg.org/dlmz04phd/g_Hacks_Dark_-_Gold_Trim.png
https://s14.postimg.org/arjtmnkq9/g_Hacks_Dark_-_Gold_Trim_2.png
https://s14.postimg.org/vbonl5vch/g_Hacks_Dark_-_Gold_Trim_3.png
https://s14.postimg.org/413cd8kpt/g_Hacks_Dark_-_Gold_Trim_4.png
https://s14.postimg.org/jmknx6h8h/g_Hacks_Dark_-_Gold_Trim_5.png
gHacks Dark – Blue Trim:
https://s14.postimg.org/kq4s8qwm9/g_Hacks_Dark_-_Blue_Trim.png
https://s14.postimg.org/gtrgcqgrl/g_Hacks_Dark_-_Blue_Trim_2.png
https://s14.postimg.org/x4rk92gep/g_Hacks_Dark_-_Blue_Trim_3.png
https://s14.postimg.org/v0777yzch/g_Hacks_Dark_-_Blue_Trim_4.png
https://s14.postimg.org/ecfp5hcap/g_Hacks_Dark_-_Blue_Trim_5.png
gHacks Dark – Gold Trim:
https://drive.google.com/open?id=14ICY37FMHSp5ao12ayOMBZV_nym7RFjV
gHacks Dark – Blue Trim:
https://drive.google.com/open?id=1EsmT5qjx2iDcrlDLn0xYkf78YAX-gBwK
Yes great work Richard, you have everything I was aiming for plus some never thought about. Appreciate you posting your CSS, now I can see how a Pro does it. (:@
Great work Richard!
@Martin Brinkmann
Thank you sir, much appreciated!
@leanon
Thank You very much! I’ll leave all my links up for a while, I’ve updated all of them with small tweaks. And… I posted a new ‘Blues’ userstyle down below, in the basement, that I think come out well. Peace! ;)
Looks good but to be completely honest liked your last try better, now its a bit to tight for my taste. See I never even saw what your where going for I just copied it into my userContent.css.
Heres my start at a dark theme, first try ever
@-moz-document domain(www.ghacks.net){
body {
color: #FFFFFF !important;
background: #262626 !important;
}
patent pending lol
Thanks Richard, we continue our work on the site as we speak. So, stay tuned :)
Great theme, you can fix the newsletter size by disable the vertical-align: baseline;
https://ibb.co/hXi5Mb
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, input, button {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
Thank you for the change in format. It’s much more readable for my tired old eyes. The graphics are cleaner making it easier to scan the page, and I like the “flat” look.
I find it better as well, same font-size for the fron tpage and for the articles/comments.
I’m just surprised to notice that the latest article [https://www.ghacks.net/2018/01/05/google-promises-better-protection-against-deceptive-chrome-inline-installations/] still has the old font-size …
EDIT :
Repaired … same font-size now :=)
If I may… font-color seems too light here: we have a dark gray on a light gray. Maybe not black but a darker gray for the fonts could be an improvement…
Now here’s a prime example of why users use adblockers: https://imgur.com/a/h59Zh
Both ads appear on the page about FF57.0.4 and they’re both animated with the borders continually revolving in an anti-clockwise direction which is very distracting when you’re trying to read an article.
Neither ad provides a clue as to which company they belong to and there’s nothing to indicate what either of them are trying to sell. I hope they don’t appear anywhere else.
What does it have to do with Firefox, with 57.0.4 specifically?
Those ads are in Dutch by he way, so you must be located in the Netherlands or maybe in Northern Belgium (Flandres). But those are plain ads, what’s the point?
@ Tom Hawack,
Mozilla released an update for 57.0.4 to address the Meltdown/Spectre vulnerabilities, but the same patch hasn’t been applied to earlier versions of Firefox and also not to FF ESR 52.5.3.
As for the ads they’re animated, but because the link takes you to a screenshot of them the animation isn’t visible.
At the time though, I wasn’t logged in to my VPN: just my ISP which is Dutch (ik ben ook NL).
This looks nice.Keep it up !
Everything is scrunched into the middle with half the page white space and the huge text in square chunks. If I reduce the text to a readable size, that doesn’t require scrolling for a mile, the white space, of course, predominates. The comments section is one-quarter text, three-quarters white.
IMO, far too much scrolling to read an article and the text size, ultra large, is more rather than less, difficult to read.
As others have said, I also miss the link to the comments section at the top of an article page. I used it regularly on subsequent visits to an article.
I like the new comments layout and appearance (better since you tweaked it). The font size may be larger than it needs to be for a [large] desktop monitor, but that doesn’t bother me–just makes it easier to read.
You have a number of buttons with an orange/tan background and white text, sometimes only on hover. The white text is harder to read; leaving it black would look better and be easier to see.
Well, now that you’ve removed the grey background from the comment headers, all of the comments just look like one big blobby mess of text.
You should learn how/when to leave well-enough alone.
As I wrote above I like the new theme and declensions of gray are the best fit for an audience. Personally I’m a fan of blue (I got the Delft blues!) and have built Firefo’s GUI on that color whenever applicable. I’m trying right now with Ghacks and it looks like this: http://hpics.li/02f2c8b
Don’t tell me you dislike/hate it, I know most will (I’m a very special species!), but colors, when in harmony with each other, bring a touch of life, IMO. Very, excessively personal.
Very nice Tom
Wow, Tom, that’s really beautiful! How did you do this?
Yoav, I know nothing to coding, I hardly manage the basics of the basics of CSS, copying, imitating… I just added a ghacks dedicated tiny css handled here by Stylus,
/* Max width for the container */
.container {width:100% !important;}
/* My colors for the header */
.pb–20.pt–20.bg–darkGray, .text–tiny.color–white.pt–6.bg–darkGray {background: #4060D0 !important;}
.color–white.pt–10.bg–black {background: #2030A0 !important;}
The point is not the code which serves me more than I serve it! Only an example of what colors can bring. It’s my stuff, I mean choosing colors for yourself is one thing choosing them for an audience, a public is another where you must remain as neutral as possible… but for me blue is nice. Blue and orange, which fit together very well by the way.
@Martin, I know what I like but not what others like, and I’ve have to propose dozens of combinations of which many i’d dislike… I’m an artist (lol) not a producer…
Reminds me the story of a French teacher of mine when we were in the States who told us in school about her trip to Mexico and what an artisan answered her when she asked if if he’d make a price if she bought several of the same sombrero: “If you want several the same it’ll be more expensive but if you wish them all different I’ll make you a price : you see, bothers me to make the same over and over again”
The artist verses the businessman! We need both.
.color–white.pt–10.bg–black {background: #2030A0 !important;}
Thanks for the information. Unfortunately, I still haven’t installed FF 57 so I can’t use Stylish :(
Maybe we should create an official repository of Ghacks themes ;)
I like it!
I like it.
Here’s my 2 cents:
Pros: I love the new site. Much more readable for me and the ads are less intrusive. “This day in history” is a nice idea.
Cons: There is still a lot of unused width on the site, which can be used to reduce scrolling. I agree with the many comments above about the comments section: it’s bad. Parent and child comments are almost indistinguishable, number of comments is missing,and so on.
Anyway, I’m sure you’ll fix most of this stuff.
Thanks for the great site!
These are some of the problems I noticed:
Printing (or Print Preview) does not lay out page content properly or nicely. This is a major issue and a rather obvious one (Was it not tested?). I have tested this on Firefox 52.5.3 (32-bit) and Opera 12.18 on Windows XP Professional with Service Pack 3.
P.S. I have tested on Chromium 30.0.1599.0 (217165). The print layout seems better on Chromium, but does not efficiently layout information.
On Windows Internet Explorer 8.0 on Windows XP Professional with Service Pack 3, only the text can display. The previous version would display better in Windows Internet Explorer 8.0.
I’ve always archived certain Ghacks articles via printfriendly.com but unfortunately the new theme is unsupported at this time, the article is missing in the output! I hope this gets resolved.
Tom, getting printing working properly again is a top priority ;)
Thank you for the report.
Looks great, and is a little easier on the eyes. That was my 3rd and 4th thought after “dam clicked the wrong bookmark” and “shit did gHacks get hacked?”
Like how the page renders to lose the right column by zooming to 110%
Do agree with a couple previous suggestions here
1: Font could be a point or two smaller.
2: Adding a dark theme option.
Home page looks good except with the big ads on the right and images on the left I find it kind of distracting, noisy, i guess. Then again may just need getting used to.
I liked the old theme ok but this this is better. Looks to be a rock solid start.
On Tor right column is gone at 100% comes back at 90%
If thats a bug please dont fix it 0.0
Agree with everyone about the font size, which is a trendy change on the Web these days. It’s about 3 points larger than it needs to be.
Love the new Theme. looks awesome.
No complaint about the theme. But the font size is too big and Arial at this size is very ugly and distracting. This is probably the first time I’ve zoomed out a website because the smaller font is better for reading.
Edit: I guess, the font size is also responsible for this > https://i.imgur.com/ATG6cCD.png
So happy the theme changed. The readability was a nightmare on Mac. Now I can enjoy seeing the content and not squinting!
On the main front page where the articles are listed, if you click the X number of comments link under the title it does not jump to the articles first comment. It just opens the article at the top of the article.
Thanks!
Its working now, great little fix.
The font size is a bit too large.
Really don’t appreciate today’s hijacking of my mobile browser Safari from the Ad server “Facebook/Walmart prizewheel” after I had whitelisted GHacks in Adguard for iOS. I liked the look and layout with Adguard disabled, so it’s re-enabled now. I goes I’ll just have to leave it like that from now on?
Bob, can you please make a screenshot of that if it happens again please? These things are a pest, but they slip though and the only thing that I can do about it is ban them retroactively.
Lookin’ Good! Clean look – easy on the eyes. Black and gray – classy style.
i hope in the future you will add the number of comments at the top on each article. That was a feature i miss on the old layout.
i also wish the background was darker, or we had a button to switch between a light and dark theme. There’s a website that i warn you in advance is a gore site, it’s URL Removed so you might see something you might not be able to handle, lol, it will be small thumbnails on the home page anyways so you should be safe if you look on the Left side in the Middle when the page loads, you will see a Paint Brush. Click it and you can adjust on the fly between a Light Theme, Dark Theme and a Mixed Theme. The Mixed Theme is the default but i always switch to Full Dark. it will reset back to Mixed Theme when you delete your cookies. i would love to have a button like this on every site let alone on Ghacks. You could see the statistics your users select on your available choices as well.
Last but not least, i have to refresh to get the articles and even the home page to display properly quite a bit. Even using Ctrl+F5 i sometimes have to refresh 10, 15 even 20 times before it will display properly. Luckily, the site load fast !
Wow, i stopped counting at about 50 Refreshes to get your article https://www.ghacks.net/2018/01/03/you-can-still-upgrade-to-windows-10-for-free-in-2018/ to display properly and it still won’t, even using Ctrl+F5.
Rick can you be more precise. Do you acess the site on the desktop or mobile? What happens exactly?
@Martin Brinkmann – Basically i’m having the same problem of Content not loading properly. The same as this post – https://www.ghacks.net/2018/01/04/ghacks-new-theme-is-finally-there/#comment-4330524 and that included screenshot – https://screenshots.firefox.com/ob2JyX6Yh53cLS1G/www.ghacks.net is exactly what i’m seeing. i’m pretty sure it’s not any of my extensions. i saw you say there’s been a problem with your Styles Sheets not loading correctly, i’m pretty sure that’s what it is.
i’m accessing your site on the Desktop with Firefox 57.0.4 on Windows 10 and 7 and on both Laptops i’ve been experiencing the same things. it’s not a lot that it happens. But yesterday was the worst on that article i mentioned where i did have to refresh about 50 or 60 times to get it to display properly, all the other times i had to refresh 5, 10, 20 times. And the reason i refresh to get the article to display properly is so included images and screenshots in the article will display.
Also, this has been happening for about 2 to 4 weeks for me, before the new theme, sorry i haven’t kept track.
Rick, we had to disable the caching of the main CSS file to work on some changes. I have enabled caching again, please give it some time and let me know if the issue is resolved on your end.
Any chance you could implement a full dark/night time theme option at the bottom of the page. Like on the Linus tech tips forum here: https://linustechtips.com/main/ scroll to the bottom of the page and see the ‘Theme’ option in the center/bottom page. It has a daytime and a night time option. Setting that preference in say your login cookie so its always remembered once set.
For those of use who always like night time/dark modes.
Congratulations! Your website now load faster, simple conversation thread are just like forum! really nice
New articles are not showing in the old design on Android Browsers.
I am using Waterfox with a theme called FT Deepdark which blends perfectly with this new theme which I am enjoying already.
I also use the add-on `Color That Site!` to modify the bright white websites that I frequent often, no more retina burn for me!
I also think a night/day button so visitors can choose to have a dark or default theme is a great idea like a few sites are adopting now.
Yes a day/night theme option like on the Linus tech tips forum here: https://linustechtips.com/main/ scroll to the bottom of the page and see the ‘Theme’ option in the center/bottom page. It has a daytime and a night time option. Setting that preference in say your login cookie so its always remembered once set.
Agree very very ugly esp the huge bold lettering here in comments & the HUGE icon to left of posts !!!!!
Hi Martin, I kinda like the new theme except for the comments section which is very tiring to read. In most pages and articles I read, I always go to the comments (sometimes even skipping the article) and I’d suggest you to reconsider the design of this section. This is just my opinion, but how about making the comments a bit smaller, and use more space on the sides?
I don’t like the bright background it gives sore and tired eyes. Earlier i read most comments but now i read about eight and no more….my eyes hurt ! Go back to the old theme !
The theme is awesome and refreshing!
But the font is way to bold and the text way to big..
It looks like my browser is zoomed in 150-200% but the text and buttons are this big.
The font overall is hideous. I prefered the old standard wwww internet font.
Edit:
A bug when editing.
The buttons stick together in one single line like “SaveCancelDelete”.
Damnit! Pushed the wrong button. Yes I did do that.
As ugly as Windows 10 – huge dislike ! Maybe a reason not to visit the site anymore….
If that’s all you visit this site for, then indeed.
The new White/Bright theme looks good.
The new White/Bright theme looks good. Hated Win 10’s Dark(= evil) theme. Win 7’s Light blue theme was OK.
Everything is very big, please make it smaller.
The new site design is great for me in Windows 10 and Chrome. The old Chrome extension Change Colors version 2.144 still works well, with the exception that when replying to a comment, I have to click around a bit to find the spot to sign up for follow All. This may have been mentioned in prior comments here.
Looks okay to me although I liked the old version too.
Oh I noticed when I click on comments of a particular article it used to be it went to the comments section. Now though it just goes to the article and then I have to scroll down. Maybe that can be corrected please.
I usually “resist change”â„¢, but in this case I really like the new theme! I used to have a bit of custom CSS, mainly for the comments, but they now look great out-of-the-box.
I would prefer the headers for the Comments and Reply sections to be more visible, so I’m using page-wide gray backgrounds for them:
h3.heading–large {
background-color: #eee;
margin: 0.5em -99em;
padding: 0 99em;
}
I’m also forcing Liberation Sans (from LibreOffice) as the font, since Helvetica is Mac-only and the fallback on Windows (Arial) is too thick and clunky at the current size.
> I know how hardcore some users are when it comes to changes, and keeping the general layout would certainly reduce the number of complaints and criticism.
Ha ha you noticed that too ? Fuck, people get berserk for the tiniest of pretexts.
I like it, congrats! My only concern with this new layout is that when you enable privacy.resistFingerprinting or use Tor Browser, you have by default a rather square window. The top part of the website then appears like this: https://s17.postimg.org/6z7j03tn3/Screenshot-2018-1-4_Ghacks_New_Theme_is_finally_there_-_g_Hacks_T.png
And clicking the hamburger menu appears like this: https://s17.postimg.org/5y7aaphpr/Screenshot-2018-1-4_Ghacks_New_Theme_is_finally_there_-_g_Hacks_T.png
If JavaScript is disabled, clicking on the hamburger menu doesn’t have any effect, meaning we can’t access categories. (Menus can probably be displayed without JS using CSS)
It would be nice if the article categories were displayed by default even for Tor Browser users, at least on desktop.
If as a future project you could consider providing better formatting for the comment system, that would be the next best thing :)
Thank you for your comment. The comment section will see improvements most definitely.
Is the functionality limited when you access the site with the Tor browser or privacy.resistFingerprinting?
If we assume JavaScript is enabled, functionality doesn’t seem hampered so far. One can always click on the hamburger menu and see the article categories properly (second screenshot), though it’s not super practical, at least on desktop, that categories don’t show up without a click on the hamburger (as per first screenshot). Maybe this layout is more comfortable on mobile, I have only tried on desktop.
With JS disabled (e.g. through Tor Browser hard mode), categories are inaccessible due to the hamburger menu requiring JS, so functionality is affected.
Commenting probably also has some limits with JS off (can’t describe them yet), but that’s to be expected these days. If comments can be read without JS, which they can, I am happy enough already.
Thanks you!
Very nice, congratulations !
I wish you could have heard how hard I laughed when I opened this article and saw this:
https://screenshots.firefox.com/ob2JyX6Yh53cLS1G/www.ghacks.net
I’m sure I have an extension interfering or something, but my first thought was that you’re really buying into minimalism. :)
Haha, yes that is the site without stylesheet. Try Ctrl-F5.
I’m experiencing the same page-rendering issue as foolishgrunt, but only on certain pages. Refreshing (CTRL-F5) the page has no effect. Off-hand, below are some of the affected pages at the time of writing:-
https://www.ghacks.net/2018/01/04/linux-mint-team-targets-may-or-june-2018-for-linux-mint-19-release
https://www.ghacks.net/category/linux
https://www.ghacks.net/category/firefox
https://www.ghacks.net/category/the-web
Sample screenshot (as seen in Firefox on an 14″ screen, Win 7 desktop):
https://i.imgur.com/L0vkjIdg.png
And regarding the new theme …
PROS:
Adverts are now placed at the sidebar, instead of inline within the content. I found the latter distracting & confusing.
CONS:
1) The new theme makes the site load more slowly: 3-4+ secs per article vs. 1+ sec on the old theme. I’m using 90 Mbps ADSL (sole user right now). If the connection is shared, I’ve the bad feeling that with the new theme, each page might take double-digit seconds to load. :(
2) The white background is too bright & glaring. Meanwhile, the pale grey subheaders are too low-contrast against the white background. The ubiquity of such web designs is what drove me to use a dark user style for routine browsing.
3) Each page requires a lot more scrolling now, even when viewed in a desktop browser. The contents would look better at 85-90% of the current size, & with better use of the whitespace.
4) Missing: Comments No. Indicator & Jump Link at the top RHS of every article, as well as for each article astract on the home page & the respective categories pages.
5) Placing the hyperlink for each comment where its timestamp is would be better than embedding the link into its Reply button.
6) The comments section looks like an irregular wall of words — perhaps due to the lack of an obvious visual delineator, eg. a timestamp-hyperlink for each comment (… but not in pale grey against white background, because this defeats the purpose of visual delineation).
7) The new theme looks generic & not very memorable.
Thanks for your comment. This seems to be a problem with the style not loading properly. We will investigate that. We are working on other fixes as I write this.
Sign up some Sneakers manufacturers Martin. I have a girlfriend who’s made keen on them and since it’s usually me who foots the bill, I’d be happy to click the ads for them. I don’t like the Socofy shoes at all: downright ugly. And a spinning top? Really?
Site’s OK though although I can’t say I like the pale grey fonts and immediately enabled NoSquint Plus to turn them black which in turn means I have to change the colour of the links since they were turned black too and became invisible in the banner at the top. Unfortunately though, the black font doesn’t work in the comment box. Any chance of changing that?
Other than that I seem to have a problem with my VPN because all the ads are in German even though I have a Dutch IP address.
We are working on those issues, stay tuned ;)
@pHROZEN gHOST: Thanks very much for the suggestion!
@pHROZEN gHOST: I was replying above, to a comment of yours, below, thanking you for the Stylus suggestion, when suddenly your comment disappeared. Don’t know what happened… :)
Author: pHROZEN gHOST
Comment: @Hy
That comment took a lot of time and effort on your part. Well done.
I also found, even the old theme, too bright. I have been using stylus to
change the style of sites.
You can install Stylus and then add the theme …
https://userstyles.org/styles/139395/simple-modern-dark-ghacks-2018
Hope that works for you and others.
I was just waiting to see when was my theme finally gonna get some recognition.
Would love if some of you chaps would leave a positive feedback there. :)
@Zex
I’ve been using your theme probably since it was first released, thank you!
I like the earlier one better myself and have been modifying it continuously since day one. It’s like a bad habit. ;) I posted a screenshot down at the bottom of this page.
I noticed that when going to userstyles.org and doing a search for ghacks your script does not come up anymore, it did yesterday. I have the old version bookmarked and it redirects to the new version . “https://userstyles.org/styles/139395/simple-modern-dark-ghacks-2017”
I took down the body and comment main text brightness some more to #bbb. Viewing on a large plasmas screen the text is very bright set against the dark BG. I prefer a softer text intensity. Maybe add that as a advanced CSS option to set on the style page. Maybe even add a touch more deep color to the BG grey, maybe deep brown or a deep blue. Just a tiny little to add just the hint of color to the BG.
I like it Zex. In fact, the 2018 version is nicer than the original.
I have always preferred dark backgrounds. It seems that several others here do also.
However, see my comment above.
I would add options to allow certain removed features to remain. Just sayin’ …
Comments may disappear for various reasons. A core one is that it is being edited by a user. This sometimes may trigger moderation.
I did try to comment that that style is a little too aggressive. It takes out content that users may want. So I recommend editing it in Stylus. I may just do that and share a nice dark style that does not otherwise affect the site. That way, those that do not want white can have dark grey textured background.
Any thoughts pro or con?
I’m improved the theme based on some of the feedback here. Check it out!
The reason I remove things is because of minimalism my themes have.
Also please don’t fork my style if you’re planning to make your version.
Thank you.
The style I mentioned above can be modified (in Stylus) to be less aggressive by commenting out the whole section under the comment /* JUNK */. This puts back a lot of features removed by the author to widen things up. It also puts back some things I am sure Martin would not want to be removed :-|
BTW, this is not to negate the immense amount of work you have done here ZEX. I love the color scheme you’ve created.
Not against the initiative but against dark themes unless they apply on all sites. Dark themes are like air-conditioned supermarkets on very hot summer days: feels nice inside but as soon as you exit heat seems stronger than ever, and as soon as you exit a dark themed page the white of other sites break your eyes like never… See what I mean?!
Quality but as well what anyone gets less bored of with time is never declined in extreme parameters. Luck warm, luck dark, mediums are what fit the best and what resist the best to time. That’s my opinion. As it is now, Ghacks is all in harmony and I do hope Martin & friends don’t change it, at least excessively. It’s OK, Martin, keep it like that, it’s just fine!
one suggestion you really need to consider; the background color. it’s too white. beige/sand would fit better imo and easier on the eyes. or you could add a dark theme as an option?
Maybe there should be a dark and a light theme.
Congratulations Martin.
I know this has been in the works for a while now. IMHO, it looks fine.
Sure, there are differences which will take some time to get used to for some users. The change in speed is noticeable.
Of course, there will always be a few individuals who cannot adapt to change. That’s unfortunate. But everything in life changes … even life itself. Adapt or go extinct.
First reaction on graphic design : excellent.
More beautiful and modern, while you can still recognise Ghacks from its looks alone, even if you are a regular and have not been informed of the change. That’s the Graal of media graphic overhaul.
Great job, Martin!
This theme is bypassing my filters rules checked in uBlock Origin (Fanboy’s Annoyance List), this is the only site I can see the Facebook and Twitter icons, HOW IS IT POSSIBLE :(
Because those icons are not downloaded from a third-party site. They do no harm, simple links, no script. This occurs elsewhere, not specific to Ghacks.
The search button is as big as the search text field, I guess this is another mobile first issue…but it doesn’t look right on desktop. Also on desktop the newsletter sub field is not aligned correctly https://i.imgur.com/8KTPykP.jpg (FF 57, Win10, 1280×1024)
Congratulations on the launch of the new theme, Martin! I know this is the realization of a long process and lots of effort. I am happy for you!
I notice that the “Companies†category at the top keeps redirecting to the “Internet†category. Also, the comment count at the top of each article seems to be missing. That is extremely useful to have.
On the main home page under the article titles, where the author, date, and number of comments info is, it is very difficult to read at a glance now. It is done in one of the smallest fonts on the page, and the combination of the tiny font and the very light gray color of it on the bright white background make it very difficult to read at a glance. It would be great if that font was a little darker, if not a smidge bigger as well, in order to improve readability.
Under the support us/We Need Your Help section it should read “independently-run†(NB: hyphen).
I must say on every score I definitely prefer the previous theme to this mew one.
The comments section, which is equally important as the article, is definitely harder on the eyes now. The big dark horizontal bars of color are the primary highlight, rather than the comments themselves. Those big dark horizontal bars make the entire comments section painful to look at now. This is a great pity, because with many articles (i.e. those with a high number of comments) this is where the majority of the text to be read on each page is found.
With the previous theme the readability of the comments section was excellent: one could immediately see at a glance the name of the commenter, the time and date of the comment, and the comment itself.
[I note that as I was composing this post the big dark horizontal bars of color in the comments section changed to a lighter color.]
Overall the pages seems so bright now that it hurts my eyes to look at them. This saddens me, as I have spent significant amounts of time on this site over the years, perhaps more then any other site. gHacks has been for as long as I can remember my favorite site on the web!
The overall look of the new theme–dark on bright white background–is harsher than the previous theme. I miss and prefer the softer tans and color scheme of the previous theme. It was beautiful, readable, and very easy on the eyes. Using the webarchive link for ghacks posted in the comment above, one can click through the years and see how ghacks looked previously and judge for themselves.
I never found the site slow in any way to begin with, but some things now with this new theme actually seemed to take longer to load for me (on a fast internet connection on a loaded, fast machine). Anyway, that is not a primary concern; the look and readability is far more important.
There are so far so many comments from names I’ve never seen before. I’m looking forward to hearing more as well from regulars like myself who’ve used the site at length frequently and for many years.
I have to agree completely with:
RichardT
too bright background – very tiring on the eyes.
Heimen Stoffels
I still think the background is too bright. The old yellowish background was much easier on the eyes.
Giron
I miss the # of comments at the top of each article. It’s useful and the link directly to the comments is something I used a lot.
Can you please bring it back?
Sorry, because there must have been lot of effort put into this new theme, but I like the old one better.
I couldn’t have put it better: I know this theme change was a long time in the making, and one can imagine that a lot of effort went into it, but my strong preference is one-hundred percent in favor of the previous design.
Trite, perhaps, but oh-so-true: “If it ain’t broke, don’t fix it!â€
Thank you, Martin, for all that you do providing this super-great and super-useful site. Long live gHacks!
P.S. I notice that the font when composing in the “Leave a Reply/Comment” box is smaller, thinner, and much more difficult to read now. Also, the comment box itself seems a bit vertically smaller, which is not as good as before.
P.P.S. Some pages/tabs/mouseovers on the site indicate “gHacks†and some say “Ghacksâ€.
Thank you for your comment. I’m collecting remarks right now, rest assured that we will continue to work on the design.
I missed at least one typo when trying to proofread my comment before posting–“mew” is obviously “new”.
I definitely found it much easier and clearer to read when posting in the Leave a Reply/Comment box of the previous theme…
Have added that to the list of things to do.
If you could make the font size of the line below the title (e.g. “by Martin Brinkmann on January 04, 2018 in ghacks – Last Update: January 04, 2018 – 46 comments”) on the main page a little bit bigger (like it is in the articles), that would be great.
In the new Iron (is it buggy??), I can’t get the theme to render; just a bunch of text comes up. Had to move the URL to Waterfox to see it.Looks OK but too big; better at 80%.
Another site that begs for the development of a motorized scroll wheel.
I don’t like it.
I like the new design. I appreciate the larger font, the cleaner “flat” look, and the quick load times for the site’s pages. BTW, I don’t mind the white spacing on either side of the body content. I think that white space looks good, actually, and it prevents pages from looking crammed onto the screen with content. Overall, I give the new look a solid thumbs up.
I like the header and content sections – sharp, clean. Makes reading the articles more enjoyable.
But I’m sorry to say I *REALLY* don’t like the comments section. :( It seems a lot “busier” than the neat comment section before. It’s a shame, because the comments in Ghacks are worth at least as much as the article, IMO.
Oh well.
In terms of reading the actual content, I find it to be a step backwards, owing to the overlarge body font size – resolving here to 18px in articles and comments. It’s particularly jarring on the desktop at lower (720p-ish) resolutions. Overall, it comes across as a casualty of the generic, dispirited “mobile-first” design philosophy that has permeated through the web at large. I’ll tweak the appearance of the fonts with the aid of a browser add-on but such are my two cents.
I like the new theme. It looks good, everything is well legible and navigation is easy.
As to donations, since you are based in a EURO/EU country, it should be very easy to use electronic bank transfers for financial contributions. Everyone has a bank account, so all EU citizens/residents need to make a donation is a Ghacks international bank account number (IBAN).
Dull dull dull
Good. The best site design is one you barely notice when you’re using it. It doesn’t intrude on or distract from why you’re there in the first place.
Lack of contrast is a fatal flaw in web design. Gray on gray fails every known precept about visual perception.
I think someone might need to adjust the contrast and/or brightness on their monitor(s). I see nicely contrasted grey and white backgrounds on mine, but then my monitor was calibrated when I set it up.
Try not to be so concrete. Grey on white is just as bad as grey on grey. Source: Psychology of Perception 101.
There are many shades of grey. The formerly grey background was just a visual cue to differentiate the header (with black text) from the white background or the page (well-differentiated on my monitor). There’s no psychology involved. If white looks like grey on your monitor, then you either have a problem with your monitor (usual) or your eyes (not usual). Before I calibrated my monitor, there was little differentiation. Not calibrating one’s monitors/TVs is not unusual, but everyone should do it.
Now there’s only a thin grey line–it doesn’t help much. What isn’t readily visible causes eye strain. It looked good; now it doesn’t.
Grey on grey would rather refer to a Psychology of Non Perception !=)
LMAO! I just saw the comment!
With that I agree. Dark gray on light gray is a fashion but quite uncomfortable. If the font is smaller no need to add moreover a light color. I’d keep it black or slightly under, but definitely not light gray given the page is already gray (which I like by the way, easy on the eyes).
The comments look a bit messy to me, sure the name of the commenter and the comment date separate comments from each other but it is still difficult to follow, especially between a comment reply and the next comment.
We will work on this to make the comment section more easy to follow.
Nice and clean. They new design looks and works great.
I like it. Slick, elegant hence not flashy, comfortable (“they’re so comfortable I think I’ll take two” as she used to say!).
I’ve increased the layout width though,
@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document domain(“ghacks.net”) {
.container {width:100% !important; }
}
mainly because if the original width is fine for the article it becomes a bit narrow with the comments’ layout.
Does anyone remember how we were once told about the coming 3D desktop and all the advantages that it would provide?
Didn’t think so :(
Taste is subjective, but functionality is not:
I miss the # of comments at the top of each article. It’s useful and the link directly to the comments is something I used a lot.
Can you please bring it back?
As for the taste part, the new theme looks and feels like everything else on the internet. Some “personality” (which was before), should be put back.
Some specifics:
Too-large font, bright background, comments section too “square”.
Sorry, because there must have been lot of effort put into this new theme, but I like the old one better.
Nice look Martin!
I like it!
Good job Martin, you can be proud of it.
The only thing that does not seem to have changed is that when I subscribe to receive comments on my comments, they do not arrive in my mailbox.
Up to right now, Main first impression is that I am ferry positive/pleasantly surprised and the Ghack.net pages looking like a clean mean easy to read reading machine.
Maybe I have to get used that the words – or sentence part who have hyperlinks are from now on only underlined, in the same color as the rest of the sentence.
Thankfully the functionality hasn’t changed.
It definitely loads faster on my win 8.1. The new look, well, it’s not too bad and as long as the quality of Martins site stays the same I can live with it. It really is a wonderful site with lots of useful info.
Looks good–nice, clean layout and easy to read. I liked the look of the “old” site. I like the new look better. It takes good advantage of color cues as well.
I don’t have any problem with subscription models. In fact, I think they’re a good idea for sites, and having ads is the worst way to go. Turning a site into a billboard is never a good idea. Ads only serve to devalue the sites that have them. (Obviously, subscribers should never see any ads.)
I like what you have done with the place, I could get used to this
Hello Martin, this is excellent job.
Positive observations :
> It indeed loads faster than before (all is loaded and displayed in The theme is very clear and nice, modern, and keeps the main aspect of previous one, I don’t think so many users can really be “in shock”.
Personal taste :
> I found the main header a little too “big”.
Side note :
> The header logo doesn’t match the favicon anymore. This could be nice to have the same header logo and favicon.
Overall, I sincerely appreciate this upgrade. Congratulations to you (and Daniel Pataki).
Long life to GHacks!
Apparently a part of my comment is missing… Maybe a bug with the use of “<" char ?
[ReTest] I wrote : (all is loaded and displayed in < 0.9s here)
I still think the background is too bright. The old yellowish background was much easier on the eyes. But the rest of the site is much better now! :-)
The only issue I’m having is that I can’t log in anymore… the login URL gives me a 404.
Try https://www.ghacks.net/wp-login.php
That’s the URL I had, but it returned a 404. But now it does work, so not sure what’s wrong. I didn’t get a notification of your reply though, even though I had set it to Replies to my comments, so not sure why that isn’t working either.
Thanks though! :)
I agree with your notification comment, in fact, it never worked for me: I never receive any notification even though I always set it to “Replies to my comments”.
@Martin: please investigate & fix.
I like it a lot… Only the comments section looks a bit clusterf; Kinda too much noise and thus slightly confusing. Otherwise overall much better.
Finally! I like it very much!
Congs for the respectful briefing and consequent new layout. Best
Nice look ,and it is faster
Felicitari !
Looks clean and slick :) I like it!
Better than before
Font is too large :( Old one was perfect. Also the box where it says “Don’t subscrribe” looks broken, the dropdown arrow colides with other elements. And hyperlinks are hard to notice due to being the same colour as regular text.
I have added the subscribe bug to the list of bugs we will address asap.
Hyperlinks are underlined, are not they on your end?
Yes, they are underlined, but a different colour would have been better imo. Also, the hover animation of hyperlinks doesn’t play nice if the link spans across two rows (only first row gets the underline coloured orange, but not the rest of it, on the 2nd row).
Thanks for clarifying that. I changed the color for now.
Thank you. It is much better now! :)
Looks good. I like it!!!!
Sorry, not my thing. After stupification of functionality (Apple, Win10 etc) comes stupification of design (again, Apple, Win10, and now ghacks).
Agreed. I hate the way the text is confined to a thin column with much wasted space either side and really hate the flat look and too bright background – very tiring on the eyes.
Martin, FYI (firefox 52-esr) center column is pinched to a too-narrow width, both on mainpage and on individual article pages. Here’s a screenshot of what I’m seeing.
https://vgy.me/UD9vrU.jpg
Also on 52-esr, and the look is OK here – almost like Martin’s screenshot.
Hi gh, thanks for your report. Are the article pages also squeezed that way?
Yes, as previously stated “both on mainpage and on individual article pages”.
FWIW, I have now tested and found that neither my installed TorBrowser nor Palemoon are affected… but my older, separately sandboxed, firefox-esr (v45) is indeed affected.
No custom userChrome is involved, no css-mangling browser extensions are in use, leaving me wondering which (or multiple) among my myriad customized userprefs might be responsible for this unexpected result.
Lookin’ good, loadin’ fast. Nice work!
There’s too much wasted vertical space between the comments, though, at least for my taste.
Looks nice, good job :)
Always the non-transparent favicon unfortunately. Like for Startpage. With black themes it looks horrible.
Not on Opera’s black theme it doesn’t.
Very nice. All I care about is the content, not the design of the site.
Waw!
I was just reading an article when the new theme was changed!
Congrats! It’s beautiful.
I like all changes.
Looks very good (except for the black banner at the top).
And yes, the loading of pages has become faster, which is very, very happy! ;)
Yep can’t agree more. Martin I would if I may:
.bg–darkGray {
background: white;
and set the logo letters to black and orange.
It’s really good Martin. Clear and simple. Awesome work.
Massive improvement – I love it.
It is a massive improvement, Idle still prefer a dark theme option but there we are, cant have everything we want.
Looks good, I enjoy it.
Any particular reason why the site still displays the old layout on Firefox for Android ?
Yes, forgot to mention that. We still run WP Touch for now which handles mobile. We need a bit more time to optmize the mobile version, but will replace it eventually as this theme is responsive.
Ugly as sin font size for the visually impaired. I have to CTRL+scrollwheel -2 iterations to make the text the same font size as normal news sites use.
This is no verbal attack but a very sincere opinion. PLEASE rethink the sizes of text!
Please reply so I know you will consider it at least. I don’t want to repost until I feel noticed :(
Noticed.
Did you change it already? I notice it is so much easier on the eyes now to read articles and comments. Now the new design is alright. Also nice choice for the highlight colour on your comments.
Thanks again!
I don’t like the flat look. Sorry to say. Modernism once again reigned supreme over usability.
What nonsense is this?
>I don’t like the flat look. Sorry to say. Modernism once again reigned supreme over usability.
@Appster
Clearly you woke up on the wrong side of the bed.
What exactly is less usable? NOTHING!
The only criticism is that the comment edit the SaveCancelDelete options are spaceless between words just like I typed it.
That or you dont know what usabilitity is.
Congrats on getting the new theme up and running Martin!
The flat look wouldn’t be my design choice but it’s not a big deal. Actually, it looks good with the dark userstyle that I use. And the text now looks better to me at the default zoom.
Like before, I think there is too much wasted space on the sides which could be used to make the article wider and the sidebar could still keep the current width.
The website has always loaded very fast for me. 625 ms is the fastest page load time I’ve seen today, mostly in the 800-900 range though.
Comments link from the Home page, for any article, doesn’t work for me in FF or Chrome.
That’s weird that my comment ended up as a reply to Appster when I added it from the bottom of the comments section. User error? Misfire? ;)
What makes it less usable?
The internet has always been flat.
https://web.archive.org/web/20060104000102/http://ghacks.net/
But it was a different kind of flat. Now everything is big and oversized for no apparent reason, everything looks like “cards”.
Right now the new theme is overall fine, but many elements are waaaaay too big for my liking, like the home page and the thumbnails for each article take up way too much space, before, one could see more articles on the screen at once, now they have to scroll more.
Yeah I actually have to say I liked the older theme. But I do notice this one is slightly faster. Still partial to the old look :(