I want to change all buttons color whose color is blue to red

Frappe Framework Customization
4

I can understand if there any solution I found will update you

1 Like
5

thanks

6

Change the color of btn-primary class in desk.min.css

2 Likes
7

desk.min.css file is auto generated file which is regenerated every time if I change any thing so the change will not be apply…Any solution to edit this file I found this file on sites/assets/css/desk.min.css this path… Guide me if I wrong…dear @shahid

8

It don’t think so that it will auto regenerate every time, and what do you mean by every time? on every update or what?
I have also changed my theme by editing desk.min.css.

9

Screenshot%20from%202018-09-07%2020-44-24
Screenshot%20from%202018-09-07%2020-44-241307×931 137 KB

You may check this detail…

10

You can make a custom app, then add a custom css file to its public folder. E.g…

custom_app/custom_app/public/css/custom.css:

.btn-primary {
    background-color: red;
}

Then include that file in custom_app/custom_app/hooks.py

app_include_css = [
    "/assets/custom_app/css/custom.css"
]

Then run bench build

4 Likes
11

Can you clarify me where to make exactly custom_app
give a clarity on this.

12

Using the below commands:

bench new-app application_name
bench install-app application_name

Regards
Bilal

13

Ok thank you.

14

Did it work?

1 Like
15

I tried this, but I am not able to have /home/user/frappe-bench/sites/assets/css/desk.min.css updated even after bench build.

I have followed your steps exactly.

Placed the custom.css in /home/user/frappe-bench/apps/custom_app/custom_app/public/css/custom.css

Also created a symbolic link in /home/user/frappe-bench/sites/assets but no difference.

Some understanding on what is the process that takes place to build up desk.min.css and the hierarchy it follows is lacking.

16

Finally sorted out. Need to create build.json as well. So let me write here how it worked:

hooks.py

app_include_css = [
	"/assets/dsr/css/custom.css"
]

custom.css in bench/apps/custom_app/custom_app/public/css

.btn-primary {
    background-color: crimson;
    border-color: crimson;
}

build.json in bench/apps/custom_app/custom_app/public

{
    "css/custom.min.css": [
    "public/css/custom.css"
    ]
}
4 Likes
17

I need to change the color of the blue buttons to green, the blue ones carry the btn-primary class but I still haven’t managed to change the color.
I need help

18

hi,
try it, it worked for me.
$(“[data-fieldname=general_tab]”).css(‘background-color’, ‘lightblue’);

19

Can you tell me where exactly I change it?
My goal is to change the color of all the blue buttons to green

20

re,

1 Like
21

No luck … didnt work for me although i have followed exactly your guide (except changing URLs).

22

do bench build after the changes are done so that the public/css .min is updated

1 Like
23

you should add !important in your css section, it worked for me

.btn-primary {
background-color: #ef5720 !important;
border-color: #ff4444 !important;
}

2 Likes