steveseguin / social_stream

Consolidate your live social messaging streams and much more
http://socialstream.ninja/
GNU General Public License v3.0
645 stars 95 forks source link

Problem with custom CSS #169

Open Dawer4 opened 11 months ago

Dawer4 commented 11 months ago

Hello, I'm trying to make social stream text look like text marked with a red rectangle. When I'm typing "text-shadow: 0 0 50 black" in custom CSS there is almost no shadow on text. Is it even possible to do this? I must admit text on the bottom looks way better.

1

bedwardly-down commented 11 months ago

If you have the hardware and desire, some of that could be done with custom dynamic shaders instead. OBS has multiple plugins for effects like that but they come at a cost

steveseguin commented 11 months ago

You may need to stack several shadows to get the effect you want, but there are quite a few CSS text shadow generators out there, along with chatGPT these days to customize advanced CSS designs.

.highlight-chat {
   text-shadow: 0px 0px 14px rgba(0,0,0,1), 0px 0px 9px rgba(0,0,0,1), 0px 0px 4px rgba(0,0,0,1);
}

results in: image

Dawer4 commented 11 months ago

Thank You very much guys, I managed to create shadow I wanted by custom shader. Currently I'm trying to solve 2 problems:

  1. Is it possible to assign random color to each nickname on chat? 1
  2. I'm trying to make message text same as nickname (font, weight etc.). Any ideas? 2
steveseguin commented 11 months ago

image There's a way to add a random color to a name if it doesn't already have a color

As per font, you can do something like this.

.hl-message , .hl-name{
    font-size: 10px!important;
    font-weight: 400!important;
}
Dawer4 commented 11 months ago

Everything works perfectly. You're amazing, thanks very much!!