Skip to content


Subversion checkout URL

You can clone with
Download ZIP


Conflict with @modal-title-padding variable in Bootstrap #377

jaoued opened this Issue · 6 comments

7 participants



There is a conflict with your variable : @modal-title-padding : 17px 19px 15px 24px;
(FLAT UI PRO 1.2.5) and the Bootstrap (3.0.3+) variable @modal-title-padding :15px;.

Indeed, when i compile BS less files and Flat UI less files, i got this error Operation on an invalid type.

After investigation, is because of those lines (bootstrap/modals.less - line 79) :

// Modal header
// Top section of the modal w/ title and dismiss
.modal-header {
      padding: @modal-title-padding;
      border-bottom: 1px solid @modal-header-border-color;
      min-height: @modal-title-padding + @modal-title-line-height;



Having exactly the same problem (FLAT UI PRO 1.2.5 + Bootstrap 3.1.0)

For the time beeing, I've just replaced the line @modal-title-padding : 17px 19px 15px 24px with @modal-title-padding :15px; in flat-ui/less/variables.less


ok, we fix this in next release.



@pytkin pytkin closed this

@pytkin when is the next release of Pro? It has been awhile and this simple bug still exists in a premium product.


This problem has not been fixed with the new release of 1.3.0. The problem is that Bootstrap defines modal-title-padding as a single value, and performs calculations in modals.less under the assumption it is a single value: min-height: (@modal-title-padding + @modal-title-line-height);, whereas flat-ui-pro defines multiple values: @modal-title-padding: 17px 19px 15px 24px;

The "solution" is to change the variable name to something else, eg:

Line 32 in modules\modals.less becomes:

padding: @modal-title-padding-all;

Line 708 in variables.less becomes:

@modal-title-padding-all: 17px 19px 15px 24px;

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.