/** * @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-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}; }