Beautiful Design App

Project Showcase
427

Pretty much any number that you see in that code you can play with, the best way is to click the link I posted above, and go to test CSS tab

428

i updated Code BOOK with new look… and codes

3 Likes
429

cool

430

Hello boys. Will anyone have a CSS code to change the color of several buttons that are one below the other, but that each color is different?

With the code that CSS I have, I put all of the same color.

@Lucas_Pires @Uzo @Darren_Murphy @Pedroydzito

431

This?

2 Likes
432

No, I have used that one for the floating buttons.

In this case I need to be able to change the colors that way, but in normal buttons (the first ones of glide) but I tried this code and it did not work for me.

@Darren_Murphy

433

A code is not specific for one thing when you start to manage for what you want

2 Likes
434

Just go to a Code BOOK App, you will find it.

1 Like
435

Yes, I know. I had tried changing the classes but didn’t know the exact name.

Just what I was looking for. Thanks a lot @Lucas_Pires

1 Like
436

Yes, your input is great, I have used your CSS code app on many occasions.

437

Get the code you need and change child() numbers for specific buttons, and add more children if you wanna target more buttons, just fallow the pattern in the code, in this app, there is a test CSS tab, you can try to modify code and see results

438

Anyone know how to change this card style color? from white to maybe other color ?

image
image456×854 27.4 KB

439

just in type() enter component number as it is in your editor


div[id*='screenScrollView'] > div > :nth-of-type(2) button {
    background-color: red;
    color: green;
}

div[id*='screenScrollView'] > div > :nth-of-type(3) button {
    background-color: green;
    color: red;
}


div[id*='screenScrollView'] > div > :nth-of-type(12) button {
    background-color: black;
    color: white;
}


div[id*='screenScrollView'] > div > :nth-of-type(13) button {
    background-color: purple;
    color: yellow;
}


div[id*='screenScrollView'] > div > :nth-of-type(14) button {
    background-color:yellow;
    color: black;
}
4 Likes
440

You’re welcome!

1 Like
441

What a pity. Will you have a CSS code to change the color of a choice?

442

Pedro… it’s amazing progress bar :tada:… congrants… Could you share us the CSS code? … thanks :wink:

1 Like
443

Do you have any current CSS settings for that card type? I’ll add to that.

1 Like
444

hi, i dont have any CSS on the card style… im asking if anyone know how to change the card style too :sweat_smile:

445 
<!--Image-->
<p style="position: Absolute;
width: 43px;
left: 50%;
margin-top: 0px;
margin-left: -140px;
transform: translate(-50%, 0%)">
<img src="https://i.imgur.com/FvPtAkr.png" /></p>

<!--Progress Bar-->
<pre><span><style>
.fckzPp {position: absolute;
background: #13161d;
height: 9px;
width: 261px;
left: 50%;
border-radius: 100px;
margin-right: -50%;
margin-left: 26px;
transform: translate(-50%, 0%)}
</pre></style></span>

And the text I created a template column, to be updated as the tasks are done.

<!--Text-->
<center><h5><font color="#efbc00">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; FINISHED% Concluído<font color="#ffffff">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; CONCLUDED/REMAINING Tarefas

Certainly, there is a better way to make the spacing better, but it worked, except for the fact that the size is tiny when it is on its side, but I still have to fix it …

2 Likes
446

I’m using Chrome, and the Code BOOK app doesn’t open.