devtools icon indicating copy to clipboard operation
devtools copied to clipboard

Different column opacity & color

Open mariuszmickiewicz opened this issue 4 years ago • 8 comments

Would be great to have the ability to change the opacity of the columns. Currently it is pretty opaque and sometimes it is hard to check the details on the page.

Great addon, thanks!

mariuszmickiewicz avatar Dec 07 '20 13:12 mariuszmickiewicz

Hey @mariuszmickiewicz, thanks for the idea! I've often wondered about color too. I know some pages have this shade of blue which can make it harder to see as well. Is this something you feel like you need to constantly adjust, or maybe once you have it where you like it you don't want to touch it again. I ask because I'm curious where the setting might live. I've started to look at trying to offload some settings into the extension's options menu for more longer lasting settings.

photodow avatar Dec 07 '20 13:12 photodow

I'm sorry, I see that I never answered your question and now I came back again to ask the same thing :) I think I would want to change it often (depending on the site's theme or images). When I set up guides in any design software I always go with "as transparent as possible, yet still visible".

mariuszmickiewicz avatar Aug 30 '21 17:08 mariuszmickiewicz

Awesome! Thanks for the feedback. Let me see if I can throw something together. Feel free to let me know if you have any other thoughts on it.

photodow avatar Sep 07 '21 15:09 photodow

I have sometimes hoped for the more transparent columns too! Maybe just give people a slider for opacity adjustment?

shixiedesign avatar Sep 23 '21 10:09 shixiedesign

Here are some thought explorations between @oliviaflory and myself.

From @oliviaflory

This was honestly just do it now, or a toggle to flip the fills as an immediate update. But I also think a number input, color control or slider could be so cool and useful

An interesting idea for a short term solution.

Sketch was partial inspiration for the color and dark/light ideas What about a radio button?


In response I had a couple sketches I threw down, and other thoughts to think about.

Here is another thing to ponder…

  1. column, gutter, border all can have different colors and opacities.
  2. column, gutter, border can only have one color, but different opacities
  3. column, gutter, border can all have different colors, but a single global opacity control
  4. column, gutter, border can only have one color, and a single global opacity control I kind of like the simplicity of 4 myself.

I really liked one of the ideas @shixiedesign had to offer from #159.

image

I'm curious what component this is, but the idea of having the color, and opacity present at the toggle row for each item is really compelling to me. No matter how we slice this we're probably looking at a custom component.

photodow avatar Nov 02 '21 23:11 photodow

Just came across this conversation in slack via Carbon's channel as it relates to customizing color. Might be a way to align on some of this.

Potential package to use — The nice thing about this is we might have a better way of controlling the colors allowed.

Some teams using default browser capabilities — This is nice because it's less work, and we know teams are using it in Carbon.

photodow avatar Dec 08 '21 17:12 photodow

All solutions are great if they can achieve this goal. Is making the columns and gutter lines a bit more transparent by default an easy, quick option? I love the plugin, but have to constantly turn it on/off to get the sense of how layouts fit the grid.

mariuszmickiewicz avatar Aug 11 '22 13:08 mariuszmickiewicz

Commenting to hopefully breathe some life back into this feature request.

andy-blum avatar Sep 13 '23 14:09 andy-blum