NationStates Dark Theme (Rift)

[Northrop-Grumman]

Unsure if this is still actively updated, but if it is I’d like to propose a change to the colors used for RMBs. Specifically, the yellow background color that highlights a new RMB message seems to be unchanged from the default theme, which makes the text (which uses the light gray color from dark theme) unreadable. It just also bothers me when I use the site on dark theme, check new messages on my region’s RMB, and get blinded with yellow boxes. It would be nice if this highlighting feature had a different background color or was just removed from dark theme entirely.

This is still being updated. Unfortunately, I've been sick lately, so that has taken up much of my time. I'll take a look at this and see what I can do, but I can't commit to a quick fix at the moment. Apologies.

[Northrop-Grumman]

Unsure if this is still actively updated, but if it is I’d like to propose a change to the colors used for RMBs. Specifically, the yellow background color that highlights a new RMB message seems to be unchanged from the default theme, which makes the text (which uses the light gray color from dark theme) unreadable. It just also bothers me when I use the site on dark theme, check new messages on my region’s RMB, and get blinded with yellow boxes. It would be nice if this highlighting feature had a different background color or was just removed from dark theme entirely.

After re-reading this and testing it out on two different browsers, I cannot reproduce this issue. Can you take screenshots of what you're seeing?

---

In the meantime, I've updated the theme.

2023-07-01
- Fixed Z-day issue where superweapon panel had white background.
- Removed white shadows from Z-day superweapon status text.
- Fixed Z-day issue where superweapon level text had a white background.
- Fixed issue where N-day stats had a white background.
- Fixed issues where trade fair alerts had light background.
- Fixed issue where Cards Against NationStates status had light background and cards were light against a light background.
- Lightened Alter Authority box border on Region Administration page.
- Added padding to map top to space it from World Factbook Entry.
- Fixed issue where disabled Add Ripple Effect option had a light background and darkened text.
- Removed background from file upload box.
- Brightened "New" indicator on new regional message board posts.
- Fixed issue with Trading Card table headers where border-radius was removed on hover.
- Darkened Trading Card sell/buy buttons on hover.

[Northrop-Grumman]

I wanted to throw out to everyone a solicitation for any tweaks that can be made to the theme or any areas I've missed. I want to balance readability with having the theme actually be dark, so if there's something that's too bright or too dark, please do let me know. I'm not planning on doing drastic changes, but instead refining what's there. I don't do change for change's sake.

For example, here's some things I'm working on. I have the framework for the CSS code, but it's now a matter of making sure the colors work right. So these are not quite final yet - the new editor toolbar needs to have the icons be lighter.

Old Editor Toolbar:


New Editor Toolbar:


Old Trading Card Filters:


New Trading Card Filters:

[Improper Classifications]

