@use "sass:map"; .icon-char::before { font-family: Roboto, "Helvetica Neue", sans-serif; content: attr(data-char); width: 1.5rem; text-align: center; display: block; } @mixin icon { /* use !important to prevent issues with browser extensions that change fonts */ /* stylelint-disable-next-line font-family-no-missing-generic-family-keyword */ font-family: "icons" !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon { @include icon; } $icons-map: ( "active-sessions": "\f101", "add-one-badge": "\f102", "add-user-filled": "\f103", "add-user": "\f104", "add": "\f105", "admin": "\f106", "allow-speak": "\f107", "animals": "\f108", "animations": "\f109", "archive-filled": "\f10a", "archive-from-main": "\f10b", "archive-to-main": "\f10c", "archive": "\f10d", "arrow-down-circle": "\f10e", "arrow-down": "\f10f", "arrow-left": "\f110", "arrow-right": "\f111", "ask-support": "\f112", "attach": "\f113", "author-hidden": "\f114", "avatar-archived-chats": "\f115", "avatar-deleted-account": "\f116", "avatar-saved-messages": "\f117", "bold": "\f118", "boost-outline": "\f119", "boost": "\f11a", "boostcircle": "\f11b", "boosts": "\f11c", "bot-command": "\f11d", "bot-commands-filled": "\f11e", "bots": "\f11f", "bug": "\f120", "calendar-filter": "\f121", "calendar": "\f122", "camera-add": "\f123", "camera": "\f124", "car": "\f125", "card": "\f126", "cash-circle": "\f127", "channel-filled": "\f128", "channel": "\f129", "channelviews": "\f12a", "chat-badge": "\f12b", "chats-badge": "\f12c", "check": "\f12d", "clock": "\f12e", "close-circle": "\f12f", "close-topic": "\f130", "close": "\f131", "cloud-download": "\f132", "collapse": "\f133", "colorize": "\f134", "comments-sticker": "\f135", "comments": "\f136", "copy-media": "\f137", "copy": "\f138", "darkmode": "\f139", "data": "\f13a", "delete-filled": "\f13b", "delete-left": "\f13c", "delete-user": "\f13d", "delete": "\f13e", "document": "\f13f", "double-badge": "\f140", "down": "\f141", "download": "\f142", "eats": "\f143", "edit": "\f144", "email": "\f145", "enter": "\f146", "expand": "\f147", "eye-closed-outline": "\f148", "eye-closed": "\f149", "eye-outline": "\f14a", "eye": "\f14b", "favorite-filled": "\f14c", "favorite": "\f14d", "file-badge": "\f14e", "flag": "\f14f", "folder-badge": "\f150", "folder": "\f151", "fontsize": "\f152", "forums": "\f153", "forward": "\f154", "fullscreen": "\f155", "gifs": "\f156", "gift": "\f157", "group-filled": "\f158", "group": "\f159", "grouped-disable": "\f15a", "grouped": "\f15b", "hand-stop": "\f15c", "hashtag": "\f15d", "heart-outline": "\f15e", "heart": "\f15f", "help": "\f160", "info-filled": "\f161", "info": "\f162", "install": "\f163", "italic": "\f164", "key": "\f165", "keyboard": "\f166", "lamp": "\f167", "language": "\f168", "large-pause": "\f169", "large-play": "\f16a", "link-badge": "\f16b", "link-broken": "\f16c", "link": "\f16d", "location": "\f16e", "lock-badge": "\f16f", "lock": "\f170", "logout": "\f171", "loop": "\f172", "mention": "\f173", "message-failed": "\f174", "message-pending": "\f175", "message-read": "\f176", "message-succeeded": "\f177", "message": "\f178", "microphone-alt": "\f179", "microphone": "\f17a", "monospace": "\f17b", "more-circle": "\f17c", "more": "\f17d", "move-caption-down": "\f17e", "move-caption-up": "\f17f", "mute": "\f180", "muted": "\f181", "my-notes": "\f182", "new-chat-filled": "\f183", "next": "\f184", "nochannel": "\f185", "noise-suppression": "\f186", "non-contacts": "\f187", "one-filled": "\f188", "open-in-new-tab": "\f189", "password-off": "\f18a", "pause": "\f18b", "permissions": "\f18c", "phone-discard-outline": "\f18d", "phone-discard": "\f18e", "phone": "\f18f", "photo": "\f190", "pin-badge": "\f191", "pin-list": "\f192", "pin": "\f193", "pinned-chat": "\f194", "pinned-message": "\f195", "pip": "\f196", "play-story": "\f197", "play": "\f198", "poll": "\f199", "previous": "\f19a", "privacy-policy": "\f19b", "quote-text": "\f19c", "quote": "\f19d", "readchats": "\f19e", "recent": "\f19f", "reload": "\f1a0", "remove-quote": "\f1a1", "remove": "\f1a2", "reopen-topic": "\f1a3", "replace": "\f1a4", "replies": "\f1a5", "reply-filled": "\f1a6", "reply": "\f1a7", "revenue-split": "\f1a8", "revote": "\f1a9", "save-story": "\f1aa", "saved-messages": "\f1ab", "schedule": "\f1ac", "search": "\f1ad", "select": "\f1ae", "send-outline": "\f1af", "send": "\f1b0", "settings-filled": "\f1b1", "settings": "\f1b2", "share-filled": "\f1b3", "share-screen-outlined": "\f1b4", "share-screen-stop": "\f1b5", "share-screen": "\f1b6", "show-message": "\f1b7", "sidebar": "\f1b8", "skip-next": "\f1b9", "skip-previous": "\f1ba", "smallscreen": "\f1bb", "smile": "\f1bc", "sort": "\f1bd", "speaker-muted-story": "\f1be", "speaker-outline": "\f1bf", "speaker-story": "\f1c0", "speaker": "\f1c1", "spoiler-disable": "\f1c2", "spoiler": "\f1c3", "sport": "\f1c4", "star": "\f1c5", "stars-lock": "\f1c6", "stats": "\f1c7", "stealth-future": "\f1c8", "stealth-past": "\f1c9", "stickers": "\f1ca", "stop-raising-hand": "\f1cb", "stop": "\f1cc", "story-caption": "\f1cd", "story-expired": "\f1ce", "story-priority": "\f1cf", "story-reply": "\f1d0", "strikethrough": "\f1d1", "tag-add": "\f1d2", "tag-crossed": "\f1d3", "tag-filter": "\f1d4", "tag-name": "\f1d5", "tag": "\f1d6", "timer": "\f1d7", "toncoin": "\f1d8", "transcribe": "\f1d9", "truck": "\f1da", "unarchive": "\f1db", "underlined": "\f1dc", "unlock-badge": "\f1dd", "unlock": "\f1de", "unmute": "\f1df", "unpin": "\f1e0", "unread": "\f1e1", "up": "\f1e2", "user-filled": "\f1e3", "user-online": "\f1e4", "user": "\f1e5", "video-outlined": "\f1e6", "video-stop": "\f1e7", "video": "\f1e8", "view-once": "\f1e9", "voice-chat": "\f1ea", "volume-1": "\f1eb", "volume-2": "\f1ec", "volume-3": "\f1ed", "web": "\f1ee", "webapp": "\f1ef", "word-wrap": "\f1f0", "zoom-in": "\f1f1", "zoom-out": "\f1f2", ); .icon-active-sessions::before { content: map.get($icons-map, "active-sessions"); } .icon-add-one-badge::before { content: map.get($icons-map, "add-one-badge"); } .icon-add-user-filled::before { content: map.get($icons-map, "add-user-filled"); } .icon-add-user::before { content: map.get($icons-map, "add-user"); } .icon-add::before { content: map.get($icons-map, "add"); } .icon-admin::before { content: map.get($icons-map, "admin"); } .icon-allow-speak::before { content: map.get($icons-map, "allow-speak"); } .icon-animals::before { content: map.get($icons-map, "animals"); } .icon-animations::before { content: map.get($icons-map, "animations"); } .icon-archive-filled::before { content: map.get($icons-map, "archive-filled"); } .icon-archive-from-main::before { content: map.get($icons-map, "archive-from-main"); } .icon-archive-to-main::before { content: map.get($icons-map, "archive-to-main"); } .icon-archive::before { content: map.get($icons-map, "archive"); } .icon-arrow-down-circle::before { content: map.get($icons-map, "arrow-down-circle"); } .icon-arrow-down::before { content: map.get($icons-map, "arrow-down"); } .icon-arrow-left::before { content: map.get($icons-map, "arrow-left"); } .icon-arrow-right::before { content: map.get($icons-map, "arrow-right"); } .icon-ask-support::before { content: map.get($icons-map, "ask-support"); } .icon-attach::before { content: map.get($icons-map, "attach"); } .icon-author-hidden::before { content: map.get($icons-map, "author-hidden"); } .icon-avatar-archived-chats::before { content: map.get($icons-map, "avatar-archived-chats"); } .icon-avatar-deleted-account::before { content: map.get($icons-map, "avatar-deleted-account"); } .icon-avatar-saved-messages::before { content: map.get($icons-map, "avatar-saved-messages"); } .icon-bold::before { content: map.get($icons-map, "bold"); } .icon-boost-outline::before { content: map.get($icons-map, "boost-outline"); } .icon-boost::before { content: map.get($icons-map, "boost"); } .icon-boostcircle::before { content: map.get($icons-map, "boostcircle"); } .icon-boosts::before { content: map.get($icons-map, "boosts"); } .icon-bot-command::before { content: map.get($icons-map, "bot-command"); } .icon-bot-commands-filled::before { content: map.get($icons-map, "bot-commands-filled"); } .icon-bots::before { content: map.get($icons-map, "bots"); } .icon-bug::before { content: map.get($icons-map, "bug"); } .icon-calendar-filter::before { content: map.get($icons-map, "calendar-filter"); } .icon-calendar::before { content: map.get($icons-map, "calendar"); } .icon-camera-add::before { content: map.get($icons-map, "camera-add"); } .icon-camera::before { content: map.get($icons-map, "camera"); } .icon-car::before { content: map.get($icons-map, "car"); } .icon-card::before { content: map.get($icons-map, "card"); } .icon-cash-circle::before { content: map.get($icons-map, "cash-circle"); } .icon-channel-filled::before { content: map.get($icons-map, "channel-filled"); } .icon-channel::before { content: map.get($icons-map, "channel"); } .icon-channelviews::before { content: map.get($icons-map, "channelviews"); } .icon-chat-badge::before { content: map.get($icons-map, "chat-badge"); } .icon-chats-badge::before { content: map.get($icons-map, "chats-badge"); } .icon-check::before { content: map.get($icons-map, "check"); } .icon-clock::before { content: map.get($icons-map, "clock"); } .icon-close-circle::before { content: map.get($icons-map, "close-circle"); } .icon-close-topic::before { content: map.get($icons-map, "close-topic"); } .icon-close::before { content: map.get($icons-map, "close"); } .icon-cloud-download::before { content: map.get($icons-map, "cloud-download"); } .icon-collapse::before { content: map.get($icons-map, "collapse"); } .icon-colorize::before { content: map.get($icons-map, "colorize"); } .icon-comments-sticker::before { content: map.get($icons-map, "comments-sticker"); } .icon-comments::before { content: map.get($icons-map, "comments"); } .icon-copy-media::before { content: map.get($icons-map, "copy-media"); } .icon-copy::before { content: map.get($icons-map, "copy"); } .icon-darkmode::before { content: map.get($icons-map, "darkmode"); } .icon-data::before { content: map.get($icons-map, "data"); } .icon-delete-filled::before { content: map.get($icons-map, "delete-filled"); } .icon-delete-left::before { content: map.get($icons-map, "delete-left"); } .icon-delete-user::before { content: map.get($icons-map, "delete-user"); } .icon-delete::before { content: map.get($icons-map, "delete"); } .icon-document::before { content: map.get($icons-map, "document"); } .icon-double-badge::before { content: map.get($icons-map, "double-badge"); } .icon-down::before { content: map.get($icons-map, "down"); } .icon-download::before { content: map.get($icons-map, "download"); } .icon-eats::before { content: map.get($icons-map, "eats"); } .icon-edit::before { content: map.get($icons-map, "edit"); } .icon-email::before { content: map.get($icons-map, "email"); } .icon-enter::before { content: map.get($icons-map, "enter"); } .icon-expand::before { content: map.get($icons-map, "expand"); } .icon-eye-closed-outline::before { content: map.get($icons-map, "eye-closed-outline"); } .icon-eye-closed::before { content: map.get($icons-map, "eye-closed"); } .icon-eye-outline::before { content: map.get($icons-map, "eye-outline"); } .icon-eye::before { content: map.get($icons-map, "eye"); } .icon-favorite-filled::before { content: map.get($icons-map, "favorite-filled"); } .icon-favorite::before { content: map.get($icons-map, "favorite"); } .icon-file-badge::before { content: map.get($icons-map, "file-badge"); } .icon-flag::before { content: map.get($icons-map, "flag"); } .icon-folder-badge::before { content: map.get($icons-map, "folder-badge"); } .icon-folder::before { content: map.get($icons-map, "folder"); } .icon-fontsize::before { content: map.get($icons-map, "fontsize"); } .icon-forums::before { content: map.get($icons-map, "forums"); } .icon-forward::before { content: map.get($icons-map, "forward"); } .icon-fullscreen::before { content: map.get($icons-map, "fullscreen"); } .icon-gifs::before { content: map.get($icons-map, "gifs"); } .icon-gift::before { content: map.get($icons-map, "gift"); } .icon-group-filled::before { content: map.get($icons-map, "group-filled"); } .icon-group::before { content: map.get($icons-map, "group"); } .icon-grouped-disable::before { content: map.get($icons-map, "grouped-disable"); } .icon-grouped::before { content: map.get($icons-map, "grouped"); } .icon-hand-stop::before { content: map.get($icons-map, "hand-stop"); } .icon-hashtag::before { content: map.get($icons-map, "hashtag"); } .icon-heart-outline::before { content: map.get($icons-map, "heart-outline"); } .icon-heart::before { content: map.get($icons-map, "heart"); } .icon-help::before { content: map.get($icons-map, "help"); } .icon-info-filled::before { content: map.get($icons-map, "info-filled"); } .icon-info::before { content: map.get($icons-map, "info"); } .icon-install::before { content: map.get($icons-map, "install"); } .icon-italic::before { content: map.get($icons-map, "italic"); } .icon-key::before { content: map.get($icons-map, "key"); } .icon-keyboard::before { content: map.get($icons-map, "keyboard"); } .icon-lamp::before { content: map.get($icons-map, "lamp"); } .icon-language::before { content: map.get($icons-map, "language"); } .icon-large-pause::before { content: map.get($icons-map, "large-pause"); } .icon-large-play::before { content: map.get($icons-map, "large-play"); } .icon-link-badge::before { content: map.get($icons-map, "link-badge"); } .icon-link-broken::before { content: map.get($icons-map, "link-broken"); } .icon-link::before { content: map.get($icons-map, "link"); } .icon-location::before { content: map.get($icons-map, "location"); } .icon-lock-badge::before { content: map.get($icons-map, "lock-badge"); } .icon-lock::before { content: map.get($icons-map, "lock"); } .icon-logout::before { content: map.get($icons-map, "logout"); } .icon-loop::before { content: map.get($icons-map, "loop"); } .icon-mention::before { content: map.get($icons-map, "mention"); } .icon-message-failed::before { content: map.get($icons-map, "message-failed"); } .icon-message-pending::before { content: map.get($icons-map, "message-pending"); } .icon-message-read::before { content: map.get($icons-map, "message-read"); } .icon-message-succeeded::before { content: map.get($icons-map, "message-succeeded"); } .icon-message::before { content: map.get($icons-map, "message"); } .icon-microphone-alt::before { content: map.get($icons-map, "microphone-alt"); } .icon-microphone::before { content: map.get($icons-map, "microphone"); } .icon-monospace::before { content: map.get($icons-map, "monospace"); } .icon-more-circle::before { content: map.get($icons-map, "more-circle"); } .icon-more::before { content: map.get($icons-map, "more"); } .icon-move-caption-down::before { content: map.get($icons-map, "move-caption-down"); } .icon-move-caption-up::before { content: map.get($icons-map, "move-caption-up"); } .icon-mute::before { content: map.get($icons-map, "mute"); } .icon-muted::before { content: map.get($icons-map, "muted"); } .icon-my-notes::before { content: map.get($icons-map, "my-notes"); } .icon-new-chat-filled::before { content: map.get($icons-map, "new-chat-filled"); } .icon-next::before { content: map.get($icons-map, "next"); } .icon-nochannel::before { content: map.get($icons-map, "nochannel"); } .icon-noise-suppression::before { content: map.get($icons-map, "noise-suppression"); } .icon-non-contacts::before { content: map.get($icons-map, "non-contacts"); } .icon-one-filled::before { content: map.get($icons-map, "one-filled"); } .icon-open-in-new-tab::before { content: map.get($icons-map, "open-in-new-tab"); } .icon-password-off::before { content: map.get($icons-map, "password-off"); } .icon-pause::before { content: map.get($icons-map, "pause"); } .icon-permissions::before { content: map.get($icons-map, "permissions"); } .icon-phone-discard-outline::before { content: map.get($icons-map, "phone-discard-outline"); } .icon-phone-discard::before { content: map.get($icons-map, "phone-discard"); } .icon-phone::before { content: map.get($icons-map, "phone"); } .icon-photo::before { content: map.get($icons-map, "photo"); } .icon-pin-badge::before { content: map.get($icons-map, "pin-badge"); } .icon-pin-list::before { content: map.get($icons-map, "pin-list"); } .icon-pin::before { content: map.get($icons-map, "pin"); } .icon-pinned-chat::before { content: map.get($icons-map, "pinned-chat"); } .icon-pinned-message::before { content: map.get($icons-map, "pinned-message"); } .icon-pip::before { content: map.get($icons-map, "pip"); } .icon-play-story::before { content: map.get($icons-map, "play-story"); } .icon-play::before { content: map.get($icons-map, "play"); } .icon-poll::before { content: map.get($icons-map, "poll"); } .icon-previous::before { content: map.get($icons-map, "previous"); } .icon-privacy-policy::before { content: map.get($icons-map, "privacy-policy"); } .icon-quote-text::before { content: map.get($icons-map, "quote-text"); } .icon-quote::before { content: map.get($icons-map, "quote"); } .icon-readchats::before { content: map.get($icons-map, "readchats"); } .icon-recent::before { content: map.get($icons-map, "recent"); } .icon-reload::before { content: map.get($icons-map, "reload"); } .icon-remove-quote::before { content: map.get($icons-map, "remove-quote"); } .icon-remove::before { content: map.get($icons-map, "remove"); } .icon-reopen-topic::before { content: map.get($icons-map, "reopen-topic"); } .icon-replace::before { content: map.get($icons-map, "replace"); } .icon-replies::before { content: map.get($icons-map, "replies"); } .icon-reply-filled::before { content: map.get($icons-map, "reply-filled"); } .icon-reply::before { content: map.get($icons-map, "reply"); } .icon-revenue-split::before { content: map.get($icons-map, "revenue-split"); } .icon-revote::before { content: map.get($icons-map, "revote"); } .icon-save-story::before { content: map.get($icons-map, "save-story"); } .icon-saved-messages::before { content: map.get($icons-map, "saved-messages"); } .icon-schedule::before { content: map.get($icons-map, "schedule"); } .icon-search::before { content: map.get($icons-map, "search"); } .icon-select::before { content: map.get($icons-map, "select"); } .icon-send-outline::before { content: map.get($icons-map, "send-outline"); } .icon-send::before { content: map.get($icons-map, "send"); } .icon-settings-filled::before { content: map.get($icons-map, "settings-filled"); } .icon-settings::before { content: map.get($icons-map, "settings"); } .icon-share-filled::before { content: map.get($icons-map, "share-filled"); } .icon-share-screen-outlined::before { content: map.get($icons-map, "share-screen-outlined"); } .icon-share-screen-stop::before { content: map.get($icons-map, "share-screen-stop"); } .icon-share-screen::before { content: map.get($icons-map, "share-screen"); } .icon-show-message::before { content: map.get($icons-map, "show-message"); } .icon-sidebar::before { content: map.get($icons-map, "sidebar"); } .icon-skip-next::before { content: map.get($icons-map, "skip-next"); } .icon-skip-previous::before { content: map.get($icons-map, "skip-previous"); } .icon-smallscreen::before { content: map.get($icons-map, "smallscreen"); } .icon-smile::before { content: map.get($icons-map, "smile"); } .icon-sort::before { content: map.get($icons-map, "sort"); } .icon-speaker-muted-story::before { content: map.get($icons-map, "speaker-muted-story"); } .icon-speaker-outline::before { content: map.get($icons-map, "speaker-outline"); } .icon-speaker-story::before { content: map.get($icons-map, "speaker-story"); } .icon-speaker::before { content: map.get($icons-map, "speaker"); } .icon-spoiler-disable::before { content: map.get($icons-map, "spoiler-disable"); } .icon-spoiler::before { content: map.get($icons-map, "spoiler"); } .icon-sport::before { content: map.get($icons-map, "sport"); } .icon-star::before { content: map.get($icons-map, "star"); } .icon-stars-lock::before { content: map.get($icons-map, "stars-lock"); } .icon-stats::before { content: map.get($icons-map, "stats"); } .icon-stealth-future::before { content: map.get($icons-map, "stealth-future"); } .icon-stealth-past::before { content: map.get($icons-map, "stealth-past"); } .icon-stickers::before { content: map.get($icons-map, "stickers"); } .icon-stop-raising-hand::before { content: map.get($icons-map, "stop-raising-hand"); } .icon-stop::before { content: map.get($icons-map, "stop"); } .icon-story-caption::before { content: map.get($icons-map, "story-caption"); } .icon-story-expired::before { content: map.get($icons-map, "story-expired"); } .icon-story-priority::before { content: map.get($icons-map, "story-priority"); } .icon-story-reply::before { content: map.get($icons-map, "story-reply"); } .icon-strikethrough::before { content: map.get($icons-map, "strikethrough"); } .icon-tag-add::before { content: map.get($icons-map, "tag-add"); } .icon-tag-crossed::before { content: map.get($icons-map, "tag-crossed"); } .icon-tag-filter::before { content: map.get($icons-map, "tag-filter"); } .icon-tag-name::before { content: map.get($icons-map, "tag-name"); } .icon-tag::before { content: map.get($icons-map, "tag"); } .icon-timer::before { content: map.get($icons-map, "timer"); } .icon-toncoin::before { content: map.get($icons-map, "toncoin"); } .icon-transcribe::before { content: map.get($icons-map, "transcribe"); } .icon-truck::before { content: map.get($icons-map, "truck"); } .icon-unarchive::before { content: map.get($icons-map, "unarchive"); } .icon-underlined::before { content: map.get($icons-map, "underlined"); } .icon-unlock-badge::before { content: map.get($icons-map, "unlock-badge"); } .icon-unlock::before { content: map.get($icons-map, "unlock"); } .icon-unmute::before { content: map.get($icons-map, "unmute"); } .icon-unpin::before { content: map.get($icons-map, "unpin"); } .icon-unread::before { content: map.get($icons-map, "unread"); } .icon-up::before { content: map.get($icons-map, "up"); } .icon-user-filled::before { content: map.get($icons-map, "user-filled"); } .icon-user-online::before { content: map.get($icons-map, "user-online"); } .icon-user::before { content: map.get($icons-map, "user"); } .icon-video-outlined::before { content: map.get($icons-map, "video-outlined"); } .icon-video-stop::before { content: map.get($icons-map, "video-stop"); } .icon-video::before { content: map.get($icons-map, "video"); } .icon-view-once::before { content: map.get($icons-map, "view-once"); } .icon-voice-chat::before { content: map.get($icons-map, "voice-chat"); } .icon-volume-1::before { content: map.get($icons-map, "volume-1"); } .icon-volume-2::before { content: map.get($icons-map, "volume-2"); } .icon-volume-3::before { content: map.get($icons-map, "volume-3"); } .icon-web::before { content: map.get($icons-map, "web"); } .icon-webapp::before { content: map.get($icons-map, "webapp"); } .icon-word-wrap::before { content: map.get($icons-map, "word-wrap"); } .icon-zoom-in::before { content: map.get($icons-map, "zoom-in"); } .icon-zoom-out::before { content: map.get($icons-map, "zoom-out"); }