Error in variables.less - Joomla! Forum - community, help and support
hi,
i have discovered mistake in file variables.less of protostar template
these variables define width of grid screens of @ least 1200 px of large.
the calculation @ gridrowwidth1200 = 940px
the values :
i have discovered mistake in file variables.less of protostar template
code: select all
/* >>> jui >>> */
// 1200px min
@gridcolumnwidth1200: 60px;
@gridgutterwidth1200: 20px;
@gridrowwidth1200: (@gridcolumns * @gridcolumnwidth) + (@gridgutterwidth * (@gridcolumns - 1));these variables define width of grid screens of @ least 1200 px of large.
the calculation @ gridrowwidth1200 = 940px
the values :
code: select all
@gridcolumnwidth1200: 70px;
@gridgutterwidth1200: 30px;
this month i've installed latest version of joomla discovering it's worse calculations gridrowwidth1200 , gridrowwidth768 use wrong variable. avoid horizontal scrolbar, had adjust values well.
here's corrected code variable.less:
in addition, it's neccessary adjust template.less either increase max-with of container or comment restriction:
here's corrected code variable.less:
code: select all
// default screen size 980px-1199px grid 12*60px + (11-1)*17px = 896px plus padding
// -------------------------
@gridcolumns: 12;
@gridcolumnwidth: 60px;
@gridgutterwidth: 16px;
@gridrowwidth: (@gridcolumns * @gridcolumnwidth) + (@gridgutterwidth * (@gridcolumns - 1));
// > joomla jui
// 1200px min grid 12*75px + (12-1)*20px = 1120px plus padding
@gridcolumnwidth1200: 75px;
@gridgutterwidth1200: 20px;
@gridrowwidth1200: (@gridcolumns * @gridcolumnwidth1200) + (@gridgutterwidth1200 * (@gridcolumns - 1));
// 768px-979px grid 12*42px + (12-1)*16px = 680px plus padding
@gridcolumnwidth768: 42px;
@gridgutterwidth768: 16px;
@gridrowwidth768: (@gridcolumns * @gridcolumnwidth768) + (@gridgutterwidth768 * (@gridcolumns - 1));in addition, it's neccessary adjust template.less either increase max-with of container or comment restriction:
code: select all
/* container */
.container{
//### max-width: 960px;
}
Comments
Post a Comment