search

NehemiahK / fun-react-lib

A fun React Library for practice
https://nehemiahk.github.io/fun-react-lib/
62 stars 24 forks source link

Consistent color systems across the library #16

Open krissh-the-dev opened 4 years ago

krissh-the-dev commented 4 years ago

Let's define colors for the entire library to maintain same color palatte, otherwise the components will become inconsistent and look very different from each other. We can also move to sass for a hassle free implementation. I request everyone reading this to leave a comment on this..

ferueda commented 4 years ago

Here are a few color palette pickers that might help with the process.

https://flatuicolors.com/

https://coolors.co/palettes/trending

Personally, I like the following palette theme

#e63946;
#f1faee;
#a8dadc;
#457b9d;
#1d3557;

image

NehemiahK commented 4 years ago

Yes, I think this is a great idea. Should probably go into the App.css file.

Anyone want to get this started?

ferueda commented 4 years ago

Yes, I think this is a great idea. Should probably go into the App.css file.

Anyone want to get this started?

I think we should have a voting process before implementing it?

jessecookedesign commented 4 years ago

I'm happy to help on this.

I'm impartial to the colors used but I'd suggest using CSS variables.

Example

:root {
 --color-red: #e63946;
}
krissh-the-dev commented 4 years ago

I suggest to go with sass, for a better syntax and easy importing... Also, it'll be easy for us to write utility classes.

ashispavan commented 4 years ago

I suggest to go with sass, for a better syntax and easy importing... Also, it'll be easy for us to write utility classes.

Agreed.

As for color palettes, we could pick a scheme from here: https://colorsinspo.com/

krissh-the-dev commented 4 years ago

I suggest to go with sass, for a better syntax and easy importing... Also, it'll be easy for us to write utility classes.

Agreed.

As for color palettes, we could pick a scheme from here: https://colorsinspo.com/

That looks great. We'll choose one.. @NehemiahK , your opinion?

krissh-the-dev commented 4 years ago

We need to do this first. Then only we can start working on other components. We need to make a quick decision.

NehemiahK commented 4 years ago

Sorry, wasn't at my computer. I'm open to whichever scheme of the person that want's to tackle this

ashispavan commented 4 years ago

@KrishnaMoorthy12 You can pick a scheme of your liking. Ideally, we could have a ThemeProvider created so we could easily swap color palettes by changing a single prop, but for now you can just pick one for the sake of proceeding with development of other components like you mentioned.

krissh-the-dev commented 4 years ago

Okay, I'll try to add the theme provider component tomorrow.