I've written a userstyle for this site, not as a complaint, but just for fun and to practice my CSS.

Here's a list of some of the neat things it does:

  • Flattens everything out by removing pretty much every gradient.
  • Adds unobtrusive but gentle underline and hover effects to certain things.
  • Does a terrible horrible very bad pure-CSS patch to fix the redundant [#] [#] or [#] [D] in SAX.
  • Removes a ton of borders.
  • Cleans up a lot of backgrounds.
  • Fixes some spacings.
  • Centers the search bar (top right- see how it's not vertically centered? that's so annoying you should install this userstyle and fix it :D)
  • Reduces clutter by removing stuff nobody actually looks at anyways.
  • Makes SAX wider and more readable.
  • Restyles the pips so they look better.
  • Improves the look of polls and makes them more readable.
  • A nonzero number of additional things!


Download
Note that the extension will not auto-update when I make changes.

Here's an imgur album with a bunch of screenshots
Here's how to install this in Google Chrome:

1. Download the zip file containing the changes.
2. Extract the zip file into a folder on your computer, ideally this would be in a spot where you wouldn't delete it.
3. Open a new tab and navigate to chrome://extensions
4. In the upper right hand corner of the screen, turn on "Developer Mode."

5. Right below the Hamburger menu, click on "Load Unpacked Extension."

6. Browse to the folder where you unpacked the extension. Don't enter the folder, but select it.

7. Click Open. The extension will now install.
8. Now reload any cemetech tabs you have open. The extension will then take effect.
9. (Optional) If you would like you may now turn off developer mode.

Please excuse my chromebook.
Just released another version- Download.

It includes a fix to the styles that remove borders, and makes SAX slightly wider and more readable.

As always, if you encounter issues or would like to see a change, feel free to create an issue or post in this thread. I already have some things I'd like to change for the next revision :D
For the next upcoming version, v2.1, I'm improving stylistic consistency throughout the site. This means making all the borders one size, removing clutter, and using easy-to-change CSS buttons all the time instead of just most of the time Wink

One of the cooler things I've changed so far for this version has been the polls. Previously, these were implemented with tables and generally looked fairly disgusting like 50% of the time, if not more often. The three images used to create the effect didn't always line up due to technical limitations, and the addition of end caps makes it hard to compare the results for polls with a fair number of votes with results that are close.

But this is a thing of the past, with my userstyles.


I got rid of the end caps so it's easier to read/visually compare two entries and used one giant hack to replace the image with a solid background.

Overall, I'm very satisfied with the look of the polls Very Happy
I've just released version 2.1.0!

It includes a bunch of changes:

  • Restyling pips
  • Spacing improvements
  • Removed gradients on search bar
  • Centered search bar
  • Gentle hover effects on most action buttons
  • Fixes for margins around posts
  • Bugfixes & compatibility improvements
  • Improved stylistic consistency
  • Much more.


I'd like to thank mr womp womp for his suggestions that I was able to pick and choose from. I'd also like to thank LogicalJoe for his safari bug reports and commandblockguy for the styling feedback and firefox bug reports that I was able to at least partially fix for now.
The white lines hurt my eyes, it feels like everything is just misaligned by 1px Sad
Thx for merging the PR, I still think the lines need to go tho. Laughing
mr womp womp wrote:
The white lines hurt my eyes, it feels like everything is just misaligned by 1px :(
Thx for merging the PR, I still think the lines need to go tho. :0x5:


After some thinking, I mostly agree.

Here's what I ended up doing (part of v2.2)


It makes the lines match the sidebar- nuking them entirely is too dramatic of a change, in my opinion, and it doesn't look all that great.

After some discussion, I've decided that adding JS magic to the extension is a good idea-it opens up a lot of opportunities as far as tweaking things goes and we can even add features to the site instead of just modifying what is already there.

I'm excited to see what we can do with this- I already have a decent-sized list of tweaks I'd like to make.

Edit: The first thing I did was implement a client-size fix for the "unicode characters being escaped in post titles" bug:
I've stolen your userstyle and started to make my own, mostly because I want to make a lot of big changes. (for fun, don't ask for features lol)
I saw you were discussing this code which I'd been playing with recently, and I actually stumbled across a small bug with the post editor, specifically when you hover over the "Youtube" button, a javascript error is thrown because the help string is undefined. It could be fixed by defining it... Laughing

Code:
var y_help = 'Youtube video: [youtube]URL Text[/youtube] (alt+y)';

So I threw that into my userstyle... Besides that, I added a button for the strike tag. Which I use occasionally, and I'll be adding one for the

Code:
[hr]
tag as well.

On a different note, the subBlue design code makes me want to scream. In the words of iPhoenix,
iPhoenix wrote:
"If someone asked me to write the worst code it would be something like that"
Thank you for wrangling with that, womp ;)

