1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-30 10:42:41 +01:00
phorge-phorge/webroot/rsrc/css/font/phui-font-icon-base.css
Chad Little 60d1762a85 Redesign Config Application
Summary: Ref T11132, significantly cleans up the Config app, new layout, icons, spacing, etc. Some minor todos around re-designing "issues", mobile support, and maybe another pass at actual Group pages.

Test Plan: Visit and test every page in the config app, set new items, resolve setup issues, etc.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: PHID-OPKG-gm6ozazyms6q6i22gyam, Korvin

Maniphest Tasks: T11132

Differential Revision: https://secure.phabricator.com/D16468
2016-08-29 15:49:49 -07:00

205 lines
3.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.dark {
color: {$darkgreytext};
}
.phui-icon-view.bluegrey {
color: {$bluetext};
}
.phui-icon-view.white {
color: #fff;
}
.phui-icon-view.red {
color: {$red};
}
.phui-icon-view.orange {
color: {$orange};
}
.phui-icon-view.yellow {
color: {$yellow};
}
.phui-icon-view.green {
color: {$green}
}
.phui-icon-view.blue {
color: {$blue};
}
.phui-icon-view.sky {
color: {$sky};
}
.phui-icon-view.indigo {
color: {$indigo};
}
.phui-icon-view.pink {
color: {$pink};
}
.phui-icon-view.fire {
color: {$fire};
}
.phui-icon-view.violet {
color: {$violet};
}
.phui-icon-view.lightbluetext {
color: {$lightbluetext};
}
.phui-icon-view.lightgreytext,
.phui-icon-view.grey {
color: rgba({$alphagrey},0.3);
}
/* Backgrounds */
.phui-icon-view.bg-dark {
background-color: {$darkgreytext};
}
.phui-icon-view.bg-bluegrey {
background-color: {$bluetext};
}
.phui-icon-view.bg-grey {
background-color: {$lightgreytext};
}
.phui-icon-view.bg-red {
background-color: {$red};
}
.phui-icon-view.bg-orange {
background-color: {$orange};
}
.phui-icon-view.bg-yellow {
background-color: {$yellow};
}
.phui-icon-view.bg-green {
background-color: {$green}
}
.phui-icon-view.bg-blue {
background-color: {$blue};
}
.phui-icon-view.bg-sky {
background-color: {$sky};
}
.phui-icon-view.bg-indigo {
background-color: {$indigo};
}
.phui-icon-view.bg-pink {
background-color: {$pink};
}
.phui-icon-view.bg-fire {
background-color: {$fire};
}
.phui-icon-view.bg-violet {
background-color: {$violet};
}
/* Hovers */
.device-desktop a.phui-icon-view.lightgreytext:hover,
.device-desktop a.phui-icon-view.grey:hover {
color: {$darkgreytext};
}
.device-desktop a.phui-icon-view.bluegrey:hover {
color: {$darkbluetext};
}