Change color of personal messages

مكون السمة
1

For some time I borrowed @ChrisBeach’s CSS snippet, so I converted it into a theme component, find the result here:

What it does

It changes the appearance of the page when a personal message is being read:

  • the head banner color (with a gradient),
  • the font color,
  • the background color,
  • the title color,
  • by adding some text after reply.

All these changes are optional and can be toggled with their on/off setting. The main «personal messages» color can also be changed with a setting. To tweak the different colors, edit the top part of the CSS file.

18 إعجابًا
2

Thank you, @oca!

I’ve found that this only works with color names, not Hex color codes. This makes it tricky to match to a colour palate. From looking at the CSS and the way colours are mixed, I’m guessing it wouldn’t be very easy to change this. Can anyone prove me wrong?

إعجابَين (2)
3

It appears that this is a Theme and not a Theme “Component” but please correct me if I’m wrong.

I’m already using a Theme that I’ve completely customized, and only one theme can be used at a time, and you can allow users to toggle from one theme to another… is that right?

It’s my understanding that theme COMPONENTS allow you to apply the component to your active/main/default theme. At least this is how the other theme components seem to work for me. In the theme Components, there’s a box that says " Include component on these themes" which allows you to apply the component to your default theme.

Would it be possible to turn this into a component so I can keep my main/defualt theme active, while enability these customizations for the personal messages or DMs/PMs ?

إعجابَين (2)
4

I remember sending PRs to all the theme components we have here on Meta when we made the change that differentiates between themes and theme components.

I think this one slipped through the cracks because it was a reply to some other topic and has since been moved to its own topic in the theme category.

@oca You only need to add one line to this “theme” to make it function as a theme component. You need to add

"component": true

to the about.json file of your component like so

{
  "name": "Private messages with color",
  "about_url": "https://framagit.org/oca/discourse-theme-colored-private-messages   ",
  "license_url": "https://framagit.org/oca/discourse-theme-colored-private-messages/blob/master/LICENSE",
+ "component": true,
   "assets": {
        "asset-variable": "assets/background.svg"
   }
}

Once you do that, it should work just like any other component and we can then add the theme-component tag to this topic.

6 إعجابات
5

In the meantime @Rhidian taught me a new trick that you can convert a theme to a component or vise versa, using the “Convert” button…

إعجابَين (2)
6

I would also love to see the ability to use a HEX code here!

3 إعجابات
8

Done !
Thanks for the tips.

5 إعجابات
9

I’ll have a look.
It could be worth adding that as a component parameter now that we can do that.
Can’t promise anything, i’m still learning that stuff.

6 إعجابات
10

Nice :+1:

I’ve added the tag to this topic. When you get a chance, can you please add a screenshot or two to the OP in this topic? No rush, but it makes it easier to see the changes this component makes.

6 إعجابات
12

I think the issue is that there’s an extra comma at the end of about.json

Screen Shot 2020-05-11 at 9.29.37 PM

6 إعجابات
13

Thanks for that !

But no thanks for those who built the json norm…

4 إعجابات
14

Is this still the way to go for changing the colour of DMs/PMs?

إعجاب واحد (1)
15

I think it can be done in a better way.
I’ve used Personal Message Bubbles for some time instead, but it has been added as core feature.

إعجاب واحد (1)
16

Does that component still work okay now the personal message bubbles are in core? I think someone had some conflicts a little while back Personal Message Bubbles - #93 by AntiMetaman

3 إعجابات