this post was submitted on 27 Jun 2023
101 points (100.0% liked)

Kbin Userstyles and Userscripts

4 readers
1 users here now

Custom CSS and JS to help improve your Kbin experience! ### Userscripts Greasy Fork ### Stylesheets UserStyles.world ### Userscript managers

founded 1 year ago
 

BEFORE AND AFTER
This userstyle makes Kbins navigation bar at the bottom of posts more clear and easy to read.

works for ALL themes, just change the color as you please

I literally couldn't tell what page I was on before. Nothing fancy, super simple CSS, but effective! Hope at least some people find this helpful!

#kbinstyles #css

top 20 comments
sorted by: hot top controversial new old
[–] iAmTheTot@kbin.social 7 points 1 year ago (1 children)

What I'd really love is for clicking on notifications to take me to the actual page the comment is on.

[–] minnieo@kbin.social 2 points 1 year ago* (last edited 1 year ago)

me too 👀

[–] Cyzaine@kbin.social 6 points 1 year ago (1 children)

oh thats QUITE the improvement! Thanks alot.

[–] minnieo@kbin.social 4 points 1 year ago

glad you think so ╰(´꒳`)╯

[–] --@kbin.social 3 points 1 year ago (1 children)
[–] minnieo@kbin.social 1 points 1 year ago

np! (⸝⸝⸝• ω •⸝⸝⸝) ♡

[–] bobfinger@kbin.social 3 points 1 year ago (1 children)

Such a simple but needed fix. Ty!

[–] minnieo@kbin.social 1 points 1 year ago

youre very welcome c:

[–] corytheboyd@kbin.social 1 points 1 year ago* (last edited 1 year ago) (1 children)

Agree that the contrast is wrong, but I think the active page button should be muted, since it’s the only one clicking on makes no sense. Your example, but inverted.

[–] minnieo@kbin.social 1 points 1 year ago

it's 100% customizable, if you wanna change it, then feel free to change it C:

[–] distant_white@fedia.io 1 points 1 year ago (1 children)

This definitely comes in handy! Thanks a lot, also for the other stuff, it's pretty neat.

[–] minnieo@kbin.social 1 points 1 year ago
[–] sdothum@kbin.social 1 points 1 year ago* (last edited 1 year ago)

Not sure how easy this would be, but perhaps change this to a js userscript and..

  1. expanded it to use the theme vars to set the highlighting (so it can work with both dark and light themes).

  2. add to GreasyFork and name script accordingly e.g. "Kbin Better Page Navigation.js"

(i am admittedly not very knowledgeable when it comes to userstyles vs userscripts).

EDIT:
i went ahead and created a "userscript" based on your "userstyle" which uses the kbin's theme vars to work with whatever theme is in use (only tested with the 5 current kbin color themes).

[–] CoderKat@kbin.social 1 points 1 year ago (1 children)

We also need some way to keep it from getting so wide on narrow displays. On my phone, once you're a few pages in, the next page arrow is all the way on the edge of the screen. Multiple times I've gone to the very last page cause it's hard to click the next page arrow. Not even sure what the use case is to go to the last page.

[–] minnieo@kbin.social 1 points 1 year ago (1 children)

can you take a screenshot of what youre seeing? i only use kbin on desktop lol

[–] CoderKat@kbin.social 1 points 1 year ago (1 children)

Here's a screenshot showing page 10. The pagination displays so many page numbers in this case that the arrows are completely off screen (lower page numbers will have them getting closer to the edge).

[–] minnieo@kbin.social 1 points 1 year ago

thanks for the sc! ill see what i can do 👀

[–] H2SO4@kbin.social 1 points 1 year ago (1 children)

Looks awesome! The current page is invisible if you're using a light theme though:
KBin light theme

[–] minnieo@kbin.social 4 points 1 year ago* (last edited 1 year ago)

edit: i forgot that i made it customizable so you can change the color as you please!

a̶h̶ ̶c̶r̶a̶p̶ ̶i̶ ̶d̶i̶d̶n̶t̶ ̶e̶v̶e̶n̶ ̶t̶a̶k̶e̶ ̶l̶i̶g̶h̶t̶ ̶t̶h̶e̶m̶e̶ ̶i̶n̶t̶o̶ ̶a̶c̶c̶o̶u̶n̶t̶,̶ ̶t̶h̶a̶n̶k̶s̶ ̶f̶o̶r̶ ̶r̶e̶m̶i̶n̶d̶i̶n̶g̶ ̶m̶e̶.̶ ̶i̶l̶l̶ ̶s̶o̶r̶t̶ ̶i̶t̶ ̶a̶n̶d̶ ̶u̶p̶d̶a̶t̶e̶ ̶t̶o̶d̶a̶y̶

load more comments
view more: next ›