I rewrote and merged in two of your javascript changes, namely the shorter dates and the clickable usernames in the online users.

I'm not fully sure if I want to keep the shorter dates- users can edit the date format in the page to edit their profile, but the syntax is fairly esoteric and I'd be surprised if even a hundred of cemetech's users have modified that in any significant way.

Additionally, the clickable online users means that the style distinction for admins no longer exists, I'll have to think about how I want to add that back.

Next up is storing half-written posts in localStorage, I think, so that you can continue writing a post after closing a tab/signing out, etc.
_iPhoenix_ wrote:
Thank you for wrangling with that, womp Wink

I rewrote and merged in two of your javascript changes, namely the shorter dates and the clickable usernames in the online users.

I'm not fully sure if I want to keep the shorter dates- users can edit the date format in the page to edit their profile, but the syntax is fairly esoteric and I'd be surprised if even a hundred of cemetech's users have modified that in any significant way.

Additionally, the clickable online users means that the style distinction for admins no longer exists, I'll have to think about how I want to add that back.

Next up is storing half-written posts in localStorage, I think, so that you can continue writing a post after closing a tab/signing out, etc.


Yeah I like the shorter dates but if your goal is for a lot of people to install your theme, maybe its best to let them decide, or maybe like you mentioned to have it be an option that the user can choose.
I hadn't considered admins with the different styling, I guess I should account for that. I'll probably go back and fix that when I have a bit of free time.
Also, your rewritten versions are very nice, I might yoink them Laughing
Time for version 2.2.0!

Changelog:

  • Added strikethrough and monospace buttons to the post editor.
  • Removed a bunch of gaps, including a number of 1px gaps.
  • Made some gaps look more intentional.
  • Improved consistency for back-to-top arrows.
  • Made a number of dates smaller.
  • Fixed an issue with unicode in post titles.
  • Fixed an error when hovering over the youtube button in the post editor.
  • Adds version information to the footer.
  • Fixes a bug with poll restyling in firefox.
  • Added links to the online user list in the sidebar so you can quickly go to user profiles.
  • Probably more I'm forgetting.


I highly suggest that people using the userstyle upgrade to this version.

Download
This project is not dead!

Today I implemented a hackfix for the snow animation using astronomical amounts of CPU.

It turns off the snow animation and replaces it with a video of the snow animation, causing all kinds of beautiful graphical problems in the fraction of a second it takes to load over my network. In my eyes, the ideal solution is creating a transparent snow gif of the CSS3 animation and overlaying that, but that's not exactly easy (though definitely something I'll take a look at later if I have the inclination- others are more than welcome to take up this job too). I have a couple of other things I need to take up before I even look at that though.

Edit- oh yeah, and I fixed some complaints with jsTIfied as suggested by KryptonicDragon- when you use the larger window there is a fair bit of fuzzy stuff around the drawn pixels because that is how canvases are by default.
Today I worked on adding real-time previews to the post editor by frankensteining some code for resizable columns out of another project and writing a BBCode parser that is "good enough" but isn't fantastic as far as partity with the real deal is concerned.

After some midnight discussion with womp (which was mostly me coming up with good ideas and womp agreeing Evil or Very Mad), I implemented spoilers with a pure CSS change. It is applied to all [size=1] and [size=2] tags. It scales them up to fit with the rest of the text and applies a blur effect that is removed if you hover over the text long enough.

