Colored - An extension to color elements based on tag colors. 🛠️

flavour1

ram0ng1 thank you for your reply and for working on it - this is great news! looking forward to use the Colored extension soon!

ram0ng1

flavour1

📌 | Version

🔧 | Installation

To install the Colored extension, run the following command in your terminal from the root directory of your Flarum:

composer require ramon/colored

After installation, clear the cache with:

php flarum cache:clear

🆕 | Updating

To update the extension to the latest version, use:

composer update ramon/colored
php flarum cache:clear

⚙️ | Configuration

After installation, go to the Flarum admin panel and adjust the configuration options. You can:

Define which elements will be colored.
Configure the speed of color transitions.

🛠️ | Features

Apply colors to interface elements based on primary tags.
Support for headers, buttons, user cards, posts, alerts, and dropdown menus.
Customize the speed of color transitions.
Automatically revert to default colors when leaving the discussion page.
Fix darkmode 😃

🖇️ | Contribute

If you encounter issues or want to suggest improvements, contribute through:

flavour1

ram0ng1 this is simply awesome! such an elegant way to spice up the forum design, thank you!

huseyinfiliz

@ram0ng1 Your extension was adding the color #536f90 to the <html> element as the primary color. It looks like this happens when the extension cannot detect a primary color attribute, and in that case the hardcoded fallback is applied.

However, I think using a hardcoded color value might not be ideal. In cases where the forum’s own primary color can't be detected (which normally shouldn’t happen), applying a fixed color can lead to inconsistent or unexpected styling across different themes or custom setups.

I believe a safer approach would be to avoid injecting a fallback color at all, or to rely on Flarum’s default variables instead of a custom hardcoded value. This would make the extension more compatible with customized themes and prevent visual conflicts.

Just wanted to share this in case it helps improve the extension. Thank you for your work!

ram0ng1

huseyinfiliz

I'll change that approach soon!

I just haven't had time to dedicate myself to flarum again...

Tutrix

Hi @ram0ng1, it would be great if you could add a border-left, e.g., 4px based on tag colors or tag-id=“xx” to the discussion list so that the border could be added via CSS.
Example:

ernestdefoe

Tutrix that would actually be pretty cool.

Tutrix

@ram0ng1 As I see on your page, you are working on it. 🙂

<div class="DiscussionListItem" style="--tag-color: #099525;">

so I just need to add this CSS

.DiscussionListItem { border-left: 4px solid var(--tag-color); }

ram0ng1

Tutrix As I see on your page, you are working on it. 🙂

It can also be used var(--primary-color, #d42a5b) on any element within the discussion to change to the primary tag color.
I've been gradually updating my installation with some new features... I just haven't had time to test and publish them yet.

I'm still studying a better way to make it revert to the default color defined in the settings so as not to cause problems with most extensions.

Could you help me and tell me which extensions you are experiencing the most problems with?

ram0ng1

Tutrix As I see on your page, you are working on it. 🙂

this is for the theme Asirem

Tutrix

ram0ng1 this is for the theme Asirem

Thanks for the info.
I don't use the Asirem theme, it's also marked as abandoned.

ram0ng1 Could you help me and tell me which extensions you are experiencing the most problems with?

I'm not using Colored at the moment.
I'd just like to have the borders in the discussion list.

ram0ng1

Tutrix Obrigado pela informação. Eu não uso o tema Asirem, também está marcado como abandonado.

Tutrix

ram0ng1
Yes, that's how I would like it. 😉
Is that now integrated into Colored?

ram0ng1

Tutrix Yes, that's how I would like it. 😉
Is that now integrated into Colored?

I'm getting ready to change now 😃

ram0ng1

@Tutrix
try:
ram0ng1/coloredreleases/tag/1.2.0

composer update ramon/colored
php flarum cache:clear

now works:

.DiscussionListItem {
border-left: 4px solid var(--tag-color);
}

Tutrix

ram0ng1
Thank you very much, I'll install it right away. 😃
Smart Button Community

By the way, I clicked on your “Donate for me” link, but donate.stripe.com responds with “The link is no longer active.”

ram0ng1

Tutrix By the way, I clicked on your “Donate for me” link, but donate.stripe.com responds with “The link is no longer active.”

Oh.... try now 🙂

Tutrix

ram0ng1 Oh.... try now 🙂

Okay, now it worked. 😉

ernestdefoe

ram0ng1 is there a way when using the discussion cards extension to have the colored border either all the way around the card or on one side.

ram0ng1

ernestdefoe

send me github extension

« Previous Page Next Page »