Giter Site home page Giter Site logo

goodguyeli / goodreads-dark Goto Github PK

View Code? Open in Web Editor NEW

This project forked from obscuredetour/goodreads-dark

0.0 1.0 0.0 2.34 MB

Dark theme for Goodreads.com

Home Page: https://github.com/obscuredetour/goodreads-dark

License: MIT License

CSS 100.00%

goodreads-dark's Introduction


Maintained? Last commit Tag

Goodreads Dark (Jade) theme

This is a dark theme for the goodreads.com website. This custom userstyle follows UserCSS guidelines.

2 versions

Dark Jade Default

Install directly with Stylus

The default Dark Jade theme colors can be seen here. Accent colors are green (jade) and background colors are dark grey.

Dark Jade (OG)

Install directly with Stylus

The Dark Jade (OG) is the original theme. More green, less grey overall. Seen here.

Table of Contents

  1. Preview
  2. How to use
  3. Contributing
  4. Color Palette
  5. Notes

Preview

Dark Jade (Default)

Goodreads - Login Goodreads - Recent

Dark Jade (OG)

Goodreads - Login Goodreads - Recent Goodreads - Choice Awards

Back to top

How to use

A userstyle extension for your browser is required, here are a few to choose from:

Install the dark theme with the links below. They support automatic updates.

Default Dark (Jade) theme colors can be seen here. It keeps the accent colors the same but zeros out the saturation on the backgrounds making it more grey.

Dark (Jade) OG is the original theme. More green, less grey overall. Seen here.

Then, the raw file will open in the browser and the extension will open a new tab asking to install it. After clicking 'install style', you're finished.

Or visit the Goodreads dark (jade) theme at Userstyles.org and click Install Style

Copy and pasting the goodreads-dark.user.css file into the extension also works.

Further instructions can be found here.

Back to top

Contributing

Open an issue first to discuss potential changes/additions.

Back to top

Color palette

Accent colors (jade)

Jade color scheme Image created in Color Deck

Back to top

Notes

Why is it so green?

The color scheme was inspired by Jade City. Here's why,

Goodreads.com default link color

  1. The color above is Goodreads.com default link color. hsl(176, 100%, 19%)

  2. I read Jade City by Fonda Lee right before creating this.

  3. What can I say? I had jade on my mind.

Bigger project than anticipated

This turned out to be a HUGE undertaking. It definitely was the hardest I have tackled thus far. Holy mackrel, why is goodreads so against reusing styles?

I also took liberties with some aesthetics.

  • The removal of many borders.
  • Increased some padding here and there.
  • Rounded out some corners.

Back to top

Archived Screenshots

v1.1 - Goodreads - Explore

v1.1 - Goodreads - News & Interviews

v1.1 - Goodreads - 2018 Choice Awards

Back to top

goodreads-dark's People

Contributors

obscuredetour avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.