The NightScript Domain!
This website was made to record various accomplishments I’ve done over the years, pass time during COVID-19 & used as a distraction from listening to the teachers. The content you may find here could range from video game reviews, blogs, projects or other things I may throw onto here. Like the other projects you’ll find on here, it is open source on GitHub. While the goal has stayed the same over the years, the design has completely changed.
History of the Website Design
This website didn’t originally start out as a personal website. The layout was made originally for a 1:1 discord clone I was told to make in the summer of 2017. I left when I got tired of being bossed around, but I didn’t want to waste all the work I put into it. That’s when I started making it a portfolio website instead. Since it was planning to be a static website, I opened up a GitHub repository and started hosting it on GitHub pages, commenting out any Discord-specific content. I also got sick of the color choice used by discord’s official dark theme, so I used Material Discords’s color scheme. However, regardless of the new paint job, the root of the projects were still a discord clone, boiling down to a bunch of unused CSS.
The unused CSS wasn’t the only badly designed thing. I developed this before I took a dive into Bootstrap, meaning I used Acmlmboard page design. Using tables for page layouts was highly discouraged and has been an outdated practice since 2001 (source: The Programmer’s Hangout Discord Server). This outdated design also led to mobile issues and incorrect layout rendering. Plus, even if I fixed it, discord’s design wasn’t mobile friendly. In order to actually accomodate everything, I’d have to zoom out the screen. Also, I always hated how the sidebar was always there when you didn’t need it. It was time to start from scratch, this time using Bootstrap 4.
Midnight UI was extremely eye catching for me, and I have to give all the credit to Tropical#8908 for knocking every other discord theme out of the park with this custom theme. After adjusting the color sceme and importing the macOS mountain background, I’ve got an identical match between the BetterDiscord theme and my website. I did have to slightly tweak the design because a Discord chat room and a portfolio wesbite had two different goals and design philosophies, but it was still recognizable to the betterdiscord theme. As an example, rather than have the gray background used on posts, I had my text go directly on the background for a bit of a cleaner vibe. Also, my sidebar links were slim whereas they’re fully fledged buttons on Midnight UI. I hadn’t stolen any actual code either, since the BetterDiscord code was confusing whereas I’m trying to keep mine clean. The only issue I’d run into myself was the mask-image not working properly, but Evie11 helped me with that. Of course, I used a Windows 10 PC whereas people would be using all sorts of devices, and that’s why I hadn’t caught the issues of mobile and Apple.
Notice how I repeated mobile and apple? The first issue I had was with the background not appearing. It was just the solid color. Thankfully, Evie made me aware that
background-attachment: fixed would not work on mobile and made a solution. Evie is also the one who fixed the button issue, suggesting that I use Font Awesome’s up arrow instead. Both of her workarounds worked fine, I just needed to do things on my end. To fix the background error, I had to make a new div element that had a fixed position, and that would contain the background. I also needed to change the cover to the top, and that was quite…I dunno, I’d rather have it in the middle but life isn’t perfect. I’d much rather having presentability on a mobile device than just a simple few pixels towards the top.
The above changed has also let me do something I was dreaming of doing ever since I saw RocketRobz’s Homebrew Launcher theme for TWiLight Menu++; moving bubbles. I wasn’t sure how to do it, but Samplasion helped me out. I had to make it two canvases (since I had the gradient and bubbles in one) but it was all worth it.
After a certain point, however, I couldn’t work on simple HTML. Inconsistencies were bound to happen, I was tired of indentation and HTML is eh. Thankfully, I made my own Jekyll theme and GitHub pages works directly with JeKyll. Shoutouts to Evie11 for helping me convert pages when I was too lazy.
Who to give credits to is actually confusing for the most part. See, Tropical introduced me to the general asthetic but then again, it’s only a color. I didn’t steal any of their HTML either, so I’m not really sure how to credit her. Do you really own color? The original person who made me do the discord layout (and what got me to start developing this website) has no actual part on the website itself anymore and they deleted their discord account. Also, Catriona Henderson made the bloated code, but without her I wouldn’t have been able to do this. I actually have a blog entry on the issues of ownership, if you want to take a read. Still, I know what Evie and I did and I definitely do have to give credit for things I know happened.
- NightScript: Creator of this website, made all the web pages (unless specified otherwise), implemented back-to-top & social buttons, converted Catriona Henderson’s work to a non-jQuery environment & general cleanup.
- Evie11: Mobile and Apple adjuster (up arrow and background), implemented background radial-blur.
- Samplasion: Helped create the bubble move code.
- Alexandre Dieulot: Made instant.page, used to speed up page load times.
- Bootstrap Team: Developing the CSS framework used by the website.
Honorable mentions to Tropical#8908 on Discord for the color selection and Catriona Henderson for the original sidebar code used. Both have been changed significantly, but I couldn’t have done it without their help.