kbin-css: decluttered and parameterized theme

3 years ago by shazbot to c/kbinMeta

Contribute to aclist/kbin-css development by creating an account on GitHub.

Hello, this is a client-side theme focused on high readability and removing extraneous visual widgets and icons. It is based on the way I liked to read content on that "other site."

Image

For better or worse, the current kbin layout is very "mobile" in design and not the best for reading longform text on a desktop. This theme focuses on easing the layout and hopefully making threads look more forumlike.

It does take a "scorched earth" approach in removing stuff I don't like, but everything that starts disabled can be enabled again via the radio buttons provided, allowing you to toggle on/off various widgets on the fly.

This includes:

  • sidebar
  • footer
  • activity
  • thumbnails
  • previews
  • short description
  • avatars
  • upvotes, downvotes, or both
  • icons
  • elements of the text submission form
  • numerous other elements

In addition, you can change the base color scheme via the color picker in order to globally control things like:

  • body color
  • link colors
  • upvote/downvote colors
  • blockquotes, code blocks, input fields
  • hover/focus color
  • text color
  • etc.

Disclaimer: I have tested this at 1440P on a desktop environment at various scaling levels and dimensions and it seems to mostly be OK. I have not extensively checked for glitches on mobile aside from some rudimentary mocking. If you find something wrong, feel free to make a PR or inbox me.

Frontend is not my main focus area, so there may be some anti-patterns or things that are objectively stupid, particularly around the way I manipulated elements on the grid. Again, if something is being implemented wrongly here, please advise.

load all comments
RodPhoto 2 points 3 years ago

Fantastic work, thank you very much. I don't assume you're taking requests, but the only thing missing for me is if I could center the content, as right now it's all aligned to the left on my very large monitor and makes for awkward reading. I have no experience scripting but I'll look into trying to do this myself anyways. Again, thank you.

path: 0 326532, hotness: undefined, score: 2, children: 4
shazbot 2 points 3 years ago

Sure, I could make it a toggle.

path: 0 326532 328479, hotness: undefined, score: 2, children: 3
RodPhoto 2 points 3 years ago

That would be ace. Also, this has improved my experience of kbin so much I would gladly contribute a few bucks to it. Maybe consider turning it into an extension or a more elaborate project as more people move here from Reddit. Thanks again.

path: 0 326532 328479 329018, hotness: undefined, score: 2, children: 2
kbinMeta

@kbin.social

login for more options
639
1280
1

Magazine dedicated to discussions about the kbin itself. Provide feedback, ask questions, suggest improvements, and engage in conversations related to the platform organization, policies, features, and community dynamics. ---- * Roadmap 2023 * m/kbinDevlog * m/kbinDesign

go to feed...