Libib - Custom status indicator style

JetpackCat
2025-02-05T17:03:19Z

Set a custom color and style for libib.com item status indicator and more

Libib custom status indicator style

A simple UserScript for customization of Libib.com status indicator

[!WARNING] This project is an independent, third-party, open-source userscript created for personal use. It is not affiliated with, associated with, authorized, endorsed by, or in any way officially connected to Libib, or any of its subsidiaries or its affiliates. The official Libib website can be found at https://www.libib.com. All product and company names are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them.

AI Usage Acknowledgment

The core logic, architecture, and overall development of this script are entirely my own work. However, I utilized AI tools as a coding assistant to help optimize specific code snippets (such as the CSS generation and the Cloudflare Worker integration) and to refine the English text in this documentation, as English is not my native language.

Why did I make this?

Libib.com is a great website to keep track of your collection of books, CDs and other things. Unfortunately the status indicator's color selection is not great and this makes it hard to see if you already read a book or not.

Here you can see a before and after:

How to install

1. Install a Userscript Manager like Violentmonkey or Tampermonkey

2. Install Libib - Custom status indicator style by clicking here

Mirrors:

How to use

Basic settings

1. Access your library on libib.com

2. You should see a new menu item on the sidebar called "Status settings"

1. After clicking it, a panel will open, in this panel you can change the settings as you like

You can choose between Triangle (default) or Border, you can also choose the position of the indicator. If you choose the Border style, you can also choose the thickness

Here are all the possible combinations:

Blur covers

In addition, you can also blur the cover of specific series (also known as groups). You can do this in two ways:

1. By clicking the eye icon on the item cover

1. By manually adding the series name in the options

Note that this option will blur the entire series

Sync settings

There are two ways to transfer your settings across devices:

Manual sync

The first method is by using the "Copy settings" button. This will copy a JSON object to your clipboard. Then, on another device, use the "Paste settings" button to apply the settings.

Cloud sync

The second method is through the Cloud Sync feature: Upon first use, a unique ID will be generated. You can upload your settings using the "Save and Sync to Cloud" button and download them using the "Load from Cloud" button (Note: The Cloud Sync ID must match on both devices). If you ever wish to erase your data, the "Delete from Cloud" function is available.

Note: The synchronization feature is completely optional and will not activate without explicit user interaction. Before using it, please read our Privacy Policy.