Fix chrome-only intermittent rendering error of font awesome icons that have their sizes changed by overriding 4.2 font-size inheritance rule from core.less

This commit is contained in:
carlfeberhard
2016-02-23 15:46:00 -05:00
parent 4c815a7d05
commit 9acbfdf3c3
3 changed files with 15 additions and 26 deletions
+9
View File
@@ -16,6 +16,15 @@
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.fa {
// The following overrides the 'font-size: inherit' rule in fontawesome/core.less and prevents an intermittant chrome
// bug that makes fa icons render in the default font (e.g. times) which, since most of the icons use unicode, make
// the icons invisible. This only occurs when the font-size is further embiggened down the road (e.g. .icon-btn).
// see also: https://github.com/galaxyproject/galaxy/issues/1716
// and: https://github.com/FortAwesome/Font-Awesome/issues/5128
// TODO: remove
font-size: 14px;
}
@import "select2.less";
/* fix for zero width select2 - remove when fixed there */
+5 -25
View File
@@ -1,29 +1,7 @@
// trello-ish style
//@icon-btn-size: 18px;
//@icon-btn-margin: 2px;
//@icon-btn-color: #AAA;
//@icon-btn-bg: @btn-default-bg;
//@icon-btn-border: lightgrey;
// no bg
//@icon-btn-size: 16px;
//@icon-btn-margin: 0px;
//@icon-btn-color: #444;
//@icon-btn-bg: transparent;
//@icon-btn-border: transparent;
// dark bg
//@icon-btn-size: 16px;
//@icon-btn-margin: 1px;
//@icon-btn-color: @link-color;
//@icon-btn-bg: rgba( 0, 0, 0, 0.1 );
//@icon-btn-border: transparent;
// big & dark style
@icon-btn-size: 22px;
@icon-btn-margin: 2px;
@icon-btn-color: @btn-default-color;
//@icon-btn-bg: transparent;
@icon-btn-bg: @btn-default-bg;
@icon-btn-border: @btn-default-border;
@@ -31,10 +9,11 @@
display : inline-block;
height : @icon-btn-size;
width : @icon-btn-size;
font-size: 125%;
// center the icon
text-align: center;
line-height: @icon-btn-size - 3;
font-size: 1.2em;
// colors and borders
border-radius: 3px;
@@ -50,14 +29,15 @@
background-color: white;
color: maroon;
}
}
.icon-btn.disabled {
background-color: transparent;
color: #BBB;
border-color: #BBB;
//color: @icon-btn-border;
}
.icon-btn-group {
display: inline-block;
.icon-btn:not(:last-child) {
File diff suppressed because one or more lines are too long