About the editor toolbar - the style (with the rounded corners and such - I hadn't realised it was like it is now until now) looks really good but the color scheme doesn't. I agree that the color needs to be lighter.
The cards look pretty readable - I would suggest removing the visible borders entirely but not everyone would agree with me.

[Northrop-Grumman]

About the editor toolbar - the style (with the rounded corners and such - I hadn't realised it was like it is now until now) looks really good but the color scheme doesn't. I agree that the color needs to be lighter.
The cards look pretty readable - I would suggest removing the visible borders entirely but not everyone would agree with me.

Hrmmm...removing the visible borders is an interesting idea. Could have them only appear when your mouse hovers over them or when that particular filter is active.

[Osheiga]

Unsure if this is still actively updated, but if it is I’d like to propose a change to the colors used for RMBs. Specifically, the yellow background color that highlights a new RMB message seems to be unchanged from the default theme, which makes the text (which uses the light gray color from dark theme) unreadable. It just also bothers me when I use the site on dark theme, check new messages on my region’s RMB, and get blinded with yellow boxes. It would be nice if this highlighting feature had a different background color or was just removed from dark theme entirely.

After re-reading this and testing it out on two different browsers, I cannot reproduce this issue. Can you take screenshots of what you're seeing?

I just grabbed the most recent post from my region’s RMB, but the background that accompanies an unread message looks like this, at least on Safari/iOS:

[Northrop-Grumman]

After re-reading this and testing it out on two different browsers, I cannot reproduce this issue. Can you take screenshots of what you're seeing?

I just grabbed the most recent post from my region’s RMB, but the background that accompanies an unread message looks like this, at least on Safari/iOS:

Ahhh, okay. I've never actually tested this on a phone; I assumed folks would use the mobile theme.

While I don't have Safari/iOS, I did try it now on Android/Firefox. I definitely can replicate that picture but oddly enough, the dark suddenly snaps into place about three seconds later. I'll scroll down on the regional message board and the next few posts will show that light yellow color but will snap to the dark theme shortly thereafter.

Here's an example of where the theme loaded and then I scrolled down to the following posts.


I don't think it's necessarily an issue with the theme itself but how mobile browsers load pages.

[United Calanworie]

We highlight new RMB posts until you scroll to/past them, I would think that would be the cause here.

[Northrop-Grumman]

We highlight new RMB posts until you scroll to/past them, I would think that would be the cause here.

Hrmmm...why would this issue only happen on mobile browsers though?

[United Calanworie]

Spitballing here because I haven’t looked into it, but it’s probably something to do with how we highlight unread posts on mobile vs pc. On PC it fades quickly, but I think it remains until you scroll past the whole screen on mobile.

[Improper Classifications]

Spitballing here because I haven’t looked into it, but it’s probably something to do with how we highlight unread posts on mobile vs pc. On PC it fades quickly, but I think it remains until you scroll past the whole screen on mobile.

Testing this now.
Edit: I get no highlighting on PC at all, so either it just isn't there or it fades so fast I can't get to see it before my 165hz monitor loads the page.

[Northrop-Grumman]

Updated!

2023-07-22
- Darkened text editor toolbar, shifted it to the right, and rounded top corners.
- Moved all style changes for cards to existing dark deck stylesheet.
- Lightened backgrounds for card types.
- Lightened card filter colors, darkened borders, and lightened text to improve readability.
- Switched filters to be brighter on hover.
- Added lightened background to all card tables.
- Darkened "Owned" card tag.
- Increased space between historical price graphs and page footer.
- Increased space between auction trades table and page footer.
- Added borders on hover for card season selection buttons.
- Darkened background for trading statistics numbers.
- Darkened bottom border on all table rows.
- Reworked main site navigation page numbers to match style of forum page numbers.
- Changed banner buttons to remove top/bottom white bars on hover.
- Removed lighter background from top banner Switch and Logout buttons.
- Fixed issue where telegram navigation page numbers were aligned to the right instead of center.
- Removed transparency from banner login box, notices, and dossier and changed to match the side panel popout menus.
- Fixed issue where banner and side panel button text turned black when pointer was on popout box.
- Centered Show Trend picture on ranking table.
- Removed background to lighten horizontal bar on Subscriptions Notice page.
- Lightened border on text editing preview boxes.
- Fixed issue where larger regional flags covered dropdown boxes on upper right of regional census page, regional admin page, and posts on message board forum view page.
- Slightly reduced maximum size of region flag on main region page.
- Added lighter background and removed box shadow on dispatch articles.
- Fixed issue where dispatch table headers removed rounded edges on hover.
- Changed nation and region navigation bars to be more white-toned.
- Removed box shadow from regional message board search box.

[The Ambis]

All looks Fantastic! Thanks NG

[YoriZ]

The Dark Theme seems to interfere with the Map feature. I was unable to get the interface to choose colors and appoint them to nations. The moment I switched from dark into default, the interface worked.

[Northrop-Grumman]

The Dark Theme seems to interfere with the Map feature. I was unable to get the interface to choose colors and appoint them to nations. The moment I switched from dark into default, the interface worked.

I appreciate the heads up about this. I haven't yet used the map function, which is why I missed this, so this is going to be a learning experience!

[Valentine Z]

The new changes are a lot more unified and consistent, and I really love them! <3

Thank you as always.

[Northrop-Grumman]

Updated!

2023-08-12
- Decreased region flag size on ranking and history pages to be consistent with other region pages.
- Revised buttons in regional administration (Withdraw Embassy and Embassy Promotion buttons), settings (Update button), advanced dossier (Download/Upload Nation Dossier File buttons), and store (Gift Options button) pages to match all other buttons on the site.
- Removed max-width restriction to match default site settings and allow tables to expand across the screen.
- Centered Security Council at Vote table on WA main page.
- Added spacing around "Update this map to this version" button on Update a Map page.
- Added spacing between World Factbook and Map tables on main region page.
- Fixed issue where tooltips were not appearing on maps.
- Darkened background for regional map tooltips
- Removed yellow box around Maps filter on activity page.
- Removed left border on flag upload table on regional administration page.
- Removed border around own nation name on store page.
- Fixed issue where nation table header on zombie spotting page brightened on hover.

[Ever-Wandering Souls]

Thank you kindly NG, for the ongoing upkeep of an essential feature.

[Improper Classifications]

Ahh, I was wondering why a bunch of buttons changed.
I got one gripe:

^ Not very dark themey button on nation creation page.

[Quebecshire]

I was told to report this here. Historic resolutions don't pair well with dark theme.

[Northrop-Grumman]

Ahh, I was wondering why a bunch of buttons changed.
I got one gripe:
(Image)
^ Not very dark themey button on nation creation page.

Thanks for the heads-up!

EDIT: Is all the text Times New Roman in the nation creation pages for you?

I was told to report this here. Historic resolutions don't pair well with dark theme.

Hmmm...the list of all historical resolutions does not have the issue, but the single historical resolution pages do. That's an easy enough fix. Thank you for letting me know!

[Valennia]

Not sure if it's 100% theme related or something else, but certain elements using the align tag in factbook entries do not work the same in dark theme vs default Rift. For example, my overview factbook, where the image and the text are within the same align tag, but are not exactly aligned in Dark.

Rift (Default): https://i.postimg.cc/pRMhjtdt/Screenshot-from-2023-10-26-20-37-16.png
Dark: https://i.postimg.cc/Wjkqt4Tn/Screenshot-from-2023-10-26-20-35-03.png

For reference:

Code: Select all

[align=center][img]https://i.postimg.cc/vHxXTyq2/Val-Gov-Banner-LD.png[/img]
[color=#811331]
[b][size=150]The Kingdom of Valennia[/size][/b]
[i]In Somnis Veritas[/i][/color][/align]
[hr]

[Northrop-Grumman]

Not sure if it's 100% theme related or something else, but certain elements using the align tag in factbook entries do not work the same in dark theme vs default Rift. For example, my overview factbook, where the image and the text are within the same align tag, but are not exactly aligned in Dark.

Rift (Default): https://i.postimg.cc/pRMhjtdt/Screenshot-from-2023-10-26-20-37-16.png
Dark: https://i.postimg.cc/Wjkqt4Tn/Screenshot-from-2023-10-26-20-35-03.png

For reference:

Code: Select all

[align=center]([url=https://i.postimg.cc/vHxXTyq2/Val-Gov-Banner-LD.png]Image[/url])
[color=#811331]
[b][size=150]The Kingdom of Valennia[/size][/b]
[i]In Somnis Veritas[/i][/color][/align]
[hr]

After poking around with it for a bit, you're right - it is dark-theme specific. Apparently, adjustments made to the endorsements box on the upper right of the Factbook also affect pictures below it, like yours, causing them to shift slightly. I'll add this to the list of things to fix. Thanks for letting me know!

Also, for folks wondering when the next update to this will be, I've had a lot of things going on personally and they're still going on, but I'm expecting to start becoming a little freer with time around mid-November.

[Northrop-Grumman]

Alright, everyone, I've started putting together these fixes (and a bunch of other fixes I spotted along the way, especially with the Create a Nation pages). I still have to do extensive testing here and there over the next few weeks (breaking for the Thanksgiving holiday, of course); I don't want to implement something and have it break everything else. I also have to make sure that none of these changes need to be made to the Century Dark theme.

Ahh, I was wondering why a bunch of buttons changed.
I got one gripe:
(Image)
^ Not very dark themey button on nation creation page.

I'm fixing this issue, as you can see here. I also noticed the header above that 3x3 grid was not centered and corrected that.

I was told to report this here. Historic resolutions don't pair well with dark theme.

I'm fixing this as seen here. I also corrected the brightness of some of the text. It was way too dark.

Not sure if it's 100% theme related or something else, but certain elements using the align tag in factbook entries do not work the same in dark theme vs default Rift. For example, my overview factbook, where the image and the text are within the same align tag, but are not exactly aligned in Dark.

Rift (Default): https://i.postimg.cc/pRMhjtdt/Screenshot-from-2023-10-26-20-37-16.png
Dark: https://i.postimg.cc/Wjkqt4Tn/Screenshot-from-2023-10-26-20-35-03.png

For reference:

Code: Select all

[align=center]([url=https://i.postimg.cc/vHxXTyq2/Val-Gov-Banner-LD.png]Image[/url])
[color=#811331]
[b][size=150]The Kingdom of Valennia[/size][/b]
[i]In Somnis Veritas[/i][/color][/align]
[hr]

And lastly, this is getting fixed, as seen here

[Durmengrad Prime]

That is a thing.