frappe / frappe

Low code web framework for real world applications, in Python and Javascript
https://frappeframework.com
MIT License
7.25k stars 3.44k forks source link

Form Layout set_intro box only has 3 color options. Green and Orange can be added #16725

Closed nikkothari22 closed 2 years ago

nikkothari22 commented 2 years ago

Is your feature request related to a problem? Please describe. In a form layout, we have the ability to set an intro message using frm.set_intro(message, color). The color field defaults to blue, and can only take the following options: yellow, blue and red - this is explicitly defined in form/layout.js under the show_message() function.

    show_message: function(html, color) {
        if (this.message_color) {
            // remove previous color
            this.message.removeClass(this.message_color);
        }
        this.message_color = (color && ['yellow', 'blue', 'red'].includes(color)) ? color : 'blue';
        if (html) {
            if (html.substr(0, 1)!=='<') {
                // wrap in a block
                html = '<div>' + html + '</div>';
            }
            this.message.removeClass('hidden').addClass(this.message_color);
            $(html).appendTo(this.message);
        } else {
            this.message.empty().addClass('hidden');
        }
    }

However, while inspecting the underlying CSS on the browser, I noticed that two more color options: green and orange are available as well - and they are supported on both light and dark mode.

Describe the solution you'd like We should add these two color options as well - since the theme already supports it. I feel like green is needed as a color option since success messages can be shown in it.

If implemented, here's how it would look:

Green:

image image

Orange:

image image

The easiest solution is to add green and orange to the condition that checks if the color belongs to ['yellow', 'blue', 'red']. But I am relatively new to contributing to Frappe, so I do not know if the condition was kept purposely or not. 😅

If there's no issue with adding those color options, I'll be glad to create a PR for this.

nikkothari22 commented 2 years ago

I have also updated the documentation for this function here. I have added the color parameter, the color options as well as a screenshot.

ankush commented 2 years ago

Open a PR for this. 👍