Last active
May 3, 2023 16:36
-
-
Save dmackerman/4734551 to your computer and use it in GitHub Desktop.
If you use Font Awesome in ::before and ::after pseudo elements, you can use these variables instead of using the unrecognizable content definitions.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .booya { | |
| &:before { | |
| font-family: "FontAwesome"; | |
| content: '$icon-music'; | |
| } | |
| } | |
| $icon-glass: "\f000"; | |
| $icon-music: "\f001"; | |
| $icon-search: "\f002"; | |
| $icon-envelope: "\f003"; | |
| $icon-heart: "\f004"; | |
| $icon-star: "\f005"; | |
| $icon-star-empty: "\f006"; | |
| $icon-user: "\f007"; | |
| $icon-film: "\f008"; | |
| $icon-th-large: "\f009"; | |
| $icon-th: "\f00a"; | |
| $icon-th-list: "\f00b"; | |
| $icon-ok: "\f00c"; | |
| $icon-remove: "\f00d"; | |
| $icon-zoom-in: "\f00e"; | |
| $icon-zoom-out: "\f010"; | |
| $icon-off: "\f011"; | |
| $icon-signal: "\f012"; | |
| $icon-cog: "\f013"; | |
| $icon-trash: "\f014"; | |
| $icon-home: "\f015"; | |
| $icon-file: "\f016"; | |
| $icon-time: "\f017"; | |
| $icon-road: "\f018"; | |
| $icon-download-alt: "\f019"; | |
| $icon-download: "\f01a"; | |
| $icon-upload: "\f01b"; | |
| $icon-inbox: "\f01c"; | |
| $icon-play-circle: "\f01d"; | |
| $icon-repeat: "\f01e"; | |
| /* \f020 doesn't work in Safari. all shifted one down */ | |
| $icon-refresh: "\f021"; | |
| $icon-list-alt: "\f022"; | |
| $icon-lock: "\f023"; | |
| $icon-flag: "\f024"; | |
| $icon-headphones: "\f025"; | |
| $icon-volume-off: "\f026"; | |
| $icon-volume-down: "\f027"; | |
| $icon-volume-up: "\f028"; | |
| $icon-qrcode: "\f029"; | |
| $icon-barcode: "\f02a"; | |
| $icon-tag: "\f02b"; | |
| $icon-tags: "\f02c"; | |
| $icon-book: "\f02d"; | |
| $icon-bookmark: "\f02e"; | |
| $icon-print: "\f02f"; | |
| $icon-camera: "\f030"; | |
| $icon-font: "\f031"; | |
| $icon-bold: "\f032"; | |
| $icon-italic: "\f033"; | |
| $icon-text-height: "\f034"; | |
| $icon-text-width: "\f035"; | |
| $icon-align-left: "\f036"; | |
| $icon-align-center: "\f037"; | |
| $icon-align-right: "\f038"; | |
| $icon-align-justify: "\f039"; | |
| $icon-list: "\f03a"; | |
| $icon-indent-left: "\f03b"; | |
| $icon-indent-right: "\f03c"; | |
| $icon-facetime-video: "\f03d"; | |
| $icon-picture: "\f03e"; | |
| $icon-pencil: "\f040"; | |
| $icon-map-marker: "\f041"; | |
| $icon-adjust: "\f042"; | |
| $icon-tint: "\f043"; | |
| $icon-edit: "\f044"; | |
| $icon-share: "\f045"; | |
| $icon-check: "\f046"; | |
| $icon-move: "\f047"; | |
| $icon-step-backward: "\f048"; | |
| $icon-fast-backward: "\f049"; | |
| $icon-backward: "\f04a"; | |
| $icon-play: "\f04b"; | |
| $icon-pause: "\f04c"; | |
| $icon-stop: "\f04d"; | |
| $icon-forward: "\f04e"; | |
| $icon-fast-forward: "\f050"; | |
| $icon-step-forward: "\f051"; | |
| $icon-eject: "\f052"; | |
| $icon-chevron-left: "\f053"; | |
| $icon-chevron-right: "\f054"; | |
| $icon-plus-sign: "\f055"; | |
| $icon-minus-sign: "\f056"; | |
| $icon-remove-sign: "\f057"; | |
| $icon-ok-sign: "\f058"; | |
| $icon-question-sign: "\f059"; | |
| $icon-info-sign: "\f05a"; | |
| $icon-screenshot: "\f05b"; | |
| $icon-remove-circle: "\f05c"; | |
| $icon-ok-circle: "\f05d"; | |
| $icon-ban-circle: "\f05e"; | |
| $icon-arrow-left: "\f060"; | |
| $icon-arrow-right: "\f061"; | |
| $icon-arrow-up: "\f062"; | |
| $icon-arrow-down: "\f063"; | |
| $icon-share-alt: "\f064"; | |
| $icon-resize-full: "\f065"; | |
| $icon-resize-small: "\f066"; | |
| $icon-plus: "\f067"; | |
| $icon-minus: "\f068"; | |
| $icon-asterisk: "\f069"; | |
| $icon-exclamation-sign: "\f06a"; | |
| $icon-gift: "\f06b"; | |
| $icon-leaf: "\f06c"; | |
| $icon-fire: "\f06d"; | |
| $icon-eye-open: "\f06e"; | |
| $icon-eye-close: "\f070"; | |
| $icon-warning-sign: "\f071"; | |
| $icon-plane: "\f072"; | |
| $icon-calendar: "\f073"; | |
| $icon-random: "\f074"; | |
| $icon-comment: "\f075"; | |
| $icon-magnet: "\f076"; | |
| $icon-chevron-up: "\f077"; | |
| $icon-chevron-down: "\f078"; | |
| $icon-retweet: "\f079"; | |
| $icon-shopping-cart: "\f07a"; | |
| $icon-folder-close: "\f07b"; | |
| $icon-folder-open: "\f07c"; | |
| $icon-resize-vertical: "\f07d"; | |
| $icon-resize-horizontal: "\f07e"; | |
| $icon-bar-chart: "\f080"; | |
| $icon-twitter-sign: "\f081"; | |
| $icon-facebook-sign: "\f082"; | |
| $icon-camera-retro: "\f083"; | |
| $icon-key: "\f084"; | |
| $icon-cogs: "\f085"; | |
| $icon-comments: "\f086"; | |
| $icon-thumbs-up: "\f087"; | |
| $icon-thumbs-down: "\f088"; | |
| $icon-star-half: "\f089"; | |
| $icon-heart-empty: "\f08a"; | |
| $icon-signout: "\f08b"; | |
| $icon-linkedin-sign: "\f08c"; | |
| $icon-pushpin: "\f08d"; | |
| $icon-external-link: "\f08e"; | |
| $icon-signin: "\f090"; | |
| $icon-trophy: "\f091"; | |
| $icon-github-sign: "\f092"; | |
| $icon-upload-alt: "\f093"; | |
| $icon-lemon: "\f094"; | |
| $icon-phone: "\f095"; | |
| $icon-check-empty: "\f096"; | |
| $icon-bookmark-empty: "\f097"; | |
| $icon-phone-sign: "\f098"; | |
| $icon-twitter: "\f099"; | |
| $icon-facebook: "\f09a"; | |
| $icon-github: "\f09b"; | |
| $icon-unlock: "\f09c"; | |
| $icon-credit-card: "\f09d"; | |
| $icon-rss: "\f09e"; | |
| $icon-hdd: "\f0a0"; | |
| $icon-bullhorn: "\f0a1"; | |
| $icon-bell: "\f0a2"; | |
| $icon-certificate: "\f0a3"; | |
| $icon-hand-right: "\f0a4"; | |
| $icon-hand-left: "\f0a5"; | |
| $icon-hand-up: "\f0a6"; | |
| $icon-hand-down: "\f0a7"; | |
| $icon-circle-arrow-left: "\f0a8"; | |
| $icon-circle-arrow-right: "\f0a9"; | |
| $icon-circle-arrow-up: "\f0aa"; | |
| $icon-circle-arrow-down: "\f0ab"; | |
| $icon-globe: "\f0ac"; | |
| $icon-wrench: "\f0ad"; | |
| $icon-tasks: "\f0ae"; | |
| $icon-filter: "\f0b0"; | |
| $icon-briefcase: "\f0b1"; | |
| $icon-fullscreen: "\f0b2"; | |
| $icon-group: "\f0c0"; | |
| $icon-link: "\f0c1"; | |
| $icon-cloud: "\f0c2"; | |
| $icon-beaker: "\f0c3"; | |
| $icon-cut: "\f0c4"; | |
| $icon-copy: "\f0c5"; | |
| $icon-paper-clip: "\f0c6"; | |
| $icon-save: "\f0c7"; | |
| $icon-sign-blank: "\f0c8"; | |
| $icon-reorder: "\f0c9"; | |
| $icon-list-ul: "\f0ca"; | |
| $icon-list-ol: "\f0cb"; | |
| $icon-strikethrough: "\f0cc"; | |
| $icon-underline: "\f0cd"; | |
| $icon-table: "\f0ce"; | |
| $icon-magic: "\f0d0"; | |
| $icon-truck: "\f0d1"; | |
| $icon-pinterest: "\f0d2"; | |
| $icon-pinterest-sign: "\f0d3"; | |
| $icon-google-plus-sign: "\f0d4"; | |
| $icon-google-plus: "\f0d5"; | |
| $icon-money: "\f0d6"; | |
| $icon-caret-down: "\f0d7"; | |
| $icon-caret-up: "\f0d8"; | |
| $icon-caret-left: "\f0d9"; | |
| $icon-caret-right: "\f0da"; | |
| $icon-columns: "\f0db"; | |
| $icon-sort: "\f0dc"; | |
| $icon-sort-down: "\f0dd"; | |
| $icon-sort-up: "\f0de"; | |
| $icon-envelope-alt: "\f0e0"; | |
| $icon-linkedin: "\f0e1"; | |
| $icon-undo: "\f0e2"; | |
| $icon-legal: "\f0e3"; | |
| $icon-dashboard: "\f0e4"; | |
| $icon-comment-alt: "\f0e5"; | |
| $icon-comments-alt: "\f0e6"; | |
| $icon-bolt: "\f0e7"; | |
| $icon-sitemap: "\f0e8"; | |
| $icon-umbrella: "\f0e9"; | |
| $icon-paste: "\f0ea"; | |
| $icon-lightbulb: "\f0eb"; | |
| $icon-exchange: "\f0ec"; | |
| $icon-cloud-download: "\f0ed"; | |
| $icon-cloud-upload: "\f0ee"; | |
| $icon-user-md: "\f0f0"; | |
| $icon-stethoscope: "\f0f1"; | |
| $icon-suitcase: "\f0f2"; | |
| $icon-bell-alt: "\f0f3"; | |
| $icon-coffee: "\f0f4"; | |
| $icon-food: "\f0f5"; | |
| $icon-file-alt: "\f0f6"; | |
| $icon-building: "\f0f7"; | |
| $icon-hospital: "\f0f8"; | |
| $icon-ambulance: "\f0f9"; | |
| $icon-medkit: "\f0fa"; | |
| $icon-fighter-jet: "\f0fb"; | |
| $icon-beer: "\f0fc"; | |
| $icon-h-sign: "\f0fd"; | |
| $icon-plus-sign-alt: "\f0fe"; | |
| $icon-double-angle-left: "\f100"; | |
| $icon-double-angle-right: "\f101"; | |
| $icon-double-angle-up: "\f102"; | |
| $icon-double-angle-down: "\f103"; | |
| $icon-angle-left: "\f104"; | |
| $icon-angle-right: "\f105"; | |
| $icon-angle-up: "\f106"; | |
| $icon-angle-down: "\f107"; | |
| $icon-desktop: "\f108"; | |
| $icon-laptop: "\f109"; | |
| $icon-tablet: "\f10a"; | |
| $icon-mobile-phone: "\f10b"; | |
| $icon-circle-blank: "\f10c"; | |
| $icon-quote-left: "\f10d"; | |
| $icon-quote-right: "\f10e"; | |
| $icon-spinner: "\f110"; | |
| $icon-circle: "\f111"; | |
| $icon-reply: "\f112"; | |
| $icon-github-alt: "\f113"; | |
| $icon-folder-close-alt: "\f114"; | |
| $icon-folder-open-alt: "\f115"; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment