DEV Community 👩‍💻👨‍💻

Cover image for Reddit In Comics Style
Nayden Gochev
Nayden Gochev

Posted on

Reddit In Comics Style

Hello guys, as a follow up of my previous post almost an year ago which was to make this amazing webside in comics style (it is a bit outdated btw) I just tried with Reddit.

Again I am no CSS or frontend person I just love comics
And again the REDDIT css will be broken very soon because their selectors and CSS classes looks like this

.Y4MkVr6trrdypfZVUkpIA, ._2vkeRJojnV7cb9pMlPHy7d

So I guess they are server side randomly generated and they change from time to time.

Still I will enjoy it till I can.

I have used an extension Stylus for chrome to apply the additional CSS on top of the default css.

The CSS I wrote can be found here

After applying it your reddit will look like this on small view:
Alt Text

Or like this in general
Alt Text

The article read view looks like this :
Alt Text

I just hope reddit can make a new style since the old one is so so ugly. Even linkedin had an updated style since today.. cmon :) it's about time.

I hope someone can improve it and actually make it better.
Right now there are only 2 important bits. One is the general borders change :

    border: solid black !important;
    border-color: black !important;
    border-width: 3px 4px 3px 5px !important;
    border-radius: 30% 2% 162% 3%/9% 96% 2% 99% !important;
Enter fullscreen mode Exit fullscreen mode

And another one for more article or more "boxed" shaped boxes

    border: solid black;
    border-color: black;
    border-width: 3px 3px 5px 5px;
Enter fullscreen mode Exit fullscreen mode

And of course about the titles font:

@font-face {
  font-family: 'Bangers';
  font-style: normal;
  font-weight: 400;
  src: url( format('woff2');

    font-family: Bangers !important;
Enter fullscreen mode Exit fullscreen mode

Well that's it folks I hope you enjoy it.

Latest comments (1)

isarisariver profile image

Looks good. Thanks for sharing 😊

🌖🌗🌘 Turn on dark mode in Settings