1. Feedback
  2. React
  3. 21371

Welcome to the React feedback portal. We’re happy you’re here! If you have feedback on how to improve the React, we’d love to hear it!

  • Check out the features or bugs others have reported and vote on your favorites. Feedback will be prioritized based on popularity.
  • If you have feedback that’s not listed yet, submit your own.

Thanks for joining our community and helping improve Syncfusion products!

2
Votes

Dialog's primary button without flat appearance

When the isPrimary property is enabled, the dialog buttons display with a flat appearance by adding an "e-flat" class. Provide an option to add/remove the flat appearance, so the user can customize it based on their application needs.

Currently, the requirement can be achieved by overriding the class like below. But we can introduce a new API to control it directly.

>>>>>>>>>>>


.e-dialog .e-footer-content .e-primary { 
            background-color: #e3165b; 
            border-color: transparent; 
            color: #fff; 
} 
 
.e-dialog .e-footer-content .e-primary:active { 
            background-color: #ec618f; 
            border-color: transparent; 
            color: #fff; 
            outline: #fafafa 0 solid; 
            box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12); 
} 
 
.e-dialog .e-footer-content .e-primary:hover { 
            background-color: #e6326f; 
            border-color: transparent; 
            box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); 
            color: #fff; 
} 
 
.e-dialog .e-footer-content .e-primary:focus { 
            background-color: #ea4e82; 
            border-color: transparent; 
            color: #fff; 
            outline: #fafafa 0 solid; 
            box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); 
}