Report Blog Entry
Last updated: 26/11/23 (DD/MM/YY), ~9:10 PM CET.
THE LENGTHY INTRO ⫻
Predicament: I value my eyes. By extension, I value all dark modes everywhere because they're easier on said eyes. SpaceHey does not have a dark mode. I made one because, again, eyes. There's really not much to it besides that.
What you're seeing right now is a preview of sorts for the theme - more specifically, its base design along with the extra compartmentalized bits used for comments and the like. In stark contrast to SpaceHey's clean, generally ultra-bright styling, I wanted At Night to live up to its name (to some extent, anyway) by going down the route of using softer, duller shades of purplish blue on almost every side, combining it with sharper / lighter shades of blue for extra contrast here 'n there and a sort of rich lavender(?) for links + other various objects of note. Point being, though, you'll be seeing a lot of blue.
There are a few (mostly important) things worth noting, though.
- This theme is no longer in beta! There are, of course, still a few holes here and there that demand patching, along with some stylistic choices that could do with some revising - but for all intents and purposes, At Night is mostly complete. More than I could've asked for when I started laying its foundation out two-ish weeks ago.
- That said, a lack of styling may be intentional. Profiles, blog entries, and group pages are all untouched for an ideally obvious reason; they may contain styling of their own, and because At Night comes in dead last as far as load order's concerned, it would inevitably clash and create a mess.
- It's created based on my preference. (Alternatively: I am a selfish bastard.) I love purple, blue, and purplish blue to death. They will always be non-negotiable. Everything else is (mostly) open to discussion and subject to change.
I think that just about covers most of what I wanted to say. Onward!
THE ACTUAL THEMING PART ⫻
To make this work on your end, you'll need two things.
- A browser that supports most present-day CSS3 pseudo-selectors and pseudo-classes. Judging by the few W3 specs I read, this essentially means "newer than ~2017" which I'd hope shouldn't be a problem for anyone, yeah?
- Stylus, the local CSS "injector" that made this thing possible in the first place. Installation depends on your browser: you can get it for Chrome, Firefox, and Opera. If you're an annoying hipster like me and you're using a Chromium fork that disables the Store, load the unpacked version from here.
All that leaves us with is actually styling the site, so bear with me for a minute. (Or don't if you've already gone through this before, I won't judge.)
- Head to the SpaceHey homepage.
- Stylus should be comfortably running in your Extensions tab somewhere at the top. Or on the side. Or wherever else. Either way, click on it to open its menu.
- Amidst the handful of buttons, you should see "Write style for:" followed by "spacehey.com/this URL". Click on spacehey.com.
- You'll now get a nice 'n cozy editor interface in a new window. Look to the side and find the Import button.
- Here's the kicker: copy all the text/code from here (as stated in the initial comment, starting from
@-moz-documentonwards) and shove that into Import's textbox. - Click on "Overwrite style."
- Give the style whatever name you want and then save it.
※ If you're updating the theme, repeat these steps but delete the previous version first.
Bonus:
You can now integrate a slightly stripped-down version of the theme into your bulletins. Similarly, you can also integrate a less stripped-down version into your profile, if that tickles your fancy. Upon creating your bulletin, enter HTML mode (the <> icon) and throw all of that into a <style> tag, as you normally would. Same goes for the profile (save for the HTML mode bit, obviously).
+ Thanks to Cross for the suggestion.
Congrats! If everything has gone according to plan and nothing crashed and burned in the meantime, you should now have a (mostly) styled, easier-on-the-eyes SpaceHey. Now all that's left is to bask in its, uh... I mean, we'll call it glory, it's just that I have some reservations about that.
It probably goes without saying, but if you have any inquiries or questions (or compliments, wink wink nudge nudge), holler at me.
Comments
Displaying 12 of 12 comments ( View all | Add Comment )
An
OMG THAT LOOKS AMAZING!! 👀👀
A nativ dark mode for spacehey has been on my to-do list for ages, but I just can't find any time for it... maybe someday
Anyways, your theme is AMAZING!!
actually flat-on-my-ass flabbergasted to hear this straight from the mouth o' the lion, but thank you so much!!!! a native setting would most certainly be appreciated, but after all the steps taken to getting here, i can totally get why you might see it as an arduous time-sink ^^;
by Ikoe; ; Report
✝ C&SP ✝
I've got a question...
If I put a custom layout on my bulletins, will the Stylus script mess it up?
Also wondering if you'll ever turn this into a profile/bulletin layout, I'd love to use it on my bulletins
by ✝ C&SP ✝; ; Report
the theme covers /bulletin and its respective elements, so yeah, custom <styles> would clash with it, most likely. you can manually undo this by simply removing every mention thereof - in stylus itself, these are entry ~43 in code block 1, entry 2 in code block 8, and entry 1 in code block 9; in the CSS itself, these are (at least in this version) at line 9, line 191, and line 200.
an emphasis on "manually" because unlike blogs, stylized bulletins - at least from personal experience - are notably rarer to come by than the former, partly due to the temporary nature of the thing. to that end, it seems sensible enough to make a trade-off; potentially mess up the layout on someone's five-day bulletin in favor of making the theme more consistent for the average user.
regarding the layouts; i can whip up a standalone bulletin CSS in a few hours. will attach it to the bottom of the blog once i do so. profile's gonna be a tiny bit more time-consuming—at best, i'll have it done by tomorrow. at worst, some point during the weekend. will see.
by Ikoe; ; Report
so that was a gross overstatement with regards to the ETA. in any case, enjoy. feel free to reply to this if any issues pop up w/ the CSS down the line.
by Ikoe; ; Report
Kurante ᓚᘏᗢ (nsfw dni) yuh
THANK YOU SO MUCH I CAN FINALLY REST MY EYES
BobieBobs
OMG THX SM!!!!!! MY EYES HAVE BEEN SAVED I CAN FINALY READ THANK YOU!!!!!!!!!!
SATURN RAZORBLADE
hi i'm using this! i love purple so its very much to my tastes :D
__x3m0lif3styl3__
It looks so cool!!!
yayoi22
Yessss let me guess, when you say “a chrome fork that disables the store” you mean ungoogled chromium right?? Don’t know if i wanna be known as a hipster, but i’ll take it if it prevents google knowing more about me than i do :3
right you are! i've been using marmaduke's builds off of woolyss' chromium archive for aaaages now and i love it to bits. amen to that, btw :p
by Ikoe; ; Report
oooooh nice I wasn't aware of alt. builds to the ones supplied by the ungoogled-chromium project itself! sucks woolyss doesn't have a macos arm64 build of ungoogled.... I was really looking for an up-to-date build, i'm running is still v92 :( oh well, *fingers_crossed*, no hackers get me
by yayoi22; ; Report
used to go with the project's git builds until i realized i was lagging behind by several versions as well. talk about cross-platform suffering!
that said, i wish i had something besides "just patch/build your own, lol" but 1. it's a lazy response(!) and 2. the woe of having to build chromium is not lost on me. i blame gentoo and portage.
*shudders*by Ikoe; ; Report
yeah I mean it's not that i couldn't build it myself, I just really, really could not be assed doing it \''/ i've played with arch linux enough, and owning a mac was supposed to save me from those nightmares, not give me trauma flashbacks... maybe there's room for me to contribute an automated build process to someone's Github repo, thanks for the linx!
by yayoi22; ; Report
neisha<3
this is so cool!!! love this
ty, happy to hear that! ^ᴗ^
by Ikoe; ; Report
✨Lo✨
Oh this is devastatingly cool
ratscallion
this is so kewl!! gj!!
thank ya kindly! ^^
by Ikoe; ; Report
ik3da
> I love purple, blue, and purplish blue to death. They will always be non-negotiable.
behold, the most correct of hue-based opinions!
seriously, great theme! when i finally get around to learning more intricate profilemancy i’ll probably use your source as a reference, just going off appeal ;3
it all comes together and looks just sublime.
immensely happy to hear that—though i do have some reservations about being a reference point, if only because of Perfectionism™ and the troubles that come with it, blarg.
(also, using any other palette of colors for a dark mode would probably classify as heresy, frankly :v)
by Ikoe; ; Report
iason
quite cool
is this a wisecrack at all the Blue™ or is my pun-infested brain being stupid again
by Ikoe; ; Report
the latter. i quite appreciate your nightmode, work good.
in case it is not intentional, the notification icon in the main page under one's own profile are and above the my mail area is blue.
by iason; ; Report
update: should be good now. overrelied on my boy
:notbut forgot that i can just, uh, undeclare stuff a line later.by Ikoe; ; Report
you should totally reply to this so i can see if it has indeed worked
by iason; ; Report
[essay-length deconstruction of the themes and topics present in shrek, the 2001 animated masterpiece]
by Ikoe; ; Report
it indeed works, awesome
by iason; ; Report