I chose these two settings because they are frequently used as spoilers anyways- it will work retroactively on old posts (and people don't need to change anything about how they write in the future). Additionally, font sizes this small are mostly useless unless you are trying to hide something (in the fashion of a spoilers) so I don't forsee this messing with people's posts.
iPhoenix wrote:

[A change to spoilers] is applied to all [size≡1] and [size≡2] tags. It scales them up to fit with the rest of the text and applies a blur effect that is removed if you hover over the text long enough.

That's so cool!
_iPhoenix_ wrote:
Additionally, the clickable online users means that the style distinction for admins no longer exists, I'll have to think about how I want to add that back.

mr womp womp wrote:
I hadn't considered admins with the different styling, I guess I should account for that. I'll probably go back and fix that when I have a bit of free time.

I added that back today and in doing so, also got a nice surprise: mods have a distinction too! (even though cemetech doesn't define the class in their stylesheet >_<)
So I took the opportunity to define one so now mods are highlighted in gray and admins get highlighted in black (no picture because all the admins are inactive on the forum :X ).



In other news, the font-size dropdown in the post editor no longer works, I suspect I probably used the same name for one of the new buttons or something... Rolling Eyes
EDIT: Yeah that's exactly what I did, its fixed now.
mr womp womp wrote:
(no picture because all the admins are inactive on the forum :X ).


I wouldn't say we're inactive, just that we weren't online at the time you took the screenshot P:
I'm basically done with my Advanced post editor. If you want to see an incredibly awkward demo of me just typing words, watch the video below I guess. Like I wrote towards the end of the video, it's good enough for most posts for most people- it doesn't support everything but it gets close enough.

So this is how you "fix" your problems Evil or Very Mad Laughing

mr womp womp wrote:
So this is how you "fix" your problems Evil or Very Mad 0x5



Yes, and proud of it.
I've been pretty busy recently, but I had a three-day weekend that I spent a fair part of working on a rewrite of SAX.

This SAX is better (as far as I'm concerned) mostly because of the following three things:

  • It was written by me

    • Wait, hear me out- the current SAX implementation was written by multiple people over multiple years. This implementation was written by one person in one sitting, more or less, and is cleaner and more consistent for that reason.

  • It is more friendly towards userscripts (this was the main goal of my rewrite)

    • In addition to being written in cleaner, more modern JS, the entire message and associated data are presented in a way that is easy to access (no parsing required). It is exceedingly easy to add new commands, and is overall just more fun to work with.

  • Commands are more fleshed-out and easier to use

    • SAX has commands (mostly for admin use), and not a lot of people know this (besides like, /me). Because they aren't used often, these commands have unfortunately been overlooked. Each command now has decent documentation on its usage, accessible through /help <command> (just use /help to list commands). Banning people (and granting them operator status) is now super easy (/ban <username> if the user has chatted recently, otherwise, you need to use their JID, see limitations below), as experience has taught me that the current system is too complicated to depend upon in the heat of the moment.

However, this SAX has some limitations, mostly because of the following three things:

  • It was written by me

    • Written by one guy in one sitting, pretty much- though it's pretty nice now, it's not as good as I'd like it to be.

  • It is more friendly towards userscripts

    • This just opens it up to abuse more, I guess. Even though it takes some extra knowledge, it's just as easy to do the same thing to the current SAX, in my unexpert opinion.

  • Commands are more fleshed-out and easier to use

    • There's no downside to this, I just needed to include it in the list for parallelism or something.

Anyways, here's a very incomplete changelog (just the most important stuff), from most-likely-to-be-contentious changes to least-likely-to-be-contentious changes.

  • Firefox support is harder to add because of some stuff I had to do to get the script injection to work. Reluctantly fixed, the firefox extension API sucks
  • Removed the line cache that displays during connection- this always felt like a bug to me even though I knew it was intentional. Not sure how I feel about it.
  • /me looks different mostly because I kinda had to without using serious hacks. This isn't an issue if you aren't a userscript, though.
  • Removed braces from URL rendering- it's unnecessary, redundant, and makes copying and pasting links harder.
  • Unrecognized commands are sent through to the server instead of being intercepted and rejected.
  • Eliminated the persistent JID map, but I plan to add that back.
  • Fixed a couple of bugs.
I should also note that this is only 2/3rds the size of the current implementation when babel'ed and gzipped (5186 bytes vs 7947 bytes) and only 3/4ths the size if terser is applied to both (3153 bytes vs 4248). Either way, it's only a couple of kb.

I'm not done with this yet, but it's at the point where I'm at least comfortable sharing it. Questions and/or comments are greatly appreciated as always.

Edit: just added notification support
  
Register to Join the Conversation
Have your own thoughts to add to this or any other topic? Want to ask a question, offer a suggestion, share your own programs and projects, upload a file to the file archives, get help with calculator and computer programming, or simply chat with like-minded coders and tech and calculator enthusiasts via the site-wide AJAX SAX widget? Registration for a free Cemetech account only takes a minute.

» Go to Registration page
Page 1 of 2
» All times are UTC - 5 Hours
 
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum

 

Advertisement