mirror of
https://we.phorge.it/source/phorge.git
synced 2024-12-20 20:40:56 +01:00
4135c7de37
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
142 lines
2.9 KiB
CSS
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};
|
|
}
|