cburschka / cadence

A strophe.js-powered XMPP web client for chatrooms.
6 stars 2 forks source link

CSS Color Module 4 - 8-digit color codes. #428

Open cburschka opened 7 years ago

cburschka commented 7 years ago

https://drafts.csswg.org/css-color/ https://www.w3.org/TR/css-color-4/

This standardizes #RRGGBBAA and #RGBA codes where the A is a hexadecimal representation of opacity (0-255).

Cadence currently adds opacity to a dynamic color value in the text color button, whose background is set to 50% opacity of whatever the chosen color is. To accomplish this, cadence parses the hex value and outputs an rgba(x,y,z,0.5) string.

As soon as this standard can be relied on, this function can be replaced by a simple string concatenation.

sylae commented 7 years ago

so what you're saying is i can set my text colour to have 0% opacity now?

+1

On 22 Sep 2016 5:16 p.m., "Christoph Burschka" notifications@github.com wrote:

https://drafts.csswg.org/css-color/ https://www.w3.org/TR/css-color-4/

This standardizes #RRGGBBAA and #RGBA codes where the A is a hexadecimal representation of opacity (0-255).

Cadence currently adds opacity to a dynamic color value in the text color button, whose background is set to 50% opacity of whatever the chosen color is. To accomplish this, cadence parses the hex value and outputs an rgba(x,y,z,0.5) string.

As soon as this standard can be relied on, this function can be replaced by a simple string concatenation.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/cburschka/cadence/issues/428, or mute the thread https://github.com/notifications/unsubscribe-auth/ACqYzNc_mBCybantf9XQO1NAMzo4G7Hmks5qsvBAgaJpZM4KEXxc .

cburschka commented 7 years ago

This is just for the button. But yeah, technically config.settings.textColor = '#......XX' lets you do crazy stuff like this: :P

screenshot from 2016-09-22 23-51-31

cburschka commented 7 years ago

Note: While Firefox supports this, jQuery doesn't.

element.style.color = '...' works. $(element).css('color', '...') doesn't work; the opacity value is lost.