Add gradient border to tags about focusly HOT 11 OPEN

Added the gradient on the border, but need to add it only when the user clicks meditate tab.
1.Thinking of changing the name of class of card for meditate
2. Using states when the user clicks the meditate button, and the color gradient gets added after the click.

Guide me through this, need few hints and will get the work finished

from focusly.

Few questions,

1. After adding another parameter into the info array, how do I add css specifically for that particular element in the array with that parameter?
2. Drop some topics which might help me in order to get this done, I'll learn them and finish the pending code.

from focusly.

You can refer this to add condition in tailwind css.

And if you want to dive deep then you can further look into this topic.

from focusly.

!assign

from focusly.

Hey @notpx Issue assigned.

from focusly.

This looks great.

Some additions:

1. How about decreasing width of border and keeping it around 5-7px.

2. We only need these gradient border for cards in new tab so we can add a parameter in 'info' array and mention there that whether this particular card belongs to new or not.

And then we can add gradient to it.

from focusly.

hello!. is this issue still open? I want to contribute to several of the open issues in this project but when I run npm install it won't let me deploy the project

from focusly.

hello!. is this issue still open? I want to contribute to several of the open issues in this project but when I run npm install it won't let me deploy the project

Hey @agustintrossero. Try running npm install --legacy-peer-deps.

Thanks for contributing to Focusly.

from focusly.

1. I need to know where to put this function, because chakra UI manages the class names and we can't know what class is it without checking inspect element. Even after finding out the class of the box... I need to figure out where that class generates from, is it from the Card.js or Meditate has its own box.

I figured out how to use the class name library as you mentioned...but help me out with the placement of the function at the right place so it gets called.

If that gets clear code will work. Need help with this lads.

from focusly.

Hey @notpx, you can call the function on button click using the onClick function

from focusly.

if the issue still open i will start work. if shared some pictorial explaination..

from focusly.