1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-23 23:32:40 +01:00
phorge-phorge/webroot/rsrc/css/font/phui-font-icon-base.css
Chad Little 4135c7de37 Clean up FontAwesome / Timeline CSS
Summary: Normalize FA CSS, expand timeline icons to 14px, fix mobile browsers, give attribution in uiexamples

Test Plan: tested iOS simulator, chrome, ie

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: epriestley, Korvin

Differential Revision: https://secure.phabricator.com/D8845
2014-04-22 18:29:14 -07:00

142 lines
2.9 KiB
CSS

/**
* @provides phui-font-icon-base-css
*/
.phui-font-fa {
display: inline-block;
color: {$darkgreytext};
font-style: normal;
font-weight: normal;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.ph-rotate-90 {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
.ph-rotate-180 {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
.ph-rotate-270 {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
-ms-transform: rotate(270deg);
-o-transform: rotate(270deg);
transform: rotate(270deg);
}
.ph-flip-horizontal {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
-webkit-transform: scale(-1, 1);
-moz-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
-o-transform: scale(-1, 1);
transform: scale(-1, 1);
}
.ph-flip-vertical {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
-webkit-transform: scale(1, -1);
-moz-transform: scale(1, -1);
-ms-transform: scale(1, -1);
-o-transform: scale(1, -1);
transform: scale(1, -1);
}
.ph-spin {
-webkit-animation: spin 2s infinite linear;
-moz-animation: spin 2s infinite linear;
-o-animation: spin 2s infinite linear;
animation: spin 2s infinite linear;
}
@-moz-keyframes spin {
0% {
-moz-transform: rotate(0deg);
}
100% {
-moz-transform: rotate(359deg);
}
}
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(359deg);
}
}
@-o-keyframes spin {
0% {
-o-transform: rotate(0deg);
}
100% {
-o-transform: rotate(359deg);
}
}
@-ms-keyframes spin {
0% {
-ms-transform: rotate(0deg);
}
100% {
-ms-transform: rotate(359deg);
}
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(359deg);
}
}
.phui-icon-view.bluegrey:before {
color: #7787a6;
}
.phui-icon-view.white:before {
color: #fff;
}
.phui-icon-view.red:before {
color: {$red};
}
.phui-icon-view.orange:before {
color: {$orange};
}
.phui-icon-view.yellow:before {
color: {$yellow};
}
.phui-icon-view.green:before {
color: {$green}
}
.phui-icon-view.blue:before {
color: {$blue};
}
.phui-icon-view.sky:before {
color: {$sky};
}
.phui-icon-view.indigo:before {
color: {$indigo};
}
.phui-icon-view.violet:before {
color: {$violet};
}
.phui-icon-view.lightbluetext:before {
color: {$lightbluetext};
}
.phui-icon-view.lightgreytext:before {
color: {$lightgreytext};
}