2023-03-10 19:19:42 +02:00
/ * Mastodon Bird UI by @ rolle @ mementomori . social
2024-07-11 18:01:29 +03:00
2 . 0 . 0rc40 * /
2023-03-09 14:40:26 +02:00
2023-03-08 15:28:39 +02:00
/* CSS variables */
: root {
2023-03-08 18:44:10 +02:00
/* Brand colors */
--color-brand-twitter : # 1d9bf0 ;
--color-brand-twitter-bg : # 15202b ;
--color-brand-twitter-dim : # 8b98a5 ;
--color-brand-twitter-mud : # 273340 ;
2023-03-08 19:49:03 +02:00
--color-brand-twitter-dark : # 232543 ;
2023-03-08 22:06:46 +02:00
--color-brand-twitter-threaded-line : # 425364 ;
2023-10-29 21:09:09 +02:00
--color-brand-mastodon : # 6364ff ;
--color-brand-mastodon-links : # 858afa ;
2023-03-08 18:44:10 +02:00
--color-brand-mastodon-bg : # 1e2028 ;
--color-brand-mastodon-dim : # 717c9b ;
2023-10-29 21:09:09 +02:00
--color-brand-mastodon-mud : rgb ( 39 44 64 / . 5 ) ;
2023-03-08 19:49:03 +02:00
--color-brand-mastodon-dark : # 232543 ;
2023-03-08 22:06:46 +02:00
--color-brand-mastodon-threaded-line : # 434264 ;
2023-03-09 12:16:25 +02:00
--color-brand-mastodon-text-light : # 8493a7 ;
2023-03-08 18:44:10 +02:00
2023-03-08 15:28:39 +02:00
/* Colors */
2023-03-10 13:25:31 +02:00
/ * Note : Remember to search for the DIM hex
and replace it inside the SVG icons if you decide to change it * /
2023-03-08 18:44:10 +02:00
--color-bg : var ( --color-brand-mastodon-bg ) ;
--color-bg-75 : # 1e2028bf ;
2023-03-09 14:39:37 +02:00
--color-fg : # fff ;
2023-03-10 17:18:44 +02:00
--color-border : # 38384d ;
2023-03-08 18:44:10 +02:00
--color-dim : var ( --color-brand-mastodon-dim ) ;
--color-accent : var ( --color-brand-mastodon-links ) ;
2023-03-08 21:17:08 +02:00
--color-accent-dark : var ( --color-brand-mastodon ) ;
2023-07-05 19:14:35 +03:00
--color-accent-dark-50 : # 595aff80 ;
2023-03-08 18:34:27 +02:00
--color-green : # 00ba7c ;
--color-red : # f91880 ;
2023-03-12 17:55:37 +02:00
--color-red-75 : # f91880bf ;
2023-04-05 18:54:13 +03:00
--color-yellow : # ffac33 ;
2023-03-11 19:11:20 +02:00
--color-light-shade : # ffffff05 ;
2023-03-11 22:43:54 +02:00
--color-focusable-toot : # ffffff09 ;
2023-03-08 18:34:27 +02:00
--color-light-text : # f7f9f9 ;
2023-03-08 18:44:10 +02:00
--color-mud : var ( --color-brand-mastodon-mud ) ;
2023-10-29 21:09:09 +02:00
--color-arsenic : # 393f4f ;
2023-04-19 21:53:57 +03:00
--color-black-coral : # 5a5371 ;
--color-profile-button-hover : # f1eff41a ;
--color-column-link-hover : # f7f7f91a ;
2023-03-08 18:34:27 +02:00
--color-modal-overlay : # 5b708366 ;
2023-03-08 19:49:03 +02:00
--color-dark : var ( --color-brand-mastodon-dark ) ;
2023-03-08 22:05:27 +02:00
--color-thread-line : var ( --color-brand-mastodon-threaded-line ) ;
2023-10-29 21:09:09 +02:00
--color-topaz : # dadaf3 ;
2023-03-12 17:35:43 +02:00
--color-light-purple : # 9baec8 ;
2023-04-22 13:41:28 +03:00
--color-lighter-purple : # a5b8d3 ;
2023-03-18 14:15:07 +02:00
--color-dark-electric-blue : # 576078 ;
2023-03-25 18:02:16 +02:00
--color-button-text : # f7f9f9 ;
2023-03-25 19:41:29 +02:00
--color-ghost-button-text : var ( --color-button-text ) ;
2023-03-26 13:34:18 +03:00
--color-verified : # 79bd9a ;
2023-03-28 09:49:46 +03:00
--color-destructive : # df405a ;
2023-07-05 17:51:51 +03:00
--color-light-fuchsia-pink : # ff8cfd ;
--color-hashtag : var ( --color-accent ) ;
--color-mention : var ( --color-accent ) ;
2023-07-05 18:14:12 +03:00
--color-link : var ( --color-accent ) ;
2023-07-30 02:43:55 +03:00
--color-bg-compose-form : rgb ( 39 44 64 / . 4 ) ;
--color-bg-compose-form-focus : rgb ( 39 44 64 / . 8 ) ;
2023-04-26 08:41:50 +03:00
/* In the original UI this color is lighten($ui-base-color, 12%) */
2023-04-26 08:34:47 +03:00
--color-outer-space : # 42485a ;
2023-03-08 15:28:39 +02:00
/* Font related */
--font-size : 15px ;
--font-size-smaller : 13px ;
2023-07-05 19:14:35 +03:00
--font-size-12 : 12px ;
2023-03-18 14:15:07 +02:00
--font-size-mid : 14px ;
2023-03-08 15:28:39 +02:00
--font-size-bigger : 17px ;
2023-07-26 01:13:00 +03:00
--font-size-title : 19px ;
2023-03-08 15:28:39 +02:00
--font-size-heading : 20px ;
2023-07-26 01:13:00 +03:00
--font-weight-regular : 400 ;
--font-weight-semibold : 500 ;
2023-03-08 15:28:39 +02:00
--font-weight-bold : 700 ;
2023-07-05 17:43:53 +03:00
--line-height : 22px ;
2023-07-05 19:14:35 +03:00
--line-height-mid : 20px ;
2023-03-08 15:28:39 +02:00
/* Grids and gaps */
--gap-default : 12px ;
2023-09-25 17:35:38 +02:00
--gap-column-link : 12px ;
2023-03-08 15:28:39 +02:00
/* Element sizes */
--size-avatar : 48px ;
--size-avatar-small : 32px ;
--width-main-panel : 600px ;
2023-04-01 11:59:23 -04:00
--width-side-panel : 260px ;
2023-07-05 00:47:39 +03:00
--width-column : 380px ;
2023-07-05 01:36:21 +03:00
--border-radius : 16px ;
2023-07-05 02:19:28 +03:00
--border-radius-badges : 4px ;
2023-07-05 02:31:06 +03:00
--badges-distance-from-edge : 12px ;
2023-03-25 18:02:16 +02:00
/* Misc */
--active-header-box-shadow : 0 1px 0 rgba ( 140 , 141 , 255 , . 3 ) ;
--active-header-radial-gradient : radial-gradient ( ellipse , rgba ( 99 , 100 , 255 , . 23 ) 0 , rgba ( 99 , 100 , 255 , 0 ) 60 % ) ;
2023-04-04 09:59:47 +03:00
--compose-form-linear-gradient : linear-gradient ( 180deg , rgba ( 30 , 32 , 40 , 1 ) 0 % , rgba ( 30 , 32 , 40 , 1 ) 53 % , rgba ( 30 , 32 , 40 , 0 . 8141631652661064 ) 76 % , rgba ( 30 , 32 , 40 , 0 . 7077205882352942 ) 87 % , rgba ( 30 , 32 , 40 , 0 . 458420868347339 ) 97 % , rgba ( 30 , 32 , 40 , 0 ) 100 % ) ;
2023-03-25 18:02:16 +02:00
2023-07-05 18:21:06 +03:00
/* Logo */
--logo : url ( 'data:image/svg+xml, %3Csvg class="mastodon-logo" xmlns="http://www.w3.org/2000/svg" width="28px" height="28px" viewBox="0 0 216.4144 232.00976"%3E%3Cdefs xmlns="http://www.w3.org/2000/svg"%3E%3ClinearGradient xmlns="http://www.w3.org/2000/svg" id="gradient" x2="0%25" y2="100%25" gradientUnits="userSpaceOnUse"%3E%3Cstop offset="0%25" stop-color="%23595aff"%3E%3C/stop%3E%3Cstop offset="100%25" stop-color="%23595aff"%3E%3C/stop%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath xmlns="http://www.w3.org/2000/svg" d="M211.80734 139.0875c-3.18125 16.36625-28.4925 34.2775-57.5625 37.74875-15.15875 1.80875-30.08375 3.47125-45.99875 2.74125-26.0275-1.1925-46.565-6.2125-46.565-6.2125 0 2.53375.15625 4.94625.46875 7.2025 3.38375 25.68625 25.47 27.225 46.39125 27.9425 21.11625.7225 39.91875-5.20625 39.91875-5.20625l.8675 19.09s-14.77 7.93125-41.08125 9.39c-14.50875.7975-32.52375-.365-53.50625-5.91875C9.23234 213.82 1.40609 165.31125.20859 116.09125c-.365-14.61375-.14-28.39375-.14-39.91875 0-50.33 32.97625-65.0825 32.97625-65.0825C49.67234 3.45375 78.20359.2425 107.86484 0h.72875c29.66125.2425 58.21125 3.45375 74.8375 11.09 0 0 32.975 14.7525 32.975 65.0825 0 0 .41375 37.13375-4.59875 62.915" fill="url(%23gradient)"%3E%3C/path%3E%3Cpath d="M177.50984 80.077v60.94125h-24.14375v-59.15c0-12.46875-5.24625-18.7975-15.74-18.7975-11.6025 0-17.4175 7.5075-17.4175 22.3525v32.37625H96.20734V85.42325c0-14.845-5.81625-22.3525-17.41875-22.3525-10.49375 0-15.74 6.32875-15.74 18.7975v59.15H38.90484V80.077c0-12.455 3.17125-22.3525 9.54125-29.675 6.56875-7.3225 15.17125-11.07625 25.85-11.07625 12.355 0 21.71125 4.74875 27.8975 14.2475l6.01375 10.08125 6.015-10.08125c6.185-9.49875 15.54125-14.2475 27.8975-14.2475 10.6775 0 19.28 3.75375 25.85 11.07625 6.36875 7.3225 9.54 17.22 9.54 29.675" fill="%23fff"%3E%3C/path%3E%3C/svg%3E' ) ;
2023-03-25 18:02:16 +02:00
/* Icons */
2023-10-29 21:09:09 +02:00
--icon-follow-hashtag : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18px" height="auto" viewBox="0 0 462 439"%3E%3Cpath fill="%23717c9b" d="M139 11.7c-3.5 2.5-6.2 5.4-7.7 8.3-2.5 4.8-2.5 5.2-7.8 52.5-1.4 12.6-3.5 31.4-4.7 41.7l-2.1 18.7-48.6.3-48.6.3-5 3.1C7.2 141.1 3 148.4 3 156.7c0 4.4.6 7.6 2 10.2 2.7 5.4 10.1 11.6 15.5 13 2.9.7 19.2 1.1 47.8 1.1 40.9 0 43.5.1 43.1 1.7-.4 1.9-8.4 73.2-8.4 75.2 0 .8-11.4 1.1-41 1.1H20.9l-4.8 2.5C7.5 265.8 3 273 3 282.5s4.5 16.7 13.1 21l4.8 2.5H97.6l-5.3 46.7c-2.9 25.8-5.4 50.3-5.5 54.5-.1 7 .2 8.2 2.8 12.5 1.7 2.7 5.1 6.2 7.8 8 4.5 3.1 5.4 3.3 13 3.3 8.9 0 10.2-.5 16.8-6.8 4.8-4.6 6.3-9.3 8.2-26.7.9-7.7 2.7-23.9 4-36 1.4-12.1 3.3-29.5 4.3-38.8l1.7-16.7H214.7l.5-8.3c.7-9.8 1.4-11.5 8.2-18.5 8.6-9 7-8.7 41.4-9l30.2-.3V259h-9.5c-9.4 0-9.5 0-9.1-2.3.3-1.2 1.5-10.8 2.6-21.2 1.2-10.5 3-26.5 4.1-35.7 1-9.2 1.9-17.2 1.9-17.8 0-.7 12.3-1 38.5-1 23.5 0 40.3-.4 43.4-1.1 6.1-1.3 13.5-7.4 16.2-13.4 5.2-11.4.2-24.9-11.5-30.9l-4.9-2.6H290.4l5.3-46.8c5.3-47.1 6.1-59 4.3-63.6-1.4-3.7-7.9-10.5-12.1-12.7C285.2 8.6 282 8 277.2 8c-6.2 0-7.5.4-11.8 3.2-9.2 6.2-10.1 8.6-12.9 31.8-3.4 28.9-7.2 63.4-8.7 77.7l-1.2 12.3h-77.8l.6-4.3c.3-2.3.8-7.1 1.1-10.7.6-6.1 2.5-23.4 7.6-68 1.2-10.8 1.9-21.1 1.6-23.1-1.1-5.5-6.2-12.6-11.4-15.9-4.2-2.7-5.6-3-12.3-3-7.2 0-8 .2-13 3.7zm97.5 174.5c-.4 2.9-1.5 12.9-2.5 22.3-1.1 9.3-2.7 24.5-3.7 33.7l-1.7 16.8H150.9l.6-6.3c.3-3.4 1.7-15.7 3-27.2 1.3-11.6 2.9-26.3 3.6-32.8l1.2-11.7H237l-.5 5.2z"/%3E%3Cpath fill="%23717c9b" d="M317.2 207c-1.8 1.1-4.1 3.4-5.2 5.2-1.9 3.1-2 5.1-2 38V285h-34.7c-33 0-35 .1-38.1 2-6.7 4.1-7.2 6-7.2 30s.5 25.9 7.2 30c3.1 1.9 5.1 2 38.1 2H310v34.7c0 33 .1 35 2 38.1 4.1 6.7 6 7.2 30 7.2s25.9-.5 30-7.2c1.9-3.1 2-5.1 2-38.1V349h34.8c32.9 0 34.9-.1 38-2 6.7-4.1 7.2-6 7.2-30s-.5-25.9-7.2-30c-3.1-1.9-5.1-2-38-2H374v-34.8c0-32.9-.1-34.9-2-38-4.1-6.7-6-7.2-30-7.2-19.7 0-21.8.2-24.8 2z"/%3E%3Cpath fill="%23717c9b" d="M217.2 359.7c-5 43.2-5.5 50-4.2 54.7 1.5 5.4 7.5 12.7 12.4 15 5.2 2.4 17.1 2.2 21.6-.5 8.9-5.3 12.3-11.7 13.4-25.4.9-10.2 3.5-33.2 4.2-36.6l.5-2.7-15.3-.4c-10.1-.2-16.1-.8-17.8-1.7-1.4-.7-5-3.8-8.1-6.8l-5.6-5.4-1.1 9.8z"/%3E%3C/svg%3E' ) ;
--icon-unfollow-hashtag : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18px" height="auto" viewBox="0 0 462 439"%3E%3Cpath fill="%2300ba7c" d="M139 11.7c-3.5 2.5-6.2 5.4-7.7 8.3-2.5 4.8-2.5 5.2-7.8 52.5-1.4 12.6-3.5 31.4-4.7 41.7l-2.1 18.7-48.6.3-48.6.3-5 3.1C7.2 141.1 3 148.4 3 156.7c0 4.4.6 7.6 2 10.2 2.7 5.4 10.1 11.6 15.5 13 2.9.7 19.2 1.1 47.8 1.1 40.9 0 43.5.1 43.1 1.7-.4 1.9-8.4 73.2-8.4 75.2 0 .8-11.4 1.1-41 1.1H20.9l-4.8 2.5C7.5 265.8 3 273 3 282.5s4.5 16.7 13.1 21l4.8 2.5H97.6l-5.3 46.7c-2.9 25.8-5.4 50.3-5.5 54.5-.1 7 .2 8.2 2.8 12.5 1.7 2.7 5.1 6.2 7.8 8 4.5 3.1 5.4 3.3 13 3.3 8.9 0 10.2-.5 16.8-6.8 4.8-4.6 6.3-9.3 8.2-26.7.9-7.7 2.7-23.9 4-36 1.4-12.1 3.3-29.5 4.3-38.8l1.7-16.7h38.8c21.3 0 38.8.4 38.8.9 0 1-2.3 21.5-5 45.1-5.9 52.1-6.4 57.6-5 62.4 1.5 5.4 7.5 12.7 12.4 15 5.2 2.4 17.1 2.2 21.6-.5 5-3 8.7-6.7 10.1-10.1 1.2-2.9 1.1-3.1-10.8-15.1-6.7-6.7-12.6-13.2-13.2-14.4-1.5-2.9-1.4-25.8 0-28.6.6-1.2 9.2-10.3 19-20.3 24-24.2 24-20.9.3-44.4-9.6-9.6-18.2-18.7-19-20.2-2-3.8-2-25.8 0-29.6 1.7-3.2 34.2-35.5 37.3-37.1 1.2-.6 4.2-1.1 6.6-1.1 5.2 0 4.6 1.5 6.8-17.3l1.1-9.7h38.4c23.4 0 40.2-.4 43.3-1.1 6.1-1.3 13.5-7.4 16.2-13.4 5.2-11.4.2-24.9-11.5-30.9l-4.9-2.6H290.4l5.3-46.8c5.3-47.1 6.1-59 4.3-63.6-1.4-3.7-7.9-10.5-12.1-12.7C285.2 8.6 282 8 277.2 8c-6.2 0-7.5.4-11.8 3.2-9.2 6.2-10.1 8.6-12.9 31.8-3.4 28.9-7.2 63.4-8.7 77.7l-1.2 12.3h-77.8l.6-4.3c.3-2.3.8-7.1 1.1-10.7.6-6.1 2.5-23.4 7.6-68 1.2-10.8 1.9-21.1 1.6-23.1-1.1-5.5-6.2-12.6-11.4-15.9-4.2-2.7-5.6-3-12.3-3-7.2 0-8 .2-13 3.7zm97.5 174.5c-.4 2.9-1.5 12.9-2.5 22.3-1.1 9.3-2.7 24.5-3.7 33.7l-1.7 16.8H150.9l.6-6.3c.3-3.4 1.7-15.7 3-27.2 1.3-11.6 2.9-26.3 3.6-32.8l1.2-11.7H237l-.5 5.2z"/%3E%3Cpath fill="%2300ba7c" d="M277.5 223.2c-3.1 1.7-28.5 27-30.1 30-1.7 3.2-1.9 12-.3 15.1.6 1.2 11.7 12.9 24.7 25.9l23.7 23.8-23.7 23.7c-13 13.1-24.1 24.8-24.7 26-1.6 3.1-1.4 11.9.3 15.1 1.7 3.2 27.2 28.5 30.3 30.1 2.8 1.4 11.8 1.4 14.6 0 1.2-.6 12.9-11.7 26-24.7l23.7-23.7 23.8 23.7c13 13 24.7 24.1 25.9 24.7 2.8 1.4 11.8 1.4 14.6 0 3.1-1.6 28.6-26.9 30.3-30.1 1.7-3.2 1.9-12 .3-15.1-.6-1.2-11.7-12.9-24.7-26L388.5 318l23.7-23.8c13-13 24.1-24.7 24.7-25.9 1.6-3.1 1.4-11.9-.3-15.1-1.7-3.2-27.2-28.5-30.3-30.1-2.8-1.4-11.8-1.4-14.6 0-1.2.6-12.9 11.7-25.9 24.7L342 271.5l-23.7-23.7c-13.1-13-24.8-24.1-26-24.7-2.8-1.4-12.2-1.4-14.8.1z"/%3E%3C/svg%3E' ) ;
2023-09-23 18:16:49 +03:00
--icon-boost : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 136 136'%3E%3Cpath fill='%23717c9b' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
--icon-boost-status : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 136 136'%3E%3Cpath fill='%23717c9b' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
--icon-boost-active : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 136 136'%3E%3Cpath fill='%2300ba7c' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
2023-10-29 21:09:09 +02:00
--icon-boost-status-prepend : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true"%3E%3Cg%3E%3Cpath fill="%2300ba7c" d="M4.75 3.79l4.603 4.3-1.706 1.82L6 8.38v7.37c0 .97.784 1.75 1.75 1.75H13V20H7.75c-2.347 0-4.25-1.9-4.25-4.25V8.38L1.853 9.91.147 8.09l4.603-4.3zm11.5 2.71H11V4h5.25c2.347 0 4.25 1.9 4.25 4.25v7.37l1.647-1.53 1.706 1.82-4.603 4.3-4.603-4.3 1.706-1.82L18 15.62V8.25c0-.97-.784-1.75-1.75-1.75z"%3E%3C/path%3E%3C/g%3E%3C/svg%3E' ) ;
2023-09-24 11:21:55 +03:00
--icon-boost-notification-filter-bar : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 136 136'%3E%3Cpath fill='%23717c9b' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
--icon-boost-notification-filter-bar-active : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 136 136'%3E%3Cpath fill='%23f7f9f9' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
2023-09-23 18:39:30 +03:00
--icon-boost-notification-wrapper : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 136 136'%3E%3Cpath fill='%2300ba7c' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
2023-03-25 18:02:16 +02:00
--icon-reply-nofitication-filter-bar-active : url ( 'data:image/svg+xml, %3Csvg viewBox="0 0 24 24" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath fill="%23f7f9f9" d="M1.751 10c0-4.42 3.584-8 8.005-8h4.366a8.13 8.13 0 0 1 8.129 8.13c0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067A8.005 8.005 0 0 1 1.751 10zm8.005-6a6.005 6.005 0 1 0 .133 12.01l.351-.01h1.761v2.3l5.087-2.81A6.127 6.127 0 0 0 14.122 4H9.756z"/%3E%3Cellipse fill="%23f7f9f9" fill-rule="evenodd" stroke-width="1.28569" cx="11.835" cy="10.2" rx="9.117" ry="8.123"/%3E%3C/svg%3E%0A' ) ;
--icon-reply : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23717c9b' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-reply-detailed-status-action-bar : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23717c9b' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-reply-detailed-status-action-bar-hover : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23595aff' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-reply-conversation : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23595aff' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-bookmark-detailed-status-action-bar : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='%23717c9b' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-04-28 19:31:58 +03:00
--icon-bookmark-detailed-status-action-bar-hover : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='%23F91880' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-03-25 18:02:16 +02:00
--icon-bookmark-detailed-status-action-bar-active : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23F91880' viewBox='0 0 24 24' width='20' height='20' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-bookmark-column-link : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23f7f9f9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bookmark"%3E%3Cpath d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-bookmark-column-link-active : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23f7f9f9" stroke="%23f7f9f9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bookmark"%3E%3Cpath d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-reply-status-hover : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23595aff' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-list : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"%3E%3Ctitle%3EList%3C/title%3E%3Cpath fill="none" stroke="%23f7f9f9" stroke-linecap="round" stroke-linejoin="round" stroke-width="48" d="M160 144h288M160 256h288M160 368h288"/%3E%3Ccircle cx="80" cy="144" r="16" fill="none" stroke="%23f7f9f9" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/%3E%3Ccircle cx="80" cy="256" r="16" fill="none" stroke="%23f7f9f9" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/%3E%3Ccircle cx="80" cy="368" r="16" fill="none" stroke="%23f7f9f9" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/%3E%3C/svg%3E' ) ;
2023-04-05 18:54:13 +03:00
--icon-heart : url ( "data:image/svg+xml, %0A%3Csvg viewBox='0 0 24 24' color='inherit' width='20' height='20' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='%23717c9b' d='M16.5 3C19.538 3 22 5.5 22 9c0 7-7.5 11-10 12.5C9.5 20 2 16 2 9c0-3.5 2.5-6 5.5-6C9.36 3 11 4 12 5c1-1 2.64-2 4.5-2zm-3.566 15.604a26.953 26.953 0 0 0 2.42-1.701C18.335 14.533 20 11.943 20 9c0-2.36-1.537-4-3.5-4c-1.076 0-2.24.57-3.086 1.414L12 7.828l-1.414-1.414C9.74 5.57 8.576 5 7.5 5C5.56 5 4 6.656 4 9c0 2.944 1.666 5.533 4.645 7.903c.745.592 1.54 1.145 2.421 1.7c.299.189.595.37.934.572c.339-.202.635-.383.934-.571z'/%3E%3C/svg%3E" ) ;
--icon-heart-hover : url ( "data:image/svg+xml, %0A%3Csvg viewBox='0 0 24 24' color='inherit' width='20' height='20' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='%23F91880' d='M16.5 3C19.538 3 22 5.5 22 9c0 7-7.5 11-10 12.5C9.5 20 2 16 2 9c0-3.5 2.5-6 5.5-6C9.36 3 11 4 12 5c1-1 2.64-2 4.5-2zm-3.566 15.604a26.953 26.953 0 0 0 2.42-1.701C18.335 14.533 20 11.943 20 9c0-2.36-1.537-4-3.5-4c-1.076 0-2.24.57-3.086 1.414L12 7.828l-1.414-1.414C9.74 5.57 8.576 5 7.5 5C5.56 5 4 6.656 4 9c0 2.944 1.666 5.533 4.645 7.903c.745.592 1.54 1.145 2.421 1.7c.299.189.595.37.934.572c.339-.202.635-.383.934-.571z'/%3E%3C/svg%3E" ) ;
--icon-heart-active : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' aria-hidden='true' fill='%23f7f9f9'%3E%3Cg%3E%3Cpath d='M20.884 13.19c-1.351 2.48-4.001 5.12-8.379 7.67l-.503.3-.504-.3c-4.379-2.55-7.029-5.19-8.382-7.67-1.36-2.5-1.41-4.86-.514-6.67.887-1.79 2.647-2.91 4.601-3.01 1.651-.09 3.368.56 4.798 2.01 1.429-1.45 3.146-2.1 4.796-2.01 1.954.1 3.714 1.22 4.601 3.01.896 1.81.846 4.17-.514 6.67z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-04-08 11:29:22 +03:00
--icon-heart-active-red : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' aria-hidden='true' fill='%23F91880'%3E%3Cg%3E%3Cpath d='M20.884 13.19c-1.351 2.48-4.001 5.12-8.379 7.67l-.503.3-.504-.3c-4.379-2.55-7.029-5.19-8.382-7.67-1.36-2.5-1.41-4.86-.514-6.67.887-1.79 2.647-2.91 4.601-3.01 1.651-.09 3.368.56 4.798 2.01 1.429-1.45 3.146-2.1 4.796-2.01 1.954.1 3.714 1.22 4.601 3.01.896 1.81.846 4.17-.514 6.67z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-04-05 18:54:13 +03:00
--icon-heart-notification : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' aria-hidden='true' fill='%23F91880'%3E%3Cg%3E%3Cpath d='M20.884 13.19c-1.351 2.48-4.001 5.12-8.379 7.67l-.503.3-.504-.3c-4.379-2.55-7.029-5.19-8.382-7.67-1.36-2.5-1.41-4.86-.514-6.67.887-1.79 2.647-2.91 4.601-3.01 1.651-.09 3.368.56 4.798 2.01 1.429-1.45 3.146-2.1 4.796-2.01 1.954.1 3.714 1.22 4.601 3.01.896 1.81.846 4.17-.514 6.67z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-04-05 19:28:39 +03:00
--icon-star-column-link : url ( 'data:image/svg+xml, %3Csvg width="24" height="24" stroke-width="2" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="%23f7f9f9"%3E%3Cpath d="M8.587 8.236l2.598-5.232a.911.911 0 011.63 0l2.598 5.232 5.808.844a.902.902 0 01.503 1.542l-4.202 4.07.992 5.75c.127.738-.653 1.3-1.32.952L12 18.678l-5.195 2.716c-.666.349-1.446-.214-1.319-.953l.992-5.75-4.202-4.07a.902.902 0 01.503-1.54l5.808-.845z" stroke="%23f7f9f9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-star-column-link-active : url ( 'data:image/svg+xml, %3Csvg width="24" height="24" stroke-width="2" viewBox="0 0 24 24" fill="%23f7f9f9" xmlns="http://www.w3.org/2000/svg" color="%23f7f9f9"%3E%3Cpath d="M8.587 8.236l2.598-5.232a.911.911 0 011.63 0l2.598 5.232 5.808.844a.902.902 0 01.503 1.542l-4.202 4.07.992 5.75c.127.738-.653 1.3-1.32.952L12 18.678l-5.195 2.716c-.666.349-1.446-.214-1.319-.953l.992-5.75-4.202-4.07a.902.902 0 01.503-1.54l5.808-.845z" stroke="%23f7f9f9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
2023-04-05 19:39:30 +03:00
--icon-star-notification : url ( 'data:image/svg+xml, %3Csvg width="24" height="24" stroke-width="0" viewBox="0 0 24 24" fill="%23ffac33" xmlns="http://www.w3.org/2000/svg" color="%23f7f9f9"%3E%3Cpath d="M8.587 8.236l2.598-5.232a.911.911 0 011.63 0l2.598 5.232 5.808.844a.902.902 0 01.503 1.542l-4.202 4.07.992 5.75c.127.738-.653 1.3-1.32.952L12 18.678l-5.195 2.716c-.666.349-1.446-.214-1.319-.953l.992-5.75-4.202-4.07a.902.902 0 01.503-1.54l5.808-.845z" stroke="%23ffac33" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
2023-04-05 18:54:13 +03:00
--icon-heart-column-link : url ( "data:image/svg+xml, %0A%3Csvg viewBox='0 0 24 24' color='inherit' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='%23f7f9f9' d='M16.5 3C19.538 3 22 5.5 22 9c0 7-7.5 11-10 12.5C9.5 20 2 16 2 9c0-3.5 2.5-6 5.5-6C9.36 3 11 4 12 5c1-1 2.64-2 4.5-2zm-3.566 15.604a26.953 26.953 0 0 0 2.42-1.701C18.335 14.533 20 11.943 20 9c0-2.36-1.537-4-3.5-4c-1.076 0-2.24.57-3.086 1.414L12 7.828l-1.414-1.414C9.74 5.57 8.576 5 7.5 5C5.56 5 4 6.656 4 9c0 2.944 1.666 5.533 4.645 7.903c.745.592 1.54 1.145 2.421 1.7c.299.189.595.37.934.572c.339-.202.635-.383.934-.571z'/%3E%3C/svg%3E" ) ;
--icon-heart-column-link-active : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' aria-hidden='true' fill='%23f7f9f9'%3E%3Cg%3E%3Cpath d='M20.884 13.19c-1.351 2.48-4.001 5.12-8.379 7.67l-.503.3-.504-.3c-4.379-2.55-7.029-5.19-8.382-7.67-1.36-2.5-1.41-4.86-.514-6.67.887-1.79 2.647-2.91 4.601-3.01 1.651-.09 3.368.56 4.798 2.01 1.429-1.45 3.146-2.1 4.796-2.01 1.954.1 3.714 1.22 4.601 3.01.896 1.81.846 4.17-.514 6.67z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-03-25 18:02:16 +02:00
--icon-direct-messages : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%23f7f9f9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-mail"%3E%3Cpath d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"%3E%3C/path%3E%3Cpolyline points="22, 6 12, 13 2, 6"%3E%3C/polyline%3E%3C/svg%3E' ) ;
--icon-direct-messages-active : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="%23f7f9f9" stroke="%23232543" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-mail"%3E%3Cpath d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"%3E%3C/path%3E%3Cpolyline points="22, 6 12, 13 2, 6"%3E%3C/polyline%3E%3C/svg%3E' ) ;
--icon-users-column-link : url ( 'data:image/svg+xml, %3Csvg width="24px" height="24px" stroke-width="2" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="%23000000"%3E%3Cpath d="M1 20v-1a7 7 0 017-7v0a7 7 0 017 7v1" stroke="%23f7f9f9" stroke-width="2" stroke-linecap="round"%3E%3C/path%3E%3Cpath d="M13 14v0a5 5 0 015-5v0a5 5 0 015 5v.5" stroke="%23f7f9f9" stroke-width="1.5" stroke-linecap="round"%3E%3C/path%3E%3Cpath d="M8 12a4 4 0 100-8 4 4 0 000 8zM18 9a3 3 0 100-6 3 3 0 000 6z" stroke="%23f7f9f9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-users-column-link-active : url ( 'data:image/svg+xml, %3Csvg width="24px" height="24px" stroke-width="2.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="%23000000"%3E%3Cpath d="M1 20v-1a7 7 0 017-7v0a7 7 0 017 7v1" stroke="%23f7f9f9" stroke-width="2" stroke-linecap="round"%3E%3C/path%3E%3Cpath d="M13 14v0a5 5 0 015-5v0a5 5 0 015 5v.5" stroke="%23f7f9f9" stroke-width="2.5" stroke-linecap="round"%3E%3C/path%3E%3Cpath d="M8 12a4 4 0 100-8 4 4 0 000 8zM18 9a3 3 0 100-6 3 3 0 000 6z" stroke="%23f7f9f9" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-bookmark-status-hover : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23595aff' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-04-08 23:00:51 +03:00
--icon-bookmark-status-hover-red : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23F91880' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-03-25 18:02:16 +02:00
--icon-bookmark : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23717c9b" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bookmark"%3E%3Cpath d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-bookmark-active : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23F91880' viewBox='0 0 24 24' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-bell : url ( 'data:image/svg+xml, %3Csvg width="24px" height="24px" stroke-width="2" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="%23f7f9f9"%3E%3Cpath d="M18 8.4c0-1.697-.632-3.325-1.757-4.525C15.117 2.675 13.59 2 12 2c-1.591 0-3.117.674-4.243 1.875C6.632 5.075 6 6.703 6 8.4 6 15.867 3 18 3 18h18s-3-2.133-3-9.6zM13.73 21a1.999 1.999 0 01-3.46 0" stroke="%23f7f9f9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-bell-active : url ( 'data:image/svg+xml, %3Csvg width="24px" height="24px" stroke-width="2" viewBox="0 0 24 24" fill="%23f7f9f9" xmlns="http://www.w3.org/2000/svg" color="%23f7f9f9"%3E%3Cpath d="M18 8.4c0-1.697-.632-3.325-1.757-4.525C15.117 2.675 13.59 2 12 2c-1.591 0-3.117.674-4.243 1.875C6.632 5.075 6 6.703 6 8.4 6 15.867 3 18 3 18h18s-3-2.133-3-9.6zM13.73 21a1.999 1.999 0 01-3.46 0" stroke="%23f7f9f9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
2023-03-25 18:09:27 +02:00
--icon-bell-header-tabs : url ( 'data:image/svg+xml, %3Csvg width="18px" height="18px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="%23f7f9f9"%3E%3Cpath d="M18 8.4c0-1.697-.632-3.325-1.757-4.525C15.117 2.675 13.59 2 12 2c-1.591 0-3.117.674-4.243 1.875C6.632 5.075 6 6.703 6 8.4 6 15.867 3 18 3 18h18s-3-2.133-3-9.6zM13.73 21a1.999 1.999 0 01-3.46 0" stroke="%23f7f9f9" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-bell-header-tabs-active : url ( 'data:image/svg+xml, %3Csvg width="18px" height="18px" stroke-width="1.5" viewBox="0 0 24 24" fill="%23f7f9f9" xmlns="http://www.w3.org/2000/svg" color="%23f7f9f9"%3E%3Cpath d="M18 8.4c0-1.697-.632-3.325-1.757-4.525C15.117 2.675 13.59 2 12 2c-1.591 0-3.117.674-4.243 1.875C6.632 5.075 6 6.703 6 8.4 6 15.867 3 18 3 18h18s-3-2.133-3-9.6zM13.73 21a1.999 1.999 0 01-3.46 0" stroke="%23f7f9f9" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
2023-03-25 18:02:16 +02:00
--icon-home-notification : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"%3E%3Ctitle%3EHome%3C/title%3E%3Cpath d="M80 212v236a16 16 0 0016 16h96V328a24 24 0 0124-24h80a24 24 0 0124 24v136h96a16 16 0 0016-16V212" fill="none" stroke="%23717c9b" stroke-linecap="round" stroke-linejoin="round" stroke-width="38"/%3E%3Cpath d="M480 256L266.89 52c-5-5.28-16.69-5.34-21.78 0L32 256M400 179V64h-48v69" fill="none" stroke="%23717c9b" stroke-linecap="round" stroke-linejoin="round" stroke-width="38"/%3E%3C/svg%3E' ) ;
--icon-home-notification-active : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" class="ionicon" fill="%23f7f9f9" viewBox="0 0 512 512"%3E%3Ctitle%3EHome%3C/title%3E%3Cpath d="M261.56 101.28a8 8 0 00-11.06 0L66.4 277.15a8 8 0 00-2.47 5.79L63.9 448a32 32 0 0032 32H192a16 16 0 0016-16V328a8 8 0 018-8h80a8 8 0 018 8v136a16 16 0 0016 16h96.06a32 32 0 0032-32V282.94a8 8 0 00-2.47-5.79z"/%3E%3Cpath d="M490.91 244.15l-74.8-71.56V64a16 16 0 00-16-16h-48a16 16 0 00-16 16v32l-57.92-55.38C272.77 35.14 264.71 32 256 32c-8.68 0-16.72 3.14-22.14 8.63l-212.7 203.5c-6.22 6-7 15.87-1.34 22.37A16 16 0 0043 267.56L250.5 69.28a8 8 0 0111.06 0l207.52 198.28a16 16 0 0022.59-.44c6.14-6.36 5.63-16.86-.76-22.97z"/%3E%3C/svg%3E' ) ;
--icon-home : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" class="ionicon" width="24" height="24" viewBox="0 0 512 512"%3E%3Ctitle%3EHome%3C/title%3E%3Cpath d="M80 212v236a16 16 0 0016 16h96V328a24 24 0 0124-24h80a24 24 0 0124 24v136h96a16 16 0 0016-16V212" fill="none" stroke="%23f7f9f9" stroke-linecap="round" stroke-linejoin="round" stroke-width="38"/%3E%3Cpath d="M480 256L266.89 52c-5-5.28-16.69-5.34-21.78 0L32 256M400 179V64h-48v69" fill="none" stroke="%23f7f9f9" stroke-linecap="round" stroke-linejoin="round" stroke-width="38"/%3E%3C/svg%3E' ) ;
2023-10-29 21:38:50 +02:00
--icon-more : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23f7f9f9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-more-horizontal'%3E%3Ccircle cx='12' cy='12' r='1'%3E%3C/circle%3E%3Ccircle cx='19' cy='12' r='1'%3E%3C/circle%3E%3Ccircle cx='5' cy='12' r='1'%3E%3C/circle%3E%3C/svg%3E" ) ;
--icon-more-status-action-bar : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23717c9b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-more-horizontal'%3E%3Ccircle cx='12' cy='12' r='1'%3E%3C/circle%3E%3Ccircle cx='19' cy='12' r='1'%3E%3C/circle%3E%3Ccircle cx='5' cy='12' r='1'%3E%3C/circle%3E%3C/svg%3E" ) ;
2023-10-29 21:09:09 +02:00
--icon-close : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23f7f9f9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-x'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E" ) ;
--icon-close-action-bar : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23717c9b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-x'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E" ) ;
2023-11-03 14:33:20 +02:00
--icon-checked-green : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2317bf63' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-check'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E" ) ;
--icon-plus : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23717c9b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-plus'%3E%3Cline x1='12' y1='5' x2='12' y2='19'%3E%3C/line%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E" ) ;
--icon-plus-green : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2317bf63' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-plus'%3E%3Cline x1='12' y1='5' x2='12' y2='19'%3E%3C/line%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E" ) ;
--icon-plus-red : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23e0245e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-plus'%3E%3Cline x1='12' y1='5' x2='12' y2='19'%3E%3C/line%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E" ) ;
--icon-cross-green : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2317bf63' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-x'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E" ) ;
--icon-cross-red : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23e0245e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-x'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E" ) ;
2023-10-29 17:00:18 +02:00
--icon-cog : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' class='ionicon' width='26' height='26' viewBox='0 0 512 512' fill='%23f7f9f9'%3E%3Cpath d='M456.7 242.27l-26.08-4.2a8 8 0 01-6.6-6.82c-.5-3.2-1-6.41-1.7-9.51a8.08 8.08 0 013.9-8.62l23.09-12.82a8.05 8.05 0 003.9-9.92l-4-11a7.94 7.94 0 00-9.4-5l-25.89 5a8 8 0 01-8.59-4.11q-2.25-4.2-4.8-8.41a8.16 8.16 0 01.7-9.52l17.29-19.94a8 8 0 00.3-10.62l-7.49-9a7.88 7.88 0 00-10.5-1.51l-22.69 13.63a8 8 0 01-9.39-.9c-2.4-2.11-4.9-4.21-7.4-6.22a8 8 0 01-2.5-9.11l9.4-24.75A8 8 0 00365 78.77l-10.2-5.91a8 8 0 00-10.39 2.21l-16.64 20.84a7.15 7.15 0 01-8.5 2.5s-5.6-2.3-9.8-3.71A8 8 0 01304 87l.4-26.45a8.07 8.07 0 00-6.6-8.42l-11.59-2a8.07 8.07 0 00-9.1 5.61l-8.6 25.05a8 8 0 01-7.79 5.41h-9.8a8.07 8.07 0 01-7.79-5.41l-8.6-25.05a8.07 8.07 0 00-9.1-5.61l-11.59 2a8.07 8.07 0 00-6.6 8.42l.4 26.45a8 8 0 01-5.49 7.71c-2.3.9-7.3 2.81-9.7 3.71-2.8 1-6.1.2-8.8-2.91l-16.51-20.34A8 8 0 00156.75 73l-10.2 5.91a7.94 7.94 0 00-3.3 10.09l9.4 24.75a8.06 8.06 0 01-2.5 9.11c-2.5 2-5 4.11-7.4 6.22a8 8 0 01-9.39.9L111 116.14a8 8 0 00-10.5 1.51l-7.49 9a8 8 0 00.3 10.62l17.29 19.94a8 8 0 01.7 9.52q-2.55 4-4.8 8.41a8.11 8.11 0 01-8.59 4.11l-25.89-5a8 8 0 00-9.4 5l-4 11a8.05 8.05 0 003.9 9.92L85.58 213a7.94 7.94 0 013.9 8.62c-.6 3.2-1.2 6.31-1.7 9.51a8.08 8.08 0 01-6.6 6.82l-26.08 4.2a8.09 8.09 0 00-7.1 7.92v11.72a7.86 7.86 0 007.1 7.92l26.08 4.2a8 8 0 016.6 6.82c.5 3.2 1 6.41 1.7 9.51a8.08 8.08 0 01-3.9 8.62L62.49 311.7a8.05 8.05 0 00-3.9 9.92l4 11a7.94 7.94 0 009.4 5l25.89-5a8 8 0 018.59 4.11q2.25 4.2 4.8 8.41a8.16 8.16 0 01-.7 9.52l-17.29 19.96a8 8 0 00-.3 10.62l7.49 9a7.88 7.88 0 0010.5 1.51l22.69-13.63a8 8 0 019.39.9c2.4 2.11 4.9 4.21 7.4 6.22a8 8 0 012.5 9.11l-9.4 24.75a8 8 0 003.3 10.12l10.2 5.91a8 8 0 0010.39-2.21l16.79-20.64c2.1-2.6 5.5-3.7 8.2-2.6 3.4 1.4 5.7 2.2 9.9 3.61a8 8 0 015.49 7.71l-.4 26.45a8.07 8.07 0 006.6 8.42l11.59 2a8.07 8.07 0 009.1-5.61l8.6-25a8 8 0 017.79-5.41h9.8a8.07 8.07 0 017.79 5.41l8.6 25a8.07 8.07 0 009.1 5.61l11.59-2a8.07 8.07 0 006.6-8.42l-.4-26.45a8 8 0 015.49-7.71c4.2-1.41 7-2.51 9.6-3.51s5.8-1 8.3 2.1l17 20.94A8 8 0 00355 439l10.2-5.91a7.93 7.93 0 003.3-10.12l-9.4-24.75a8.08 8.08 0 012.5-9.12c2.5-2 5-4.1 7.4-6.21a8 8 0 019.39-.9L401 395.66a8 8 0 0010.5-1.51l7.49-9a8 8 0 00-.3-10.62l-17.29-19.94a8 8 0 01-.7-9.52q2.55-4.05 4.8-8.41a8.11 8.11 0 018.59-4.11l25.89 5a8 8 0 009.4-5l4-11a8.05 8.05 0 00-3.9-9.92l-23.09-12.82a7.94 7.94 0 01-3.9-8.62c.6-3.2 1.2-6.31 1.7-9.51a8.08 8.08 0 016.6-6.82l26.08-4.2a8.09 8.09 0 007.1-7.92V250a8.25 8.25 0 00-7.27-7.73zM256 112a143.82 143.82 0 01139.38 108.12A16 16 0 01379.85 240H274.61a16 16 0 01-13.91-8.09l-52.1-91.71a16 16 0 019.85-23.39A146.94 146.94 0 01256 112zM112 256a144 144 0 0143.65-103.41 16 16 0 0125.17 3.47L233.06 248a16 16 0 010 15.87l-52.67 91.7a16 16 0 01-25.18 3.36A143.94 143.94 0 01112 256zm144 144a146.9 146.9 0 01-38.19-4.95 16 16 0 01-9.76-23.44l52.58-91.55a16 16 0 0113.88-8H379.9a16 16 0 0115.52 19.88A143.84 143.84 0 01256 400z'/%3E%3C/svg%3E" ) ;
2024-03-24 11:44:49 +02:00
--icon-sliders-contrast : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23f7f9f9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-sliders'%3E%3Cline x1='4' y1='21' x2='4' y2='14'%3E%3C/line%3E%3Cline x1='4' y1='10' x2='4' y2='3'%3E%3C/line%3E%3Cline x1='12' y1='21' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='8' x2='12' y2='3'%3E%3C/line%3E%3Cline x1='20' y1='21' x2='20' y2='16'%3E%3C/line%3E%3Cline x1='20' y1='12' x2='20' y2='3'%3E%3C/line%3E%3Cline x1='1' y1='14' x2='7' y2='14'%3E%3C/line%3E%3Cline x1='9' y1='8' x2='15' y2='8'%3E%3C/line%3E%3Cline x1='17' y1='16' x2='23' y2='16'%3E%3C/line%3E%3C/svg%3E" ) ;
2024-03-23 15:14:40 +02:00
--icon-sliders : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23717c9b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-sliders'%3E%3Cline x1='4' y1='21' x2='4' y2='14'%3E%3C/line%3E%3Cline x1='4' y1='10' x2='4' y2='3'%3E%3C/line%3E%3Cline x1='12' y1='21' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='8' x2='12' y2='3'%3E%3C/line%3E%3Cline x1='20' y1='21' x2='20' y2='16'%3E%3C/line%3E%3Cline x1='20' y1='12' x2='20' y2='3'%3E%3C/line%3E%3Cline x1='1' y1='14' x2='7' y2='14'%3E%3C/line%3E%3Cline x1='9' y1='8' x2='15' y2='8'%3E%3C/line%3E%3Cline x1='17' y1='16' x2='23' y2='16'%3E%3C/line%3E%3C/svg%3E" ) ;
2023-09-24 02:37:12 +03:00
--icon-globe : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0.00 0.00 512.00 512.00'%3E%3Cpath fill='%23f7f9f9' d=' M 512.00 383.82 L 512.00 385.55 C 509.71 419.39 473.05 422.09 447.81 418.87 Q 423.66 415.79 400.31 408.70 Q 358.58 396.03 318.76 378.21 Q 218.90 333.52 129.46 270.53 C 92.32 244.38 56.82 216.22 27.43 182.58 C 14.63 167.94 1.88 149.41 0.00 128.96 L 0.00 125.94 C 3.19 91.33 40.56 90.05 66.57 93.40 Q 81.64 95.34 88.25 97.23 C 99.02 100.32 103.61 112.14 97.29 121.55 C 92.20 129.11 85.23 129.19 76.43 127.41 C 64.10 124.92 44.84 121.70 32.89 126.36 A 1.55 1.54 74.3 0 0 31.93 128.08 C 34.07 139.90 43.53 152.31 51.28 161.22 Q 68.49 181.02 88.94 198.55 Q 89.49 199.02 89.73 198.34 Q 110.62 140.43 161.78 107.51 C 234.44 60.76 331.69 75.26 388.09 139.91 C 446.04 206.35 446.71 303.97 388.97 370.93 Q 388.58 371.38 389.14 371.58 Q 413.92 380.31 439.48 385.26 C 451.88 387.65 467.05 389.92 479.11 385.65 A 1.51 1.50 -14.2 0 0 480.10 384.00 C 477.90 369.69 463.57 354.46 454.60 343.62 C 440.99 327.16 463.05 306.29 479.15 323.40 C 495.03 340.29 510.01 360.98 512.00 383.82 Z M 115.39 210.46 Q 136.86 228.57 159.38 244.15 C 223.66 288.63 294.05 327.49 367.32 354.98 A 1.46 1.44 30.8 0 0 368.93 354.58 Q 400.10 318.66 405.76 270.75 Q 407.08 259.64 406.38 249.56 C 401.05 172.60 342.31 113.52 265.72 106.81 Q 255.74 105.94 245.77 106.92 C 185.42 112.87 134.96 151.32 114.89 208.65 Q 114.52 209.72 115.39 210.46 Z M 295.33 328.94 A 0.34 0.34 0.0 0 0 295.16 329.58 L 299.51 331.72 A 0.34 0.34 0.0 0 0 300.00 331.41 L 300.00 329.51 A 0.34 0.34 0.0 0 0 299.68 329.17 L 295.33 328.94 Z'%0A/%3E%3Cpath fill='%23f7f9f9' d=' M 307.69 408.30 C 316.86 412.38 316.05 421.82 306.19 424.66 C 209.45 452.48 109.79 396.22 85.13 298.09 Q 83.95 293.40 84.37 291.18 C 85.73 284.03 93.55 284.22 98.50 287.80 Q 197.11 359.12 307.69 408.30 Z M 263.31 410.94 Q 262.74 410.51 262.12 410.23 Q 199.27 381.56 142.55 342.19 Q 129.49 333.13 117.25 323.09 A 0.18 0.18 0.0 0 0 116.97 323.31 C 142.74 377.01 195.57 410.10 255.44 411.80 Q 261.32 411.97 263.93 411.40 Q 264.37 411.30 264.00 411.06 Q 263.69 410.85 263.31 410.94 Z'%0A/%3E%3C/svg%3E" ) ;
2024-03-22 18:34:20 +02:00
--icon-globe-purple : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0.00 0.00 512.00 512.00'%3E%3Cpath fill='%238c8dff' d=' M 512.00 383.82 L 512.00 385.55 C 509.71 419.39 473.05 422.09 447.81 418.87 Q 423.66 415.79 400.31 408.70 Q 358.58 396.03 318.76 378.21 Q 218.90 333.52 129.46 270.53 C 92.32 244.38 56.82 216.22 27.43 182.58 C 14.63 167.94 1.88 149.41 0.00 128.96 L 0.00 125.94 C 3.19 91.33 40.56 90.05 66.57 93.40 Q 81.64 95.34 88.25 97.23 C 99.02 100.32 103.61 112.14 97.29 121.55 C 92.20 129.11 85.23 129.19 76.43 127.41 C 64.10 124.92 44.84 121.70 32.89 126.36 A 1.55 1.54 74.3 0 0 31.93 128.08 C 34.07 139.90 43.53 152.31 51.28 161.22 Q 68.49 181.02 88.94 198.55 Q 89.49 199.02 89.73 198.34 Q 110.62 140.43 161.78 107.51 C 234.44 60.76 331.69 75.26 388.09 139.91 C 446.04 206.35 446.71 303.97 388.97 370.93 Q 388.58 371.38 389.14 371.58 Q 413.92 380.31 439.48 385.26 C 451.88 387.65 467.05 389.92 479.11 385.65 A 1.51 1.50 -14.2 0 0 480.10 384.00 C 477.90 369.69 463.57 354.46 454.60 343.62 C 440.99 327.16 463.05 306.29 479.15 323.40 C 495.03 340.29 510.01 360.98 512.00 383.82 Z M 115.39 210.46 Q 136.86 228.57 159.38 244.15 C 223.66 288.63 294.05 327.49 367.32 354.98 A 1.46 1.44 30.8 0 0 368.93 354.58 Q 400.10 318.66 405.76 270.75 Q 407.08 259.64 406.38 249.56 C 401.05 172.60 342.31 113.52 265.72 106.81 Q 255.74 105.94 245.77 106.92 C 185.42 112.87 134.96 151.32 114.89 208.65 Q 114.52 209.72 115.39 210.46 Z M 295.33 328.94 A 0.34 0.34 0.0 0 0 295.16 329.58 L 299.51 331.72 A 0.34 0.34 0.0 0 0 300.00 331.41 L 300.00 329.51 A 0.34 0.34 0.0 0 0 299.68 329.17 L 295.33 328.94 Z'%0A/%3E%3Cpath fill='%238c8dff' d=' M 307.69 408.30 C 316.86 412.38 316.05 421.82 306.19 424.66 C 209.45 452.48 109.79 396.22 85.13 298.09 Q 83.95 293.40 84.37 291.18 C 85.73 284.03 93.55 284.22 98.50 287.80 Q 197.11 359.12 307.69 408.30 Z M 263.31 410.94 Q 262.74 410.51 262.12 410.23 Q 199.27 381.56 142.55 342.19 Q 129.49 333.13 117.25 323.09 A 0.18 0.18 0.0 0 0 116.97 323.31 C 142.74 377.01 195.57 410.10 255.44 411.80 Q 261.32 411.97 263.93 411.40 Q 264.37 411.30 264.00 411.06 Q 263.69 410.85 263.31 410.94 Z'%0A/%3E%3C/svg%3E" ) ;
2023-09-23 13:21:08 -04:00
--icon-globe-active : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" class="ionicon" fill="%23f7f9f9" viewBox="0 0 512 512"%3E%3Cpath d="M96.85 286.62a8 8 0 00-12.53 8.25C102.07 373.28 172.3 432 256 432a175.31 175.31 0 0052.41-8 8 8 0 00.79-15 1120 1120 0 01-109.48-55.61 1126.24 1126.24 0 01-102.87-66.77zM492.72 339.51c-4.19-5.58-9.11-11.44-14.7-17.53a15.83 15.83 0 00-26.56 5.13c0 .16-.11.31-.17.47a15.75 15.75 0 003.15 16.06c22.74 25 26.42 38.51 25.48 41.36-2 2.23-17.05 6.89-58.15-3.53q-8.83-2.24-19.32-5.46-6.76-2.08-13.79-4.49a176.76 176.76 0 0019.54-27.25c.17-.29.35-.58.52-.88A175.39 175.39 0 00432 256a178.87 178.87 0 00-1-19c-9.57-88.17-84.4-157-175-157a175.37 175.37 0 00-106.4 35.89 177.4 177.4 0 00-45.83 51.84c-.16.29-.34.58-.51.87a175.48 175.48 0 00-13.83 30.52q-5.59-4.87-10.79-9.67c-5.39-5-10.17-9.63-14.42-14-29.57-30.26-33.09-45.61-32.16-48.45 2-2.23 15.54-5.87 48.62 1.31A15.82 15.82 0 0096.22 123l.36-.44a15.74 15.74 0 00-8.67-25.43A237.38 237.38 0 0064.13 93c-30.72-3.53-50.83 2.52-59.78 18-3.24 5.58-6.35 15.09-2.72 28.6C7 159.66 26.14 184 53.23 209.5c8.63 8.13 18.06 16.37 28.12 24.64 7.32 6 15 12.06 22.9 18.08q7.91 6 16.15 12T137.1 276c25.41 17.61 52.26 34.52 78.59 49.69q14.34 8.26 28.64 16t28.37 14.81c21.9 11 43.35 20.92 63.86 29.43q13.19 5.48 25.81 10.16c11.89 4.42 23.37 8.31 34.31 11.59l1.1.33c25.73 7.66 47.42 11.69 64.48 12H464c21.64 0 36.3-6.38 43.58-19 9.09-15.62 4.08-36.32-14.86-61.5z"/%3E%3C/svg%3E' ) ;
2023-03-25 18:02:16 +02:00
--icon-home-column-link-active : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" class="ionicon" fill="%23f7f9f9" width="24" height="24" viewBox="0 0 512 512"%3E%3Ctitle%3EHome%3C/title%3E%3Cpath d="M261.56 101.28a8 8 0 00-11.06 0L66.4 277.15a8 8 0 00-2.47 5.79L63.9 448a32 32 0 0032 32H192a16 16 0 0016-16V328a8 8 0 018-8h80a8 8 0 018 8v136a16 16 0 0016 16h96.06a32 32 0 0032-32V282.94a8 8 0 00-2.47-5.79z"/%3E%3Cpath d="M490.91 244.15l-74.8-71.56V64a16 16 0 00-16-16h-48a16 16 0 00-16 16v32l-57.92-55.38C272.77 35.14 264.71 32 256 32c-8.68 0-16.72 3.14-22.14 8.63l-212.7 203.5c-6.22 6-7 15.87-1.34 22.37A16 16 0 0043 267.56L250.5 69.28a8 8 0 0111.06 0l207.52 198.28a16 16 0 0022.59-.44c6.14-6.36 5.63-16.86-.76-22.97z"/%3E%3C/svg%3E' ) ;
--icon-hashtag : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%23f7f9f9" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-hash"%3E%3Cline x1="4" y1="9" x2="20" y2="9"%3E%3C/line%3E%3Cline x1="4" y1="15" x2="20" y2="15"%3E%3C/line%3E%3Cline x1="10" y1="3" x2="8" y2="21"%3E%3C/line%3E%3Cline x1="16" y1="3" x2="14" y2="21"%3E%3C/line%3E%3C/svg%3E' ) ;
--icon-hashtag-active : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%23f7f9f9" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" class="feather feather-hash"%3E%3Cline x1="4" y1="9" x2="20" y2="9"%3E%3C/line%3E%3Cline x1="4" y1="15" x2="20" y2="15"%3E%3C/line%3E%3Cline x1="10" y1="3" x2="8" y2="21"%3E%3C/line%3E%3Cline x1="16" y1="3" x2="14" y2="21"%3E%3C/line%3E%3C/svg%3E' ) ;
2023-04-05 18:54:13 +03:00
--icon-star : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="none" stroke="%23717c9b" stroke-width="5.5" viewBox="0 0 68 68"%3E%3Cpath d="M31.4 3.8c-.7.4-2.5 5-4.1 10.2l-2.9 9.5-9.9.5c-5.5.3-10.6.9-11.3 1.3-.6.5-1.2 1.9-1.2 3.3 0 2 1.5 3.4 8 7.5 4.4 2.8 8 5.5 8 6s-1.3 4.5-3 9.1c-3.6 9.7-3.7 11.4-.9 12.8 2.7 1.5 3.5 1.1 12.4-5.6l7.5-5.6 8.2 6.1c8.4 6.3 11.2 7.1 13.2 3.9.8-1.4.3-3.9-2.2-11-1.8-5.1-3.2-9.6-3.2-9.9 0-.4 3.6-3 8-5.8 6.5-4.1 8-5.5 8-7.5 0-1.4-.6-2.8-1.2-3.3-.7-.4-5.8-1-11.3-1.3l-9.9-.5-2.9-9.5C37.8 4.6 36.9 3 34 3c-.8 0-2 .4-2.6.8z"/%3E%3C/svg%3E%0A' ) ;
2023-10-29 21:09:09 +02:00
--icon-star-active : url ( "data:image/svg+xml, %3Csvg fill='%23717c9b' xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 -960 960 960' class='icon icon-star' aria-hidden='true'%3E%3Cpath d='m212.086-50.607 70.652-305.306L45.52-561.305l312.871-26.696L480-876.176l121.609 288.175 312.871 26.696-237.218 205.392 71.217 305.306L480-213.173 212.086-50.607Z'%3E%3C/path%3E%3C/svg%3E" ) ;
--icon-star-detailed-status-action-bar : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23717c9b' width='18' height='18' viewBox='0 -960 960 960' class='icon icon-star' aria-hidden='true'%3E%3Cpath d='m330.955-216.328 149.066-89 149.066 90.023-40.305-168.391 131.217-114.347-172.956-14.87L480-671.869l-67.043 158.521-172.956 14.305 131.427 113.796-40.473 168.919ZM212.086-50.608l70.652-305.305L45.52-561.305l312.645-26.579L480-876.176l121.835 288.292 312.645 26.579-237.218 205.392 71.217 305.306L480-213.173 212.086-50.607ZM480-433.87Z'%3E%3C/path%3E%3C/svg%3E" ) ;
--icon-star-detailed-status-action-bar-hover : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffac33' width='18' height='18' viewBox='0 -960 960 960' class='icon icon-star' aria-hidden='true'%3E%3Cpath d='m330.955-216.328 149.066-89 149.066 90.023-40.305-168.391 131.217-114.347-172.956-14.87L480-671.869l-67.043 158.521-172.956 14.305 131.427 113.796-40.473 168.919ZM212.086-50.608l70.652-305.305L45.52-561.305l312.645-26.579L480-876.176l121.835 288.292 312.645 26.579-237.218 205.392 71.217 305.306L480-213.173 212.086-50.607ZM480-433.87Z'%3E%3C/path%3E%3C/svg%3E" ) ;
--icon-star-detailed-status-action-bar-active : url ( "data:image/svg+xml, %3Csvg fill='%23ffac33' xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 -960 960 960' class='icon icon-star' aria-hidden='true'%3E%3Cpath d='m212.086-50.607 70.652-305.306L45.52-561.305l312.871-26.696L480-876.176l121.609 288.175 312.871 26.696-237.218 205.392 71.217 305.306L480-213.173 212.086-50.607Z'%3E%3C/path%3E%3C/svg%3E" ) ;
--icon-active : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="%23717c9b" stroke="%23717c9b" stroke-width="5.5" viewBox="0 0 68 68"%3E%3Cpath d="M31.4 3.8c-.7.4-2.5 5-4.1 10.2l-2.9 9.5-9.9.5c-5.5.3-10.6.9-11.3 1.3-.6.5-1.2 1.9-1.2 3.3 0 2 1.5 3.4 8 7.5 4.4 2.8 8 5.5 8 6s-1.3 4.5-3 9.1c-3.6 9.7-3.7 11.4-.9 12.8 2.7 1.5 3.5 1.1 12.4-5.6l7.5-5.6 8.2 6.1c8.4 6.3 11.2 7.1 13.2 3.9.8-1.4.3-3.9-2.2-11-1.8-5.1-3.2-9.6-3.2-9.9 0-.4 3.6-3 8-5.8 6.5-4.1 8-5.5 8-7.5 0-1.4-.6-2.8-1.2-3.3-.7-.4-5.8-1-11.3-1.3l-9.9-.5-2.9-9.5C37.8 4.6 36.9 3 34 3c-.8 0-2 .4-2.6.8z"/%3E%3C/svg%3E%0A' ) ;
2023-04-05 18:54:13 +03:00
--icon-star-hover : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="none" stroke="%23ffac33" stroke-width="5.5" viewBox="0 0 68 68"%3E%3Cpath d="M31.4 3.8c-.7.4-2.5 5-4.1 10.2l-2.9 9.5-9.9.5c-5.5.3-10.6.9-11.3 1.3-.6.5-1.2 1.9-1.2 3.3 0 2 1.5 3.4 8 7.5 4.4 2.8 8 5.5 8 6s-1.3 4.5-3 9.1c-3.6 9.7-3.7 11.4-.9 12.8 2.7 1.5 3.5 1.1 12.4-5.6l7.5-5.6 8.2 6.1c8.4 6.3 11.2 7.1 13.2 3.9.8-1.4.3-3.9-2.2-11-1.8-5.1-3.2-9.6-3.2-9.9 0-.4 3.6-3 8-5.8 6.5-4.1 8-5.5 8-7.5 0-1.4-.6-2.8-1.2-3.3-.7-.4-5.8-1-11.3-1.3l-9.9-.5-2.9-9.5C37.8 4.6 36.9 3 34 3c-.8 0-2 .4-2.6.8z"/%3E%3C/svg%3E%0A' ) ;
2023-07-03 23:06:42 +03:00
--icon-search : url ( "data:image/svg+xml;charset=utf-8, %3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23535C76' aria-hidden='true' viewBox='0 0 24 24'%3E%3Cpath d='M10.25 3.75a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13zm-8.5 6.5a8.5 8.5 0 1 1 15.176 5.262l4.781 4.781-1.414 1.414-4.781-4.781A8.5 8.5 0 0 1 1.75 10.25z'/%3E%3C/svg%3E" ) ;
2023-09-23 22:52:43 +03:00
/* Profile icons */
--icon-github : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%23717c9b" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-github"%3E%3Cpath d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-youtube : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%23717c9b" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-youtube"%3E%3Cpath d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.46a2.78 2.78 0 0 0-1.94 2A29 29 0 0 0 1 11.75a29 29 0 0 0 .46 5.33A2.78 2.78 0 0 0 3.4 19c1.72.46 8.6.46 8.6.46s6.88 0 8.6-.46a2.78 2.78 0 0 0 1.94-2 29 29 0 0 0 .46-5.25 29 29 0 0 0-.46-5.33z"%3E%3C/path%3E%3Cpolygon points="9.75 15.02 15.5 11.75 9.75 8.48 9.75 15.02"%3E%3C/polygon%3E%3C/svg%3E' ) ;
--icon-link : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="%23717c9b" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-link-2"%3E%3Cpath d="M15 7h3a5 5 0 0 1 5 5 5 5 0 0 1-5 5h-3m-6 0H6a5 5 0 0 1-5-5 5 5 0 0 1 5-5h3"%3E%3C/path%3E%3Cline x1="8" y1="12" x2="16" y2="12"%3E%3C/line%3E%3C/svg%3E' ) ;
--icon-twitter : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 512 512"%3E%3Cpath fill="%23717c9b" d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"/%3E%3C/svg%3E' ) ;
--icon-twitch : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%23717c9b" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-twitch"%3E%3Cpath d="M21 2H3v16h5v4l4-4h5l4-4V2zm-10 9V7m5 4V7"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-patreon : url ( "data:image/svg+xml, %0A%3Csvg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%23717c9b'%3E%3Ctitle%3EPatreon icon%3C/title%3E%3Cpath d='M15.386.524c-4.764 0-8.64 3.876-8.64 8.64 0 4.75 3.876 8.613 8.64 8.613 4.75 0 8.614-3.864 8.614-8.613C24 4.4 20.136.524 15.386.524M.003 23.537h4.22V.524H.003'/%3E%3C/svg%3E" ) ;
2023-11-12 16:33:49 +02:00
--icon-threads : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='18' fill='%23717c9b' width='18' viewBox='0 0 448 512'%3E%3Cpath d='M331.5 235.7c2.2 .9 4.2 1.9 6.3 2.8c29.2 14.1 50.6 35.2 61.8 61.4c15.7 36.5 17.2 95.8-30.3 143.2c-36.2 36.2-80.3 52.5-142.6 53h-.3c-70.2-.5-124.1-24.1-160.4-70.2c-32.3-41-48.9-98.1-49.5-169.6V256v-.2C17 184.3 33.6 127.2 65.9 86.2C102.2 40.1 156.2 16.5 226.4 16h.3c70.3 .5 124.9 24 162.3 69.9c18.4 22.7 32 50 40.6 81.7l-40.4 10.8c-7.1-25.8-17.8-47.8-32.2-65.4c-29.2-35.8-73-54.2-130.5-54.6c-57 .5-100.1 18.8-128.2 54.4C72.1 146.1 58.5 194.3 58 256c.5 61.7 14.1 109.9 40.3 143.3c28 35.6 71.2 53.9 128.2 54.4c51.4-.4 85.4-12.6 113.7-40.9c32.3-32.2 31.7-71.8 21.4-95.9c-6.1-14.2-17.1-26-31.9-34.9c-3.7 26.9-11.8 48.3-24.7 64.8c-17.1 21.8-41.4 33.6-72.7 35.3c-23.6 1.3-46.3-4.4-63.9-16c-20.8-13.8-33-34.8-34.3-59.3c-2.5-48.3 35.7-83 95.2-86.4c21.1-1.2 40.9-.3 59.2 2.8c-2.4-14.8-7.3-26.6-14.6-35.2c-10-11.7-25.6-17.7-46.2-17.8H227c-16.6 0-39 4.6-53.3 26.3l-34.4-23.6c19.2-29.1 50.3-45.1 87.8-45.1h.8c62.6 .4 99.9 39.5 103.7 107.7l-.2 .2zm-156 68.8c1.3 25.1 28.4 36.8 54.6 35.3c25.6-1.4 54.6-11.4 59.5-73.2c-13.2-2.9-27.8-4.4-43.4-4.4c-4.8 0-9.6 .1-14.4 .4c-42.9 2.4-57.2 23.2-56.2 41.8l-.1 .1z'/%3E%3C/svg%3E" ) ;
2024-02-09 20:41:36 +02:00
--icon-bluesky : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8.467 8.467' width='18' height='18'%3E%3Cpath fill='%23717c9b' d='M67.256 111.972c-.545-.648-.629-.916-.411-1.323.15-.28.477-.52.727-.531.289-.013.204-.113-.236-.274-.862-.316-1.295-1.239-1.295-2.76 0-1.071.058-1.179.643-1.179.65 0 2.043 1.149 2.88 2.374l.446.655.446-.655c.837-1.225 2.23-2.373 2.88-2.373.584 0 .642.107.642 1.178 0 1.528-.435 2.45-1.295 2.74-.686.23-.686.233-.094.424.787.253.78 1.214-.017 1.961-.893.84-1.748.751-2.114-.218-.165-.437-.364-.794-.442-.794-.078 0-.3.357-.493.794-.47 1.06-1.365 1.053-2.267-.02z' transform='translate(-65.776 -105.112)'/%3E%3C/svg%3E" ) ;
2023-11-12 16:33:49 +02:00
--icon-nostr : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 860 847'%3E%3Cpath d='M454.5 1.1c-67.6 10.3-115.8 27.2-160.4 56.4-16.5 10.9-19.3 12-29.1 12-9.5 0-14.6-2-20.8-7.9-5.5-5.1-7.5-9.9-9.2-22-1.9-13.1-6.8-20.4-17.3-25.7l-5.8-3-92.2.3c-68.2.3-93.1.7-95.6 1.6-4.5 1.5-11.4 8.3-15.2 14.8L6 32.8l.2 391.8.3 391.9 2.7 5c1.4 2.8 4.6 6.9 7.1 9.2 8.7 8 .9 7.3 96 8 88.7.6 108.3 0 116.7-3.3 5.9-2.4 13.5-11.7 14.9-18.4 1.4-6.4 1.4-67.7.1-103.3-3-78.6-15.8-158-48.1-297.2-21.2-91.3-27.3-126.1-28.6-162.6-1.5-43.2 7-69.1 28.8-87.6 6.9-5.8 19.7-12.8 29.7-16.2 14.8-5 57.5-12 96.2-15.7 21-2.1 84.2-2.4 104.4-.6 25.3 2.3 54.4 8.4 76 15.9 36.2 12.5 62.9 33.9 75.5 60.4 5.2 10.8 7.6 20.5 9.6 38.2 1.9 16.7 3.6 24 7.4 32.2 7.1 15.3 26.3 28.9 50.7 36 20.1 5.9 42 8.1 86.4 9 33.3.7 41.1 1.5 47.9 5 7.7 3.9 15.4 11.6 18.7 18.7 2.8 6 2.9 6.9 2.9 20.8 0 13.3-.2 14.9-2.4 19.5-1.4 2.8-5.6 8.1-9.5 12-10.8 10.7-28 18.8-48.8 23-13.6 2.7-38.7 3.5-110.3 3.5-73.4 0-79.9.3-96.7 4.5-33.7 8.5-56.9 25.7-70.1 52.1-15.4 30.7-26.8 91.8-31.7 170.4-2.9 46.1-3 159.5-.1 166.5 1.9 4.7 11.1 13.4 15.3 14.5 8.4 2.3 51.4 3 196.8 3 155 0 184.6-.6 191.7-3.5 5.5-2.3 12.1-9.2 13.4-13.9.6-2.1 1.5-10.5 2-18.5 1.9-32.6.2-482.7-2-504.1-4.6-44.3-20-97.2-39.7-136.1-14.5-28.7-30.3-50.8-51.9-72.5-27-27.1-54.5-45.9-89.8-61.4-31.8-13.9-71.3-24.3-104.5-27.5-16.8-1.7-98.5-1.9-108.7-.4z' fill='%23717c9b'/%3E%3Cpath d='M448 211.5c-21.4 5.9-38.1 21.3-45.8 42.7-2.4 6.5-2.7 8.7-2.6 19.8 0 11.3.3 13.3 3 21 3.9 11 8.7 18.2 18.1 27 11.2 10.4 22.4 15.1 39.8 16.5 27.9 2.3 56.6-18.3 64.9-46.5 8.1-27.5-5.4-60.4-30.1-73.3-12.3-6.4-17.5-7.8-30.3-8.3-8.2-.3-13.1 0-17 1.1z' fill='%23717c9b'/%3E%3C/svg%3E" ) ;
2023-09-23 22:52:43 +03:00
--icon-paypal : url ( "data:image/svg+xml, %0A%3Csvg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%23717c9b'%3E%3Ctitle%3EPayPal icon%3C/title%3E%3Cpath d='M6.908 24H3.804c-.664 0-1.086-.529-.936-1.18l.149-.674h2.071c.666 0 1.336-.533 1.482-1.182l1.064-4.592c.15-.648.816-1.18 1.48-1.18h.883c3.789 0 6.734-.779 8.84-2.34s3.16-3.6 3.16-6.135c0-1.125-.195-2.055-.588-2.789 0-.016-.016-.031-.016-.046l.135.075c.75.465 1.32 1.064 1.711 1.814.404.75.598 1.68.598 2.791 0 2.535-1.049 4.574-3.164 6.135-2.1 1.545-5.055 2.324-8.834 2.324h-.9c-.66 0-1.334.525-1.484 1.186L8.39 22.812c-.149.645-.81 1.17-1.47 1.17L6.908 24zm-2.677-2.695H1.126c-.663 0-1.084-.529-.936-1.18L4.563 1.182C4.714.529 5.378 0 6.044 0h6.465c1.395 0 2.609.098 3.648.289 1.035.189 1.92.519 2.684.99.736.465 1.322 1.072 1.697 1.818.389.748.584 1.68.584 2.797 0 2.535-1.051 4.574-3.164 6.119-2.1 1.561-5.056 2.326-8.836 2.326h-.883c-.66 0-1.328.524-1.478 1.169L5.7 20.097c-.149.646-.817 1.172-1.485 1.172l.016.036zm7.446-17.369h-1.014c-.666 0-1.332.529-1.48 1.178l-.93 4.02c-.15.648.27 1.179.93 1.179h.766c1.664 0 2.97-.343 3.9-1.021.929-.686 1.395-1.654 1.395-2.912 0-.83-.301-1.445-.9-1.84-.6-.404-1.5-.605-2.686-.605l.019.001z'/%3E%3C/svg%3E" ) ;
--icon-kofi : url ( "data:image/svg+xml, %3Csvg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%23717c9b'%3E%3Ctitle%3EKo-fi icon%3C/title%3E%3Cpath d='M23.881 8.948c-.773-4.085-4.859-4.593-4.859-4.593H.723c-.604 0-.679.798-.679.798s-.082 7.324-.022 11.822c.164 2.424 2.586 2.672 2.586 2.672s8.267-.023 11.966-.049c2.438-.426 2.683-2.566 2.658-3.734 4.352.24 7.422-2.831 6.649-6.916zm-11.062 3.511c-1.246 1.453-4.011 3.976-4.011 3.976s-.121.119-.31.023c-.076-.057-.108-.09-.108-.09-.443-.441-3.368-3.049-4.034-3.954-.709-.965-1.041-2.7-.091-3.71.951-1.01 3.005-1.086 4.363.407 0 0 1.565-1.782 3.468-.963 1.904.82 1.832 3.011.723 4.311zm6.173.478c-.928.116-1.682.028-1.682.028V7.284h1.77s1.971.551 1.971 2.638c0 1.913-.985 2.667-2.059 3.015z'/%3E%3C/svg%3E" ) ;
2024-02-10 16:30:43 +02:00
--icon-bandcamp : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='%23717c9b' viewBox='0 0 512 512'%3E%3Cpath d='M105.6 191.2C98.1 204.8 33 325.2 33 325.6c0 .2 36.8.3 81.7.2l81.7-.3 37.5-69.4 37.6-69.4.3 70.2.2 70.2 10.3-.3 10.2-.3.3-6.8.3-6.7 3.2 4.2c2.2 2.9 5.6 5.5 10.1 7.8 6.8 3.5 7.1 3.5 19.5 3.5 12.3 0 12.8-.1 19.3-3.3 16.4-8 25.9-28.9 24.5-53.7-1.3-22.4-10.5-38.2-26.5-45.8-6.3-3-7.4-3.2-17.7-3.2-9.8 0-11.6.3-16.7 2.7-3.2 1.5-7.8 4.8-10.3 7.3l-4.5 4.7V185H109.1l-3.5 6.2zm226.1 51c5.3 2.4 8.7 6.5 12.7 14.8 2.9 6.1 3.1 7.2 3.1 18 0 12.9-1 17.1-5.7 24.9-4.7 7.6-11.5 11.4-20.6 11.4-15.3 0-24.4-9.6-27.4-28.6-2.1-13.4 1.5-28.2 8.5-35.5 7.6-7.9 19-9.9 29.4-5zM413.1 223.6c-21.1 5.7-34.1 26-34.1 53.1.1 22.8 9.6 39.9 26.8 48.1 6.5 3.1 8.6 3.6 17.4 4 15 .7 24.1-1.8 33.4-9.4 6.9-5.6 12.9-16.6 14.9-27.7l.7-3.7h-22l-.7 3.7c-1 5.5-3.9 10.6-8.1 14.2-4.8 4.3-7.7 5.3-14.9 5.3-16 .1-25.5-13.2-25.5-35.7 0-23.3 9.4-35.7 27-35.7 10.8 0 17.4 4.4 20.9 13.8l1.9 4.9 10.7.3 10.7.3-.7-4.7c-1.6-10.9-9.8-22.5-19.3-27.3-9.9-5-27.6-6.6-39.1-3.5z'/%3E%3C/svg%3E%0A" ) ;
--icon-facebook : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23717c9b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-facebook'%3E%3Cpath d='M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z'%3E%3C/path%3E%3C/svg%3E" ) ;
--icon-friendica : url ( "data:image/svg+xml, %3Csvg fill='%23717c9b' width='18' height='18' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1523.8 1536'%3E%3Cpath d='M0 276.4v983.2C0 1412 122.8 1536 274.4 1536h975.1c151.6 0 274.4-124 274.4-276.4V276.4C1523.8 124 1401.1 0 1249.4 0h-975C122.8 0 0 124 0 276.4zM1249.4 61.2c118.5 0 213.2 95.3 213.2 215.2v983.2c0 119.9-94.7 215.2-213.2 215.2H518.1V1106h487.5l-1.3-367.7-486.3 2.6V430.1h487.5V61.2h243.9z'/%3E%3C/svg%3E%0A" ) ;
--icon-genderless-pronouns : url ( "data:image/svg+xml, %3Csvg fill='%23717c9b' width='18' height='18' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.334 12v-.02a9.354 9.354 0 1 0-2.74 6.614 8.963 8.963 0 0 0 2.74-6.462l-.001-.139V12zM24 12v.036c0 1.67-.349 3.258-.977 4.695l.029-.075c-1.226 2.905-3.491 5.17-6.318 6.367l-.078.029C15.282 23.651 13.682 24 12 24s-3.283-.349-4.733-.978l.077.03c-2.905-1.226-5.17-3.491-6.367-6.318l-.029-.078C.349 15.282 0 13.682 0 12s.349-3.283.978-4.733l-.03.077C2.174 4.439 4.439 2.174 7.266.977l.078-.029C8.718.349 10.318 0 12 0s3.283.349 4.733.978l-.077-.03c2.905 1.226 5.17 3.491 6.367 6.318l.029.078c.599 1.362.948 2.95.948 4.62v.039-.002z'/%3E%3C/svg%3E%0A" ) ;
--icon-wordpress : url ( "data:image/svg+xml, %3Csvg width='18' height='18' fill='%23717c9b' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M61.7 169.4l101.5 278C92.2 413 43.3 340.2 43.3 256c0-30.9 6.6-60.1 18.4-86.6zm337.9 75.9c0-26.3-9.4-44.5-17.5-58.7-10.8-17.5-20.9-32.4-20.9-49.9 0-19.6 14.8-37.8 35.7-37.8 .9 0 1.8 .1 2.8 .2-37.9-34.7-88.3-55.9-143.7-55.9-74.3 0-139.7 38.1-177.8 95.9 5 .2 9.7 .3 13.7 .3 22.2 0 56.7-2.7 56.7-2.7 11.5-.7 12.8 16.2 1.4 17.5 0 0-11.5 1.3-24.3 2l77.5 230.4L249.8 247l-33.1-90.8c-11.5-.7-22.3-2-22.3-2-11.5-.7-10.1-18.2 1.3-17.5 0 0 35.1 2.7 56 2.7 22.2 0 56.7-2.7 56.7-2.7 11.5-.7 12.8 16.2 1.4 17.5 0 0-11.5 1.3-24.3 2l76.9 228.7 21.2-70.9c9-29.4 16-50.5 16-68.7zm-139.9 29.3l-63.8 185.5c19.1 5.6 39.2 8.7 60.1 8.7 24.8 0 48.5-4.3 70.6-12.1-.6-.9-1.1-1.9-1.5-2.9l-65.4-179.2zm183-120.7c.9 6.8 1.4 14 1.4 21.9 0 21.6-4 45.8-16.2 76.2l-65 187.9C426.2 403 468.7 334.5 468.7 256c0-37-9.4-71.8-26-102.1zM504 256c0 136.8-111.3 248-248 248C119.2 504 8 392.7 8 256 8 119.2 119.2 8 256 8c136.7 0 248 111.2 248 248zm-11.4 0c0-130.5-106.2-236.6-236.6-236.6C125.5 19.4 19.4 125.5 19.4 256S125.6 492.6 256 492.6c130.5 0 236.6-106.1 236.6-236.6z'/%3E%3C/svg%3E" ) ;
2023-09-23 22:52:43 +03:00
--icon-mastodon : url ( "data:image/svg+xml, %0A%3Csvg role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23717c9b'%3E%3Ctitle%3EMastodon icon%3C/title%3E%3Cpath d='M23.193 7.879c0-5.206-3.411-6.732-3.411-6.732C18.062.357 15.108.025 12.041 0h-.076c-3.068.025-6.02.357-7.74 1.147 0 0-3.411 1.526-3.411 6.732 0 1.192-.023 2.618.015 4.129.124 5.092.934 10.109 5.641 11.355 2.17.574 4.034.695 5.535.612 2.722-.15 4.25-.972 4.25-.972l-.09-1.975s-1.945.613-4.129.539c-2.165-.074-4.449-.233-4.799-2.891a5.499 5.499 0 0 1-.048-.745s2.125.52 4.817.643c1.646.075 3.19-.097 4.758-.283 3.007-.359 5.625-2.212 5.954-3.905.517-2.665.475-6.507.475-6.507zm-4.024 6.709h-2.497V8.469c0-1.29-.543-1.944-1.628-1.944-1.2 0-1.802.776-1.802 2.312v3.349h-2.483v-3.35c0-1.536-.602-2.312-1.802-2.312-1.085 0-1.628.655-1.628 1.944v6.119H4.832V8.284c0-1.289.328-2.313.987-3.07.68-.758 1.569-1.146 2.674-1.146 1.278 0 2.246.491 2.886 1.474L12 6.585l.622-1.043c.64-.983 1.608-1.474 2.886-1.474 1.104 0 1.994.388 2.674 1.146.658.757.986 1.781.986 3.07v6.304z'/%3E%3C/svg%3E" ) ;
--icon-verified : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" width="22" height="22" %3E%3Cpath fill="%236364ff" d="M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-verified-smaller : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" width="15" height="15" %3E%3Cpath fill="%236364ff" d="M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-label : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%23717c9b" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-tag"%3E%3Cpath d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"%3E%3C/path%3E%3Cline x1="7" y1="7" x2="7.01" y2="7"%3E%3C/line%3E%3C/svg%3E' ) ;
--icon-discord : url ( ' data : image / svg + xml , % 3Csvg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 32 32" width = "18" height = "18" % 3E % 3Cpath fill = "%23717c9b" d = " M 12 . 65625 4 . 90625 L 11 . 875 5 C 11 . 875 5 8 . 371094 5 . 382813 5 . 8125 7 . 4375 L 5 . 78125 7 . 4375 L 5 . 75 7 . 46875 C 5 . 175781 7 . 996094 4 . 925781 8 . 644531 4 . 53125 9 . 59375 C 4 . 136719 10 . 542969 3 . 714844 11 . 753906 3 . 34375 13 . 09375 C 2 . 601563 15 . 777344 2 19 . 027344 2 22 L 2 22 . 25 L 2 . 125 22 . 5 C 3 . 050781 24 . 125 4 . 695313 25 . 160156 6 . 21875 25 . 875 C 7 . 742188 26 . 589844 9 . 058594 26 . 96875 9 . 96875 27 L 10 . 5625 27 . 03125 L 10 . 875 26 . 5 L 11 . 96875 24 . 5625 C 13 . 128906 24 . 824219 14 . 464844 25 16 25 C 17 . 535156 25 18 . 871094 24 . 824219 20 . 03125 24 . 5625 L 21 . 125 26 . 5 L 21 . 4375 27 . 03125 L 22 . 03125 27 C 22 . 941406 26 . 96875 24 . 257813 26 . 589844 25 . 78125 25 . 875 C 27 . 304688 25 . 160156 28 . 949219 24 . 125 29 . 875 22 . 5 L 30 22 . 25 L 30 22 C 30 19 . 027344 29 . 398438 15 . 777344 28 . 65625 13 . 09375 C 28 . 285156 11 . 753906 27 . 863281 10 . 542969 27 . 46875 9 . 59375 C 27 . 074219 8 . 644531 26 . 824219 7 . 996094 26 . 25 7 . 46875 L 26 . 21875 7 . 4375 L 26 . 1875 7 . 4375 C 23 . 628906 5 . 382813 20 . 125 5 20 . 125 5 L 19 . 34375 4 . 90625 L 19 . 0625 5 . 625 C 19 . 0625 5 . 625 18 . 773438 6 . 355469 18 . 59375 7 . 1875 C 17 . 460938 7 . 035156 16 . 535156 7 16 7 C 15 . 464844 7 14 . 539063 7 . 035156 13 . 40625 7 . 1875 C 13 . 226563 6 . 355469 12 . 9375 5 . 625 12 . 9375 5 . 625 Z M 11 . 28125 7 . 1875 C 11 . 324219 7 . 328125 11 . 367188 7 . 449219 11 . 40625 7 . 5625 C 10 . 113281 7 . 882813 8 . 734375 8 . 371094 7 . 46875 9 . 15625 L 8 . 53125 10 . 84375 C 11 . 125 9 . 234375 14 . 851563 9 16 9 C 17 . 148438 9 20 . 875 9 . 234375 23 . 46875 10 . 84375 L 24 . 53125 9 . 15625 C 23 . 265625 8 . 371094 21 . 886719 7 . 882813 20 . 59375 7 . 5625 C 20 . 632813 7 . 449219 20 . 675781 7 . 328125 20 . 71875 7 . 1875 C 21 . 652344 7 . 375 23 . 433594 7 . 804688 24 . 90625 8 . 96875 C 24 . 898438 8 . 972656 25 . 28125 9 . 550781 25 . 625 10 . 375 C 25 . 976563 11 . 222656 26 . 367188 12 . 351563 26 . 71875 13 . 625 C 27 . 394531 16 . 066406 27 . 925781 19 . 039063 27 . 96875 21 . 65625 C 27 . 339844 22 . 617188 26 . 171875 23 . 484375 24 . 9375 24 . 0625 C 23 . 859375 24 . 566406 23 . 007813 24 . 75 22 . 5 24 . 84375 L 22 24 C 22 . 296875 23 . 890625 22 . 589844 23 . 769531 22 . 84375 23 . 65625 C 24 . 382813 22 . 980469 25 . 21875 22 . 25 25 . 21875 22 . 25 L 23 . 90625 20 . 75 C 23 . 90625 20 . 75 23 . 34375 21 . 265625 22 . 03125 21 . 84375 C 20 . 71875 22 . 421875 18 . 714844 23 16 23 C 13 . 285156 23 11 . 28125 22 . 421875 9 . 96875 21 . 84375 C 8 . 65625 21 . 265625 8 . 09375 20 . 75 8 . 09375 20 . 75 L 6 . 78125 22 . 25 C 6 . 78125 22 . 25 7 . 617188 22 . 980469 9 . 15625 23 . 65625 C 9 . 410156 23 . 769531 9 . 703125 23 . 890625 10 24 L 9 . 5 24 . 84375 C 8 . 992188 24 . 75 8 . 140625 24 . 566406 7 . 0625 24 . 0625 C 5 . 828125 23 . 484375 4 . 660156 22 . 617188 4 . 03125 21 . 65625 C 4 . 074219 19 . 039063 4 . 605469 16 . 066406 5 . 28125 13 . 625 C 5 . 632813 12 . 351563 6 . 023438 11 . 222656 6 . 375 10 . 375 C 6 . 71875 9 . 550781 7 . 101563 8 . 972656 7 . 09375 8 . 96875 C 8 . 566406 7 . 804688 10 . 347656 7 . 375 11 . 28125 7 . 1875 Z M 12 . 5 14 C 11 . 726563 14 11 . 042969 14 . 441406 10 . 625 15 C 10 . 207031 15 . 558594 10 16 . 246094 10 17 C 10 17 . 753906 10 . 207031 18 . 441406 10 . 625 19 C 11 . 042969 19 . 558594 11 . 726563 20 12 . 5 20 C 13 . 273438 20 13 . 957031 19 . 558594 14 . 375 19 C 14 . 792969 18 . 441406 15 17 . 753906 15 17 C 15 16 . 246094 14 . 792969 15 . 558594 14 . 375 15 C 13 . 957031 14 . 441406 13 . 273438 14 12 . 5 14 Z M 19 . 5 14 C 18 . 726563 14 18 . 042969 14 . 441406 17 . 625 15 C 17 . 207031 15 . 558594 17 16 . 246094 17 17 C 17 17 . 753906 17 . 207031 18 . 441406 17 . 625 19 C 18 . 042969 19 . 558594 18 . 726563 20 19 . 5 20 C 20 . 273438 20 20 . 957031 19 . 558594 21 . 375 19 C 21 . 792969 18 . 441406 22 17 . 753906 22 17 C 22 16 . 246094 21 . 792969 15 . 558594 21 . 375 15 C 20 . 957031 14 . 441406 20 . 273438 14 19 . 5 14 Z M 12 . 5 16 C 12 . 554688 16 12 . 625 16 . 019531 12 . 75 16 . 1875 C 12 . 875 16 . 355469 13 16 . 648438 13 17 C 13 17 . 351563 12 . 875 17 . 644531 12 . 75 17 . 8125 C 12 . 625 17 . 980469 12 . 554688 18 12 . 5 18 C 12 . 445313 18 12 . 375 17 . 980469 12 . 25 17 . 8125 C 12 . 125 17 . 644531 12 17 . 351563 12 17 C 12 16 . 648438 12 . 125 16 . 355469 12 . 25 16 . 1875 C 12 . 375 16 . 019531 12 . 445313 16 12 . 5 16 Z M 19 . 5 16 C 19 . 554688 16 19 . 625 16 . 019531 19 . 75 16 . 1875 C 19 . 875 16 . 355469 20 16 . 648438 20 17 C 20 17 . 351563 19 . 875 17 . 644531 19 . 75 17 . 8125 C 19 . 625 17 . 980469 19 . 554688 18 19 . 5 18 C 19 . 445313 18 19 . 375 17 . 980469 19 . 25 17 . 81
--icon-linkedin : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%23717c9b" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-linkedin"%3E%3Cpath d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"%3E%3C/path%3E%3Crect x="2" y="9" width="4" height="12"%3E%3C/rect%3E%3Ccircle cx="4" cy="4" r="2"%3E%3C/circle%3E%3C/svg%3E' ) ;
--icon-instagram : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%23717c9b" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-instagram"%3E%3Crect x="2" y="2" width="20" height="20" rx="5" ry="5"%3E%3C/rect%3E%3Cpath d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"%3E%3C/path%3E%3Cline x1="17.5" y1="6.5" x2="17.51" y2="6.5"%3E%3C/line%3E%3C/svg%3E' ) ;
2023-03-25 18:02:16 +02:00
}
2023-04-05 19:24:16 +03:00
/* High Contrast theme */
2023-07-03 22:21:53 +03:00
body . theme-contrast . layout-multiple-columns {
2023-04-04 19:15:46 +03:00
--color-dim : # b8b3c0 ;
2023-04-05 19:28:39 +03:00
/* Icons */
2023-09-23 18:16:49 +03:00
--icon-boost : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 136 136'%3E%3Cpath fill='%23b8b3c0' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
--icon-boost-status : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 136 136'%3E%3Cpath fill='%23b8b3c0' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
2023-09-24 11:21:55 +03:00
--icon-boost-notification-filter-bar : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 136 136'%3E%3Cpath fill='%23b8b3c0' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
--icon-boost-notification-filter-bar-active : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 136 136'%3E%3Cpath fill='%23f7f9f9' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
2023-10-29 21:09:09 +02:00
--icon-follow-hashtag : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18px" height="auto" viewBox="0 0 462 439"%3E%3Cpath fill="%23b8b3c0" d="M139 11.7c-3.5 2.5-6.2 5.4-7.7 8.3-2.5 4.8-2.5 5.2-7.8 52.5-1.4 12.6-3.5 31.4-4.7 41.7l-2.1 18.7-48.6.3-48.6.3-5 3.1C7.2 141.1 3 148.4 3 156.7c0 4.4.6 7.6 2 10.2 2.7 5.4 10.1 11.6 15.5 13 2.9.7 19.2 1.1 47.8 1.1 40.9 0 43.5.1 43.1 1.7-.4 1.9-8.4 73.2-8.4 75.2 0 .8-11.4 1.1-41 1.1H20.9l-4.8 2.5C7.5 265.8 3 273 3 282.5s4.5 16.7 13.1 21l4.8 2.5H97.6l-5.3 46.7c-2.9 25.8-5.4 50.3-5.5 54.5-.1 7 .2 8.2 2.8 12.5 1.7 2.7 5.1 6.2 7.8 8 4.5 3.1 5.4 3.3 13 3.3 8.9 0 10.2-.5 16.8-6.8 4.8-4.6 6.3-9.3 8.2-26.7.9-7.7 2.7-23.9 4-36 1.4-12.1 3.3-29.5 4.3-38.8l1.7-16.7H214.7l.5-8.3c.7-9.8 1.4-11.5 8.2-18.5 8.6-9 7-8.7 41.4-9l30.2-.3V259h-9.5c-9.4 0-9.5 0-9.1-2.3.3-1.2 1.5-10.8 2.6-21.2 1.2-10.5 3-26.5 4.1-35.7 1-9.2 1.9-17.2 1.9-17.8 0-.7 12.3-1 38.5-1 23.5 0 40.3-.4 43.4-1.1 6.1-1.3 13.5-7.4 16.2-13.4 5.2-11.4.2-24.9-11.5-30.9l-4.9-2.6H290.4l5.3-46.8c5.3-47.1 6.1-59 4.3-63.6-1.4-3.7-7.9-10.5-12.1-12.7C285.2 8.6 282 8 277.2 8c-6.2 0-7.5.4-11.8 3.2-9.2 6.2-10.1 8.6-12.9 31.8-3.4 28.9-7.2 63.4-8.7 77.7l-1.2 12.3h-77.8l.6-4.3c.3-2.3.8-7.1 1.1-10.7.6-6.1 2.5-23.4 7.6-68 1.2-10.8 1.9-21.1 1.6-23.1-1.1-5.5-6.2-12.6-11.4-15.9-4.2-2.7-5.6-3-12.3-3-7.2 0-8 .2-13 3.7zm97.5 174.5c-.4 2.9-1.5 12.9-2.5 22.3-1.1 9.3-2.7 24.5-3.7 33.7l-1.7 16.8H150.9l.6-6.3c.3-3.4 1.7-15.7 3-27.2 1.3-11.6 2.9-26.3 3.6-32.8l1.2-11.7H237l-.5 5.2z"/%3E%3Cpath fill="%23b8b3c0" d="M317.2 207c-1.8 1.1-4.1 3.4-5.2 5.2-1.9 3.1-2 5.1-2 38V285h-34.7c-33 0-35 .1-38.1 2-6.7 4.1-7.2 6-7.2 30s.5 25.9 7.2 30c3.1 1.9 5.1 2 38.1 2H310v34.7c0 33 .1 35 2 38.1 4.1 6.7 6 7.2 30 7.2s25.9-.5 30-7.2c1.9-3.1 2-5.1 2-38.1V349h34.8c32.9 0 34.9-.1 38-2 6.7-4.1 7.2-6 7.2-30s-.5-25.9-7.2-30c-3.1-1.9-5.1-2-38-2H374v-34.8c0-32.9-.1-34.9-2-38-4.1-6.7-6-7.2-30-7.2-19.7 0-21.8.2-24.8 2z"/%3E%3Cpath fill="%23b8b3c0" d="M217.2 359.7c-5 43.2-5.5 50-4.2 54.7 1.5 5.4 7.5 12.7 12.4 15 5.2 2.4 17.1 2.2 21.6-.5 8.9-5.3 12.3-11.7 13.4-25.4.9-10.2 3.5-33.2 4.2-36.6l.5-2.7-15.3-.4c-10.1-.2-16.1-.8-17.8-1.7-1.4-.7-5-3.8-8.1-6.8l-5.6-5.4-1.1 9.8z"/%3E%3C/svg%3E' ) ;
2023-04-05 19:28:39 +03:00
--icon-reply : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23b8b3c0' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-reply-detailed-status-action-bar : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23b8b3c0' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-bookmark-detailed-status-action-bar : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='%23b8b3c0' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-04-28 19:31:58 +03:00
--icon-bookmark-detailed-status-action-bar-hover : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='%23F91880' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-04-05 19:28:39 +03:00
--icon-heart : url ( "data:image/svg+xml, %0A%3Csvg viewBox='0 0 24 24' color='inherit' width='20' height='20' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='%23b8b3c0' d='M16.5 3C19.538 3 22 5.5 22 9c0 7-7.5 11-10 12.5C9.5 20 2 16 2 9c0-3.5 2.5-6 5.5-6C9.36 3 11 4 12 5c1-1 2.64-2 4.5-2zm-3.566 15.604a26.953 26.953 0 0 0 2.42-1.701C18.335 14.533 20 11.943 20 9c0-2.36-1.537-4-3.5-4c-1.076 0-2.24.57-3.086 1.414L12 7.828l-1.414-1.414C9.74 5.57 8.576 5 7.5 5C5.56 5 4 6.656 4 9c0 2.944 1.666 5.533 4.645 7.903c.745.592 1.54 1.145 2.421 1.7c.299.189.595.37.934.572c.339-.202.635-.383.934-.571z'/%3E%3C/svg%3E" ) ;
--icon-home-notification : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"%3E%3Ctitle%3EHome%3C/title%3E%3Cpath d="M80 212v236a16 16 0 0016 16h96V328a24 24 0 0124-24h80a24 24 0 0124 24v136h96a16 16 0 0016-16V212" fill="none" stroke="%23b8b3c0" stroke-linecap="round" stroke-linejoin="round" stroke-width="38"/%3E%3Cpath d="M480 256L266.89 52c-5-5.28-16.69-5.34-21.78 0L32 256M400 179V64h-48v69" fill="none" stroke="%23b8b3c0" stroke-linecap="round" stroke-linejoin="round" stroke-width="38"/%3E%3C/svg%3E' ) ;
--icon-star : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="none" stroke="%23b8b3c0" stroke-width="5.5" viewBox="0 0 68 68"%3E%3Cpath d="M31.4 3.8c-.7.4-2.5 5-4.1 10.2l-2.9 9.5-9.9.5c-5.5.3-10.6.9-11.3 1.3-.6.5-1.2 1.9-1.2 3.3 0 2 1.5 3.4 8 7.5 4.4 2.8 8 5.5 8 6s-1.3 4.5-3 9.1c-3.6 9.7-3.7 11.4-.9 12.8 2.7 1.5 3.5 1.1 12.4-5.6l7.5-5.6 8.2 6.1c8.4 6.3 11.2 7.1 13.2 3.9.8-1.4.3-3.9-2.2-11-1.8-5.1-3.2-9.6-3.2-9.9 0-.4 3.6-3 8-5.8 6.5-4.1 8-5.5 8-7.5 0-1.4-.6-2.8-1.2-3.3-.7-.4-5.8-1-11.3-1.3l-9.9-.5-2.9-9.5C37.8 4.6 36.9 3 34 3c-.8 0-2 .4-2.6.8z"/%3E%3C/svg%3E%0A' ) ;
2023-10-29 21:09:09 +02:00
--icon-star-active : url ( "data:image/svg+xml, %3Csvg fill='%23b8b3c0' xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 -960 960 960' class='icon icon-star' aria-hidden='true'%3E%3Cpath d='m212.086-50.607 70.652-305.306L45.52-561.305l312.871-26.696L480-876.176l121.609 288.175 312.871 26.696-237.218 205.392 71.217 305.306L480-213.173 212.086-50.607Z'%3E%3C/path%3E%3C/svg%3E" ) ;
--icon-star-detailed-status-action-bar : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23b8b3c0' width='18' height='18' viewBox='0 -960 960 960' class='icon icon-star' aria-hidden='true'%3E%3Cpath d='m330.955-216.328 149.066-89 149.066 90.023-40.305-168.391 131.217-114.347-172.956-14.87L480-671.869l-67.043 158.521-172.956 14.305 131.427 113.796-40.473 168.919ZM212.086-50.608l70.652-305.305L45.52-561.305l312.645-26.579L480-876.176l121.835 288.292 312.645 26.579-237.218 205.392 71.217 305.306L480-213.173 212.086-50.607ZM480-433.87Z'%3E%3C/path%3E%3C/svg%3E" ) ;
--icon-active : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="%23b8b3c0" stroke="%23b8b3c0" stroke-width="5.5" viewBox="0 0 68 68"%3E%3Cpath d="M31.4 3.8c-.7.4-2.5 5-4.1 10.2l-2.9 9.5-9.9.5c-5.5.3-10.6.9-11.3 1.3-.6.5-1.2 1.9-1.2 3.3 0 2 1.5 3.4 8 7.5 4.4 2.8 8 5.5 8 6s-1.3 4.5-3 9.1c-3.6 9.7-3.7 11.4-.9 12.8 2.7 1.5 3.5 1.1 12.4-5.6l7.5-5.6 8.2 6.1c8.4 6.3 11.2 7.1 13.2 3.9.8-1.4.3-3.9-2.2-11-1.8-5.1-3.2-9.6-3.2-9.9 0-.4 3.6-3 8-5.8 6.5-4.1 8-5.5 8-7.5 0-1.4-.6-2.8-1.2-3.3-.7-.4-5.8-1-11.3-1.3l-9.9-.5-2.9-9.5C37.8 4.6 36.9 3 34 3c-.8 0-2 .4-2.6.8z"/%3E%3C/svg%3E%0A' ) ;
2023-07-05 19:14:35 +03:00
--icon-bookmark : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23b8b3c0" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bookmark"%3E%3Cpath d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"%3E%3C/path%3E%3C/svg%3E' ) ;
2023-10-29 21:09:09 +02:00
/* Profile icons */
--icon-github : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%23b8b3c0" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-github"%3E%3Cpath d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-youtube : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%23b8b3c0" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-youtube"%3E%3Cpath d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.46a2.78 2.78 0 0 0-1.94 2A29 29 0 0 0 1 11.75a29 29 0 0 0 .46 5.33A2.78 2.78 0 0 0 3.4 19c1.72.46 8.6.46 8.6.46s6.88 0 8.6-.46a2.78 2.78 0 0 0 1.94-2 29 29 0 0 0 .46-5.25 29 29 0 0 0-.46-5.33z"%3E%3C/path%3E%3Cpolygon points="9.75 15.02 15.5 11.75 9.75 8.48 9.75 15.02"%3E%3C/polygon%3E%3C/svg%3E' ) ;
--icon-link : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="%23b8b3c0" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-link-2"%3E%3Cpath d="M15 7h3a5 5 0 0 1 5 5 5 5 0 0 1-5 5h-3m-6 0H6a5 5 0 0 1-5-5 5 5 0 0 1 5-5h3"%3E%3C/path%3E%3Cline x1="8" y1="12" x2="16" y2="12"%3E%3C/line%3E%3C/svg%3E' ) ;
--icon-twitter : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 512 512"%3E%3Cpath fill="%23b8b3c0" d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"/%3E%3C/svg%3E' ) ;
--icon-twitch : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%23b8b3c0" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-twitch"%3E%3Cpath d="M21 2H3v16h5v4l4-4h5l4-4V2zm-10 9V7m5 4V7"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-patreon : url ( "data:image/svg+xml, %0A%3Csvg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%23b8b3c0'%3E%3Ctitle%3EPatreon icon%3C/title%3E%3Cpath d='M15.386.524c-4.764 0-8.64 3.876-8.64 8.64 0 4.75 3.876 8.613 8.64 8.613 4.75 0 8.614-3.864 8.614-8.613C24 4.4 20.136.524 15.386.524M.003 23.537h4.22V.524H.003'/%3E%3C/svg%3E" ) ;
2023-11-12 16:33:49 +02:00
--icon-threads : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='18' fill='%23b8b3c0' width='18' viewBox='0 0 448 512'%3E%3Cpath d='M331.5 235.7c2.2 .9 4.2 1.9 6.3 2.8c29.2 14.1 50.6 35.2 61.8 61.4c15.7 36.5 17.2 95.8-30.3 143.2c-36.2 36.2-80.3 52.5-142.6 53h-.3c-70.2-.5-124.1-24.1-160.4-70.2c-32.3-41-48.9-98.1-49.5-169.6V256v-.2C17 184.3 33.6 127.2 65.9 86.2C102.2 40.1 156.2 16.5 226.4 16h.3c70.3 .5 124.9 24 162.3 69.9c18.4 22.7 32 50 40.6 81.7l-40.4 10.8c-7.1-25.8-17.8-47.8-32.2-65.4c-29.2-35.8-73-54.2-130.5-54.6c-57 .5-100.1 18.8-128.2 54.4C72.1 146.1 58.5 194.3 58 256c.5 61.7 14.1 109.9 40.3 143.3c28 35.6 71.2 53.9 128.2 54.4c51.4-.4 85.4-12.6 113.7-40.9c32.3-32.2 31.7-71.8 21.4-95.9c-6.1-14.2-17.1-26-31.9-34.9c-3.7 26.9-11.8 48.3-24.7 64.8c-17.1 21.8-41.4 33.6-72.7 35.3c-23.6 1.3-46.3-4.4-63.9-16c-20.8-13.8-33-34.8-34.3-59.3c-2.5-48.3 35.7-83 95.2-86.4c21.1-1.2 40.9-.3 59.2 2.8c-2.4-14.8-7.3-26.6-14.6-35.2c-10-11.7-25.6-17.7-46.2-17.8H227c-16.6 0-39 4.6-53.3 26.3l-34.4-23.6c19.2-29.1 50.3-45.1 87.8-45.1h.8c62.6 .4 99.9 39.5 103.7 107.7l-.2 .2zm-156 68.8c1.3 25.1 28.4 36.8 54.6 35.3c25.6-1.4 54.6-11.4 59.5-73.2c-13.2-2.9-27.8-4.4-43.4-4.4c-4.8 0-9.6 .1-14.4 .4c-42.9 2.4-57.2 23.2-56.2 41.8l-.1 .1z'/%3E%3C/svg%3E" ) ;
2024-02-09 20:41:36 +02:00
--icon-bluesky : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8.467 8.467' width='18' height='18'%3E%3Cpath fill='%23b8b3c0' d='M67.256 111.972c-.545-.648-.629-.916-.411-1.323.15-.28.477-.52.727-.531.289-.013.204-.113-.236-.274-.862-.316-1.295-1.239-1.295-2.76 0-1.071.058-1.179.643-1.179.65 0 2.043 1.149 2.88 2.374l.446.655.446-.655c.837-1.225 2.23-2.373 2.88-2.373.584 0 .642.107.642 1.178 0 1.528-.435 2.45-1.295 2.74-.686.23-.686.233-.094.424.787.253.78 1.214-.017 1.961-.893.84-1.748.751-2.114-.218-.165-.437-.364-.794-.442-.794-.078 0-.3.357-.493.794-.47 1.06-1.365 1.053-2.267-.02z' transform='translate(-65.776 -105.112)'/%3E%3C/svg%3E" ) ;
2023-11-12 16:33:49 +02:00
--icon-nostr : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 860 847'%3E%3Cpath d='M454.5 1.1c-67.6 10.3-115.8 27.2-160.4 56.4-16.5 10.9-19.3 12-29.1 12-9.5 0-14.6-2-20.8-7.9-5.5-5.1-7.5-9.9-9.2-22-1.9-13.1-6.8-20.4-17.3-25.7l-5.8-3-92.2.3c-68.2.3-93.1.7-95.6 1.6-4.5 1.5-11.4 8.3-15.2 14.8L6 32.8l.2 391.8.3 391.9 2.7 5c1.4 2.8 4.6 6.9 7.1 9.2 8.7 8 .9 7.3 96 8 88.7.6 108.3 0 116.7-3.3 5.9-2.4 13.5-11.7 14.9-18.4 1.4-6.4 1.4-67.7.1-103.3-3-78.6-15.8-158-48.1-297.2-21.2-91.3-27.3-126.1-28.6-162.6-1.5-43.2 7-69.1 28.8-87.6 6.9-5.8 19.7-12.8 29.7-16.2 14.8-5 57.5-12 96.2-15.7 21-2.1 84.2-2.4 104.4-.6 25.3 2.3 54.4 8.4 76 15.9 36.2 12.5 62.9 33.9 75.5 60.4 5.2 10.8 7.6 20.5 9.6 38.2 1.9 16.7 3.6 24 7.4 32.2 7.1 15.3 26.3 28.9 50.7 36 20.1 5.9 42 8.1 86.4 9 33.3.7 41.1 1.5 47.9 5 7.7 3.9 15.4 11.6 18.7 18.7 2.8 6 2.9 6.9 2.9 20.8 0 13.3-.2 14.9-2.4 19.5-1.4 2.8-5.6 8.1-9.5 12-10.8 10.7-28 18.8-48.8 23-13.6 2.7-38.7 3.5-110.3 3.5-73.4 0-79.9.3-96.7 4.5-33.7 8.5-56.9 25.7-70.1 52.1-15.4 30.7-26.8 91.8-31.7 170.4-2.9 46.1-3 159.5-.1 166.5 1.9 4.7 11.1 13.4 15.3 14.5 8.4 2.3 51.4 3 196.8 3 155 0 184.6-.6 191.7-3.5 5.5-2.3 12.1-9.2 13.4-13.9.6-2.1 1.5-10.5 2-18.5 1.9-32.6.2-482.7-2-504.1-4.6-44.3-20-97.2-39.7-136.1-14.5-28.7-30.3-50.8-51.9-72.5-27-27.1-54.5-45.9-89.8-61.4-31.8-13.9-71.3-24.3-104.5-27.5-16.8-1.7-98.5-1.9-108.7-.4z' fill='%23b8b3c0'/%3E%3Cpath d='M448 211.5c-21.4 5.9-38.1 21.3-45.8 42.7-2.4 6.5-2.7 8.7-2.6 19.8 0 11.3.3 13.3 3 21 3.9 11 8.7 18.2 18.1 27 11.2 10.4 22.4 15.1 39.8 16.5 27.9 2.3 56.6-18.3 64.9-46.5 8.1-27.5-5.4-60.4-30.1-73.3-12.3-6.4-17.5-7.8-30.3-8.3-8.2-.3-13.1 0-17 1.1z' fill='%23b8b3c0'/%3E%3C/svg%3E" ) ;
2023-10-29 21:09:09 +02:00
--icon-paypal : url ( "data:image/svg+xml, %0A%3Csvg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%23b8b3c0'%3E%3Ctitle%3EPayPal icon%3C/title%3E%3Cpath d='M6.908 24H3.804c-.664 0-1.086-.529-.936-1.18l.149-.674h2.071c.666 0 1.336-.533 1.482-1.182l1.064-4.592c.15-.648.816-1.18 1.48-1.18h.883c3.789 0 6.734-.779 8.84-2.34s3.16-3.6 3.16-6.135c0-1.125-.195-2.055-.588-2.789 0-.016-.016-.031-.016-.046l.135.075c.75.465 1.32 1.064 1.711 1.814.404.75.598 1.68.598 2.791 0 2.535-1.049 4.574-3.164 6.135-2.1 1.545-5.055 2.324-8.834 2.324h-.9c-.66 0-1.334.525-1.484 1.186L8.39 22.812c-.149.645-.81 1.17-1.47 1.17L6.908 24zm-2.677-2.695H1.126c-.663 0-1.084-.529-.936-1.18L4.563 1.182C4.714.529 5.378 0 6.044 0h6.465c1.395 0 2.609.098 3.648.289 1.035.189 1.92.519 2.684.99.736.465 1.322 1.072 1.697 1.818.389.748.584 1.68.584 2.797 0 2.535-1.051 4.574-3.164 6.119-2.1 1.561-5.056 2.326-8.836 2.326h-.883c-.66 0-1.328.524-1.478 1.169L5.7 20.097c-.149.646-.817 1.172-1.485 1.172l.016.036zm7.446-17.369h-1.014c-.666 0-1.332.529-1.48 1.178l-.93 4.02c-.15.648.27 1.179.93 1.179h.766c1.664 0 2.97-.343 3.9-1.021.929-.686 1.395-1.654 1.395-2.912 0-.83-.301-1.445-.9-1.84-.6-.404-1.5-.605-2.686-.605l.019.001z'/%3E%3C/svg%3E" ) ;
--icon-kofi : url ( "data:image/svg+xml, %3Csvg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%23b8b3c0'%3E%3Ctitle%3EKo-fi icon%3C/title%3E%3Cpath d='M23.881 8.948c-.773-4.085-4.859-4.593-4.859-4.593H.723c-.604 0-.679.798-.679.798s-.082 7.324-.022 11.822c.164 2.424 2.586 2.672 2.586 2.672s8.267-.023 11.966-.049c2.438-.426 2.683-2.566 2.658-3.734 4.352.24 7.422-2.831 6.649-6.916zm-11.062 3.511c-1.246 1.453-4.011 3.976-4.011 3.976s-.121.119-.31.023c-.076-.057-.108-.09-.108-.09-.443-.441-3.368-3.049-4.034-3.954-.709-.965-1.041-2.7-.091-3.71.951-1.01 3.005-1.086 4.363.407 0 0 1.565-1.782 3.468-.963 1.904.82 1.832 3.011.723 4.311zm6.173.478c-.928.116-1.682.028-1.682.028V7.284h1.77s1.971.551 1.971 2.638c0 1.913-.985 2.667-2.059 3.015z'/%3E%3C/svg%3E" ) ;
2024-02-10 16:30:43 +02:00
--icon-bandcamp : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='%23b8b3c0' viewBox='0 0 512 512'%3E%3Cpath d='M105.6 191.2C98.1 204.8 33 325.2 33 325.6c0 .2 36.8.3 81.7.2l81.7-.3 37.5-69.4 37.6-69.4.3 70.2.2 70.2 10.3-.3 10.2-.3.3-6.8.3-6.7 3.2 4.2c2.2 2.9 5.6 5.5 10.1 7.8 6.8 3.5 7.1 3.5 19.5 3.5 12.3 0 12.8-.1 19.3-3.3 16.4-8 25.9-28.9 24.5-53.7-1.3-22.4-10.5-38.2-26.5-45.8-6.3-3-7.4-3.2-17.7-3.2-9.8 0-11.6.3-16.7 2.7-3.2 1.5-7.8 4.8-10.3 7.3l-4.5 4.7V185H109.1l-3.5 6.2zm226.1 51c5.3 2.4 8.7 6.5 12.7 14.8 2.9 6.1 3.1 7.2 3.1 18 0 12.9-1 17.1-5.7 24.9-4.7 7.6-11.5 11.4-20.6 11.4-15.3 0-24.4-9.6-27.4-28.6-2.1-13.4 1.5-28.2 8.5-35.5 7.6-7.9 19-9.9 29.4-5zM413.1 223.6c-21.1 5.7-34.1 26-34.1 53.1.1 22.8 9.6 39.9 26.8 48.1 6.5 3.1 8.6 3.6 17.4 4 15 .7 24.1-1.8 33.4-9.4 6.9-5.6 12.9-16.6 14.9-27.7l.7-3.7h-22l-.7 3.7c-1 5.5-3.9 10.6-8.1 14.2-4.8 4.3-7.7 5.3-14.9 5.3-16 .1-25.5-13.2-25.5-35.7 0-23.3 9.4-35.7 27-35.7 10.8 0 17.4 4.4 20.9 13.8l1.9 4.9 10.7.3 10.7.3-.7-4.7c-1.6-10.9-9.8-22.5-19.3-27.3-9.9-5-27.6-6.6-39.1-3.5z'/%3E%3C/svg%3E%0A" ) ;
--icon-facebook : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23b8b3c0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-facebook'%3E%3Cpath d='M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z'%3E%3C/path%3E%3C/svg%3E" ) ;
--icon-friendica : url ( "data:image/svg+xml, %3Csvg fill='%23b8b3c0' width='18' height='18' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1523.8 1536'%3E%3Cpath d='M0 276.4v983.2C0 1412 122.8 1536 274.4 1536h975.1c151.6 0 274.4-124 274.4-276.4V276.4C1523.8 124 1401.1 0 1249.4 0h-975C122.8 0 0 124 0 276.4zM1249.4 61.2c118.5 0 213.2 95.3 213.2 215.2v983.2c0 119.9-94.7 215.2-213.2 215.2H518.1V1106h487.5l-1.3-367.7-486.3 2.6V430.1h487.5V61.2h243.9z'/%3E%3C/svg%3E%0A" ) ;
--icon-genderless-pronouns : url ( "data:image/svg+xml, %3Csvg fill='%23b8b3c0' width='18' height='18' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.334 12v-.02a9.354 9.354 0 1 0-2.74 6.614 8.963 8.963 0 0 0 2.74-6.462l-.001-.139V12zM24 12v.036c0 1.67-.349 3.258-.977 4.695l.029-.075c-1.226 2.905-3.491 5.17-6.318 6.367l-.078.029C15.282 23.651 13.682 24 12 24s-3.283-.349-4.733-.978l.077.03c-2.905-1.226-5.17-3.491-6.367-6.318l-.029-.078C.349 15.282 0 13.682 0 12s.349-3.283.978-4.733l-.03.077C2.174 4.439 4.439 2.174 7.266.977l.078-.029C8.718.349 10.318 0 12 0s3.283.349 4.733.978l-.077-.03c2.905 1.226 5.17 3.491 6.367 6.318l.029.078c.599 1.362.948 2.95.948 4.62v.039-.002z'/%3E%3C/svg%3E%0A" ) ;
--icon-wordpress : url ( "data:image/svg+xml, %3Csvg width='18' height='18' fill='%23b8b3c0' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M61.7 169.4l101.5 278C92.2 413 43.3 340.2 43.3 256c0-30.9 6.6-60.1 18.4-86.6zm337.9 75.9c0-26.3-9.4-44.5-17.5-58.7-10.8-17.5-20.9-32.4-20.9-49.9 0-19.6 14.8-37.8 35.7-37.8 .9 0 1.8 .1 2.8 .2-37.9-34.7-88.3-55.9-143.7-55.9-74.3 0-139.7 38.1-177.8 95.9 5 .2 9.7 .3 13.7 .3 22.2 0 56.7-2.7 56.7-2.7 11.5-.7 12.8 16.2 1.4 17.5 0 0-11.5 1.3-24.3 2l77.5 230.4L249.8 247l-33.1-90.8c-11.5-.7-22.3-2-22.3-2-11.5-.7-10.1-18.2 1.3-17.5 0 0 35.1 2.7 56 2.7 22.2 0 56.7-2.7 56.7-2.7 11.5-.7 12.8 16.2 1.4 17.5 0 0-11.5 1.3-24.3 2l76.9 228.7 21.2-70.9c9-29.4 16-50.5 16-68.7zm-139.9 29.3l-63.8 185.5c19.1 5.6 39.2 8.7 60.1 8.7 24.8 0 48.5-4.3 70.6-12.1-.6-.9-1.1-1.9-1.5-2.9l-65.4-179.2zm183-120.7c.9 6.8 1.4 14 1.4 21.9 0 21.6-4 45.8-16.2 76.2l-65 187.9C426.2 403 468.7 334.5 468.7 256c0-37-9.4-71.8-26-102.1zM504 256c0 136.8-111.3 248-248 248C119.2 504 8 392.7 8 256 8 119.2 119.2 8 256 8c136.7 0 248 111.2 248 248zm-11.4 0c0-130.5-106.2-236.6-236.6-236.6C125.5 19.4 19.4 125.5 19.4 256S125.6 492.6 256 492.6c130.5 0 236.6-106.1 236.6-236.6z'/%3E%3C/svg%3E" ) ;
2023-10-29 21:09:09 +02:00
--icon-mastodon : url ( "data:image/svg+xml, %0A%3Csvg role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23b8b3c0'%3E%3Ctitle%3EMastodon icon%3C/title%3E%3Cpath d='M23.193 7.879c0-5.206-3.411-6.732-3.411-6.732C18.062.357 15.108.025 12.041 0h-.076c-3.068.025-6.02.357-7.74 1.147 0 0-3.411 1.526-3.411 6.732 0 1.192-.023 2.618.015 4.129.124 5.092.934 10.109 5.641 11.355 2.17.574 4.034.695 5.535.612 2.722-.15 4.25-.972 4.25-.972l-.09-1.975s-1.945.613-4.129.539c-2.165-.074-4.449-.233-4.799-2.891a5.499 5.499 0 0 1-.048-.745s2.125.52 4.817.643c1.646.075 3.19-.097 4.758-.283 3.007-.359 5.625-2.212 5.954-3.905.517-2.665.475-6.507.475-6.507zm-4.024 6.709h-2.497V8.469c0-1.29-.543-1.944-1.628-1.944-1.2 0-1.802.776-1.802 2.312v3.349h-2.483v-3.35c0-1.536-.602-2.312-1.802-2.312-1.085 0-1.628.655-1.628 1.944v6.119H4.832V8.284c0-1.289.328-2.313.987-3.07.68-.758 1.569-1.146 2.674-1.146 1.278 0 2.246.491 2.886 1.474L12 6.585l.622-1.043c.64-.983 1.608-1.474 2.886-1.474 1.104 0 1.994.388 2.674 1.146.658.757.986 1.781.986 3.07v6.304z'/%3E%3C/svg%3E" ) ;
2023-11-12 16:58:59 +02:00
--icon-verified : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" width="22" height="22" %3E%3Cpath fill="%236364ff" d="M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-verified-smaller : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" width="15" height="15" %3E%3Cpath fill="%236364ff" d="M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z"%3E%3C/path%3E%3C/svg%3E' ) ;
2023-10-29 21:09:09 +02:00
--icon-label : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%23b8b3c0" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-tag"%3E%3Cpath d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"%3E%3C/path%3E%3Cline x1="7" y1="7" x2="7.01" y2="7"%3E%3C/line%3E%3C/svg%3E' ) ;
--icon-discord : url ( ' data : image / svg + xml , % 3Csvg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 32 32" width = "18" height = "18" % 3E % 3Cpath fill = "%23b8b3c0" d = " M 12 . 65625 4 . 90625 L 11 . 875 5 C 11 . 875 5 8 . 371094 5 . 382813 5 . 8125 7 . 4375 L 5 . 78125 7 . 4375 L 5 . 75 7 . 46875 C 5 . 175781 7 . 996094 4 . 925781 8 . 644531 4 . 53125 9 . 59375 C 4 . 136719 10 . 542969 3 . 714844 11 . 753906 3 . 34375 13 . 09375 C 2 . 601563 15 . 777344 2 19 . 027344 2 22 L 2 22 . 25 L 2 . 125 22 . 5 C 3 . 050781 24 . 125 4 . 695313 25 . 160156 6 . 21875 25 . 875 C 7 . 742188 26 . 589844 9 . 058594 26 . 96875 9 . 96875 27 L 10 . 5625 27 . 03125 L 10 . 875 26 . 5 L 11 . 96875 24 . 5625 C 13 . 128906 24 . 824219 14 . 464844 25 16 25 C 17 . 535156 25 18 . 871094 24 . 824219 20 . 03125 24 . 5625 L 21 . 125 26 . 5 L 21 . 4375 27 . 03125 L 22 . 03125 27 C 22 . 941406 26 . 96875 24 . 257813 26 . 589844 25 . 78125 25 . 875 C 27 . 304688 25 . 160156 28 . 949219 24 . 125 29 . 875 22 . 5 L 30 22 . 25 L 30 22 C 30 19 . 027344 29 . 398438 15 . 777344 28 . 65625 13 . 09375 C 28 . 285156 11 . 753906 27 . 863281 10 . 542969 27 . 46875 9 . 59375 C 27 . 074219 8 . 644531 26 . 824219 7 . 996094 26 . 25 7 . 46875 L 26 . 21875 7 . 4375 L 26 . 1875 7 . 4375 C 23 . 628906 5 . 382813 20 . 125 5 20 . 125 5 L 19 . 34375 4 . 90625 L 19 . 0625 5 . 625 C 19 . 0625 5 . 625 18 . 773438 6 . 355469 18 . 59375 7 . 1875 C 17 . 460938 7 . 035156 16 . 535156 7 16 7 C 15 . 464844 7 14 . 539063 7 . 035156 13 . 40625 7 . 1875 C 13 . 226563 6 . 355469 12 . 9375 5 . 625 12 . 9375 5 . 625 Z M 11 . 28125 7 . 1875 C 11 . 324219 7 . 328125 11 . 367188 7 . 449219 11 . 40625 7 . 5625 C 10 . 113281 7 . 882813 8 . 734375 8 . 371094 7 . 46875 9 . 15625 L 8 . 53125 10 . 84375 C 11 . 125 9 . 234375 14 . 851563 9 16 9 C 17 . 148438 9 20 . 875 9 . 234375 23 . 46875 10 . 84375 L 24 . 53125 9 . 15625 C 23 . 265625 8 . 371094 21 . 886719 7 . 882813 20 . 59375 7 . 5625 C 20 . 632813 7 . 449219 20 . 675781 7 . 328125 20 . 71875 7 . 1875 C 21 . 652344 7 . 375 23 . 433594 7 . 804688 24 . 90625 8 . 96875 C 24 . 898438 8 . 972656 25 . 28125 9 . 550781 25 . 625 10 . 375 C 25 . 976563 11 . 222656 26 . 367188 12 . 351563 26 . 71875 13 . 625 C 27 . 394531 16 . 066406 27 . 925781 19 . 039063 27 . 96875 21 . 65625 C 27 . 339844 22 . 617188 26 . 171875 23 . 484375 24 . 9375 24 . 0625 C 23 . 859375 24 . 566406 23 . 007813 24 . 75 22 . 5 24 . 84375 L 22 24 C 22 . 296875 23 . 890625 22 . 589844 23 . 769531 22 . 84375 23 . 65625 C 24 . 382813 22 . 980469 25 . 21875 22 . 25 25 . 21875 22 . 25 L 23 . 90625 20 . 75 C 23 . 90625 20 . 75 23 . 34375 21 . 265625 22 . 03125 21 . 84375 C 20 . 71875 22 . 421875 18 . 714844 23 16 23 C 13 . 285156 23 11 . 28125 22 . 421875 9 . 96875 21 . 84375 C 8 . 65625 21 . 265625 8 . 09375 20 . 75 8 . 09375 20 . 75 L 6 . 78125 22 . 25 C 6 . 78125 22 . 25 7 . 617188 22 . 980469 9 . 15625 23 . 65625 C 9 . 410156 23 . 769531 9 . 703125 23 . 890625 10 24 L 9 . 5 24 . 84375 C 8 . 992188 24 . 75 8 . 140625 24 . 566406 7 . 0625 24 . 0625 C 5 . 828125 23 . 484375 4 . 660156 22 . 617188 4 . 03125 21 . 65625 C 4 . 074219 19 . 039063 4 . 605469 16 . 066406 5 . 28125 13 . 625 C 5 . 632813 12 . 351563 6 . 023438 11 . 222656 6 . 375 10 . 375 C 6 . 71875 9 . 550781 7 . 101563 8 . 972656 7 . 09375 8 . 96875 C 8 . 566406 7 . 804688 10 . 347656 7 . 375 11 . 28125 7 . 1875 Z M 12 . 5 14 C 11 . 726563 14 11 . 042969 14 . 441406 10 . 625 15 C 10 . 207031 15 . 558594 10 16 . 246094 10 17 C 10 17 . 753906 10 . 207031 18 . 441406 10 . 625 19 C 11 . 042969 19 . 558594 11 . 726563 20 12 . 5 20 C 13 . 273438 20 13 . 957031 19 . 558594 14 . 375 19 C 14 . 792969 18 . 441406 15 17 . 753906 15 17 C 15 16 . 246094 14 . 792969 15 . 558594 14 . 375 15 C 13 . 957031 14 . 441406 13 . 273438 14 12 . 5 14 Z M 19 . 5 14 C 18 . 726563 14 18 . 042969 14 . 441406 17 . 625 15 C 17 . 207031 15 . 558594 17 16 . 246094 17 17 C 17 17 . 753906 17 . 207031 18 . 441406 17 . 625 19 C 18 . 042969 19 . 558594 18 . 726563 20 19 . 5 20 C 20 . 273438 20 20 . 957031 19 . 558594 21 . 375 19 C 21 . 792969 18 . 441406 22 17 . 753906 22 17 C 22 16 . 246094 21 . 792969 15 . 558594 21 . 375 15 C 20 . 957031 14 . 441406 20 . 273438 14 19 . 5 14 Z M 12 . 5 16 C 12 . 554688 16 12 . 625 16 . 019531 12 . 75 16 . 1875 C 12 . 875 16 . 355469 13 16 . 648438 13 17 C 13 17 . 351563 12 . 875 17 . 644531 12 . 75 17 . 8125 C 12 . 625 17 . 980469 12 . 554688 18 12 . 5 18 C 12 . 445313 18 12 . 375 17 . 980469 12 . 25 17 . 8125 C 12 . 125 17 . 644531 12 17 . 351563 12 17 C 12 16 . 648438 12 . 125 16 . 355469 12 . 25 16 . 1875 C 12 . 375 16 . 019531 12 . 445313 16 12 . 5 16 Z M 19 . 5 16 C 19 . 554688 16 19 . 625 16 . 019531 19 . 75 16 . 1875 C 19 . 875 16 . 355469 20 16 . 648438 20 17 C 20 17 . 351563 19 . 875 17 . 644531 19 . 75 17 . 8125 C 19 . 625 17 . 980469 19 . 554688 18 19 . 5 18 C 19 . 445313 18 19 . 375 17 . 980469 19 . 25 17 . 81
--icon-linkedin : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%23b8b3c0" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-linkedin"%3E%3Cpath d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"%3E%3C/path%3E%3Crect x="2" y="9" width="4" height="12"%3E%3C/rect%3E%3Ccircle cx="4" cy="4" r="2"%3E%3C/circle%3E%3C/svg%3E' ) ;
--icon-instagram : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%23b8b3c0" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-instagram"%3E%3Crect x="2" y="2" width="20" height="20" rx="5" ry="5"%3E%3C/rect%3E%3Cpath d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"%3E%3C/path%3E%3Cline x1="17.5" y1="6.5" x2="17.51" y2="6.5"%3E%3C/line%3E%3C/svg%3E' ) ;
2023-04-04 19:15:46 +03:00
}
2023-03-25 18:02:16 +02:00
/* Light theme */
2023-07-03 22:21:53 +03:00
body . theme-mastodon-light . layout-multiple-columns {
2023-03-25 18:02:16 +02:00
--color-bg : # fff ;
--color-fg : # 000 ;
2023-03-25 18:09:27 +02:00
--color-border : # e6e1ed ;
--color-dim : # 9388a6 ;
2023-03-25 18:02:16 +02:00
--color-green : # 17bf63 ;
--color-red : # e0245e ;
--color-red-75 : # e0245ebf ;
--color-light-shade : # 00000005 ;
2023-03-25 18:28:40 +02:00
--color-focusable-toot : rgba ( 0 , 0 , 0 , 0 . 035 ) ;
2023-03-25 18:09:27 +02:00
--color-light-text : # 1f1b23 ;
--color-mud : # e5e1ed ;
--color-black-coral : # 9188a6 ;
--color-profile-button-hover : # 1e1b231a ;
--color-column-link-hover : # 1e1b231a ;
--color-modal-overlay : # 6a5b8366 ;
2023-03-25 18:02:16 +02:00
--color-dark : # f7f9f9 ;
--color-thread-line : # e1e8ed ;
2023-10-29 21:09:09 +02:00
--color-topaz : # 8899a6 ;
2023-03-25 18:09:27 +02:00
--color-light-purple : # 9588a6 ;
--color-dark-electric-blue : # 9088a6 ;
2023-03-25 18:02:16 +02:00
--color-bg-75 : # ffffffbf ;
2023-03-25 18:28:40 +02:00
--color-accent : var ( --color-accent-dark ) ;
2023-03-25 19:41:29 +02:00
--color-ghost-button-text : var ( --color-accent-dark ) ;
2023-07-30 02:43:55 +03:00
--color-bg-compose-form : rgb ( 147 136 166 / . 2 ) ;
--color-bg-compose-form-focus : rgb ( 147 136 166 / . 3 ) ;
2023-09-24 02:51:09 +03:00
--color-hashtag : var ( --color-accent-dark ) ;
--color-mention : var ( --color-accent-dark ) ;
2023-03-25 18:09:27 +02:00
2023-04-04 09:59:47 +03:00
/* Misc */
--compose-form-linear-gradient : linear-gradient ( 180deg , rgba ( 255 , 255 , 255 , 1 ) 0 % , rgba ( 255 , 255 , 255 , 1 ) 53 % , rgba ( 255 , 255 , 255 , 0 . 8141631652661064 ) 76 % , rgba ( 255 , 255 , 255 , 0 . 7077205882352942 ) 87 % , rgba ( 255 , 255 , 255 , 0 . 458420868347339 ) 97 % , rgba ( 255 , 255 , 255 , 0 ) 100 % ) ;
2023-03-25 18:09:27 +02:00
/* Icons for light theme */
2023-09-23 18:53:06 +03:00
--icon-boost : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 136 136'%3E%3Cpath fill='%239388a6' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
--icon-boost-status : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 136 136'%3E%3Cpath fill='%239388a6' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
--icon-boost-status-prepend : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true"%3E%3Cg%3E%3Cpath fill="%2300ba7c" d="M4.75 3.79l4.603 4.3-1.706 1.82L6 8.38v7.37c0 .97.784 1.75 1.75 1.75H13V20H7.75c-2.347 0-4.25-1.9-4.25-4.25V8.38L1.853 9.91.147 8.09l4.603-4.3zm11.5 2.71H11V4h5.25c2.347 0 4.25 1.9 4.25 4.25v7.37l1.647-1.53 1.706 1.82-4.603 4.3-4.603-4.3 1.706-1.82L18 15.62V8.25c0-.97-.784-1.75-1.75-1.75z"%3E%3C/path%3E%3C/g%3E%3C/svg%3E' ) ;
2023-09-24 11:21:55 +03:00
--icon-boost-notification-filter-bar : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 136 136'%3E%3Cpath fill='%23717c9b' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
--icon-boost-notification-filter-bar-active : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 136 136'%3E%3Cpath fill='%231f1b23' d='M51 23.8c0 .4 2.4 3.1 5.3 6l5.3 5.2h34.6l3.4 3.4 3.4 3.4v47.4l-6.7-6.1-6.8-6.1-4 4-4 4 13.8 13.7 13.7 13.8L122.5 99c7.4-7.4 13.5-13.7 13.5-14-.1-.3-1.7-2.3-3.6-4.4l-3.5-4-6.8 6.8-6.9 6.9-.4-25.4c-.3-23.8-.4-25.7-2.5-29.4-2.7-5.1-5.7-7.9-11.3-10.4-4.1-1.9-6.5-2.1-27.2-2.1-12.6 0-22.8.4-22.8.8zM13 37.5-.4 51l3.8 3.9 3.9 4 6.6-6.1 6.6-6 .5 24.4c.5 26.3.7 27.2 6.6 33.2 6 5.9 6.8 6.1 33.2 6.4 13.3.2 24.2-.1 24.2-.5 0-.5-2.2-3-4.8-5.6l-4.8-4.7-15.9-.1c-17.7 0-21.7-.9-24.9-5.2-2-2.7-2.1-4.2-2.3-26.5l-.2-23.6 6.7 6.7C42.5 55 46 58 46.6 58c.5 0 2.5-1.6 4.4-3.5l3.4-3.5L41 37.5C33.6 30.1 27.3 24 27 24c-.3 0-6.6 6.1-14 13.5z'/%3E%3C/svg%3E%0A" ) ;
2023-03-25 18:09:27 +02:00
--icon-boost-notification-wrapper : url ( "data:image/svg+xml, %0A%3Csvg viewBox='0 0 24 24' color='inherit' width='24' height='24' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='%2300ba7c' d='M6 4h15a1 1 0 0 1 1 1v7h-2V6H6v3L1 5l5-4v3zm12 16H3a1 1 0 0 1-1-1v-7h2v6h14v-3l5 4l-5 4v-3z'/%3E%3C/svg%3E" ) ;
--icon-reply-nofitication-filter-bar-active : url ( 'data:image/svg+xml, %3Csvg viewBox="0 0 24 24" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath fill="%231f1b23" d="M1.751 10c0-4.42 3.584-8 8.005-8h4.366a8.13 8.13 0 0 1 8.129 8.13c0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067A8.005 8.005 0 0 1 1.751 10zm8.005-6a6.005 6.005 0 1 0 .133 12.01l.351-.01h1.761v2.3l5.087-2.81A6.127 6.127 0 0 0 14.122 4H9.756z"/%3E%3Cellipse fill="%231f1b23" fill-rule="evenodd" stroke-width="1.28569" cx="11.835" cy="10.2" rx="9.117" ry="8.123"/%3E%3C/svg%3E%0A' ) ;
2023-09-23 18:53:06 +03:00
--icon-reply : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%239388a6' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-reply-detailed-status-action-bar : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%239388a6' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-03-25 18:09:27 +02:00
--icon-reply-detailed-status-action-bar-hover : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23595aff' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-reply-conversation : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23595aff' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-09-23 18:53:06 +03:00
--icon-bookmark-detailed-status-action-bar : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='%239388a6' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-04-28 19:31:58 +03:00
--icon-bookmark-detailed-status-action-bar-hover : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='%23F91880' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-03-25 18:09:27 +02:00
--icon-bookmark-detailed-status-action-bar-active : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23F91880' viewBox='0 0 24 24' width='20' height='20' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-bookmark-column-link : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%231f1b23" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bookmark"%3E%3Cpath d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-bookmark-column-link-active : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%231f1b23" stroke="%231f1b23" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bookmark"%3E%3Cpath d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-reply-status-hover : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23595aff' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-list : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"%3E%3Ctitle%3EList%3C/title%3E%3Cpath fill="none" stroke="%231f1b23" stroke-linecap="round" stroke-linejoin="round" stroke-width="48" d="M160 144h288M160 256h288M160 368h288"/%3E%3Ccircle cx="80" cy="144" r="16" fill="none" stroke="%231f1b23" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/%3E%3Ccircle cx="80" cy="256" r="16" fill="none" stroke="%231f1b23" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/%3E%3Ccircle cx="80" cy="368" r="16" fill="none" stroke="%231f1b23" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"/%3E%3C/svg%3E' ) ;
2023-09-23 18:53:06 +03:00
--icon-heart : url ( "data:image/svg+xml, %0A%3Csvg viewBox='0 0 24 24' color='inherit' width='20' height='20' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='%239388a6' d='M16.5 3C19.538 3 22 5.5 22 9c0 7-7.5 11-10 12.5C9.5 20 2 16 2 9c0-3.5 2.5-6 5.5-6C9.36 3 11 4 12 5c1-1 2.64-2 4.5-2zm-3.566 15.604a26.953 26.953 0 0 0 2.42-1.701C18.335 14.533 20 11.943 20 9c0-2.36-1.537-4-3.5-4c-1.076 0-2.24.57-3.086 1.414L12 7.828l-1.414-1.414C9.74 5.57 8.576 5 7.5 5C5.56 5 4 6.656 4 9c0 2.944 1.666 5.533 4.645 7.903c.745.592 1.54 1.145 2.421 1.7c.299.189.595.37.934.572c.339-.202.635-.383.934-.571z'/%3E%3C/svg%3E" ) ;
2023-04-05 18:54:13 +03:00
--icon-heart-hover : url ( "data:image/svg+xml, %0A%3Csvg viewBox='0 0 24 24' color='inherit' width='20' height='20' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='%23F91880' d='M16.5 3C19.538 3 22 5.5 22 9c0 7-7.5 11-10 12.5C9.5 20 2 16 2 9c0-3.5 2.5-6 5.5-6C9.36 3 11 4 12 5c1-1 2.64-2 4.5-2zm-3.566 15.604a26.953 26.953 0 0 0 2.42-1.701C18.335 14.533 20 11.943 20 9c0-2.36-1.537-4-3.5-4c-1.076 0-2.24.57-3.086 1.414L12 7.828l-1.414-1.414C9.74 5.57 8.576 5 7.5 5C5.56 5 4 6.656 4 9c0 2.944 1.666 5.533 4.645 7.903c.745.592 1.54 1.145 2.421 1.7c.299.189.595.37.934.572c.339-.202.635-.383.934-.571z'/%3E%3C/svg%3E" ) ;
--icon-heart-active : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' aria-hidden='true' fill='%231f1b23'%3E%3Cg%3E%3Cpath d='M20.884 13.19c-1.351 2.48-4.001 5.12-8.379 7.67l-.503.3-.504-.3c-4.379-2.55-7.029-5.19-8.382-7.67-1.36-2.5-1.41-4.86-.514-6.67.887-1.79 2.647-2.91 4.601-3.01 1.651-.09 3.368.56 4.798 2.01 1.429-1.45 3.146-2.1 4.796-2.01 1.954.1 3.714 1.22 4.601 3.01.896 1.81.846 4.17-.514 6.67z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-heart-notification : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' aria-hidden='true' fill='%23F91880'%3E%3Cg%3E%3Cpath d='M20.884 13.19c-1.351 2.48-4.001 5.12-8.379 7.67l-.503.3-.504-.3c-4.379-2.55-7.029-5.19-8.382-7.67-1.36-2.5-1.41-4.86-.514-6.67.887-1.79 2.647-2.91 4.601-3.01 1.651-.09 3.368.56 4.798 2.01 1.429-1.45 3.146-2.1 4.796-2.01 1.954.1 3.714 1.22 4.601 3.01.896 1.81.846 4.17-.514 6.67z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-heart-column-link : url ( "data:image/svg+xml, %0A%3Csvg viewBox='0 0 24 24' color='inherit' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='%231f1b23' d='M16.5 3C19.538 3 22 5.5 22 9c0 7-7.5 11-10 12.5C9.5 20 2 16 2 9c0-3.5 2.5-6 5.5-6C9.36 3 11 4 12 5c1-1 2.64-2 4.5-2zm-3.566 15.604a26.953 26.953 0 0 0 2.42-1.701C18.335 14.533 20 11.943 20 9c0-2.36-1.537-4-3.5-4c-1.076 0-2.24.57-3.086 1.414L12 7.828l-1.414-1.414C9.74 5.57 8.576 5 7.5 5C5.56 5 4 6.656 4 9c0 2.944 1.666 5.533 4.645 7.903c.745.592 1.54 1.145 2.421 1.7c.299.189.595.37.934.572c.339-.202.635-.383.934-.571z'/%3E%3C/svg%3E" ) ;
--icon-heart-column-link-active : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' aria-hidden='true' fill='%231f1b23'%3E%3Cg%3E%3Cpath d='M20.884 13.19c-1.351 2.48-4.001 5.12-8.379 7.67l-.503.3-.504-.3c-4.379-2.55-7.029-5.19-8.382-7.67-1.36-2.5-1.41-4.86-.514-6.67.887-1.79 2.647-2.91 4.601-3.01 1.651-.09 3.368.56 4.798 2.01 1.429-1.45 3.146-2.1 4.796-2.01 1.954.1 3.714 1.22 4.601 3.01.896 1.81.846 4.17-.514 6.67z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-04-05 19:28:39 +03:00
--icon-star-column-link : url ( 'data:image/svg+xml, %3Csvg width="24" height="24" stroke-width="2" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="%231f1b23"%3E%3Cpath d="M8.587 8.236l2.598-5.232a.911.911 0 011.63 0l2.598 5.232 5.808.844a.902.902 0 01.503 1.542l-4.202 4.07.992 5.75c.127.738-.653 1.3-1.32.952L12 18.678l-5.195 2.716c-.666.349-1.446-.214-1.319-.953l.992-5.75-4.202-4.07a.902.902 0 01.503-1.54l5.808-.845z" stroke="%231f1b23" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-star-column-link-active : url ( 'data:image/svg+xml, %3Csvg width="24" height="24" stroke-width="2" viewBox="0 0 24 24" fill="%231f1b23" xmlns="http://www.w3.org/2000/svg" color="%231f1b23"%3E%3Cpath d="M8.587 8.236l2.598-5.232a.911.911 0 011.63 0l2.598 5.232 5.808.844a.902.902 0 01.503 1.542l-4.202 4.07.992 5.75c.127.738-.653 1.3-1.32.952L12 18.678l-5.195 2.716c-.666.349-1.446-.214-1.319-.953l.992-5.75-4.202-4.07a.902.902 0 01.503-1.54l5.808-.845z" stroke="%231f1b23" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
2023-03-25 18:09:27 +02:00
--icon-direct-messages : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%231f1b23" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-mail"%3E%3Cpath d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"%3E%3C/path%3E%3Cpolyline points="22, 6 12, 13 2, 6"%3E%3C/polyline%3E%3C/svg%3E' ) ;
2023-03-27 19:47:22 +03:00
--icon-direct-messages-active : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="%231f1b23" stroke="%23ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-mail"%3E%3Cpath d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"%3E%3C/path%3E%3Cpolyline points="22, 6 12, 13 2, 6"%3E%3C/polyline%3E%3C/svg%3E' ) ;
2023-03-25 18:09:27 +02:00
--icon-users-column-link : url ( 'data:image/svg+xml, %3Csvg width="24px" height="24px" stroke-width="2" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="%23000000"%3E%3Cpath d="M1 20v-1a7 7 0 017-7v0a7 7 0 017 7v1" stroke="%231f1b23" stroke-width="2" stroke-linecap="round"%3E%3C/path%3E%3Cpath d="M13 14v0a5 5 0 015-5v0a5 5 0 015 5v.5" stroke="%231f1b23" stroke-width="1.5" stroke-linecap="round"%3E%3C/path%3E%3Cpath d="M8 12a4 4 0 100-8 4 4 0 000 8zM18 9a3 3 0 100-6 3 3 0 000 6z" stroke="%231f1b23" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-users-column-link-active : url ( 'data:image/svg+xml, %3Csvg width="24px" height="24px" stroke-width="2.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="%23000000"%3E%3Cpath d="M1 20v-1a7 7 0 017-7v0a7 7 0 017 7v1" stroke="%231f1b23" stroke-width="2" stroke-linecap="round"%3E%3C/path%3E%3Cpath d="M13 14v0a5 5 0 015-5v0a5 5 0 015 5v.5" stroke="%231f1b23" stroke-width="2.5" stroke-linecap="round"%3E%3C/path%3E%3Cpath d="M8 12a4 4 0 100-8 4 4 0 000 8zM18 9a3 3 0 100-6 3 3 0 000 6z" stroke="%231f1b23" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-bookmark-status-hover : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23595aff' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
2023-09-23 18:53:06 +03:00
--icon-bookmark : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%239388a6" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bookmark"%3E%3Cpath d="M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z"%3E%3C/path%3E%3C/svg%3E' ) ;
2023-03-25 18:09:27 +02:00
--icon-bookmark-active : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23F91880' viewBox='0 0 24 24' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E" ) ;
--icon-bell : url ( 'data:image/svg+xml, %3Csvg width="24px" height="24px" stroke-width="2" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="%231f1b23"%3E%3Cpath d="M18 8.4c0-1.697-.632-3.325-1.757-4.525C15.117 2.675 13.59 2 12 2c-1.591 0-3.117.674-4.243 1.875C6.632 5.075 6 6.703 6 8.4 6 15.867 3 18 3 18h18s-3-2.133-3-9.6zM13.73 21a1.999 1.999 0 01-3.46 0" stroke="%231f1b23" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-bell-active : url ( 'data:image/svg+xml, %3Csvg width="24px" height="24px" stroke-width="2" viewBox="0 0 24 24" fill="%231f1b23" xmlns="http://www.w3.org/2000/svg" color="%231f1b23"%3E%3Cpath d="M18 8.4c0-1.697-.632-3.325-1.757-4.525C15.117 2.675 13.59 2 12 2c-1.591 0-3.117.674-4.243 1.875C6.632 5.075 6 6.703 6 8.4 6 15.867 3 18 3 18h18s-3-2.133-3-9.6zM13.73 21a1.999 1.999 0 01-3.46 0" stroke="%231f1b23" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-bell-header-tabs : url ( 'data:image/svg+xml, %3Csvg width="18px" height="18px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="%231f1b23"%3E%3Cpath d="M18 8.4c0-1.697-.632-3.325-1.757-4.525C15.117 2.675 13.59 2 12 2c-1.591 0-3.117.674-4.243 1.875C6.632 5.075 6 6.703 6 8.4 6 15.867 3 18 3 18h18s-3-2.133-3-9.6zM13.73 21a1.999 1.999 0 01-3.46 0" stroke="%231f1b23" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-bell-header-tabs-active : url ( 'data:image/svg+xml, %3Csvg width="18px" height="18px" stroke-width="1.5" viewBox="0 0 24 24" fill="%231f1b23" xmlns="http://www.w3.org/2000/svg" color="%231f1b23"%3E%3Cpath d="M18 8.4c0-1.697-.632-3.325-1.757-4.525C15.117 2.675 13.59 2 12 2c-1.591 0-3.117.674-4.243 1.875C6.632 5.075 6 6.703 6 8.4 6 15.867 3 18 3 18h18s-3-2.133-3-9.6zM13.73 21a1.999 1.999 0 01-3.46 0" stroke="%231f1b23" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-home-notification : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"%3E%3Ctitle%3EHome%3C/title%3E%3Cpath d="M80 212v236a16 16 0 0016 16h96V328a24 24 0 0124-24h80a24 24 0 0124 24v136h96a16 16 0 0016-16V212" fill="none" stroke="%23717c9b" stroke-linecap="round" stroke-linejoin="round" stroke-width="38"/%3E%3Cpath d="M480 256L266.89 52c-5-5.28-16.69-5.34-21.78 0L32 256M400 179V64h-48v69" fill="none" stroke="%23717c9b" stroke-linecap="round" stroke-linejoin="round" stroke-width="38"/%3E%3C/svg%3E' ) ;
--icon-home-notification-active : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" class="ionicon" fill="%231f1b23" viewBox="0 0 512 512"%3E%3Ctitle%3EHome%3C/title%3E%3Cpath d="M261.56 101.28a8 8 0 00-11.06 0L66.4 277.15a8 8 0 00-2.47 5.79L63.9 448a32 32 0 0032 32H192a16 16 0 0016-16V328a8 8 0 018-8h80a8 8 0 018 8v136a16 16 0 0016 16h96.06a32 32 0 0032-32V282.94a8 8 0 00-2.47-5.79z"/%3E%3Cpath d="M490.91 244.15l-74.8-71.56V64a16 16 0 00-16-16h-48a16 16 0 00-16 16v32l-57.92-55.38C272.77 35.14 264.71 32 256 32c-8.68 0-16.72 3.14-22.14 8.63l-212.7 203.5c-6.22 6-7 15.87-1.34 22.37A16 16 0 0043 267.56L250.5 69.28a8 8 0 0111.06 0l207.52 198.28a16 16 0 0022.59-.44c6.14-6.36 5.63-16.86-.76-22.97z"/%3E%3C/svg%3E' ) ;
--icon-home : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" class="ionicon" width="24" height="24" viewBox="0 0 512 512"%3E%3Ctitle%3EHome%3C/title%3E%3Cpath d="M80 212v236a16 16 0 0016 16h96V328a24 24 0 0124-24h80a24 24 0 0124 24v136h96a16 16 0 0016-16V212" fill="none" stroke="%231f1b23" stroke-linecap="round" stroke-linejoin="round" stroke-width="38"/%3E%3Cpath d="M480 256L266.89 52c-5-5.28-16.69-5.34-21.78 0L32 256M400 179V64h-48v69" fill="none" stroke="%231f1b23" stroke-linecap="round" stroke-linejoin="round" stroke-width="38"/%3E%3C/svg%3E' ) ;
2023-10-29 21:38:50 +02:00
--icon-more : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%231f1b23' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-more-horizontal'%3E%3Ccircle cx='12' cy='12' r='1'%3E%3C/circle%3E%3Ccircle cx='19' cy='12' r='1'%3E%3C/circle%3E%3Ccircle cx='5' cy='12' r='1'%3E%3C/circle%3E%3C/svg%3E" ) ;
--icon-more-status-action-bar : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%239388a6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-more-horizontal'%3E%3Ccircle cx='12' cy='12' r='1'%3E%3C/circle%3E%3Ccircle cx='19' cy='12' r='1'%3E%3C/circle%3E%3Ccircle cx='5' cy='12' r='1'%3E%3C/circle%3E%3C/svg%3E" ) ;
2023-10-29 21:09:09 +02:00
--icon-close : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%231f1b23' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-x'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E" ) ;
--icon-close-action-bar : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%239388a6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-x'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E" ) ;
2023-11-03 14:33:20 +02:00
--icon-plus : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%239388a6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-plus'%3E%3Cline x1='12' y1='5' x2='12' y2='19'%3E%3C/line%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E" ) ;
2023-10-29 17:00:18 +02:00
--icon-cog : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' class='ionicon' width='26' height='26' viewBox='0 0 512 512' fill='%231f1b23'%3E%3Cpath d='M456.7 242.27l-26.08-4.2a8 8 0 01-6.6-6.82c-.5-3.2-1-6.41-1.7-9.51a8.08 8.08 0 013.9-8.62l23.09-12.82a8.05 8.05 0 003.9-9.92l-4-11a7.94 7.94 0 00-9.4-5l-25.89 5a8 8 0 01-8.59-4.11q-2.25-4.2-4.8-8.41a8.16 8.16 0 01.7-9.52l17.29-19.94a8 8 0 00.3-10.62l-7.49-9a7.88 7.88 0 00-10.5-1.51l-22.69 13.63a8 8 0 01-9.39-.9c-2.4-2.11-4.9-4.21-7.4-6.22a8 8 0 01-2.5-9.11l9.4-24.75A8 8 0 00365 78.77l-10.2-5.91a8 8 0 00-10.39 2.21l-16.64 20.84a7.15 7.15 0 01-8.5 2.5s-5.6-2.3-9.8-3.71A8 8 0 01304 87l.4-26.45a8.07 8.07 0 00-6.6-8.42l-11.59-2a8.07 8.07 0 00-9.1 5.61l-8.6 25.05a8 8 0 01-7.79 5.41h-9.8a8.07 8.07 0 01-7.79-5.41l-8.6-25.05a8.07 8.07 0 00-9.1-5.61l-11.59 2a8.07 8.07 0 00-6.6 8.42l.4 26.45a8 8 0 01-5.49 7.71c-2.3.9-7.3 2.81-9.7 3.71-2.8 1-6.1.2-8.8-2.91l-16.51-20.34A8 8 0 00156.75 73l-10.2 5.91a7.94 7.94 0 00-3.3 10.09l9.4 24.75a8.06 8.06 0 01-2.5 9.11c-2.5 2-5 4.11-7.4 6.22a8 8 0 01-9.39.9L111 116.14a8 8 0 00-10.5 1.51l-7.49 9a8 8 0 00.3 10.62l17.29 19.94a8 8 0 01.7 9.52q-2.55 4-4.8 8.41a8.11 8.11 0 01-8.59 4.11l-25.89-5a8 8 0 00-9.4 5l-4 11a8.05 8.05 0 003.9 9.92L85.58 213a7.94 7.94 0 013.9 8.62c-.6 3.2-1.2 6.31-1.7 9.51a8.08 8.08 0 01-6.6 6.82l-26.08 4.2a8.09 8.09 0 00-7.1 7.92v11.72a7.86 7.86 0 007.1 7.92l26.08 4.2a8 8 0 016.6 6.82c.5 3.2 1 6.41 1.7 9.51a8.08 8.08 0 01-3.9 8.62L62.49 311.7a8.05 8.05 0 00-3.9 9.92l4 11a7.94 7.94 0 009.4 5l25.89-5a8 8 0 018.59 4.11q2.25 4.2 4.8 8.41a8.16 8.16 0 01-.7 9.52l-17.29 19.96a8 8 0 00-.3 10.62l7.49 9a7.88 7.88 0 0010.5 1.51l22.69-13.63a8 8 0 019.39.9c2.4 2.11 4.9 4.21 7.4 6.22a8 8 0 012.5 9.11l-9.4 24.75a8 8 0 003.3 10.12l10.2 5.91a8 8 0 0010.39-2.21l16.79-20.64c2.1-2.6 5.5-3.7 8.2-2.6 3.4 1.4 5.7 2.2 9.9 3.61a8 8 0 015.49 7.71l-.4 26.45a8.07 8.07 0 006.6 8.42l11.59 2a8.07 8.07 0 009.1-5.61l8.6-25a8 8 0 017.79-5.41h9.8a8.07 8.07 0 017.79 5.41l8.6 25a8.07 8.07 0 009.1 5.61l11.59-2a8.07 8.07 0 006.6-8.42l-.4-26.45a8 8 0 015.49-7.71c4.2-1.41 7-2.51 9.6-3.51s5.8-1 8.3 2.1l17 20.94A8 8 0 00355 439l10.2-5.91a7.93 7.93 0 003.3-10.12l-9.4-24.75a8.08 8.08 0 012.5-9.12c2.5-2 5-4.1 7.4-6.21a8 8 0 019.39-.9L401 395.66a8 8 0 0010.5-1.51l7.49-9a8 8 0 00-.3-10.62l-17.29-19.94a8 8 0 01-.7-9.52q2.55-4.05 4.8-8.41a8.11 8.11 0 018.59-4.11l25.89 5a8 8 0 009.4-5l4-11a8.05 8.05 0 00-3.9-9.92l-23.09-12.82a7.94 7.94 0 01-3.9-8.62c.6-3.2 1.2-6.31 1.7-9.51a8.08 8.08 0 016.6-6.82l26.08-4.2a8.09 8.09 0 007.1-7.92V250a8.25 8.25 0 00-7.27-7.73zM256 112a143.82 143.82 0 01139.38 108.12A16 16 0 01379.85 240H274.61a16 16 0 01-13.91-8.09l-52.1-91.71a16 16 0 019.85-23.39A146.94 146.94 0 01256 112zM112 256a144 144 0 0143.65-103.41 16 16 0 0125.17 3.47L233.06 248a16 16 0 010 15.87l-52.67 91.7a16 16 0 01-25.18 3.36A143.94 143.94 0 01112 256zm144 144a146.9 146.9 0 01-38.19-4.95 16 16 0 01-9.76-23.44l52.58-91.55a16 16 0 0113.88-8H379.9a16 16 0 0115.52 19.88A143.84 143.84 0 01256 400z'/%3E%3C/svg%3E" ) ;
2024-03-24 11:44:49 +02:00
--icon-sliders-contrast : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%231f1b23' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-sliders'%3E%3Cline x1='4' y1='21' x2='4' y2='14'%3E%3C/line%3E%3Cline x1='4' y1='10' x2='4' y2='3'%3E%3C/line%3E%3Cline x1='12' y1='21' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='8' x2='12' y2='3'%3E%3C/line%3E%3Cline x1='20' y1='21' x2='20' y2='16'%3E%3C/line%3E%3Cline x1='20' y1='12' x2='20' y2='3'%3E%3C/line%3E%3Cline x1='1' y1='14' x2='7' y2='14'%3E%3C/line%3E%3Cline x1='9' y1='8' x2='15' y2='8'%3E%3C/line%3E%3Cline x1='17' y1='16' x2='23' y2='16'%3E%3C/line%3E%3C/svg%3E" ) ;
2024-03-23 15:14:40 +02:00
--icon-sliders : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23b8b3c0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-sliders'%3E%3Cline x1='4' y1='21' x2='4' y2='14'%3E%3C/line%3E%3Cline x1='4' y1='10' x2='4' y2='3'%3E%3C/line%3E%3Cline x1='12' y1='21' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='8' x2='12' y2='3'%3E%3C/line%3E%3Cline x1='20' y1='21' x2='20' y2='16'%3E%3C/line%3E%3Cline x1='20' y1='12' x2='20' y2='3'%3E%3C/line%3E%3Cline x1='1' y1='14' x2='7' y2='14'%3E%3C/line%3E%3Cline x1='9' y1='8' x2='15' y2='8'%3E%3C/line%3E%3Cline x1='17' y1='16' x2='23' y2='16'%3E%3C/line%3E%3C/svg%3E" ) ;
2023-09-24 02:46:54 +03:00
--icon-globe : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0.00 0.00 512.00 512.00'%3E%3Cpath fill='%231f1b23' d=' M 512.00 383.82 L 512.00 385.55 C 509.71 419.39 473.05 422.09 447.81 418.87 Q 423.66 415.79 400.31 408.70 Q 358.58 396.03 318.76 378.21 Q 218.90 333.52 129.46 270.53 C 92.32 244.38 56.82 216.22 27.43 182.58 C 14.63 167.94 1.88 149.41 0.00 128.96 L 0.00 125.94 C 3.19 91.33 40.56 90.05 66.57 93.40 Q 81.64 95.34 88.25 97.23 C 99.02 100.32 103.61 112.14 97.29 121.55 C 92.20 129.11 85.23 129.19 76.43 127.41 C 64.10 124.92 44.84 121.70 32.89 126.36 A 1.55 1.54 74.3 0 0 31.93 128.08 C 34.07 139.90 43.53 152.31 51.28 161.22 Q 68.49 181.02 88.94 198.55 Q 89.49 199.02 89.73 198.34 Q 110.62 140.43 161.78 107.51 C 234.44 60.76 331.69 75.26 388.09 139.91 C 446.04 206.35 446.71 303.97 388.97 370.93 Q 388.58 371.38 389.14 371.58 Q 413.92 380.31 439.48 385.26 C 451.88 387.65 467.05 389.92 479.11 385.65 A 1.51 1.50 -14.2 0 0 480.10 384.00 C 477.90 369.69 463.57 354.46 454.60 343.62 C 440.99 327.16 463.05 306.29 479.15 323.40 C 495.03 340.29 510.01 360.98 512.00 383.82 Z M 115.39 210.46 Q 136.86 228.57 159.38 244.15 C 223.66 288.63 294.05 327.49 367.32 354.98 A 1.46 1.44 30.8 0 0 368.93 354.58 Q 400.10 318.66 405.76 270.75 Q 407.08 259.64 406.38 249.56 C 401.05 172.60 342.31 113.52 265.72 106.81 Q 255.74 105.94 245.77 106.92 C 185.42 112.87 134.96 151.32 114.89 208.65 Q 114.52 209.72 115.39 210.46 Z M 295.33 328.94 A 0.34 0.34 0.0 0 0 295.16 329.58 L 299.51 331.72 A 0.34 0.34 0.0 0 0 300.00 331.41 L 300.00 329.51 A 0.34 0.34 0.0 0 0 299.68 329.17 L 295.33 328.94 Z'%0A/%3E%3Cpath fill='%231f1b23' d=' M 307.69 408.30 C 316.86 412.38 316.05 421.82 306.19 424.66 C 209.45 452.48 109.79 396.22 85.13 298.09 Q 83.95 293.40 84.37 291.18 C 85.73 284.03 93.55 284.22 98.50 287.80 Q 197.11 359.12 307.69 408.30 Z M 263.31 410.94 Q 262.74 410.51 262.12 410.23 Q 199.27 381.56 142.55 342.19 Q 129.49 333.13 117.25 323.09 A 0.18 0.18 0.0 0 0 116.97 323.31 C 142.74 377.01 195.57 410.10 255.44 411.80 Q 261.32 411.97 263.93 411.40 Q 264.37 411.30 264.00 411.06 Q 263.69 410.85 263.31 410.94 Z'%0A/%3E%3C/svg%3E" ) ;
2023-09-23 13:21:08 -04:00
--icon-globe-active : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" class="ionicon" fill="%231f1b23" viewBox="0 0 512 512"%3E%3Cpath d="M96.85 286.62a8 8 0 00-12.53 8.25C102.07 373.28 172.3 432 256 432a175.31 175.31 0 0052.41-8 8 8 0 00.79-15 1120 1120 0 01-109.48-55.61 1126.24 1126.24 0 01-102.87-66.77zM492.72 339.51c-4.19-5.58-9.11-11.44-14.7-17.53a15.83 15.83 0 00-26.56 5.13c0 .16-.11.31-.17.47a15.75 15.75 0 003.15 16.06c22.74 25 26.42 38.51 25.48 41.36-2 2.23-17.05 6.89-58.15-3.53q-8.83-2.24-19.32-5.46-6.76-2.08-13.79-4.49a176.76 176.76 0 0019.54-27.25c.17-.29.35-.58.52-.88A175.39 175.39 0 00432 256a178.87 178.87 0 00-1-19c-9.57-88.17-84.4-157-175-157a175.37 175.37 0 00-106.4 35.89 177.4 177.4 0 00-45.83 51.84c-.16.29-.34.58-.51.87a175.48 175.48 0 00-13.83 30.52q-5.59-4.87-10.79-9.67c-5.39-5-10.17-9.63-14.42-14-29.57-30.26-33.09-45.61-32.16-48.45 2-2.23 15.54-5.87 48.62 1.31A15.82 15.82 0 0096.22 123l.36-.44a15.74 15.74 0 00-8.67-25.43A237.38 237.38 0 0064.13 93c-30.72-3.53-50.83 2.52-59.78 18-3.24 5.58-6.35 15.09-2.72 28.6C7 159.66 26.14 184 53.23 209.5c8.63 8.13 18.06 16.37 28.12 24.64 7.32 6 15 12.06 22.9 18.08q7.91 6 16.15 12T137.1 276c25.41 17.61 52.26 34.52 78.59 49.69q14.34 8.26 28.64 16t28.37 14.81c21.9 11 43.35 20.92 63.86 29.43q13.19 5.48 25.81 10.16c11.89 4.42 23.37 8.31 34.31 11.59l1.1.33c25.73 7.66 47.42 11.69 64.48 12H464c21.64 0 36.3-6.38 43.58-19 9.09-15.62 4.08-36.32-14.86-61.5z"/%3E%3C/svg%3E' ) ;
2023-03-25 18:09:27 +02:00
--icon-home-column-link-active : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" class="ionicon" fill="%231f1b23" width="24" height="24" viewBox="0 0 512 512"%3E%3Ctitle%3EHome%3C/title%3E%3Cpath d="M261.56 101.28a8 8 0 00-11.06 0L66.4 277.15a8 8 0 00-2.47 5.79L63.9 448a32 32 0 0032 32H192a16 16 0 0016-16V328a8 8 0 018-8h80a8 8 0 018 8v136a16 16 0 0016 16h96.06a32 32 0 0032-32V282.94a8 8 0 00-2.47-5.79z"/%3E%3Cpath d="M490.91 244.15l-74.8-71.56V64a16 16 0 00-16-16h-48a16 16 0 00-16 16v32l-57.92-55.38C272.77 35.14 264.71 32 256 32c-8.68 0-16.72 3.14-22.14 8.63l-212.7 203.5c-6.22 6-7 15.87-1.34 22.37A16 16 0 0043 267.56L250.5 69.28a8 8 0 0111.06 0l207.52 198.28a16 16 0 0022.59-.44c6.14-6.36 5.63-16.86-.76-22.97z"/%3E%3C/svg%3E' ) ;
--icon-hashtag : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%231f1b23" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-hash"%3E%3Cline x1="4" y1="9" x2="20" y2="9"%3E%3C/line%3E%3Cline x1="4" y1="15" x2="20" y2="15"%3E%3C/line%3E%3Cline x1="10" y1="3" x2="8" y2="21"%3E%3C/line%3E%3Cline x1="16" y1="3" x2="14" y2="21"%3E%3C/line%3E%3C/svg%3E' ) ;
--icon-hashtag-active : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%231f1b23" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" class="feather feather-hash"%3E%3Cline x1="4" y1="9" x2="20" y2="9"%3E%3C/line%3E%3Cline x1="4" y1="15" x2="20" y2="15"%3E%3C/line%3E%3Cline x1="10" y1="3" x2="8" y2="21"%3E%3C/line%3E%3Cline x1="16" y1="3" x2="14" y2="21"%3E%3C/line%3E%3C/svg%3E' ) ;
2023-07-03 23:06:42 +03:00
--icon-search : url ( "data:image/svg+xml;charset=utf-8, %3Csvg xmlns='http://www.w3.org/2000/svg' fill='%239FA4BB' aria-hidden='true' viewBox='0 0 24 24'%3E%3Cpath d='M10.25 3.75a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13zm-8.5 6.5a8.5 8.5 0 1 1 15.176 5.262l4.781 4.781-1.414 1.414-4.781-4.781A8.5 8.5 0 0 1 1.75 10.25z'/%3E%3C/svg%3E" ) ;
2023-10-29 21:09:09 +02:00
/* Profile icons */
--icon-github : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%239FA4BB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-github"%3E%3Cpath d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-youtube : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%239FA4BB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-youtube"%3E%3Cpath d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.46a2.78 2.78 0 0 0-1.94 2A29 29 0 0 0 1 11.75a29 29 0 0 0 .46 5.33A2.78 2.78 0 0 0 3.4 19c1.72.46 8.6.46 8.6.46s6.88 0 8.6-.46a2.78 2.78 0 0 0 1.94-2 29 29 0 0 0 .46-5.25 29 29 0 0 0-.46-5.33z"%3E%3C/path%3E%3Cpolygon points="9.75 15.02 15.5 11.75 9.75 8.48 9.75 15.02"%3E%3C/polygon%3E%3C/svg%3E' ) ;
--icon-link : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="%239FA4BB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-link-2"%3E%3Cpath d="M15 7h3a5 5 0 0 1 5 5 5 5 0 0 1-5 5h-3m-6 0H6a5 5 0 0 1-5-5 5 5 0 0 1 5-5h3"%3E%3C/path%3E%3Cline x1="8" y1="12" x2="16" y2="12"%3E%3C/line%3E%3C/svg%3E' ) ;
--icon-twitter : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 512 512"%3E%3Cpath fill="%239FA4BB" d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"/%3E%3C/svg%3E' ) ;
--icon-twitch : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%239FA4BB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-twitch"%3E%3Cpath d="M21 2H3v16h5v4l4-4h5l4-4V2zm-10 9V7m5 4V7"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-patreon : url ( "data:image/svg+xml, %0A%3Csvg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%239FA4BB'%3E%3Ctitle%3EPatreon icon%3C/title%3E%3Cpath d='M15.386.524c-4.764 0-8.64 3.876-8.64 8.64 0 4.75 3.876 8.613 8.64 8.613 4.75 0 8.614-3.864 8.614-8.613C24 4.4 20.136.524 15.386.524M.003 23.537h4.22V.524H.003'/%3E%3C/svg%3E" ) ;
2023-11-12 16:58:59 +02:00
--icon-threads : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='18' fill='%239FA4BB' width='18' viewBox='0 0 448 512'%3E%3Cpath d='M331.5 235.7c2.2 .9 4.2 1.9 6.3 2.8c29.2 14.1 50.6 35.2 61.8 61.4c15.7 36.5 17.2 95.8-30.3 143.2c-36.2 36.2-80.3 52.5-142.6 53h-.3c-70.2-.5-124.1-24.1-160.4-70.2c-32.3-41-48.9-98.1-49.5-169.6V256v-.2C17 184.3 33.6 127.2 65.9 86.2C102.2 40.1 156.2 16.5 226.4 16h.3c70.3 .5 124.9 24 162.3 69.9c18.4 22.7 32 50 40.6 81.7l-40.4 10.8c-7.1-25.8-17.8-47.8-32.2-65.4c-29.2-35.8-73-54.2-130.5-54.6c-57 .5-100.1 18.8-128.2 54.4C72.1 146.1 58.5 194.3 58 256c.5 61.7 14.1 109.9 40.3 143.3c28 35.6 71.2 53.9 128.2 54.4c51.4-.4 85.4-12.6 113.7-40.9c32.3-32.2 31.7-71.8 21.4-95.9c-6.1-14.2-17.1-26-31.9-34.9c-3.7 26.9-11.8 48.3-24.7 64.8c-17.1 21.8-41.4 33.6-72.7 35.3c-23.6 1.3-46.3-4.4-63.9-16c-20.8-13.8-33-34.8-34.3-59.3c-2.5-48.3 35.7-83 95.2-86.4c21.1-1.2 40.9-.3 59.2 2.8c-2.4-14.8-7.3-26.6-14.6-35.2c-10-11.7-25.6-17.7-46.2-17.8H227c-16.6 0-39 4.6-53.3 26.3l-34.4-23.6c19.2-29.1 50.3-45.1 87.8-45.1h.8c62.6 .4 99.9 39.5 103.7 107.7l-.2 .2zm-156 68.8c1.3 25.1 28.4 36.8 54.6 35.3c25.6-1.4 54.6-11.4 59.5-73.2c-13.2-2.9-27.8-4.4-43.4-4.4c-4.8 0-9.6 .1-14.4 .4c-42.9 2.4-57.2 23.2-56.2 41.8l-.1 .1z'/%3E%3C/svg%3E" ) ;
2024-02-09 20:41:36 +02:00
--icon-bluesky : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8.467 8.467' width='18' height='18'%3E%3Cpath fill='%239FA4BB' d='M67.256 111.972c-.545-.648-.629-.916-.411-1.323.15-.28.477-.52.727-.531.289-.013.204-.113-.236-.274-.862-.316-1.295-1.239-1.295-2.76 0-1.071.058-1.179.643-1.179.65 0 2.043 1.149 2.88 2.374l.446.655.446-.655c.837-1.225 2.23-2.373 2.88-2.373.584 0 .642.107.642 1.178 0 1.528-.435 2.45-1.295 2.74-.686.23-.686.233-.094.424.787.253.78 1.214-.017 1.961-.893.84-1.748.751-2.114-.218-.165-.437-.364-.794-.442-.794-.078 0-.3.357-.493.794-.47 1.06-1.365 1.053-2.267-.02z' transform='translate(-65.776 -105.112)'/%3E%3C/svg%3E" ) ;
2023-11-12 16:58:59 +02:00
--icon-nostr : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 860 847'%3E%3Cpath d='M454.5 1.1c-67.6 10.3-115.8 27.2-160.4 56.4-16.5 10.9-19.3 12-29.1 12-9.5 0-14.6-2-20.8-7.9-5.5-5.1-7.5-9.9-9.2-22-1.9-13.1-6.8-20.4-17.3-25.7l-5.8-3-92.2.3c-68.2.3-93.1.7-95.6 1.6-4.5 1.5-11.4 8.3-15.2 14.8L6 32.8l.2 391.8.3 391.9 2.7 5c1.4 2.8 4.6 6.9 7.1 9.2 8.7 8 .9 7.3 96 8 88.7.6 108.3 0 116.7-3.3 5.9-2.4 13.5-11.7 14.9-18.4 1.4-6.4 1.4-67.7.1-103.3-3-78.6-15.8-158-48.1-297.2-21.2-91.3-27.3-126.1-28.6-162.6-1.5-43.2 7-69.1 28.8-87.6 6.9-5.8 19.7-12.8 29.7-16.2 14.8-5 57.5-12 96.2-15.7 21-2.1 84.2-2.4 104.4-.6 25.3 2.3 54.4 8.4 76 15.9 36.2 12.5 62.9 33.9 75.5 60.4 5.2 10.8 7.6 20.5 9.6 38.2 1.9 16.7 3.6 24 7.4 32.2 7.1 15.3 26.3 28.9 50.7 36 20.1 5.9 42 8.1 86.4 9 33.3.7 41.1 1.5 47.9 5 7.7 3.9 15.4 11.6 18.7 18.7 2.8 6 2.9 6.9 2.9 20.8 0 13.3-.2 14.9-2.4 19.5-1.4 2.8-5.6 8.1-9.5 12-10.8 10.7-28 18.8-48.8 23-13.6 2.7-38.7 3.5-110.3 3.5-73.4 0-79.9.3-96.7 4.5-33.7 8.5-56.9 25.7-70.1 52.1-15.4 30.7-26.8 91.8-31.7 170.4-2.9 46.1-3 159.5-.1 166.5 1.9 4.7 11.1 13.4 15.3 14.5 8.4 2.3 51.4 3 196.8 3 155 0 184.6-.6 191.7-3.5 5.5-2.3 12.1-9.2 13.4-13.9.6-2.1 1.5-10.5 2-18.5 1.9-32.6.2-482.7-2-504.1-4.6-44.3-20-97.2-39.7-136.1-14.5-28.7-30.3-50.8-51.9-72.5-27-27.1-54.5-45.9-89.8-61.4-31.8-13.9-71.3-24.3-104.5-27.5-16.8-1.7-98.5-1.9-108.7-.4z' fill='%239FA4BB'/%3E%3Cpath d='M448 211.5c-21.4 5.9-38.1 21.3-45.8 42.7-2.4 6.5-2.7 8.7-2.6 19.8 0 11.3.3 13.3 3 21 3.9 11 8.7 18.2 18.1 27 11.2 10.4 22.4 15.1 39.8 16.5 27.9 2.3 56.6-18.3 64.9-46.5 8.1-27.5-5.4-60.4-30.1-73.3-12.3-6.4-17.5-7.8-30.3-8.3-8.2-.3-13.1 0-17 1.1z' fill='%239FA4BB'/%3E%3C/svg%3E" ) ;
2023-10-29 21:09:09 +02:00
--icon-paypal : url ( "data:image/svg+xml, %0A%3Csvg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%239FA4BB'%3E%3Ctitle%3EPayPal icon%3C/title%3E%3Cpath d='M6.908 24H3.804c-.664 0-1.086-.529-.936-1.18l.149-.674h2.071c.666 0 1.336-.533 1.482-1.182l1.064-4.592c.15-.648.816-1.18 1.48-1.18h.883c3.789 0 6.734-.779 8.84-2.34s3.16-3.6 3.16-6.135c0-1.125-.195-2.055-.588-2.789 0-.016-.016-.031-.016-.046l.135.075c.75.465 1.32 1.064 1.711 1.814.404.75.598 1.68.598 2.791 0 2.535-1.049 4.574-3.164 6.135-2.1 1.545-5.055 2.324-8.834 2.324h-.9c-.66 0-1.334.525-1.484 1.186L8.39 22.812c-.149.645-.81 1.17-1.47 1.17L6.908 24zm-2.677-2.695H1.126c-.663 0-1.084-.529-.936-1.18L4.563 1.182C4.714.529 5.378 0 6.044 0h6.465c1.395 0 2.609.098 3.648.289 1.035.189 1.92.519 2.684.99.736.465 1.322 1.072 1.697 1.818.389.748.584 1.68.584 2.797 0 2.535-1.051 4.574-3.164 6.119-2.1 1.561-5.056 2.326-8.836 2.326h-.883c-.66 0-1.328.524-1.478 1.169L5.7 20.097c-.149.646-.817 1.172-1.485 1.172l.016.036zm7.446-17.369h-1.014c-.666 0-1.332.529-1.48 1.178l-.93 4.02c-.15.648.27 1.179.93 1.179h.766c1.664 0 2.97-.343 3.9-1.021.929-.686 1.395-1.654 1.395-2.912 0-.83-.301-1.445-.9-1.84-.6-.404-1.5-.605-2.686-.605l.019.001z'/%3E%3C/svg%3E" ) ;
--icon-kofi : url ( "data:image/svg+xml, %3Csvg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%239FA4BB'%3E%3Ctitle%3EKo-fi icon%3C/title%3E%3Cpath d='M23.881 8.948c-.773-4.085-4.859-4.593-4.859-4.593H.723c-.604 0-.679.798-.679.798s-.082 7.324-.022 11.822c.164 2.424 2.586 2.672 2.586 2.672s8.267-.023 11.966-.049c2.438-.426 2.683-2.566 2.658-3.734 4.352.24 7.422-2.831 6.649-6.916zm-11.062 3.511c-1.246 1.453-4.011 3.976-4.011 3.976s-.121.119-.31.023c-.076-.057-.108-.09-.108-.09-.443-.441-3.368-3.049-4.034-3.954-.709-.965-1.041-2.7-.091-3.71.951-1.01 3.005-1.086 4.363.407 0 0 1.565-1.782 3.468-.963 1.904.82 1.832 3.011.723 4.311zm6.173.478c-.928.116-1.682.028-1.682.028V7.284h1.77s1.971.551 1.971 2.638c0 1.913-.985 2.667-2.059 3.015z'/%3E%3C/svg%3E" ) ;
2024-02-10 16:30:43 +02:00
--icon-bandcamp : url ( "data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='%239FA4BB' viewBox='0 0 512 512'%3E%3Cpath d='M105.6 191.2C98.1 204.8 33 325.2 33 325.6c0 .2 36.8.3 81.7.2l81.7-.3 37.5-69.4 37.6-69.4.3 70.2.2 70.2 10.3-.3 10.2-.3.3-6.8.3-6.7 3.2 4.2c2.2 2.9 5.6 5.5 10.1 7.8 6.8 3.5 7.1 3.5 19.5 3.5 12.3 0 12.8-.1 19.3-3.3 16.4-8 25.9-28.9 24.5-53.7-1.3-22.4-10.5-38.2-26.5-45.8-6.3-3-7.4-3.2-17.7-3.2-9.8 0-11.6.3-16.7 2.7-3.2 1.5-7.8 4.8-10.3 7.3l-4.5 4.7V185H109.1l-3.5 6.2zm226.1 51c5.3 2.4 8.7 6.5 12.7 14.8 2.9 6.1 3.1 7.2 3.1 18 0 12.9-1 17.1-5.7 24.9-4.7 7.6-11.5 11.4-20.6 11.4-15.3 0-24.4-9.6-27.4-28.6-2.1-13.4 1.5-28.2 8.5-35.5 7.6-7.9 19-9.9 29.4-5zM413.1 223.6c-21.1 5.7-34.1 26-34.1 53.1.1 22.8 9.6 39.9 26.8 48.1 6.5 3.1 8.6 3.6 17.4 4 15 .7 24.1-1.8 33.4-9.4 6.9-5.6 12.9-16.6 14.9-27.7l.7-3.7h-22l-.7 3.7c-1 5.5-3.9 10.6-8.1 14.2-4.8 4.3-7.7 5.3-14.9 5.3-16 .1-25.5-13.2-25.5-35.7 0-23.3 9.4-35.7 27-35.7 10.8 0 17.4 4.4 20.9 13.8l1.9 4.9 10.7.3 10.7.3-.7-4.7c-1.6-10.9-9.8-22.5-19.3-27.3-9.9-5-27.6-6.6-39.1-3.5z'/%3E%3C/svg%3E%0A" ) ;
--icon-facebook : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239FA4BB' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-facebook'%3E%3Cpath d='M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z'%3E%3C/path%3E%3C/svg%3E" ) ;
--icon-friendica : url ( "data:image/svg+xml, %3Csvg fill='%239FA4BB' width='18' height='18' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1523.8 1536'%3E%3Cpath d='M0 276.4v983.2C0 1412 122.8 1536 274.4 1536h975.1c151.6 0 274.4-124 274.4-276.4V276.4C1523.8 124 1401.1 0 1249.4 0h-975C122.8 0 0 124 0 276.4zM1249.4 61.2c118.5 0 213.2 95.3 213.2 215.2v983.2c0 119.9-94.7 215.2-213.2 215.2H518.1V1106h487.5l-1.3-367.7-486.3 2.6V430.1h487.5V61.2h243.9z'/%3E%3C/svg%3E%0A" ) ;
--icon-genderless-pronouns : url ( "data:image/svg+xml, %3Csvg fill='%239FA4BB' width='18' height='18' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.334 12v-.02a9.354 9.354 0 1 0-2.74 6.614 8.963 8.963 0 0 0 2.74-6.462l-.001-.139V12zM24 12v.036c0 1.67-.349 3.258-.977 4.695l.029-.075c-1.226 2.905-3.491 5.17-6.318 6.367l-.078.029C15.282 23.651 13.682 24 12 24s-3.283-.349-4.733-.978l.077.03c-2.905-1.226-5.17-3.491-6.367-6.318l-.029-.078C.349 15.282 0 13.682 0 12s.349-3.283.978-4.733l-.03.077C2.174 4.439 4.439 2.174 7.266.977l.078-.029C8.718.349 10.318 0 12 0s3.283.349 4.733.978l-.077-.03c2.905 1.226 5.17 3.491 6.367 6.318l.029.078c.599 1.362.948 2.95.948 4.62v.039-.002z'/%3E%3C/svg%3E%0A" ) ;
--icon-wordpress : url ( "data:image/svg+xml, %3Csvg width='18' height='18' fill='%239FA4BB' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M61.7 169.4l101.5 278C92.2 413 43.3 340.2 43.3 256c0-30.9 6.6-60.1 18.4-86.6zm337.9 75.9c0-26.3-9.4-44.5-17.5-58.7-10.8-17.5-20.9-32.4-20.9-49.9 0-19.6 14.8-37.8 35.7-37.8 .9 0 1.8 .1 2.8 .2-37.9-34.7-88.3-55.9-143.7-55.9-74.3 0-139.7 38.1-177.8 95.9 5 .2 9.7 .3 13.7 .3 22.2 0 56.7-2.7 56.7-2.7 11.5-.7 12.8 16.2 1.4 17.5 0 0-11.5 1.3-24.3 2l77.5 230.4L249.8 247l-33.1-90.8c-11.5-.7-22.3-2-22.3-2-11.5-.7-10.1-18.2 1.3-17.5 0 0 35.1 2.7 56 2.7 22.2 0 56.7-2.7 56.7-2.7 11.5-.7 12.8 16.2 1.4 17.5 0 0-11.5 1.3-24.3 2l76.9 228.7 21.2-70.9c9-29.4 16-50.5 16-68.7zm-139.9 29.3l-63.8 185.5c19.1 5.6 39.2 8.7 60.1 8.7 24.8 0 48.5-4.3 70.6-12.1-.6-.9-1.1-1.9-1.5-2.9l-65.4-179.2zm183-120.7c.9 6.8 1.4 14 1.4 21.9 0 21.6-4 45.8-16.2 76.2l-65 187.9C426.2 403 468.7 334.5 468.7 256c0-37-9.4-71.8-26-102.1zM504 256c0 136.8-111.3 248-248 248C119.2 504 8 392.7 8 256 8 119.2 119.2 8 256 8c136.7 0 248 111.2 248 248zm-11.4 0c0-130.5-106.2-236.6-236.6-236.6C125.5 19.4 19.4 125.5 19.4 256S125.6 492.6 256 492.6c130.5 0 236.6-106.1 236.6-236.6z'/%3E%3C/svg%3E" ) ;
2023-10-29 21:09:09 +02:00
--icon-mastodon : url ( "data:image/svg+xml, %0A%3Csvg role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%239FA4BB'%3E%3Ctitle%3EMastodon icon%3C/title%3E%3Cpath d='M23.193 7.879c0-5.206-3.411-6.732-3.411-6.732C18.062.357 15.108.025 12.041 0h-.076c-3.068.025-6.02.357-7.74 1.147 0 0-3.411 1.526-3.411 6.732 0 1.192-.023 2.618.015 4.129.124 5.092.934 10.109 5.641 11.355 2.17.574 4.034.695 5.535.612 2.722-.15 4.25-.972 4.25-.972l-.09-1.975s-1.945.613-4.129.539c-2.165-.074-4.449-.233-4.799-2.891a5.499 5.499 0 0 1-.048-.745s2.125.52 4.817.643c1.646.075 3.19-.097 4.758-.283 3.007-.359 5.625-2.212 5.954-3.905.517-2.665.475-6.507.475-6.507zm-4.024 6.709h-2.497V8.469c0-1.29-.543-1.944-1.628-1.944-1.2 0-1.802.776-1.802 2.312v3.349h-2.483v-3.35c0-1.536-.602-2.312-1.802-2.312-1.085 0-1.628.655-1.628 1.944v6.119H4.832V8.284c0-1.289.328-2.313.987-3.07.68-.758 1.569-1.146 2.674-1.146 1.278 0 2.246.491 2.886 1.474L12 6.585l.622-1.043c.64-.983 1.608-1.474 2.886-1.474 1.104 0 1.994.388 2.674 1.146.658.757.986 1.781.986 3.07v6.304z'/%3E%3C/svg%3E" ) ;
2023-11-12 16:58:59 +02:00
--icon-verified : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" width="22" height="22" %3E%3Cpath fill="%236364ff" d="M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z"%3E%3C/path%3E%3C/svg%3E' ) ;
--icon-verified-smaller : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" width="15" height="15" %3E%3Cpath fill="%236364ff" d="M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z"%3E%3C/path%3E%3C/svg%3E' ) ;
2023-10-29 21:09:09 +02:00
--icon-label : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%239FA4BB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-tag"%3E%3Cpath d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"%3E%3C/path%3E%3Cline x1="7" y1="7" x2="7.01" y2="7"%3E%3C/line%3E%3C/svg%3E' ) ;
2023-11-12 16:58:59 +02:00
--icon-discord : url ( ' data : image / svg + xml , % 3Csvg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 32 32" width = "18" height = "18" % 3E % 3Cpath fill = "%239FA4BB" d = " M 12 . 65625 4 . 90625 L 11 . 875 5 C 11 . 875 5 8 . 371094 5 . 382813 5 . 8125 7 . 4375 L 5 . 78125 7 . 4375 L 5 . 75 7 . 46875 C 5 . 175781 7 . 996094 4 . 925781 8 . 644531 4 . 53125 9 . 59375 C 4 . 136719 10 . 542969 3 . 714844 11 . 753906 3 . 34375 13 . 09375 C 2 . 601563 15 . 777344 2 19 . 027344 2 22 L 2 22 . 25 L 2 . 125 22 . 5 C 3 . 050781 24 . 125 4 . 695313 25 . 160156 6 . 21875 25 . 875 C 7 . 742188 26 . 589844 9 . 058594 26 . 96875 9 . 96875 27 L 10 . 5625 27 . 03125 L 10 . 875 26 . 5 L 11 . 96875 24 . 5625 C 13 . 128906 24 . 824219 14 . 464844 25 16 25 C 17 . 535156 25 18 . 871094 24 . 824219 20 . 03125 24 . 5625 L 21 . 125 26 . 5 L 21 . 4375 27 . 03125 L 22 . 03125 27 C 22 . 941406 26 . 96875 24 . 257813 26 . 589844 25 . 78125 25 . 875 C 27 . 304688 25 . 160156 28 . 949219 24 . 125 29 . 875 22 . 5 L 30 22 . 25 L 30 22 C 30 19 . 027344 29 . 398438 15 . 777344 28 . 65625 13 . 09375 C 28 . 285156 11 . 753906 27 . 863281 10 . 542969 27 . 46875 9 . 59375 C 27 . 074219 8 . 644531 26 . 824219 7 . 996094 26 . 25 7 . 46875 L 26 . 21875 7 . 4375 L 26 . 1875 7 . 4375 C 23 . 628906 5 . 382813 20 . 125 5 20 . 125 5 L 19 . 34375 4 . 90625 L 19 . 0625 5 . 625 C 19 . 0625 5 . 625 18 . 773438 6 . 355469 18 . 59375 7 . 1875 C 17 . 460938 7 . 035156 16 . 535156 7 16 7 C 15 . 464844 7 14 . 539063 7 . 035156 13 . 40625 7 . 1875 C 13 . 226563 6 . 355469 12 . 9375 5 . 625 12 . 9375 5 . 625 Z M 11 . 28125 7 . 1875 C 11 . 324219 7 . 328125 11 . 367188 7 . 449219 11 . 40625 7 . 5625 C 10 . 113281 7 . 882813 8 . 734375 8 . 371094 7 . 46875 9 . 15625 L 8 . 53125 10 . 84375 C 11 . 125 9 . 234375 14 . 851563 9 16 9 C 17 . 148438 9 20 . 875 9 . 234375 23 . 46875 10 . 84375 L 24 . 53125 9 . 15625 C 23 . 265625 8 . 371094 21 . 886719 7 . 882813 20 . 59375 7 . 5625 C 20 . 632813 7 . 449219 20 . 675781 7 . 328125 20 . 71875 7 . 1875 C 21 . 652344 7 . 375 23 . 433594 7 . 804688 24 . 90625 8 . 96875 C 24 . 898438 8 . 972656 25 . 28125 9 . 550781 25 . 625 10 . 375 C 25 . 976563 11 . 222656 26 . 367188 12 . 351563 26 . 71875 13 . 625 C 27 . 394531 16 . 066406 27 . 925781 19 . 039063 27 . 96875 21 . 65625 C 27 . 339844 22 . 617188 26 . 171875 23 . 484375 24 . 9375 24 . 0625 C 23 . 859375 24 . 566406 23 . 007813 24 . 75 22 . 5 24 . 84375 L 22 24 C 22 . 296875 23 . 890625 22 . 589844 23 . 769531 22 . 84375 23 . 65625 C 24 . 382813 22 . 980469 25 . 21875 22 . 25 25 . 21875 22 . 25 L 23 . 90625 20 . 75 C 23 . 90625 20 . 75 23 . 34375 21 . 265625 22 . 03125 21 . 84375 C 20 . 71875 22 . 421875 18 . 714844 23 16 23 C 13 . 285156 23 11 . 28125 22 . 421875 9 . 96875 21 . 84375 C 8 . 65625 21 . 265625 8 . 09375 20 . 75 8 . 09375 20 . 75 L 6 . 78125 22 . 25 C 6 . 78125 22 . 25 7 . 617188 22 . 980469 9 . 15625 23 . 65625 C 9 . 410156 23 . 769531 9 . 703125 23 . 890625 10 24 L 9 . 5 24 . 84375 C 8 . 992188 24 . 75 8 . 140625 24 . 566406 7 . 0625 24 . 0625 C 5 . 828125 23 . 484375 4 . 660156 22 . 617188 4 . 03125 21 . 65625 C 4 . 074219 19 . 039063 4 . 605469 16 . 066406 5 . 28125 13 . 625 C 5 . 632813 12 . 351563 6 . 023438 11 . 222656 6 . 375 10 . 375 C 6 . 71875 9 . 550781 7 . 101563 8 . 972656 7 . 09375 8 . 96875 C 8 . 566406 7 . 804688 10 . 347656 7 . 375 11 . 28125 7 . 1875 Z M 12 . 5 14 C 11 . 726563 14 11 . 042969 14 . 441406 10 . 625 15 C 10 . 207031 15 . 558594 10 16 . 246094 10 17 C 10 17 . 753906 10 . 207031 18 . 441406 10 . 625 19 C 11 . 042969 19 . 558594 11 . 726563 20 12 . 5 20 C 13 . 273438 20 13 . 957031 19 . 558594 14 . 375 19 C 14 . 792969 18 . 441406 15 17 . 753906 15 17 C 15 16 . 246094 14 . 792969 15 . 558594 14 . 375 15 C 13 . 957031 14 . 441406 13 . 273438 14 12 . 5 14 Z M 19 . 5 14 C 18 . 726563 14 18 . 042969 14 . 441406 17 . 625 15 C 17 . 207031 15 . 558594 17 16 . 246094 17 17 C 17 17 . 753906 17 . 207031 18 . 441406 17 . 625 19 C 18 . 042969 19 . 558594 18 . 726563 20 19 . 5 20 C 20 . 273438 20 20 . 957031 19 . 558594 21 . 375 19 C 21 . 792969 18 . 441406 22 17 . 753906 22 17 C 22 16 . 246094 21 . 792969 15 . 558594 21 . 375 15 C 20 . 957031 14 . 441406 20 . 273438 14 19 . 5 14 Z M 12 . 5 16 C 12 . 554688 16 12 . 625 16 . 019531 12 . 75 16 . 1875 C 12 . 875 16 . 355469 13 16 . 648438 13 17 C 13 17 . 351563 12 . 875 17 . 644531 12 . 75 17 . 8125 C 12 . 625 17 . 980469 12 . 554688 18 12 . 5 18 C 12 . 445313 18 12 . 375 17 . 980469 12 . 25 17 . 8125 C 12 . 125 17 . 644531 12 17 . 351563 12 17 C 12 16 . 648438 12 . 125 16 . 355469 12 . 25 16 . 1875 C 12 . 375 16 . 019531 12 . 445313 16 12 . 5 16 Z M 19 . 5 16 C 19 . 554688 16 19 . 625 16 . 019531 19 . 75 16 . 1875 C 19 . 875 16 . 355469 20 16 . 648438 20 17 C 20 17 . 351563 19 . 875 17 . 644531 19 . 75 17 . 8125 C 19 . 625 17 . 980469 19 . 554688 18 19 . 5 18 C 19 . 445313 18 19 . 375 17 . 980469 19 . 25 17 . 81
2023-10-29 21:09:09 +02:00
--icon-linkedin : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%239FA4BB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-linkedin"%3E%3Cpath d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"%3E%3C/path%3E%3Crect x="2" y="9" width="4" height="12"%3E%3C/rect%3E%3Ccircle cx="4" cy="4" r="2"%3E%3C/circle%3E%3C/svg%3E' ) ;
--icon-instagram : url ( 'data:image/svg+xml, %0A%3Csvg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%239FA4BB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-instagram"%3E%3Crect x="2" y="2" width="20" height="20" rx="5" ry="5"%3E%3C/rect%3E%3Cpath d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"%3E%3C/path%3E%3Cline x1="17.5" y1="6.5" x2="17.51" y2="6.5"%3E%3C/line%3E%3C/svg%3E' ) ;
2023-03-08 15:28:39 +02:00
}
2023-03-28 21:54:33 +03:00
/* Vars on iPad, landscape */
@ media ( min-width : 1175px ) and ( max-width : 1260px ) {
: root {
--width-main-panel : 500px ;
--width-side-panel : 265px ;
}
}
2023-03-08 18:18:32 +02:00
/* Vars in mobile */
@ media ( max-width : 500px ) {
: root {
2023-10-29 21:09:09 +02:00
--font-size : 16px ;
--line-height : 1 . 4 ;
2023-03-08 18:18:32 +02:00
--font-size-heading : 17px ;
2023-07-05 02:32:54 +03:00
--badges-distance-from-edge : 10px ;
2023-03-08 18:18:32 +02:00
}
2023-03-13 19:58:21 +02:00
/* Hide scrollbar on mobile, since we can't pick the handle anyway */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns :: -webkit-scrollbar {
2023-03-13 19:58:21 +02:00
display : none ;
}
2023-04-06 20:56:55 +03:00
}
2023-03-23 21:54:28 +02:00
2023-04-06 20:56:55 +03:00
/* Search popout offset */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . search__popout ,
. layout-multiple-columns . search-popout {
2023-04-06 20:56:55 +03:00
left : calc ( 30px / 2 ) ;
2023-03-23 21:54:28 +02:00
2023-04-06 20:56:55 +03:00
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
max-width : calc ( 100 % - 30px ) ! important ;
2023-03-23 21:54:28 +02:00
2023-04-06 20:56:55 +03:00
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
width : calc ( 100 % - 30px ) ! important ;
2023-03-08 18:18:32 +02:00
}
2023-07-03 22:21:53 +03:00
body . layout-multiple-columns {
2023-03-08 15:28:39 +02:00
background-color : var ( --color-bg ) ;
2023-03-09 14:39:37 +02:00
color : var ( --color-fg ) ;
2023-03-08 15:28:39 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . ui {
2023-03-13 19:58:21 +02:00
display : flex ;
width : 100 % ;
2023-03-12 00:14:17 +02:00
}
2023-03-11 22:43:54 +02:00
/* Text color */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__tabs__name h1 ,
. layout-multiple-columns . account__header__bio . account__header__content ,
. layout-multiple-columns . reply-indicator__content ,
. layout-multiple-columns . status__content {
2023-03-11 22:43:54 +02:00
color : var ( --color-fg ) ;
}
2023-07-05 17:51:51 +03:00
/* Link color variants */
. layout-multiple-columns . status-link . hashtag {
color : var ( --color-hashtag ) ;
}
. layout-multiple-columns . status-link . mention : not ( . hashtag ) {
color : var ( --color-mention ) ;
}
2023-07-05 19:14:35 +03:00
/* stylelint-disable-next-line */
2023-07-05 18:14:12 +03:00
. layout-multiple-columns . status-link . mention : not ( . hashtag ) : not ( . mention ) {
color : var ( --color-link ) ;
}
2023-03-08 15:28:39 +02:00
/* Logo */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . ui__header__logo ,
. layout-multiple-columns . column-link . column-link--logo {
2023-07-05 18:21:06 +03:00
background-image : var ( --logo ) ;
2023-03-08 15:28:39 +02:00
background-position : center ;
background-repeat : no-repeat ;
background-size : 32px auto ;
height : 50px ;
padding : 0 ;
width : 50px ;
}
2024-04-06 17:57:49 +03:00
/* Fixes a regression for 4.3.0-alpha.3-2024-04-06 caused by https://github.com/mastodon/mastodon/commit/4f068d4fcc4d134fcbd56faa8f39c608dd343417 */
. layout-multiple-columns . ui__header__logo {
flex-grow : unset ;
}
2023-07-08 20:16:26 +03:00
. layout-multiple-columns . ui__header__logo img ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . ui__header__logo svg {
2023-03-08 18:18:32 +02:00
display : none ;
}
2023-07-05 17:43:53 +03:00
/* Things that should have the default font-size */
2023-07-05 21:29:24 +03:00
. layout-multiple-columns . notification__message ,
2023-07-05 19:14:35 +03:00
. layout-multiple-columns . account__header__tabs__name h1 small ,
. layout-multiple-columns . button ,
2023-07-05 18:16:08 +03:00
. layout-multiple-columns . status__content__read-more-button ,
2023-07-05 17:43:53 +03:00
. layout-multiple-columns . status__prepend ,
. layout-multiple-columns . status__info ,
. layout-multiple-columns . status__relative-time ,
. layout-multiple-columns . status__info . status__display-name ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__section-headline a ,
. layout-multiple-columns . account__section-headline button ,
. layout-multiple-columns . notification__filter-bar a ,
. layout-multiple-columns . notification__filter-bar button {
2023-03-08 15:28:39 +02:00
font-size : var ( --font-size ) ;
}
2023-07-05 18:01:29 +03:00
/* Things that should have the mid font-size */
2023-07-05 19:14:35 +03:00
. layout-multiple-columns . account__header__extra__links ,
2023-07-06 11:25:55 +03:00
. layout-multiple-columns . columns-area__panels__pane--compositional . account__header__account-note textarea ,
2023-07-05 19:14:35 +03:00
. layout-multiple-columns . account__header__content ,
2023-07-06 11:30:50 +03:00
. layout-multiple-columns . columns-area__panels__pane--compositional . compose-form . autosuggest-textarea__textarea ,
. layout-multiple-columns . columns-area__panels__pane--compositional . compose-form . spoiler-input__input {
2023-07-05 18:01:29 +03:00
font-size : var ( --font-size-mid ) ;
2023-07-05 19:14:35 +03:00
line-height : var ( --line-height-mid ) ;
}
2023-07-05 23:40:36 +03:00
/* Exceptions */
2023-07-16 15:02:27 +03:00
. layout-multiple-columns . account__header__content {
2023-07-05 23:40:36 +03:00
line-height : 18px ;
}
2023-07-05 19:14:35 +03:00
/* Things that will have even smaller font size */
2023-07-16 15:02:27 +03:00
. layout-multiple-columns . account__header__account-note label {
2023-07-05 19:14:35 +03:00
font-size : var ( --font-size-12 ) ;
2023-07-05 18:01:29 +03:00
}
2023-07-05 17:43:53 +03:00
/* Line heights */
. layout-multiple-columns . status__content {
line-height : var ( --line-height ) ;
}
2023-03-08 15:28:39 +02:00
/* Modal overlay */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . modal-root__overlay {
2023-03-08 17:16:39 +02:00
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
background-color : var ( --color-modal-overlay ) ! important ;
/* stylelint-disable-next-line */
color : var ( --color-light-text ) ! important ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . modal-root__modal . display-name strong ,
. layout-multiple-columns . modal-root__modal . status__content {
2023-03-30 20:15:30 +03:00
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
color : var ( --color-light-text ) ! important ;
}
2023-03-15 15:46:41 +02:00
/* Hide footer buttons in modals */
2024-01-07 18:35:22 +02:00
. layout-multiple-columns . picture-in-picture . picture-in-picture__footer {
2023-03-15 15:46:41 +02:00
display : none ;
}
2024-01-07 18:35:22 +02:00
/* Picture in picture fixes */
. layout-multiple-columns . picture-in-picture . audio-player ,
. layout-multiple-columns . picture-in-picture . video-player {
/* stylelint-disable-next-line */
border-radius : 0 ! important ;
/* stylelint-disable-next-line */
margin-left : 0 ! important ;
}
2023-03-23 19:28:59 +02:00
/* Report modal */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . report-dialog-modal . poll__option . dialog-option > . poll__option__text {
2023-03-23 19:28:59 +02:00
display : grid ;
gap : 6px ;
}
2023-12-17 14:54:25 +02:00
/* Improve modal icon size and accessibility */
. layout-multiple-columns . image-loader . icon ,
. layout-multiple-columns . media-modal__navigation . icon {
color : var ( --color-light-text ) ;
height : 32px ;
width : 32px ;
2023-03-08 15:28:39 +02:00
}
2023-03-09 21:21:43 +02:00
/* List adder input */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . list-editor input . setting-text ,
. layout-multiple-columns . list-adder input . setting-text {
2023-03-09 21:21:43 +02:00
background-color : transparent ;
border-color : var ( --color-black-coral ) ;
height : 38px ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . list-editor . column-inline-form button ,
. layout-multiple-columns . list-adder . column-inline-form button ,
. layout-multiple-columns . list-editor . column-inline-form button :: before {
2023-03-10 15:08:38 +02:00
min-height : 38px ;
2023-03-12 13:03:39 +02:00
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
width : 100 % ! important ;
2023-03-10 15:08:38 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . list-editor__search {
2023-03-10 15:08:38 +02:00
padding : 15px ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . embed-modal . embed-modal__container . embed-modal__html {
2023-03-12 19:38:38 +02:00
color : var ( --color-light-text ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . embed-modal . embed-modal__container . embed-modal__html ,
. layout-multiple-columns . list-editor__search . search__input {
2023-03-10 15:08:38 +02:00
background-color : transparent ;
border-color : var ( --color-black-coral ) ;
height : 38px ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . list-editor . drawer__inner . backdrop {
2023-03-10 15:08:38 +02:00
box-shadow : 2px 4px 15px rgba ( 0 , 0 , 0 , . 2 ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . list-editor . list__display-name ,
. layout-multiple-columns . list-adder . list__display-name {
2024-03-23 14:01:48 +02:00
align-items : center ;
2023-03-09 22:10:09 +02:00
display : flex ;
gap : var ( --gap-default ) ;
}
2023-08-01 18:15:21 +03:00
/* URL preview cards */
2023-07-06 01:34:30 +03:00
. layout-multiple-columns . status-card ,
2023-08-01 18:15:21 +03:00
. layout-multiple-columns . status-card : hover ,
. layout-multiple-columns . status-card : focus {
background-color : transparent ;
border-color : var ( --color-border ) ;
}
/* URL preview card summary text */
. layout-multiple-columns . status-card . status-card__host ,
. layout-multiple-columns . status-card . status-card__description {
color : var ( --color-dim ) ;
}
/* URL preview card box */
/* stylelint-disable-next-line */
. layout-multiple-columns . status-card . status-card__content {
padding : var ( --gap-default ) ;
}
. layout-multiple-columns . status-card . expanded . status-card__content {
display : grid ;
gap : 8px ;
}
/* Preview cards */
. layout-multiple-columns . status-card {
2023-03-09 21:35:44 +02:00
background-color : var ( --color-bg ) ;
2023-07-06 01:34:30 +03:00
border : 1px solid var ( --color-border ) ;
2023-07-05 01:36:21 +03:00
border-radius : var ( --border-radius ) ;
2023-07-06 20:09:11 +03:00
transition : all 200ms ;
2023-07-30 00:45:44 +03:00
}
2024-06-30 19:48:41 +03:00
. layout-multiple-columns . status-card . status-card . bottomless {
border-bottom-left-radius : 0 ;
border-bottom-right-radius : 0 ;
}
2023-08-01 18:15:21 +03:00
. layout-multiple-columns . status-card . expanded {
display : block ;
}
. layout-multiple-columns a . status-card . status-card__host {
font-size : var ( --font-size ) ;
}
. layout-multiple-columns . status-card a : active . status-card__author ,
. layout-multiple-columns . status-card a : active . status-card__title ,
. layout-multiple-columns . status-card a : focus . status-card__author ,
. layout-multiple-columns . status-card a : focus . status-card__title ,
. layout-multiple-columns . status-card a : hover . status-card__author ,
. layout-multiple-columns . status-card a : hover . status-card__title ,
. layout-multiple-columns a . status-card : active . status-card__author ,
. layout-multiple-columns a . status-card : active . status-card__title ,
. layout-multiple-columns a . status-card : focus . status-card__author ,
. layout-multiple-columns a . status-card : focus . status-card__title ,
. layout-multiple-columns a . status-card : hover . status-card__author ,
2023-08-02 10:04:28 +03:00
. layout-multiple-columns a . status-card : hover . status-card__title ,
. layout-multiple-columns a . status-card : focus . status-card__description ,
. layout-multiple-columns a . status-card : hover . status-card__description {
2023-08-01 18:15:21 +03:00
color : var ( --color-fg ) ;
}
. layout-multiple-columns . status-card a : active . status-card__host ,
. layout-multiple-columns . status-card a : hover . status-card__host ,
. layout-multiple-columns . status-card a : focus . status-card__host ,
. layout-multiple-columns a . status-card : active . status-card__host ,
. layout-multiple-columns a . status-card : focus . status-card__host ,
. layout-multiple-columns a . status-card : hover . status-card__host {
color : var ( --color-dim ) ;
}
2023-07-30 00:45:44 +03:00
/* Show minimal status card if there's no image */
. layout-multiple-columns . status-card . status-card__image : not ( : has ( img ) ) {
display : none ;
}
2023-08-24 14:48:42 -07:00
/* Show iframe in status card if status contains embedded media */
. layout-multiple-columns . status-card . status-card-video : has ( iframe ) {
display : inherit ;
}
2023-07-30 00:45:44 +03:00
/* Hide empty status cards alltogether (Mastodon 4.1.5-2023-07-29) */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . status-card : has ( . icon-file-text ) {
2023-07-30 00:45:44 +03:00
display : none ;
2023-03-09 12:19:57 +02:00
}
2023-07-06 20:21:20 +03:00
/* Hide empty YouTube description */
. layout-multiple-columns . status-card__description : empty {
display : none ;
}
2023-07-06 20:08:19 +03:00
. layout-multiple-columns . status-card : focus ,
. layout-multiple-columns . status-card : hover {
background-color : rgba ( 255 255 255 / . 03 ) ;
}
2023-08-01 18:15:21 +03:00
. layout-multiple-columns . status-card__image-image ,
. layout-multiple-columns . status-card__image-preview ,
. layout-multiple-columns . status-card . status-card__image {
background-color : var ( --color-arsenic ) ;
2023-03-09 12:19:57 +02:00
border-radius : 0 ;
}
2023-08-01 18:15:21 +03:00
. layout-multiple-columns a . status-card . status-card__content {
padding : 16px ;
2023-03-09 12:19:57 +02:00
}
2023-08-01 18:15:21 +03:00
. layout-multiple-columns a . status-card . status-card__title {
2023-03-09 21:35:44 +02:00
color : var ( --color-fg ) ;
2023-08-01 18:15:21 +03:00
font-size : var ( --font-size-title ) ;
font-weight : var ( --font-weight-semibold ) ;
2023-03-09 12:19:57 +02:00
line-height : 1 . 3 ;
2023-07-26 01:44:03 +03:00
margin : 0 ;
2023-08-01 18:15:21 +03:00
}
. layout-multiple-columns a . status-card . expanded . status-card__title {
2023-03-09 12:19:57 +02:00
white-space : inherit ;
}
2023-08-01 18:15:21 +03:00
. layout-multiple-columns . status-card . expanded . status-card__host {
2023-03-09 21:21:43 +02:00
color : var ( --color-dim ) ;
2023-08-01 18:15:21 +03:00
font-size : var ( --font-size ) ;
margin-bottom : 0 ;
margin-top : 0 ;
}
. layout-multiple-columns . status-card . expanded . status-card__description {
2023-03-09 12:19:57 +02:00
margin-top : 0 ;
}
2023-03-24 09:41:48 +02:00
/* Announcements */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . announcements__pagination . icon ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . announcements__pagination {
2023-03-24 09:41:48 +02:00
color : var ( --color-dim ) ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . announcements__pagination . icon-button : hover . icon {
2023-03-24 09:41:48 +02:00
color : var ( --color-light-purple ) ;
}
2023-03-18 15:50:31 +02:00
/* Dark panels like modals and boxes */
2023-10-04 23:10:29 +03:00
. layout-multiple-columns . account-memorial-banner ,
. layout-multiple-columns . follow-request-banner ,
. layout-multiple-columns . moved-account-banner ,
2023-07-05 00:47:39 +03:00
. layout-multiple-columns . column-select__menu * ,
. layout-multiple-columns . column-select__menu ,
. layout-multiple-columns . column-settings__hashtags . column-select__control ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . about__meta ,
. layout-multiple-columns . about__section__title ,
. layout-multiple-columns . announcements ,
. layout-multiple-columns . report-dialog-modal ,
. layout-multiple-columns . report-modal__target ,
. layout-multiple-columns . compose-form . autosuggest-textarea__suggestions ,
. layout-multiple-columns . privacy-dropdown__dropdown ,
. layout-multiple-columns . drawer__backdrop ,
. layout-multiple-columns . list-editor__account ,
. layout-multiple-columns . list-editor ,
. layout-multiple-columns . list-editor__lists ,
. layout-multiple-columns . list-adder__account ,
. layout-multiple-columns . list-adder ,
. layout-multiple-columns . list-adder__lists ,
. layout-multiple-columns . dropdown-menu__arrow :: before ,
. layout-multiple-columns . dropdown-menu ,
. layout-multiple-columns . dropdown-menu__item a ,
. layout-multiple-columns . dropdown-menu__item button ,
. layout-multiple-columns . emoji-mart-category-label span ,
. layout-multiple-columns . emoji-mart-bar : first-child ,
. layout-multiple-columns . emoji-picker-dropdown__menu ,
. layout-multiple-columns . privacy-dropdown . active . privacy-dropdown__value ,
. layout-multiple-columns . emoji-mart-search input ,
. layout-multiple-columns . emoji-mart-scroll ,
. layout-multiple-columns . emoji-mart-search ,
. layout-multiple-columns . follow_requests-unlocked_explanation ,
. layout-multiple-columns . dismissable-banner ,
. layout-multiple-columns . block-modal__action-bar ,
. layout-multiple-columns . boost-modal__action-bar ,
. layout-multiple-columns . confirmation-modal__action-bar ,
. layout-multiple-columns . mute-modal__action-bar ,
. layout-multiple-columns . setting-text__wrapper ,
. layout-multiple-columns . setting-text ,
. layout-multiple-columns . report-modal__comment ,
. layout-multiple-columns . report-modal__container ,
. layout-multiple-columns . actions-modal ,
. layout-multiple-columns . block-modal ,
. layout-multiple-columns . boost-modal ,
. layout-multiple-columns . compare-history-modal ,
. layout-multiple-columns . confirmation-modal ,
. layout-multiple-columns . mute-modal ,
. layout-multiple-columns . report-modal ,
. layout-multiple-columns . column-header__collapsible-inner {
2023-03-08 15:28:39 +02:00
background-color : var ( --color-dark ) ;
border-color : var ( --color-dark ) ;
color : var ( --color-light-text ) ;
}
2023-09-24 17:02:58 +03:00
/* Column-header border */
. layout-multiple-columns . column-header__collapsible {
border-bottom : 1px solid var ( --color-border ) ;
}
2023-10-04 22:15:14 +03:00
. layout-multiple-columns . column-header__collapsible ,
2023-09-24 17:02:58 +03:00
. layout-multiple-columns . column-header__collapsible . collapsed {
opacity : 1 ;
}
2023-04-06 20:56:55 +03:00
/* Has dark 1px border */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . dismissable-banner {
2023-04-06 20:56:55 +03:00
border : 1px solid var ( --color-dark ) ;
}
2023-03-08 21:26:55 +02:00
/* More subtle box-shadow for dropdown-menu */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . search-popout ,
. layout-multiple-columns . search__popout ,
. layout-multiple-columns . dropdown-menu {
2023-03-08 21:26:55 +02:00
box-shadow : 2px 4px 16px rgb ( 0 0 0 / . 01 ) ;
}
2023-03-12 16:35:18 +02:00
/* Autosuggest box shadow reset */
2023-07-05 00:47:39 +03:00
. layout-multiple-columns . column-select__menu ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . search-popout ,
. layout-multiple-columns . search__popout ,
. layout-multiple-columns . dropdown-menu ,
. layout-multiple-columns . emoji-picker-dropdown__menu ,
. layout-multiple-columns . compose-form . compose-form__warning ,
. layout-multiple-columns . privacy-dropdown . active . privacy-dropdown__value ,
. layout-multiple-columns . privacy-dropdown__dropdown ,
. layout-multiple-columns . language-dropdown__dropdown ,
. layout-multiple-columns . compose-form . autosuggest-textarea__suggestions {
2023-03-12 16:35:18 +02:00
box-shadow : none ;
}
2023-03-26 17:55:18 +03:00
/* Composer form warnings */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . compose-form . compose-form__warning {
2023-03-26 17:55:18 +03:00
background-color : var ( --color-light-purple ) ;
color : var ( --color-bg ) ;
}
2023-07-04 22:00:30 +03:00
/* Content warning placeholder */
2023-07-04 22:10:01 +03:00
. layout-multiple-columns . compose-form . autosuggest-textarea__textarea :: placeholder ,
. layout-multiple-columns . compose-form . spoiler-input__input :: placeholder {
2023-07-04 22:00:30 +03:00
color : var ( --color-dim ) ;
}
2023-03-12 17:35:43 +02:00
/* Border colors */
2023-10-04 22:11:41 +03:00
. layout-multiple-columns . search-results__section__header ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__bar ,
. layout-multiple-columns . about__meta__divider ,
. layout-multiple-columns . poll__footer ,
. layout-multiple-columns . report-dialog-modal . poll__option . dialog-option ,
. layout-multiple-columns . account ,
. layout-multiple-columns . report-dialog-modal__container ,
. layout-multiple-columns . dropdown-menu__item . edited-timestamp__history__item ,
. layout-multiple-columns . dropdown-menu__container__header ,
. layout-multiple-columns . compare-history-modal . report-modal__target ,
. layout-multiple-columns . account__section-headline ,
. layout-multiple-columns . detailed-status__action-bar ,
. layout-multiple-columns . column-back-button ,
. layout-multiple-columns . column-header ,
. layout-multiple-columns . audio-player ,
. layout-multiple-columns . video-player ,
. layout-multiple-columns . media-gallery ,
. layout-multiple-columns . compose-form . spoiler-input__input ,
. layout-multiple-columns . compose-form__autosuggest-wrapper ,
. layout-multiple-columns . compose-form__poll-wrapper ,
. layout-multiple-columns . compose-form__poll-wrapper select ,
. layout-multiple-columns . poll__option input [ type = "text" ] ,
. layout-multiple-columns . report-dialog-modal__textarea ,
. layout-multiple-columns . search__input ,
. layout-multiple-columns . setting-text ,
. layout-multiple-columns . dropdown-menu__separator ,
. layout-multiple-columns . status ,
. layout-multiple-columns . emoji-mart-search input ,
. layout-multiple-columns . conversation ,
. layout-multiple-columns . setting-text__wrapper {
2023-04-26 20:50:23 +03:00
border-color : var ( --color-border ) ;
2023-03-08 15:28:39 +02:00
}
/* Change panel order */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__pane {
2023-03-08 15:28:39 +02:00
order : 3 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__main {
2023-03-08 15:28:39 +02:00
order : 2 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__pane . columns-area__panels__pane--start . columns-area__panels__pane--navigational {
2023-03-08 15:28:39 +02:00
order : 1 ;
}
2023-04-01 22:43:11 +03:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__pane ,
. layout-multiple-columns . columns-area__panels__pane__inner ,
. layout-multiple-columns . compose-panel {
2023-04-01 11:59:23 -04:00
min-width : var ( --width-side-panel ) ;
2023-04-01 22:43:11 +03:00
width : var ( --width-side-panel ) ;
2023-04-01 11:59:23 -04:00
}
2023-04-01 22:43:11 +03:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__pane--compositional {
2023-04-01 22:43:11 +03:00
flex-grow : 1 ;
2023-04-01 11:59:23 -04:00
height : 100vh ;
max-width : 350px ;
2024-03-22 19:16:39 +02:00
min-height : 880px ;
2023-04-01 22:43:11 +03:00
position : sticky ;
top : 0 ;
2023-04-01 11:59:23 -04:00
}
2023-04-01 22:43:11 +03:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__pane--compositional . columns-area__panels__pane__inner {
2023-04-01 11:59:23 -04:00
position : static ;
}
2023-04-01 22:43:11 +03:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__pane--compositional . columns-area__panels__pane__inner ,
2023-04-01 11:59:23 -04:00
. compose-panel {
2023-04-01 22:49:22 +03:00
/* stylelint-disable-next-line */
2023-04-01 11:59:23 -04:00
width : 100 % ! important ;
}
2023-04-01 22:43:11 +03:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . search {
2023-04-01 11:59:23 -04:00
margin-inline : 10px ;
2023-03-28 21:54:33 +03:00
}
2023-03-08 18:18:32 +02:00
/* stylelint-disable-next-line */
@ media ( min-width : 1175px ) {
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__main {
2023-03-08 18:18:32 +02:00
max-width : calc ( var ( --width-main-panel ) + calc ( var ( --gap-default ) * 4 ) ) ;
padding-left : calc ( var ( --gap-default ) * 2 ) ;
padding-right : calc ( var ( --gap-default ) * 2 ) ;
}
2023-03-27 19:37:46 +03:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel {
2023-03-26 15:33:15 -04:00
margin-right : -20px ;
2023-03-27 19:37:46 +03:00
/* stylelint-disable-next-line */
padding-left : 0 ! important ;
2023-03-26 15:33:15 -04:00
padding-right : 20px ;
}
2023-03-08 18:18:32 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . emoji-mart-anchor-bar ,
. layout-multiple-columns . column-link . column-link--logo svg {
2023-03-08 15:28:39 +02:00
display : none ;
}
/* Accented items like links */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . about__section__title ,
. layout-multiple-columns . account__header__bio . account__header__fields a ,
. layout-multiple-columns . column-back-button ,
. layout-multiple-columns . emoji-mart-anchor . emoji-mart-anchor-selected ,
. layout-multiple-columns . text-icon-button . active ,
. layout-multiple-columns . empty-column-indicator a ,
. layout-multiple-columns . follow_requests-unlocked_explanation a ,
. layout-multiple-columns . column-header__back-button ,
. layout-multiple-columns . link-button ,
. layout-multiple-columns . reply-indicator__content a . unhandled-link ,
. layout-multiple-columns . status__content a . unhandled-link ,
. layout-multiple-columns . column-header > . column-header__back-button ,
. layout-multiple-columns . reply-indicator__content a ,
2023-03-23 20:00:34 +02:00
body . embed . status__content a ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__content a ,
. layout-multiple-columns . column-link--transparent . active ,
. layout-multiple-columns . status__content__read-more-button {
2023-03-08 15:28:39 +02:00
color : var ( --color-accent ) ;
}
2023-07-05 00:47:39 +03:00
/* Toggles etc. */
. layout-multiple-columns . search-results__header ,
. layout-multiple-columns . drawer__inner ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . react-toggle . react-toggle-track {
2023-05-13 21:09:11 +03:00
background-color : var ( --color-bg ) ;
}
2023-03-08 15:28:39 +02:00
/* Accented background colors */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . react-toggle--checked . react-toggle-track ,
. layout-multiple-columns . language-dropdown__dropdown__results__item . active ,
. layout-multiple-columns . icon-with-badge__badge ,
. layout-multiple-columns . button {
2023-07-05 19:14:35 +03:00
background-color : var ( --color-accent-dark ) ;
2023-03-08 15:28:39 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . block-modal__cancel-button ,
. layout-multiple-columns . confirmation-modal__cancel-button ,
. layout-multiple-columns . confirmation-modal__secondary-button ,
. layout-multiple-columns . mute-modal__cancel-button {
2023-03-18 14:15:07 +02:00
background-color : transparent ;
color : var ( --color-dim ) ;
font-size : var ( --font-size-mid ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . block-modal__cancel-button : focus ,
. layout-multiple-columns . confirmation-modal__cancel-button : focus ,
. layout-multiple-columns . confirmation-modal__secondary-button : focus ,
. layout-multiple-columns . mute-modal__cancel-button : focus ,
. layout-multiple-columns . block-modal__cancel-button : hover ,
. layout-multiple-columns . confirmation-modal__cancel-button : hover ,
. layout-multiple-columns . confirmation-modal__secondary-button : hover ,
. layout-multiple-columns . mute-modal__cancel-button : hover {
2023-03-18 14:15:07 +02:00
background-color : transparent ;
color : var ( --color-dark-electric-blue ) ;
}
2023-03-08 22:13:31 +02:00
. column-link--transparent . icon-with-badge__badge ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . icon-with-badge__badge {
2023-03-08 21:17:08 +02:00
background-color : var ( --color-accent-dark ) ;
2023-03-08 22:13:31 +02:00
border-color : var ( --color-bg ) ;
2023-03-08 21:17:08 +02:00
}
2023-03-08 15:28:39 +02:00
/* Accented strokes */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . trends__item__sparkline path : last-child {
2023-03-08 15:28:39 +02:00
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
stroke : var ( --color-accent ) ! important ;
}
2023-07-05 19:14:35 +03:00
/* Dropdown hovers */
. layout-multiple-columns . language-dropdown__dropdown__results__item : hover ,
. layout-multiple-columns . language-dropdown__dropdown__results__item : focus {
background-color : var ( --color-accent-dark-50 ) ;
color : var ( --color-light-text ) ;
}
2023-03-08 15:28:39 +02:00
/* Accented border colors */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . unread :: before ,
. layout-multiple-columns . status__wrapper . unread :: before {
2023-03-08 15:28:39 +02:00
border-color : var ( --color-accent ) ;
2023-03-09 12:46:06 +02:00
display : none ;
2023-03-08 15:28:39 +02:00
}
2023-07-19 15:28:51 +03:00
/* Filtered post */
. layout-multiple-columns . status__wrapper . status__wrapper--filtered {
align-items : center ;
background-color : var ( --color-focusable-toot ) ;
border : 1px solid var ( --color-border ) ;
border-radius : var ( --border-radius ) ;
color : var ( --color-light-purple ) ;
display : flex ;
flex-wrap : nowrap ;
font-size : var ( --font-size-mid ) ;
justify-content : space-between ;
margin : var ( --gap-default ) ;
overflow : hidden ;
padding : 4px 16px ;
text-align : left ;
text-overflow : ellipsis ;
white-space : nowrap ;
width : calc ( 100 % - calc ( var ( --gap-default ) * 2 ) ) ;
}
. layout-multiple-columns . notification : has ( . status__wrapper--filtered ) . notification__message {
display : none ;
}
2023-07-21 20:34:22 +03:00
/* Fix hover/focus on article that has filtered banner */
. layout-multiple-columns article : has ( . status__wrapper--filtered ) : hover {
background-color : transparent ;
}
2023-07-19 15:28:51 +03:00
. layout-multiple-columns . status__wrapper . status__wrapper--filtered button {
background-color : rgb ( 255 255 255 / 0 ) ;
border-bottom-left-radius : 9999px ;
border-bottom-right-radius : 9999px ;
border-top-left-radius : 9999px ;
border-top-right-radius : 9999px ;
color : var ( --color-fg ) ;
2023-07-26 01:13:00 +03:00
font-weight : var ( --font-weight-semibold ) ;
2023-07-19 15:28:51 +03:00
margin-left : auto ;
padding-bottom : 8px ;
padding-left : 12px ;
padding-right : 12px ;
padding-top : 8px ;
transition : 200ms background ;
white-space : nowrap ;
}
. layout-multiple-columns . status__wrapper . status__wrapper--filtered button : focus ,
. layout-multiple-columns . status__wrapper . status__wrapper--filtered button : hover {
background-color : rgb ( 255 255 255 / . 1 ) ;
text-decoration : none ;
}
2023-03-09 12:35:04 +02:00
/* Unread message */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . conversation--unread ,
. layout-multiple-columns . notification . unread : hover ,
. layout-multiple-columns . notification . unread ,
. layout-multiple-columns . status__wrapper . unread {
2023-03-09 12:35:04 +02:00
background-color : var ( --color-dark ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification : hover . notification__message {
2023-03-09 18:42:57 +02:00
background-color : transparent ;
}
2023-03-11 17:04:21 +02:00
/* Things like notification status update text that should be dim */
2023-07-05 23:40:36 +03:00
/* stylelint-disable-next-line selector-not-notation */
. layout-multiple-columns . notification . status-link . mention : not ( . hashtag ) : not ( . mention ) ,
. layout-multiple-columns . notification . status-link . hashtag ,
. layout-multiple-columns . notification . status-link . mention : not ( . hashtag ) ,
2023-07-05 19:14:35 +03:00
. layout-multiple-columns . compose-form . autosuggest-textarea__textarea :: placeholder ,
. layout-multiple-columns . compose-form . icon-button ,
. layout-multiple-columns . compose-form . spoiler-input__input :: placeholder ,
. layout-multiple-columns . compose-form__poll-wrapper . button . button-secondary ,
. layout-multiple-columns . language-dropdown__dropdown__results__item__common-name ,
. layout-multiple-columns . report-dialog-modal__textarea :: placeholder ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . poll__link ,
. layout-multiple-columns . muted . poll ,
. layout-multiple-columns . status . status__relative-time ,
. layout-multiple-columns . status . status__visibility-icon ,
. layout-multiple-columns . block-modal__action-bar > div ,
. layout-multiple-columns . boost-modal__action-bar > div ,
. layout-multiple-columns . confirmation-modal__action-bar > div ,
. layout-multiple-columns . mute-modal__action-bar > div ,
. layout-multiple-columns . search-popout > h4 ,
. layout-multiple-columns . search__popout > h4 ,
. layout-multiple-columns . status-check-box__status . detailed-status__display-name ,
. layout-multiple-columns . report-dialog-modal . poll__option . dialog-option > . poll__option__text ,
. layout-multiple-columns . status-card . status-card__description ,
. layout-multiple-columns . report-dialog-modal . dialog-option . poll__input ,
. layout-multiple-columns . dropdown-menu__container__header ,
. layout-multiple-columns . sign-in-banner p ,
. layout-multiple-columns . navigation-bar > a ,
. layout-multiple-columns . character-counter ,
. layout-multiple-columns . text-icon-button ,
. layout-multiple-columns . empty-column-indicator ,
. layout-multiple-columns . follow_requests-unlocked_explanation ,
. layout-multiple-columns . poll__footer ,
. layout-multiple-columns . server-banner h4 ,
. layout-multiple-columns . column-header__button ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . search__icon . icon-times-circle ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . timeline-hint ,
. layout-multiple-columns . status__display-name . muted ,
. layout-multiple-columns . setting-text-label ,
. layout-multiple-columns . account__header__bio . account__header__fields dt ,
. layout-multiple-columns . account__header__bio . account__header__fields dd ,
. layout-multiple-columns . link-footer p ,
. layout-multiple-columns . account__header__extra__links a ,
. layout-multiple-columns . trends__item__current ,
. layout-multiple-columns . emoji-mart-anchor ,
. layout-multiple-columns . emoji-mart ,
. layout-multiple-columns . emoji-mart-anchors ,
. layout-multiple-columns . reply-indicator . display-name * ,
. layout-multiple-columns . status__display-name ,
. layout-multiple-columns . status__prepend . status__display-name strong ,
. layout-multiple-columns . status__prepend ,
. layout-multiple-columns . compose-form . compose-form__modifiers ,
. layout-multiple-columns . compose-form . autosuggest-textarea__textarea ,
. layout-multiple-columns . compose-form . spoiler-input__input ,
. layout-multiple-columns . autosuggest-textarea__suggestions ,
. layout-multiple-columns . compose-form . autosuggest-account . display-name__account ,
. layout-multiple-columns . compose-panel . compose-form__autosuggest-wrapper ,
. layout-multiple-columns . compose-form . compose-form__buttons-wrapper ,
. layout-multiple-columns . account__section-headline a ,
. layout-multiple-columns . account__section-headline button ,
. layout-multiple-columns . notification__filter-bar a ,
. layout-multiple-columns . notification__filter-bar button ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . attachment-list . compact . icon ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . attachment-list__list a ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification__message . icon-user-plus ,
. layout-multiple-columns . notification__message . icon-home ,
. layout-multiple-columns . notification__message . icon-retweet ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . link-footer p a ,
. layout-multiple-columns . trends__item__name ,
. layout-multiple-columns . muted . status__content ,
. layout-multiple-columns . muted . status__content a ,
. layout-multiple-columns . muted . status__content p ,
2023-07-10 02:12:25 +03:00
. layout-multiple-columns . muted . status__display-name strong ,
. layout-multiple-columns . privacy-dropdown__option : not ( . active ) . privacy-dropdown__option__content {
2023-03-08 15:28:39 +02:00
color : var ( --color-dim ) ;
}
2023-03-09 12:16:25 +02:00
/* Dim backgrounds */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . poll__chart {
2023-03-09 12:16:25 +02:00
background-color : var ( --color-dim ) ;
}
2023-03-09 13:24:58 +02:00
/* Lighter border colors */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . report-dialog-modal . dialog-option . poll__input ,
. layout-multiple-columns . poll__input {
2023-03-09 13:24:58 +02:00
border-color : var ( --color-brand-mastodon-text-light ) ;
}
2023-03-11 22:43:54 +02:00
/* Light grey things */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-bar ,
. layout-multiple-columns . navigation-bar strong {
2023-10-29 23:00:05 +02:00
color : var ( --color-topaz ) ;
2023-03-11 22:43:54 +02:00
}
2023-03-25 18:28:40 +02:00
/* CW button */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . reply-indicator__content . status__content__spoiler-link ,
. layout-multiple-columns . status__content__spoiler-link {
2023-04-22 13:41:28 +03:00
background-color : var ( --color-dark ) ;
2023-04-22 13:34:54 +03:00
color : var ( --color-light-purple ) ;
2023-07-26 01:13:00 +03:00
font-weight : var ( --font-weight-semibold ) ;
2023-04-22 13:33:32 +03:00
/* Need to override forced styles */
/* stylelint-disable-next-line */
margin-left : calc ( var ( --gap-default ) / 2 ) ! important ;
2023-04-22 13:28:44 +03:00
vertical-align : baseline ;
2023-03-25 18:28:40 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . reply-indicator__content . status__content__spoiler-link : focus ,
. layout-multiple-columns . reply-indicator__content . status__content__spoiler-link : hover ,
. layout-multiple-columns . status__content . status__content__spoiler-link : focus ,
. layout-multiple-columns . status__content . status__content__spoiler-link : hover {
2023-04-22 13:41:28 +03:00
background-color : var ( --color-dark ) ;
color : var ( --color-lighter-purple ) ;
}
/* CW button in notifications */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . reply-indicator__content . status__content__spoiler-link ,
. layout-multiple-columns . notification . status__content__spoiler-link {
2023-04-22 13:41:28 +03:00
background-color : var ( --color-dark ) ;
color : var ( --color-dim ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . reply-indicator__content . status__content__spoiler-link : focus ,
. layout-multiple-columns . notification . reply-indicator__content . status__content__spoiler-link : hover ,
. layout-multiple-columns . notification . status__content . status__content__spoiler-link : focus ,
. layout-multiple-columns . notification . status__content . status__content__spoiler-link : hover {
2023-04-22 13:41:28 +03:00
background-color : var ( --color-dark ) ;
color : var ( --color-dim ) ;
2023-03-25 18:28:40 +02:00
}
2023-03-12 17:35:43 +02:00
/* Light purple things */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . announcements__pagination . icon-button : hover . icon ,
2023-07-16 15:02:27 +03:00
. layout-multiple-columns . server-banner__introduction ,
. layout-multiple-columns . account__header__tabs__name h1 small ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account . account__display-name ,
. layout-multiple-columns . column-settings__section ,
2023-07-23 18:54:22 +03:00
. layout-multiple-columns . setting-toggle__label ,
2023-07-25 15:46:27 +03:00
. layout-multiple-columns . server-banner__number-label {
2023-03-12 17:35:43 +02:00
color : var ( --color-light-purple ) ;
}
2023-03-08 15:28:39 +02:00
/* White things */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . compose-form__poll-wrapper select ,
. layout-multiple-columns . actions-modal ul li : not ( : empty ) a ,
. layout-multiple-columns . report-dialog-modal . status__content ,
. layout-multiple-columns . report-dialog-modal . status__content p ,
. layout-multiple-columns . report-dialog-modal . poll__option . dialog-option > . poll__option__text strong ,
. layout-multiple-columns . report-dialog-modal__lead ,
. layout-multiple-columns . detailed-status__display-name strong ,
. layout-multiple-columns . dismissable-banner__message ,
2023-07-10 12:42:45 +03:00
. layout-multiple-columns . privacy-dropdown__option . active ,
. layout-multiple-columns . privacy-dropdown__option : hover . privacy-dropdown__option__content ,
. layout-multiple-columns . privacy-dropdown__option : focus . privacy-dropdown__option__content ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . privacy-dropdown__option ,
. layout-multiple-columns . privacy-dropdown__option__content strong ,
. layout-multiple-columns . status__info . display-name strong . display-name__html ,
. layout-multiple-columns . reply-indicator . display-name strong . display-name__html ,
. layout-multiple-columns . notification__message ,
. layout-multiple-columns . getting-started__trends h4 a ,
. layout-multiple-columns . trends__item__name a ,
. layout-multiple-columns . emoji-mart-search input ,
. layout-multiple-columns . language-dropdown__dropdown__results__item ,
. layout-multiple-columns . reply-indicator__content ,
. layout-multiple-columns . compose-form . compose-form__modifiers : focus ,
. layout-multiple-columns . compose-form . autosuggest-textarea__textarea ,
. layout-multiple-columns . compose-form . spoiler-input__input : focus ,
. layout-multiple-columns . compose-panel . compose-form__autosuggest-wrapper : focus ,
. layout-multiple-columns . compose-form . compose-form__buttons-wrapper : focus ,
. layout-multiple-columns . autosuggest-textarea . autosuggest-textarea__textarea : focus ,
. layout-multiple-columns . account__section-headline a . active ,
. layout-multiple-columns . account__section-headline button . active ,
. layout-multiple-columns . notification__filter-bar a . active ,
. layout-multiple-columns . notification__filter-bar button . active {
2023-03-08 15:28:39 +02:00
color : var ( --color-light-text ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . muted . status__info * ,
. layout-multiple-columns . muted . status__info . display-name * {
2023-03-08 15:28:39 +02:00
color : var ( --color-light-text ) ;
}
/* Account names */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__info . display-name . display-name__account ,
. layout-multiple-columns . display-name__account {
2023-03-08 15:28:39 +02:00
color : var ( --color-dim ) ;
}
/* Main panel column */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__main > div {
2023-03-08 15:28:39 +02:00
border-left : 1px solid var ( --color-border ) ;
border-right : 1px solid var ( --color-border ) ;
}
/* Status header */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status . status__info {
2023-03-08 15:28:39 +02:00
align-items : flex-start ;
gap : var ( --gap-default ) ;
height : calc ( var ( --gap-default ) * 2 ) ;
justify-content : flex-start ;
margin-bottom : 0 ;
2023-07-06 14:16:21 +03:00
padding-bottom : 0 ;
}
/* Status action bar */
2023-07-16 15:02:27 +03:00
. layout-multiple-columns . status__action-bar {
2023-07-06 14:16:21 +03:00
margin-top : 12px ;
2023-07-28 20:23:01 +03:00
max-height : 27px ;
2023-03-08 15:28:39 +02:00
}
/* Display name */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__info . status__display-name {
2023-03-08 15:28:39 +02:00
align-items : flex-start ;
display : inline-flex ;
gap : var ( --gap-default ) ;
order : 1 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__info . display-name {
2023-03-08 15:28:39 +02:00
display : flex ;
gap : calc ( var ( --gap-default ) / 2 ) ;
}
/* The separator dot */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__info :: before {
2023-03-08 15:28:39 +02:00
color : var ( --color-dim ) ;
content : "·" ;
display : inline-block ;
font-size : var ( --font-size ) ;
2023-07-26 01:13:00 +03:00
font-weight : var ( --font-weight-regular ) ;
2023-03-08 15:28:39 +02:00
height : 20px ;
margin-left : -6px ;
margin-right : -10px ;
order : 2 ;
position : relative ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__info . status__relative-time {
2023-03-08 15:28:39 +02:00
height : unset ;
order : 3 ;
}
/* Visibility icon */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status . status__visibility-icon {
2023-03-18 14:15:07 +02:00
font-size : var ( --font-size-mid ) ;
2023-03-08 15:28:39 +02:00
}
/* Panels and things that should be transparent */
2023-10-04 22:11:41 +03:00
. layout-multiple-columns . search-results__section__header ,
2023-10-04 22:09:20 +03:00
. layout-multiple-columns . explore__search-results ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__wrapper-direct ,
. layout-multiple-columns . focusable : focus . detailed-status ,
. layout-multiple-columns . focusable : focus . detailed-status__action-bar ,
. layout-multiple-columns . compose-form__poll-wrapper select ,
. layout-multiple-columns . poll__option input [ type = "text" ] ,
. layout-multiple-columns . language-dropdown__dropdown ,
2023-03-23 20:00:34 +02:00
body . embed . activity-stream . entry ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . report-dialog-modal__textarea ,
. layout-multiple-columns . column-inline-form ,
. layout-multiple-columns . scrollable . account-card ,
. layout-multiple-columns . scrollable . account-card__title__avatar . account__avatar ,
. layout-multiple-columns . scrollable . account-card__title__avatar img ,
. layout-multiple-columns . explore__search-header ,
. layout-multiple-columns . empty-column-indicator ,
. layout-multiple-columns . follow_requests-unlocked_explanation ,
. layout-multiple-columns . column-link ,
. layout-multiple-columns . columns-area__panels__pane--navigational . navigation-panel ,
. layout-multiple-columns . tabs-bar__wrapper . column-back-button ,
. layout-multiple-columns . account__header ,
. layout-multiple-columns . column-header__back-button ,
. layout-multiple-columns . compose-form . compose-form__modifiers ,
. layout-multiple-columns . compose-form . autosuggest-textarea__textarea ,
. layout-multiple-columns . compose-form . spoiler-input__input ,
. layout-multiple-columns . compose-panel . compose-form__autosuggest-wrapper ,
. layout-multiple-columns . compose-form . compose-form__buttons-wrapper ,
. layout-multiple-columns . column-header__button ,
. layout-multiple-columns . account__section-headline button ,
. layout-multiple-columns . notification__filter-bar button ,
. layout-multiple-columns . account__section-headline ,
. layout-multiple-columns . notification__filter-bar ,
. layout-multiple-columns . tabs-bar__wrapper ,
. layout-multiple-columns . column-header ,
2023-03-23 20:00:34 +02:00
body . embed . detailed-status ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status ,
. layout-multiple-columns . detailed-status__action-bar ,
. layout-multiple-columns . column > . scrollable {
2023-03-08 15:28:39 +02:00
background-color : transparent ;
}
/* Avatar */
2023-03-08 17:03:18 +02:00
. account__avatar [ style = "width: 46px; height: 46px;" ] ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__avatar {
2023-03-08 17:03:18 +02:00
/* Need to override inline styles */
/* stylelint-disable-next-line */
height : var ( --size-avatar ) ! important ;
2023-03-09 21:46:19 +02:00
/* stylelint-disable-next-line */
2023-03-10 13:37:40 +02:00
max-height : var ( --size-avatar ) ! important ;
2023-03-10 13:21:39 +02:00
/* stylelint-disable-next-line */
2023-03-10 13:37:40 +02:00
max-width : var ( --size-avatar ) ! important ;
2023-03-10 13:21:39 +02:00
/* stylelint-disable-next-line */
2023-03-10 13:37:40 +02:00
min-height : var ( --size-avatar ) ! important ;
2023-03-10 13:21:39 +02:00
/* stylelint-disable-next-line */
2023-03-09 21:46:19 +02:00
min-width : var ( --size-avatar ) ! important ;
2023-03-08 17:03:18 +02:00
/* Need to override inline styles */
/* stylelint-disable-next-line */
width : var ( --size-avatar ) ! important ;
2023-03-08 15:28:39 +02:00
}
2023-03-11 22:43:54 +02:00
/* Avatars */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account-card__title__avatar . account__avatar ,
. layout-multiple-columns . account-card__title__avatar img ,
. layout-multiple-columns . account__avatar > img ,
. layout-multiple-columns . column > . scrollable . status__avatar img {
2023-03-09 13:42:41 +02:00
border : 0 ;
2023-03-08 15:28:39 +02:00
border-radius : 50 % ;
box-shadow : rgb ( 255 255 255 / 0 . 03 ) 0 0 2px inset ;
}
2023-03-11 22:43:54 +02:00
/* Things that should not have border */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-inline-form ,
. layout-multiple-columns . column > . scrollable ,
. layout-multiple-columns . error-column ,
. layout-multiple-columns . getting-started ,
. layout-multiple-columns . regeneration-indicator ,
. layout-multiple-columns . column-header {
2023-03-11 22:43:54 +02:00
border : 0 ;
}
/* Nice active effect in the column header */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-header__wrapper . active {
2023-03-25 18:02:16 +02:00
box-shadow : var ( --active-header-box-shadow ) ;
2023-03-11 22:43:54 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-header__wrapper . active :: before {
2023-03-11 22:43:54 +02:00
/* stylelint-disable-next-line */
2023-03-25 18:02:16 +02:00
background : var ( --active-header-radial-gradient ) ;
2023-03-11 22:43:54 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . compose-form__autosuggest-wrapper ,
. layout-multiple-columns . compose-form__buttons-wrapper {
2023-03-11 22:43:54 +02:00
border : 0 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns article ,
. layout-multiple-columns . status__prepend ,
. layout-multiple-columns . notification__message ,
. layout-multiple-columns . status {
2023-03-08 15:28:39 +02:00
transition : all 200ms ;
}
2023-03-11 22:43:54 +02:00
/* Toot hover effect */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns article : focus ,
. layout-multiple-columns article : hover {
2023-03-08 15:28:39 +02:00
background-color : var ( --color-light-shade ) ;
}
2023-03-12 16:34:07 +02:00
/* Focusable toot and other hilighted items */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . compose-form . autosuggest-textarea__suggestions__item . selected ,
. layout-multiple-columns . compose-form . autosuggest-textarea__suggestions__item : active ,
. layout-multiple-columns . compose-form . autosuggest-textarea__suggestions__item : focus ,
. layout-multiple-columns . compose-form . autosuggest-textarea__suggestions__item : hover ,
. layout-multiple-columns . focusable : focus {
2023-03-25 18:28:40 +02:00
/* stylelint-disable-next-line */
background : var ( --color-focusable-toot ) ;
2023-03-11 22:43:54 +02:00
}
2023-03-23 22:19:17 +02:00
/* Search panel that opens when focusing Search or paste URL field */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . explore__search-header . search__popout ,
. layout-multiple-columns . compose-form__poll-wrapper option ,
. layout-multiple-columns . search__popout ,
. layout-multiple-columns . search-popout {
2023-03-23 21:54:28 +02:00
background-color : var ( --color-dark ) ;
border-color : var ( --color-dark ) ;
color : var ( --color-dim ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . search__popout em ,
. layout-multiple-columns . search-popout em {
2023-03-23 21:54:28 +02:00
color : var ( --color-light-text ) ;
}
2023-08-23 23:03:07 +03:00
/* Pill style tags */
. layout-multiple-columns . hashtag-bar a {
background-color : var ( --color-dark ) ;
border-radius : 9999px ;
color : var ( --color-light-purple ) ;
display : inline-block ;
font-size : var ( --font-size-smaller ) ;
font-weight : var ( --font-weight-semibold ) ;
line-height : 1 . 5 ;
margin : 0 4px 4px 0 ;
padding : 4px 8px ;
text-decoration : none ;
}
. layout-multiple-columns . hashtag-bar . link-button {
font-size : var ( --font-size-smaller ) ;
}
. layout-multiple-columns . hashtag-bar a : focus ,
. layout-multiple-columns . hashtag-bar a : hover {
background-color : var ( --color-accent-dark ) ;
2023-08-23 23:33:36 +03:00
/* It should be always light also on light mode, so not using variable here */
color : # f7f9f9 ;
2023-08-23 23:03:07 +03:00
}
. layout-multiple-columns . hashtag-bar a : focus span ,
. layout-multiple-columns . hashtag-bar a : hover span {
text-decoration : none ;
}
2023-03-08 15:28:39 +02:00
/* Status update tinted to right */
2023-08-23 23:26:38 +03:00
. layout-multiple-columns . status : not ( . status--in-thread ) . hashtag-bar ,
2023-07-05 00:53:29 +03:00
. layout-multiple-columns . status__content--collapsed + . status__content__read-more-button ,
. layout-multiple-columns . status : not ( . status--in-thread ) . status__action-bar ,
. layout-multiple-columns . status : not ( . status--in-thread ) . attachment-list ,
. layout-multiple-columns . status : not ( . status--in-thread ) . status__content {
2023-03-08 15:28:39 +02:00
font-size : var ( --font-size ) ;
padding-left : calc ( var ( --size-avatar ) + var ( --gap-default ) ) ;
2023-04-05 23:39:30 +03:00
padding-top : 0 ;
2023-03-08 15:28:39 +02:00
}
2023-04-05 21:37:45 +03:00
/* Translate link and other padding resets */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . conversation . attachment-list ,
. layout-multiple-columns . translate ~ . status__content__read-more-button {
2023-03-19 18:26:47 +02:00
padding-left : 0 ;
}
2023-07-06 19:27:52 +03:00
/* Make sure read more/translate button is always aligned to center vertically and to left horizontally */
2023-07-05 00:53:29 +03:00
. layout-multiple-columns . status__content__read-more-button {
align-items : center ;
display : flex ;
justify-content : flex-start ;
2023-07-06 19:27:52 +03:00
margin-inline-start : 0 ;
2023-07-05 00:53:29 +03:00
}
2023-03-13 21:04:56 +02:00
/* Rtl version */
2023-07-03 22:21:53 +03:00
[ dir = "rtl" ] . layout-multiple-columns . status__action-bar ,
2023-07-06 01:41:24 +03:00
[ dir = "rtl" ] . layout-multiple-columns . attachment-list ,
2023-07-03 22:21:53 +03:00
[ dir = "rtl" ] . layout-multiple-columns . status__content__read-more-button ,
[ dir = "rtl" ] . layout-multiple-columns . status . status__content {
2023-03-13 21:04:56 +02:00
padding-left : 0 ;
padding-right : calc ( var ( --size-avatar ) + var ( --gap-default ) ) ;
}
2023-03-09 21:48:23 +02:00
/* Reset padding from attachment-list on reply indicator */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . reply-indicator . attachment-list {
2023-03-09 21:48:23 +02:00
padding-left : 0 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__action-bar button ,
. layout-multiple-columns . detailed-status__action-bar button {
2023-03-08 17:28:58 +02:00
border-radius : 50 % ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__action-bar . icon-button [ disabled ] ,
. layout-multiple-columns . status__action-bar . icon-button [ disabled ] {
2023-03-12 15:42:29 +02:00
opacity : . 5 ;
pointer-events : none ;
}
2024-07-11 18:01:29 +03:00
/* Grouped notification exceptions, pr30440 2024-07-11 */
. layout-multiple-columns . notification-ungrouped . status . hashtag-bar ,
. layout-multiple-columns . notification-ungrouped . status . status__content ,
. layout-multiple-columns . notification-ungrouped . status . status__action-bar {
padding-left : var ( --gap-default ) ;
}
. layout-multiple-columns . notification-ungrouped . notification-ungrouped__header {
padding-left : calc ( 24px + var ( --gap-default ) ) ;
}
2023-03-08 16:19:09 +02:00
/* Media inside status update tinted to right */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status . audio-player ,
. layout-multiple-columns . status . video-player ,
. layout-multiple-columns . status . media-gallery {
2023-03-08 16:19:09 +02:00
margin-left : auto ;
2023-03-12 16:37:18 +02:00
/* Need to override inline styles */
/* stylelint-disable-next-line */
2023-03-15 11:13:41 +02:00
width : calc ( 100 % - calc ( var ( --size-avatar ) + var ( --gap-default ) ) ) ! important ;
2023-03-08 16:19:09 +02:00
}
2023-07-26 22:55:27 +03:00
/* Fix aspect-ratio for some videos in mastodon v4.1.5-nightly-2023-07-26 */
2023-07-27 21:46:34 +03:00
. layout-multiple-columns div [ style * = 'aspect-ratio' ] : not ( [ class ] ) {
2023-07-26 22:55:27 +03:00
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
aspect-ratio : unset ! important ;
}
2024-01-07 17:11:44 +02:00
/* Start: Experimental Threads-like media proportions, if the height is tall, show smaller media: https://mementomori.social/@rolle/111715197571142727 */
. layout-multiple-columns . media-gallery__item . standalone img ,
. layout-multiple-columns . video-player . media-gallery__preview {
object-fit : contain ;
}
. layout-multiple-columns . status . audio-player ,
. layout-multiple-columns . status . media-gallery ,
. layout-multiple-columns . status . video-player ,
. layout-multiple-columns . audio-player ,
. layout-multiple-columns . media-gallery ,
. layout-multiple-columns . media-gallery__gifv ,
. layout-multiple-columns . media-gallery__preview ,
. layout-multiple-columns . video-player {
margin-left : calc ( var ( --size-avatar ) + var ( --gap-default ) ) ;
max-height : 430px ;
/* stylelint-disable-next-line */
width : unset ! important ;
}
. layout-multiple-columns . spoiler-button + . media-gallery__item > . media-gallery__preview {
/* stylelint-disable-next-line */
margin-left : unset ! important ;
/* stylelint-disable-next-line */
max-height : unset ! important ;
/* stylelint-disable-next-line */
width : 100 % ! important ;
}
2024-01-27 16:24:11 +02:00
. layout-multiple-columns . media-gallery__gifv ,
2024-01-07 17:11:44 +02:00
. layout-multiple-columns . detailed-status . audio-player ,
. layout-multiple-columns . detailed-status . media-gallery ,
. layout-multiple-columns . detailed-status . media-gallery__gifv ,
. layout-multiple-columns . detailed-status . media-gallery__preview ,
. layout-multiple-columns . detailed-status . video-player {
margin-left : 0 ;
2024-01-12 20:10:01 +02:00
}
2024-01-27 16:24:11 +02:00
. layout-multiple-columns . media-gallery__preview {
2024-01-12 20:10:01 +02:00
/* stylelint-disable-next-line */
margin-left : 0 ! important ;
/* stylelint-disable-next-line */
width : 100 % ! important ;
}
2024-01-27 16:24:11 +02:00
. layout-multiple-columns . media-gallery > . media-gallery__item : nth-of-type ( odd ) ,
. layout-multiple-columns . media-gallery > . media-gallery__item : nth-of-type ( odd ) > a ,
. layout-multiple-columns . media-gallery__preview : nth-of-type ( odd ) ,
2024-01-12 20:10:01 +02:00
{
border-bottom-right-radius : 0 ;
border-top-right-radius : 0 ;
}
2024-01-27 16:24:11 +02:00
. layout-multiple-columns . media-gallery > . media-gallery__item : nth-of-type ( even ) ,
. layout-multiple-columns . media-gallery > . media-gallery__item : nth-of-type ( even ) > a ,
. layout-multiple-columns . media-gallery__preview : nth-of-type ( even ) {
2024-01-12 20:10:01 +02:00
border-bottom-left-radius : 0 ;
border-top-left-radius : 0 ;
2024-01-07 17:11:44 +02:00
}
/* End: Experimental Threads-like media proportions, if the height is tall, show smaller media */
2024-06-30 19:48:41 +03:00
. layout-multiple-columns . status . status-card + . more-from-author ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status . status-card {
2023-03-08 15:28:39 +02:00
margin-left : calc ( var ( --size-avatar ) + var ( --gap-default ) ) ;
}
/* Detailed status update */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status . status__content {
2023-03-08 15:28:39 +02:00
font-size : var ( --font-size-bigger ) ;
2023-07-06 00:17:48 +03:00
line-height : 1 . 4 ;
2023-03-08 15:28:39 +02:00
}
2023-03-23 20:00:34 +02:00
body . embed . detailed-status__meta ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__meta {
2023-03-08 16:36:16 +02:00
color : var ( --color-dim ) ;
font-size : var ( --font-size ) ;
}
2023-03-23 20:00:34 +02:00
body . embed . detailed-status__meta {
line-height : 1 . 5 ;
}
body . embed . detailed-status__reblogs ,
body . embed . detailed-status__favorites ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__favorites ,
. layout-multiple-columns . detailed-status__reblogs {
2023-03-08 16:36:16 +02:00
display : inline-flex ;
font-size : var ( --font-size ) ;
gap : 4px ;
}
2023-03-23 20:00:34 +02:00
body . embed . detailed-status__meta . animated-number ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__meta . animated-number {
2023-03-08 16:36:16 +02:00
color : var ( --color-light-text ) ;
font-weight : var ( --font-weight-bold ) ;
}
2023-03-23 20:00:34 +02:00
body . embed . detailed-status__reblogs ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__reblogs {
2023-03-08 16:36:16 +02:00
font-size : var ( --font-size ) ;
}
2023-03-23 20:00:34 +02:00
body . embed . detailed-status__reblogs ,
body . embed . detailed-status__favorites {
color : var ( --color-light-text ) ;
font-weight : var ( --font-weight-bold ) ;
}
2023-12-06 16:16:21 +02:00
/* Fix alignment */
. layout-multiple-columns . detailed-status__link {
2023-12-06 16:34:59 +02:00
top : 0 ;
2023-12-06 16:16:21 +02:00
}
2023-12-30 13:00:53 +02:00
/* Profile lock icon alignment fix */
. layout-multiple-columns . account__header__tabs__name h1 small {
display : flex ;
gap : 4px ;
margin-top : 4px ;
}
2023-07-27 21:41:13 +03:00
/* Textual labels for detailed metrics */
2023-10-29 21:09:09 +02:00
body . embed . detailed-status__link > . icon-reply + span :: after ,
. layout-multiple-columns . detailed-status__link > . icon-reply + span :: after {
2023-07-27 17:47:00 +03:00
color : var ( --color-dim ) ;
content : 'Replies' ;
font-weight : var ( --font-weight-semibold ) ;
}
2023-10-29 21:09:09 +02:00
body . embed . detailed-status__link > . icon-retweet + span :: after ,
. layout-multiple-columns . detailed-status__link > . icon-retweet + span :: after {
2023-03-23 20:00:34 +02:00
color : var ( --color-dim ) ;
2023-03-08 16:36:16 +02:00
content : 'Boosts' ;
2023-07-26 01:13:00 +03:00
font-weight : var ( --font-weight-semibold ) ;
2023-03-08 16:36:16 +02:00
}
2023-10-29 21:09:09 +02:00
body . embed . detailed-status__link > . icon-star + span :: after ,
. layout-multiple-columns . detailed-status__link > . icon-star + span :: after {
2023-03-23 20:00:34 +02:00
color : var ( --color-dim ) ;
2023-03-08 16:36:16 +02:00
content : 'Favourites' ;
2023-07-26 01:13:00 +03:00
font-weight : var ( --font-weight-semibold ) ;
2023-03-08 16:36:16 +02:00
}
2023-10-29 21:09:09 +02:00
body . embed . detailed-status__meta . detailed-status__link . icon-star ,
body . embed . detailed-status__meta . detailed-status__link . icon-retweet ,
. layout-multiple-columns . detailed-status__meta . detailed-status__link . icon-star ,
. layout-multiple-columns . detailed-status__meta . detailed-status__link . icon-retweet {
2023-03-08 16:36:16 +02:00
display : none ;
}
2023-03-08 15:28:39 +02:00
/* Icon buttons */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . icon-button {
2024-06-30 16:34:09 +03:00
border-bottom-left-radius : 9999px ;
border-bottom-right-radius : 9999px ;
border-top-left-radius : 9999px ;
border-top-right-radius : 9999px ;
2023-03-08 15:28:39 +02:00
color : var ( --color-dim ) ;
}
2023-07-05 01:34:27 +03:00
/* Hide/Show media button */
2023-07-05 01:56:15 +03:00
. layout-multiple-columns . spoiler-button . spoiler-button--minified > button {
2023-07-05 01:34:27 +03:00
background-color : var ( --color-bg ) ;
2023-07-05 02:19:28 +03:00
border-radius : var ( --border-radius-badges ) ;
2023-07-05 01:34:27 +03:00
color : var ( --color-ghost-button-text ) ;
opacity : . 5 ;
}
2023-07-05 02:05:00 +03:00
/* Alt badge */
. layout-multiple-columns . media-gallery__item__badges > span {
2023-07-05 02:19:28 +03:00
border-radius : var ( --border-radius-badges ) ;
}
/* Distance from the edge */
. layout-multiple-columns . spoiler-button--minified {
2023-07-05 02:31:06 +03:00
inset-inline-start : var ( --badges-distance-from-edge ) ;
top : var ( --badges-distance-from-edge ) ;
2023-07-05 02:19:28 +03:00
}
. layout-multiple-columns . media-gallery__item__badges {
2023-07-05 02:31:06 +03:00
bottom : var ( --badges-distance-from-edge ) ;
inset-inline-start : var ( --badges-distance-from-edge ) ;
2023-07-05 02:05:00 +03:00
}
2023-07-05 02:10:06 +03:00
. layout-multiple-columns . spoiler-button . spoiler-button--minified > button : hover ,
. layout-multiple-columns . spoiler-button . spoiler-button--minified > button : focus {
2023-07-05 01:34:27 +03:00
opacity : 1 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . icon-button : hover {
2023-03-08 15:28:39 +02:00
color : var ( --color-accent ) ;
}
2023-03-12 17:35:43 +02:00
/* Other general buttons */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-header__button . active : active ,
2023-03-12 17:35:43 +02:00
. column-header__button . active : focus ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-header__button . active : hover {
2023-03-12 17:35:43 +02:00
background-color : var ( --color-focusable-toot ) ;
color : var ( --color-fg ) ;
}
2023-03-08 15:28:39 +02:00
/* Bars on panels */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . ui__header ,
. layout-multiple-columns . columns-area__panels__main > div . tabs-bar__wrapper ,
. layout-multiple-columns . tabs-bar__wrapper {
2023-03-08 15:28:39 +02:00
backdrop-filter : blur ( 12px ) ;
background-color : var ( --color-bg-75 ) ;
2023-03-12 17:03:41 +02:00
border-color : var ( --color-border ) ;
2023-03-08 15:28:39 +02:00
padding : 0 ;
}
2023-03-12 00:14:17 +02:00
@ media ( min-width : 1175px ) {
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . ui__header ,
. layout-multiple-columns . columns-area__panels__main > div . tabs-bar__wrapper ,
. layout-multiple-columns . tabs-bar__wrapper {
2023-03-12 00:14:17 +02:00
margin-right : -2px ;
}
}
2023-03-08 15:28:39 +02:00
/* Hidden things */
2023-03-08 22:34:05 +02:00
/* stylelint-disable-next-line */
2024-02-25 16:38:57 +02:00
. layout-multiple-columns . column-header . column-header__icon : not ( . icon-user-plus ) : not ( . icon-user-times ) {
2023-03-08 15:28:39 +02:00
display : none ;
}
/* Column headers */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-header {
2023-03-08 15:28:39 +02:00
font-size : var ( --font-size-heading ) ;
font-weight : var ( --font-weight-bold ) ;
}
2023-03-09 14:39:37 +02:00
/* Column sub-headers */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-subheading {
2023-03-09 14:39:37 +02:00
background-color : transparent ;
color : var ( --color-fg ) ;
2023-08-04 21:41:34 +03:00
/* stylelint-disable-next-line */
font-size : var ( --font-size-bigger ) ! important ;
/* stylelint-disable-next-line */
font-weight : var ( --font-weight-bold ) ! important ;
/* stylelint-disable-next-line */
padding-bottom : 12px ! important ;
/* stylelint-disable-next-line */
padding-top : 24px ! important ;
2023-03-09 14:39:37 +02:00
text-transform : unset ;
}
/* "Your lists" view */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-subheading ~ article {
2023-03-09 14:39:37 +02:00
padding-left : var ( --gap-default ) ;
padding-right : var ( --gap-default ) ;
}
2023-03-08 15:28:39 +02:00
/* Notifications */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification__message {
2023-03-08 15:28:39 +02:00
display : grid ;
gap : var ( --gap-default ) ;
grid-template-columns : minmax ( 0 , var ( --size-avatar ) ) minmax ( 0 , 1fr ) ;
height : calc ( var ( --gap-default ) * 2 ) ;
}
2024-07-11 18:01:29 +03:00
/* Notification groups, pr30440 2024-07-11 */
. layout-multiple-columns . notification-group {
display : grid ;
gap : var ( --gap-default ) ;
grid-template-columns : minmax ( 0 , var ( --size-avatar ) ) minmax ( 0 , 1fr ) ;
}
2023-03-08 15:32:35 +02:00
/* Make sure notification user is clickable */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification__display-name {
2023-03-08 15:32:35 +02:00
position : relative ;
z-index : 99 ;
}
2023-03-09 13:14:49 +02:00
/* Hack to display notification message title on one line */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification__message > span {
2023-03-09 12:47:40 +02:00
display : block ;
2023-03-16 19:56:41 +02:00
margin-top : calc ( var ( --size-avatar-small ) + 6px ) ;
2023-03-09 13:14:49 +02:00
overflow : visible ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification__message > span > span {
2023-03-09 13:14:49 +02:00
display : block ;
2023-03-09 12:47:40 +02:00
overflow : hidden ;
text-overflow : ellipsis ;
white-space : nowrap ;
2023-03-08 15:28:39 +02:00
}
2023-09-24 11:29:42 +03:00
/* Truncate too long unfollow buttons and texts beside it so they don't overlap in notifications */
@ media ( max-width : 600px ) {
. layout-multiple-columns . notification . account__relationship > . button ,
. layout-multiple-columns . notification__report__actions . button {
max-width : 24vw ;
}
. layout-multiple-columns . notification__message > span > span {
max-width : 50vw ;
}
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification__message > div {
2023-03-08 15:28:39 +02:00
display : flex ;
justify-content : flex-end ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . muted . status__avatar {
2023-03-08 15:28:39 +02:00
opacity : 1 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . account__avatar-overlay-base {
2023-03-08 15:28:39 +02:00
display : none ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . account__avatar ,
. layout-multiple-columns . notification . account__avatar-overlay-overlay . account__avatar ,
. layout-multiple-columns . notification . account__avatar-overlay-overlay {
2023-03-08 15:28:39 +02:00
/* Need to override inline styles */
/* stylelint-disable-next-line */
height : var ( --size-avatar-small ) ! important ;
/* stylelint-disable-next-line */
2023-03-10 13:37:40 +02:00
min-height : var ( --size-avatar-small ) ! important ;
/* stylelint-disable-next-line */
min-width : var ( --size-avatar-small ) ! important ;
2023-03-16 13:49:35 +02:00
position : absolute ;
2023-03-10 13:37:40 +02:00
/* stylelint-disable-next-line */
2023-03-08 15:28:39 +02:00
width : var ( --size-avatar-small ) ! important ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . status__info . status__display-name {
2023-03-08 15:28:39 +02:00
overflow : visible ;
}
2023-05-07 13:24:16 +03:00
/* Fixes: User avatars in notifications are sometimes links to my profile instead of theirs #25 */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-reblog . status__info . status__display-name ,
. layout-multiple-columns . notification . notification-follow . status__info . status__display-name ,
. layout-multiple-columns . notification . notification-favourite . status__info . status__display-name {
2023-05-07 13:24:16 +03:00
pointer-events : none ;
}
2023-03-08 21:20:18 +02:00
/* Hack to show follow notification more minimal way */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-admin-report . notification__report ,
. layout-multiple-columns . notification . notification-admin-sign-up . account__wrapper ,
. layout-multiple-columns . notification . notification-update . account__wrapper ,
. layout-multiple-columns . notification . notification-follow . account__wrapper {
2023-03-08 15:28:39 +02:00
position : relative ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-admin-report . account__avatar-overlay-overlay {
2023-03-16 13:49:35 +02:00
top : calc ( -1 * calc ( var ( --size-avatar-small ) + var ( --gap-default ) + 4px ) ) ;
}
2023-03-08 21:20:18 +02:00
/* Hack to show follow notification more minimal way */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-poll . display-name ,
. layout-multiple-columns . notification . notification-update . display-name__html ,
. layout-multiple-columns . notification . notification-update . display-name__account ,
. layout-multiple-columns . notification . notification-admin-sign-up . display-name__html ,
. layout-multiple-columns . notification . notification-admin-sign-up . display-name ,
. layout-multiple-columns . notification . notification-follow . display-name__html {
2023-03-08 21:20:18 +02:00
visibility : hidden ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-update . account__avatar-wrapper ,
. layout-multiple-columns . notification . notification-admin-sign-up . account__avatar-wrapper ,
. layout-multiple-columns . notification . notification-follow . account__avatar-wrapper ,
. layout-multiple-columns . notification . account__avatar-overlay {
2023-03-08 15:28:39 +02:00
left : calc ( var ( --size-avatar-small ) + var ( --gap-default ) + 18px ) ;
margin-top : calc ( -1 * calc ( var ( --size-avatar-small ) + var ( --gap-default ) ) ) ;
position : absolute ;
top : 4px ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-admin-report . account__avatar-overlay {
2023-03-16 11:38:53 +02:00
margin-top : 0 ;
top : 0 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-status . notification__message > span {
2023-03-08 15:28:39 +02:00
display : none ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-follow . verified-badge ,
2023-07-05 00:53:29 +03:00
. layout-multiple-columns . notification . notification-admin-sign-up . account__contents ,
. layout-multiple-columns . notification . notification-follow . account__contents ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-follow . display-name ,
. layout-multiple-columns . notification . notification-admin-sign-up . display-name + span ,
. layout-multiple-columns . notification . notification-follow . display-name + span ,
. layout-multiple-columns . notification . notification-favourite . status__wrapper-direct . status__prepend ,
. layout-multiple-columns . notification . notification-reblog . display-name ,
. layout-multiple-columns . notification . notification-favourite . display-name {
2023-03-08 15:28:39 +02:00
display : none ;
}
2023-04-05 23:51:34 +03:00
/* Minimal boost notification fix */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-reblog . notification__message > span {
2023-04-06 08:39:43 +03:00
margin-top : calc ( var ( --size-avatar-small ) + calc ( var ( --gap-default ) / 2 ) ) ;
2023-04-05 23:33:22 +03:00
}
2023-04-05 23:14:52 +03:00
/* Minimal follow notification fix */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-follow . notification__message > span {
2023-04-08 11:36:23 +03:00
margin-top : calc ( calc ( var ( --size-avatar-small ) + calc ( var ( --gap-default ) / 2 ) ) + 6px ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification . notification-admin-sign-up . account__relationship ,
. layout-multiple-columns . notification . notification-follow . account__relationship {
2023-04-08 11:43:09 +03:00
transform : translateY ( -8px ) ;
}
2023-04-08 11:36:23 +03:00
/* stylelint-disable-next-line */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-follow . account__avatar-wrapper {
2023-04-08 11:36:23 +03:00
top : 6px ;
2023-04-05 23:14:52 +03:00
}
2023-04-05 23:33:22 +03:00
/* Minimal fav notification fix */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-favourite . notification__message > span {
2023-04-06 08:39:43 +03:00
margin-top : calc ( var ( --size-avatar-small ) + calc ( var ( --gap-default ) / 2 ) ) ;
2023-04-05 23:33:22 +03:00
}
2023-04-06 10:33:01 +03:00
/* If a status content is empty and there's only attachment, remove gap */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . status__content : has ( . status__content__text : empty ) + . attachment-list {
2023-04-06 08:34:55 +03:00
margin-top : 0 ;
}
2023-04-06 10:33:01 +03:00
/* Less space before attachments if no status content */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status . status__content : has ( . status__content__text : empty ) + . audio-player ,
. layout-multiple-columns . status . status__content : has ( . status__content__text : empty ) + . video-player ,
. layout-multiple-columns . status . status__content : has ( . status__content__text : empty ) + . media-gallery ,
. layout-multiple-columns . detailed-status . status__content : has ( . status__content__text : empty ) + . audio-player ,
. layout-multiple-columns . detailed-status . status__content : has ( . status__content__text : empty ) + . video-player ,
. layout-multiple-columns . detailed-status . status__content : has ( . status__content__text : empty ) + . media-gallery {
2023-04-06 10:33:01 +03:00
margin-top : calc ( var ( --gap-default ) / 2 ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__prepend {
2023-03-08 15:28:39 +02:00
padding-left : calc ( var ( --size-avatar ) - 4px ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-update . account__display-name ,
. layout-multiple-columns . notification . notification-follow . account__display-name {
2023-03-08 15:28:39 +02:00
display : inline-flex ;
gap : var ( --gap-default ) ;
padding-left : calc ( var ( --size-avatar ) + var ( --gap-default ) ) ;
}
2023-03-15 20:10:41 +02:00
/* Admin reports and other admin notifications */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification-admin-report . notification__report {
2023-03-16 11:38:53 +02:00
border-color : var ( --color-border ) ;
display : flex ;
font-size : var ( --font-size ) ;
gap : 16px ;
margin-top : 22px ;
padding : 16px ;
2023-03-15 20:10:41 +02:00
padding-left : calc ( var ( --size-avatar ) + var ( --gap-default ) ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification-admin-report . notification__report__details {
2023-03-15 20:10:41 +02:00
color : var ( --color-dim ) ;
font-size : var ( --font-size ) ;
}
2024-01-28 20:34:11 +02:00
/* stylelint-disable-next-line */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification-admin-report . notification__report__details strong {
2023-07-26 01:13:00 +03:00
font-weight : var ( --font-weight-regular ) ;
2023-03-15 20:10:41 +02:00
}
2023-03-15 20:22:16 +02:00
/* Revert hack for notification admin message that has no avatar visible */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification-admin-report . notification__message > span {
2023-03-15 20:10:41 +02:00
display : block ;
margin-top : calc ( var ( --size-avatar-small ) + 4px ) ;
overflow : visible ;
}
2023-03-08 15:28:39 +02:00
/* Hide things in notifications */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . status__relative-time ,
. layout-multiple-columns . notification . status__info :: before {
2023-03-08 15:28:39 +02:00
display : none ;
}
/* Right side panel */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel {
2023-03-27 19:37:46 +03:00
box-sizing : border-box ;
margin-top : 0 ;
2023-04-05 23:39:30 +03:00
overflow-y : auto ;
2023-03-27 19:37:46 +03:00
padding : 10px ;
2023-03-26 15:33:15 -04:00
}
2023-03-27 19:37:46 +03:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel hr {
2023-03-08 15:28:39 +02:00
/* Hide but reserve space */
visibility : hidden ;
}
2023-03-08 18:18:32 +02:00
. columns-area__panels__pane--navigational . navigation-panel {
border : 0 ;
2023-03-18 16:02:51 +02:00
height : 100 % ;
2023-03-08 18:18:32 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel__logo hr {
2023-03-27 19:37:46 +03:00
margin : 0 ;
2023-03-26 15:33:15 -04:00
}
2023-03-29 10:06:41 +03:00
/* Attempt to hide scrollbars for .navigation-panel for Firefox */
. dropdown-menu__container__list--scrollable ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel {
2023-03-29 10:06:41 +03:00
scrollbar-width : none ;
}
/* Hide scrollbars for .navigation-panel for Chrome and Safari */
2023-03-15 20:32:02 +02:00
. dropdown-menu__container__list--scrollable :: -webkit-scrollbar ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel :: -webkit-scrollbar {
2023-03-09 13:14:49 +02:00
display : none ;
2023-04-05 23:39:30 +03:00
width : 4px ;
2023-03-09 13:14:49 +02:00
}
2023-07-05 00:47:39 +03:00
/* Columns */
. layout-multiple-columns . column {
border-right : 1px solid var ( --color-border ) ;
padding-left : 0 ;
padding-right : 0 ;
2023-09-23 17:44:37 +03:00
padding-top : 0 ;
2023-07-05 00:47:39 +03:00
width : var ( --width-column ) ;
}
. layout-multiple-columns . column-subheading ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link {
2023-03-08 17:53:25 +02:00
align-items : center ;
2023-03-08 15:28:39 +02:00
color : var ( --color-light-text ) ;
2023-07-05 00:47:39 +03:00
display : flex ;
font-size : var ( --font-size ) ;
2023-08-04 21:41:34 +03:00
font-weight : var ( --font-weight-semibold ) ;
2023-09-25 17:35:38 +02:00
gap : var ( --gap-column-link ) ;
2023-03-27 19:37:46 +03:00
overflow : visible ;
2023-08-04 21:41:34 +03:00
padding-bottom : 8px ;
2023-09-25 17:35:38 +02:00
padding-left : var ( --gap-column-link ) ;
padding-right : calc ( var ( --gap-column-link ) * 1 . 5 ) ;
2023-08-04 21:41:34 +03:00
padding-top : 8px ;
2023-03-08 15:28:39 +02:00
transition : all 100ms ;
}
2023-07-03 22:21:53 +03:00
[ dir = "rtl" ] . layout-multiple-columns . column-link {
2023-03-13 21:04:56 +02:00
margin-left : auto ;
margin-right : 0 ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link > . icon {
2023-08-04 21:41:34 +03:00
min-width : 20px ;
2023-09-23 13:31:42 -04:00
width : 26px ;
2023-03-26 15:33:15 -04:00
}
2023-03-27 19:37:46 +03:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link > span {
2023-03-26 15:33:15 -04:00
position : relative ;
}
2023-03-27 19:37:46 +03:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__section-headline a {
2023-03-08 15:28:39 +02:00
transition : all 200ms ;
}
2023-09-16 19:24:51 +03:00
. layout-multiple-columns . dropdown-menu__item a : hover ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification__filter-bar button : hover ,
. layout-multiple-columns . account__section-headline a : hover {
2023-03-08 15:28:39 +02:00
background-color : var ( --color-column-link-hover ) ;
}
2023-04-08 11:29:22 +03:00
/* Mobile devices */
@ media ( hover : none ) {
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification__filter-bar button . active : hover ,
. layout-multiple-columns . account__section-headline a . active : hover {
2023-04-08 11:29:22 +03:00
background-color : transparent ;
}
}
2023-03-12 17:35:43 +02:00
/* Notification filter bar */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification__filter-bar {
2023-03-12 17:35:43 +02:00
border-bottom : 1px solid var ( --color-border ) ;
border-left : 0 ;
border-right : 0 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link__icon {
2023-03-08 15:28:39 +02:00
margin : 0 ;
}
/* Notification badge on side panel */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . icon-with-badge__badge {
2023-03-08 15:28:39 +02:00
border-radius : 50 % ;
2023-03-08 16:36:16 +02:00
font-size : 11px ;
2023-03-08 15:28:39 +02:00
left : 12px ;
top : -6px ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link--transparent . active {
2023-03-08 15:28:39 +02:00
color : var ( --color-light-text ) ;
font-weight : var ( --font-weight-bold ) ;
}
/* Top panel */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__section-headline a . active :: after ,
. layout-multiple-columns . account__section-headline button . active :: after ,
. layout-multiple-columns . notification__filter-bar a . active :: after ,
. layout-multiple-columns . notification__filter-bar button . active :: after {
2023-03-08 15:28:39 +02:00
background-color : var ( --color-accent ) ;
border : 0 ;
border-bottom-left-radius : 9999px ;
border-bottom-right-radius : 9999px ;
border-top-left-radius : 9999px ;
border-top-right-radius : 9999px ;
2023-09-07 13:32:25 +03:00
bottom : -1px ;
content : "" ;
display : block ;
2023-03-08 15:28:39 +02:00
height : 4px ;
2023-09-07 13:32:25 +03:00
left : 50 % ;
2023-03-08 15:28:39 +02:00
min-width : 56px ;
2023-09-07 13:32:25 +03:00
position : absolute ;
transform : translateX ( -50 % ) ;
2023-03-08 15:28:39 +02:00
}
2023-10-29 21:09:09 +02:00
/* Notification icons */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__section-headline a . active :: before ,
. layout-multiple-columns . account__section-headline button . active :: before ,
. layout-multiple-columns . notification__filter-bar a . active :: before ,
. layout-multiple-columns . notification__filter-bar button . active :: before {
2023-03-08 15:28:39 +02:00
display : none ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . notification-reblog . status__action-bar ,
. layout-multiple-columns . notification . notification-favourite . status__action-bar {
2023-03-08 15:28:39 +02:00
display : none ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . status__prepend . icon-retweet {
background-image : var ( --icon-boost-status-prepend ) ;
2023-03-08 15:28:39 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification . notification__message . icon {
align-self : start ;
height : 27px ;
justify-self : end ;
2023-03-08 15:28:39 +02:00
margin-right : 4px ;
max-width : 30px ;
2023-10-29 21:09:09 +02:00
width : 27px ;
2023-03-08 15:28:39 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification . notification__message . icon . icon-retweet {
color : var ( --color-green ) ;
height : 24px ;
width : 24px ;
2023-03-08 15:39:41 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification . icon . icon-user-plus : not ( . icon-link ) {
2023-03-10 14:56:15 +02:00
color : var ( --color-accent-dark ) ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . account__relationship . icon . icon-user-plus : not ( . icon-link ) ,
. layout-multiple-columns . notification . account__relationship . icon . icon-user-plus : not ( . icon-link ) {
2023-03-13 21:08:00 +02:00
color : var ( --color-dim ) ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification . icon . icon-flag ,
. layout-multiple-columns . notification . icon . icon-tasks : not ( . icon-link ) {
2023-03-10 14:56:15 +02:00
color : var ( --color-accent-dark ) ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification . icon . icon-home : not ( . icon-link ) {
2023-03-10 14:56:15 +02:00
color : var ( --color-accent-dark ) ;
2023-10-29 21:09:09 +02:00
height : 24px ;
width : 24px ;
2023-03-08 23:39:07 +02:00
}
2023-03-23 20:00:34 +02:00
/* Follow/unfollow button */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__relationship . icon-button ,
. layout-multiple-columns . notification . account__relationship . icon-button {
2023-03-13 16:48:43 +02:00
background-color : transparent ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification . account__relationship . icon {
2023-03-10 17:54:35 +02:00
/* stylelint-disable-next-line */
2023-03-13 20:14:00 +02:00
color : var ( --color-dim ) ;
2023-03-08 22:35:46 +02:00
font-size : 20px ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . list-adder__lists . icon-times ,
. layout-multiple-columns . account__wrapper . account__relationship . icon-button . active . icon ,
. layout-multiple-columns . explore__search-results . account__relationship . icon-button . active . icon ,
. layout-multiple-columns . notification . account__relationship . icon-button . active . icon {
2023-03-13 16:48:43 +02:00
/* stylelint-disable-next-line */
2023-03-13 20:14:00 +02:00
color : var ( --color-green ) ;
2023-03-13 16:48:43 +02:00
opacity : . 75 ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . list-adder__lists . icon-times : hover ,
. layout-multiple-columns . explore__search-results . icon-button . active : hover . icon ,
. layout-multiple-columns . notification . account__relationship . icon-button . active : hover . icon {
2023-03-13 16:48:43 +02:00
/* stylelint-disable-next-line */
2023-03-13 20:14:00 +02:00
color : var ( --color-red ) ;
2023-03-13 19:58:21 +02:00
opacity : 1 ;
2023-03-13 16:48:43 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . explore__search-results . icon-button : focus . icon ,
. layout-multiple-columns . notification . account__relationship . icon-button : focus . icon ,
. layout-multiple-columns . explore__search-results . icon-button . active : focus . icon ,
. layout-multiple-columns . notification . account__relationship . icon-button . active : focus . icon ,
. layout-multiple-columns . explore__search-results . icon-button : hover . icon ,
. layout-multiple-columns . notification . account__relationship . icon-button : hover . icon {
2023-03-13 16:48:43 +02:00
/* stylelint-disable-next-line */
2023-03-13 20:14:00 +02:00
color : var ( --color-green ) ;
2023-03-13 19:58:21 +02:00
opacity : 1 ;
2023-03-13 16:48:43 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . account__relationship {
2023-03-10 21:07:11 +02:00
border-radius : 50 % ;
height : 24px ;
2023-04-05 23:20:26 +03:00
transform : translateY ( -4px ) ;
2023-03-10 21:07:11 +02:00
}
2023-03-13 20:36:41 +02:00
/* Emoji-mart search input */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . emoji-mart-search-icon svg {
2023-03-13 20:36:41 +02:00
fill : var ( --color-border ) ;
opacity : 1 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . emoji-mart-search > input : focus-visible ~ . emoji-mart-search-icon svg {
2023-03-13 20:36:41 +02:00
fill : var ( --color-accent ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . emoji-mart-search > input {
2023-03-13 20:41:23 +02:00
font-size : var ( --font-size-smaller ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . compose-form__autosuggest-wrapper textarea :: placeholder ,
. layout-multiple-columns . report-dialog-modal__textarea :: placeholder ,
. layout-multiple-columns . emoji-mart-search > input :: placeholder {
2023-03-13 20:41:23 +02:00
color : var ( --color-dim ) ;
opacity : 1 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . report-dialog-modal__textarea ,
. layout-multiple-columns . report-dialog-modal__textarea : focus ,
. layout-multiple-columns . emoji-mart-search > input : focus {
2023-03-13 20:41:23 +02:00
color : var ( --color-light-text ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . emoji-mart-search-icon : disabled {
2023-03-13 20:36:41 +02:00
opacity : 1 ;
}
2023-03-09 14:39:37 +02:00
/* Search */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . search . search__icon . icon-search {
2023-07-03 23:06:42 +03:00
background-image : var ( --icon-search ) ;
2023-03-08 15:28:39 +02:00
background-position : center ;
background-repeat : no-repeat ;
background-size : 20px ;
display : inline-block ;
height : 24px ;
2024-01-28 11:59:03 +02:00
width : 24px ;
}
. layout-multiple-columns . search . search__icon . icon {
2024-01-27 16:24:11 +02:00
inset-inline-start : unset ;
2024-01-28 11:59:03 +02:00
position : absolute ;
2024-01-27 16:24:11 +02:00
right : 14px ;
2023-10-30 18:59:38 +02:00
top : 9px ;
2023-03-08 15:28:39 +02:00
}
2023-10-30 18:59:38 +02:00
. layout-multiple-columns . search . search__icon . icon-search path {
display : none ;
}
2024-01-28 17:15:17 +02:00
. layout-multiple-columns . search . active . search__input ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns input . setting-text ,
. layout-multiple-columns . search__input {
2023-03-08 15:28:39 +02:00
background-color : var ( --color-mud ) ;
2023-03-11 22:43:54 +02:00
border-color : var ( --color-mud ) ;
2023-03-08 15:28:39 +02:00
border-radius : 32px ;
color : var ( --color-dim ) ;
font-size : var ( --font-size ) ;
height : 42px ;
padding : 0 20px ;
}
2023-03-30 08:47:49 +03:00
/* Input texts */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . poll__option input [ type = "text" ] ,
. layout-multiple-columns input . setting-text : focus ,
. layout-multiple-columns . search__input : focus {
2023-03-09 21:10:44 +02:00
color : var ( --color-light-text ) ;
}
2023-03-30 08:47:49 +03:00
/* Poll input */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . poll__option input [ type = "text" ] {
2023-03-30 08:47:49 +03:00
background-color : transparent ;
border-color : var ( --color-border ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . poll__option input [ type = "text" ] : focus {
2023-03-30 08:47:49 +03:00
border-color : var ( --color-accent ) ;
}
/* Placeholders */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . poll__option input [ type = "text" ] :: placeholder ,
. layout-multiple-columns . search__input :: placeholder ,
. layout-multiple-columns input :: placeholder ,
. layout-multiple-columns input . setting-text :: placeholder {
2023-03-09 14:39:37 +02:00
color : var ( --color-dim ) ;
opacity : 1 ;
}
2023-03-08 15:28:39 +02:00
/* Profile */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . getting-started__trends h4 ,
. layout-multiple-columns . account__header__bar {
2023-03-08 15:28:39 +02:00
border-color : var ( --color-border ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__bio . account__header__fields {
2023-03-08 15:28:39 +02:00
background-color : transparent ;
2024-03-22 18:26:03 +02:00
border : 0 ;
2023-03-08 15:28:39 +02:00
color : var ( --color-dim ) ;
display : flex ;
flex-wrap : wrap ;
gap : var ( --gap-default ) ;
padding : 0 ;
}
2024-03-22 18:44:43 +02:00
/* New popout styles */
. layout-multiple-columns . account__domain-pill__popout {
border : 1px solid var ( --color-mud ) ;
color : var ( --color-light-purple ) ;
}
2024-03-22 18:34:20 +02:00
. layout-multiple-columns . account__domain-pill__popout__parts > div : nth-child ( 2 ) svg {
background-image : var ( --icon-globe-purple ) ;
background-size : 24px ;
}
2024-03-22 18:44:43 +02:00
. layout-multiple-columns . account__domain-pill__popout__handle {
background-color : var ( --color-dark ) ;
border : 0 ;
color : var ( --color-accent ) ;
padding : 12px 10px ;
}
/* Hide unnecessary header icon for minimalism */
. layout-multiple-columns . account__domain-pill__popout__header__icon {
display : none ;
}
. account__domain-pill__popout > p {
font-size : var ( --font-size-smaller ) ;
line-height : 1 . 3 ;
}
2023-11-12 16:43:25 +02:00
/* Truncate too long links in the profile, like Nostr */
2024-02-09 21:06:58 +02:00
. layout-multiple-columns . account__header__bio . account__header__fields span > a : only-of-type {
2023-11-12 16:43:25 +02:00
display : block ;
2023-11-12 20:41:56 +02:00
max-width : 220px ;
2023-11-12 16:43:25 +02:00
overflow : hidden ;
text-overflow : ellipsis ;
white-space : nowrap ;
}
2023-09-23 22:52:43 +03:00
. layout-multiple-columns . account__header__bio . account__header__fields dl :: after {
content : '|' ;
order : 2 ;
}
/* Recognize empty field and remove pipe */
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dd > span : empty ) :: after {
display : none ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__bio . account__header__fields dt {
2023-09-23 22:52:43 +03:00
order : 1 ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dd {
order : 3 ;
}
/* Hide the character in between Joined label */
. layout-multiple-columns . account__header__bio . account__header__fields dl : first-of-type :: before ,
. layout-multiple-columns . account__header__bio . account__header__fields dl : first-of-type :: after {
2023-03-08 15:28:39 +02:00
display : none ;
}
2023-09-23 22:52:43 +03:00
/* Make full width... */
/* stylelint-disable no-duplicate-selectors */
. layout-multiple-columns . account__header__bio . account__header__fields dl {
width : 100 % ;
}
/* stylelint-enable no-duplicate-selectors */
/* ...except on those that have label with GitHub, github, YouTube or similar */
2024-02-10 16:30:43 +02:00
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "github" i ] , dt [ title * = "youtube" i ] , dt [ title * = "website" i ] , dt [ title * = "twitch" i ] , dt [ title * = "twitter" i ] , dt [ title = "x" i ] , dt [ title * = "discord" i ] , dt [ title * = "linkedin" i ] , dt [ title * = "instagram" i ] , dt [ title = "IG" ] , dt [ title ~ = "Mastodon account" i ] , dt [ title ~ = "Mastodon account" i ] , dt [ title ~ = "account" i ] , dt [ title = "Alt account" i ] , dt [ title * = "mastodon" i ] , dt [ title * = "masto" i ] , dt [ title * = "ko-fi" i ] , dt [ title * = "kofi" i ] , dt [ title * = "paypal" i ] , dt [ title * = "patreon" i ] , dt [ title * = "threads" i ] , dt [ title * = "bluesky" i ] , dt [ title * = "nostr" i ] , dt [ title * = "facebook" i ] , dt [ title * = "friendica" i ] , dt [ title * = "pronouns" i ] , dt [ title * = "wordpress" i ] , dt [ title * = "fb" i ] , dt [ title * = "bandcamp" i ] ) {
max-width : 50 % ;
2023-11-12 16:33:49 +02:00
/* Move to last */
order : 9999 ;
width : auto ;
}
2023-09-23 22:52:43 +03:00
/* Hide labels that show "Website", "YouTube", etc. */
2024-02-10 16:30:43 +02:00
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "github" i ] , dt [ title * = "youtube" i ] , dt [ title * = "website" i ] , dt [ title * = "twitch" i ] , dt [ title * = "twitter" i ] , dt [ title = "x" i ] , dt [ title * = "discord" i ] , dt [ title * = "linkedin" i ] , dt [ title * = "instagram" i ] , dt [ title = "IG" ] , dt [ title ~ = "Mastodon account" i ] , dt [ title ~ = "Mastodon account" i ] , dt [ title ~ = "account" i ] , dt [ title = "Alt account" i ] , dt [ title * = "mastodon" i ] , dt [ title * = "masto" i ] , dt [ title * = "ko-fi" i ] , dt [ title * = "kofi" i ] , dt [ title * = "paypal" i ] , dt [ title * = "patreon" i ] , dt [ title * = "threads" i ] , dt [ title * = "bluesky" i ] , dt [ title * = "nostr" i ] , dt [ title * = "bandcamp" i ] , dt [ title * = "facebook" i ] , dt [ title * = "friendica" i ] , dt [ title * = "pronouns" i ] , dt [ title * = "wordpress" i ] , dt [ title * = "fb" i ] ) dt {
2023-09-23 22:52:43 +03:00
display : none ;
}
2023-09-24 00:45:09 +03:00
/* Hide pipe after link icon and the link icon from the ones that already have an icon */
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "website" i ] ) :: after ,
2024-02-10 16:30:43 +02:00
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "github" i ] , dt [ title * = "youtube" i ] , dt [ title * = "twitch" i ] , dt [ title * = "twitter" i ] , dt [ title = "x" i ] , dt [ title * = "discord" i ] , dt [ title * = "linkedin" i ] , dt [ title * = "instagram" i ] , dt [ title = "IG" ] , dt [ title ~ = "Mastodon account" i ] , dt [ title ~ = "Mastodon account" i ] , dt [ title ~ = "account" i ] , dt [ title = "Alt account" i ] , dt [ title * = "mastodon" i ] , dt [ title * = "masto" i ] , dt [ title * = "ko-fi" i ] , dt [ title * = "kofi" i ] , dt [ title * = "paypal" i ] , dt [ title * = "patreon" i ] , dt [ title * = "threads" i ] , dt [ title * = "bluesky" i ] , dt [ title * = "nostr" i ] , dt [ title * = "bandcamp" i ] , dt [ title * = "facebook" i ] , dt [ title * = "friendica" i ] , dt [ title * = "pronouns" i ] , dt [ title * = "wordpress" i ] , dt [ title * = "fb" i ] ) :: before {
2023-09-23 22:52:43 +03:00
display : none ;
}
/* If GitHub etc. move even further from links */
2024-02-10 16:30:43 +02:00
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "github" i ] , dt [ title * = "youtube" i ] , dt [ title * = "twitch" i ] , dt [ title * = "twitter" i ] , dt [ title = "x" i ] , dt [ title * = "discord" i ] , dt [ title * = "linkedin" i ] , dt [ title * = "instagram" i ] , dt [ title = "IG" ] , dt [ title = "bandcamp" ] , dt [ title = "facebook" ] , dt [ title = "friendica" ] , dt [ title = "pronouns" ] , dt [ title = "wordpress" ] , dt [ title = "fb" ] ) {
2023-09-23 22:52:43 +03:00
/* Move to last-last */
order : 99999 ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "github" i ] ) :: after {
content : var ( --icon-github ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "discord" i ] ) :: after {
content : var ( --icon-discord ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "linkedin" i ] ) :: after {
content : var ( --icon-linkedin ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title = "IG" ] , dt [ title * = "instagram" i ] ) :: after {
content : var ( --icon-instagram ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "youtube" i ] ) :: after {
content : var ( --icon-youtube ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "twitch" i ] ) :: after {
content : var ( --icon-twitch ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title = "x" i ] ) :: after ,
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "twitter" i ] ) :: after {
content : var ( --icon-twitter ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "patreon" i ] ) :: after {
content : var ( --icon-patreon ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "paypal" i ] ) :: after {
content : var ( --icon-paypal ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "kofi" i ] ) :: after ,
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "ko-fi" i ] ) :: after {
content : var ( --icon-kofi ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
2024-02-10 16:30:43 +02:00
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "bandcamp" i ] ) :: after {
content : var ( --icon-bandcamp ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "facebook" i ] ) :: after ,
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "fb" i ] ) :: after {
content : var ( --icon-facebook ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "friendica" i ] ) :: after {
content : var ( --icon-friendica ) ;
height : 18 . 5px ;
transform : scale ( . 9 ) ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "pronouns" i ] ) :: after {
content : var ( --icon-genderless-pronouns ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "wordpress" i ] ) :: after {
content : var ( --icon-wordpress ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
2023-09-23 22:52:43 +03:00
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "masto" i ] ) :: after ,
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "mastodon" i ] ) :: after ,
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title = "Alt account" i ] ) :: after ,
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title ~ = "account" i ] ) :: after ,
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title ~ = "Mastodon account" i ] ) :: after {
content : var ( --icon-mastodon ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
2023-11-12 16:33:49 +02:00
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "threads" i ] ) :: after {
content : var ( --icon-threads ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "bluesky" i ] ) :: after {
content : var ( --icon-bluesky ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
. layout-multiple-columns . account__header__bio . account__header__fields dl : has ( dt [ title * = "nostr" i ] ) :: after {
content : var ( --icon-nostr ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
2023-09-23 22:52:43 +03:00
/* Default link icon */
. layout-multiple-columns . account__header__bio . account__header__fields dl :: before {
content : var ( --icon-link ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
/* If the profile item has no link element, show just label icon */
. layout-multiple-columns . account__header__bio . account__header__fields dl : not ( : has ( a ) ) :: before {
content : var ( --icon-label ) ;
height : 18 . 5px ;
width : 18 . 5px ;
}
/* Verified colors for Firefox before :has */
2023-09-23 23:03:23 +03:00
. layout-multiple-columns . account__details . verified-badge a ,
2023-09-23 22:52:43 +03:00
. layout-multiple-columns . account__header__bar . account__header__fields . verified__mark ,
. layout-multiple-columns . account__header__bar . account__header__fields . verified a ,
. layout-multiple-columns . account__header__bar . account__header__bio . account__header__fields . verified a ,
. layout-multiple-columns . account__header__bar . account__header__bio . account__header__fields . verified dd {
color : var ( --color-verified ) ;
font-weight : var ( --font-weight-regular ) ;
}
/* Reset verified colors */
2023-09-23 23:03:23 +03:00
. layout-multiple-columns . account__details . verified-badge a ,
2023-09-23 22:52:43 +03:00
. layout-multiple-columns . account__header__bar : has ( . account__header__fields . verified ) . account__header__fields . verified__mark ,
. layout-multiple-columns . account__header__bar : has ( . account__header__fields . verified ) . account__header__fields . verified a ,
. layout-multiple-columns . account__header__bar : has ( . account__header__fields . verified ) . account__header__bio . account__header__fields . verified a ,
. layout-multiple-columns . account__header__bar : has ( . account__header__fields . verified ) . account__header__bio . account__header__fields . verified dd {
color : var ( --color-accent ) ;
font-weight : var ( --font-weight-regular ) ;
}
/* Replace verified__mark */
2023-10-29 21:52:32 +02:00
. layout-multiple-columns . account__details . verified-badge . verified-badge__mark ,
2023-09-23 22:52:43 +03:00
. layout-multiple-columns . account__header__bar : has ( . account__header__fields . verified ) . account__header__fields . verified__mark {
2023-10-29 21:52:32 +02:00
background-image : var ( --icon-verified-smaller ) ;
background-repeat : no-repeat ;
height : 15px ;
width : 15px ;
}
. layout-multiple-columns . account__details . verified-badge . verified-badge__mark path ,
. layout-multiple-columns . account__header__bar : has ( . account__header__fields . verified ) . account__header__fields . verified__mark path {
display : none ;
2023-09-23 22:52:43 +03:00
}
2023-09-23 23:03:23 +03:00
. layout-multiple-columns . account__details . verified-badge ,
2023-09-23 22:52:43 +03:00
. layout-multiple-columns . account__header__bar : has ( . account__header__fields . verified ) . account__header__fields . verified dd {
align-items : center ;
display : inline-flex ;
gap : 4px ;
}
2023-09-23 23:03:23 +03:00
. layout-multiple-columns . account__details . verified-badge . verified-badge__mark ,
2023-09-23 22:52:43 +03:00
. layout-multiple-columns . account__header__bar : has ( . account__header__fields . verified ) . account__header__fields . verified dd span : nth-child ( 1 ) {
align-items : center ;
display : flex ;
order : 2 ;
}
2023-09-23 23:03:23 +03:00
. layout-multiple-columns . account__details . verified-badge > span ,
2023-09-23 22:52:43 +03:00
. layout-multiple-columns . account__header__bar : has ( . account__header__fields . verified ) . account__header__fields . verified dd span : nth-child ( 2 ) {
order : 1 ;
}
2023-03-08 15:28:39 +02:00
/* Joined label */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__bio . account__header__fields dt : not ( [ title ] ) {
2023-03-08 15:28:39 +02:00
display : inline-flex ;
2023-07-26 01:13:00 +03:00
font-weight : var ( --font-weight-regular ) ;
2023-03-08 15:28:39 +02:00
gap : calc ( var ( --gap-default ) / 2 ) ;
2023-03-08 17:53:59 +02:00
text-transform : unset ;
2023-03-08 15:28:39 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns h4 ,
. layout-multiple-columns . search__popout h4 ,
. layout-multiple-columns . search-popout h4 ,
. layout-multiple-columns . server-banner h4 {
2023-03-08 23:28:26 +02:00
text-transform : unset ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__bio . account__header__fields dt : not ( [ title ] ) :: before {
2023-03-10 13:25:31 +02:00
content : url ( 'data:image/svg+xml, %3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" fill="%23717c9b" class="r-115tad6 r-4qtqp9 r-yyyyoo r-1xvli5t r-1d4mawv r-dnmrzs r-bnwqim r-1plcrui r-lrvibr"%3E%3Cg%3E%3Cpath d="M7 4V3h2v1h6V3h2v1h1.5C19.89 4 21 5.12 21 6.5v12c0 1.38-1.11 2.5-2.5 2.5h-13C4.12 21 3 19.88 3 18.5v-12C3 5.12 4.12 4 5.5 4H7zm0 2H5.5c-.27 0-.5.22-.5.5v12c0 .28.23.5.5.5h13c.28 0 .5-.22.5-.5v-12c0-.28-.22-.5-.5-.5H17v1h-2V6H9v1H7V6zm0 6h2v-2H7v2zm0 4h2v-2H7v2zm4-4h2v-2h-2v2zm0 4h2v-2h-2v2zm4-4h2v-2h-2v2z"%3E%3C/path%3E%3C/g%3E%3C/svg%3E' ) ;
2023-03-08 15:28:39 +02:00
height : 18 . 5px ;
width : 18 . 5px ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__bio . account__header__fields dd ,
. layout-multiple-columns . account__header__bio . account__header__fields dt {
2023-03-08 15:28:39 +02:00
color : var ( --color-dim ) ;
font-size : var ( --font-size ) ;
2023-09-24 02:23:32 +03:00
font-weight : var ( --font-weight-regular ) ;
text-transform : unset ;
2023-03-08 15:28:39 +02:00
}
2023-09-24 02:23:32 +03:00
/* stylelint-disable no-duplicate-selectors */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__bio . account__header__fields dl {
2023-03-08 15:28:39 +02:00
background-color : transparent ;
border : 0 ;
color : var ( --color-dim ) ;
display : inline-flex ;
font-size : var ( --font-size ) ;
2023-07-26 01:13:00 +03:00
font-weight : var ( --font-weight-regular ) ;
2023-03-08 15:28:39 +02:00
gap : calc ( var ( --gap-default ) / 2 ) ;
padding : 0 ;
}
2023-09-24 02:26:08 +03:00
/* stylelint-enable no-duplicate-selectors */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . getting-started__trends h4 {
2023-03-10 19:11:33 +02:00
border : 0 ;
2023-03-08 15:28:39 +02:00
font-size : var ( --font-size-heading ) ;
font-weight : var ( --font-weight-bold ) ;
line-height : 24px ;
2023-03-10 19:11:33 +02:00
margin-bottom : var ( --gap-default ) ;
2023-03-08 15:28:39 +02:00
text-transform : unset ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . getting-started__trends {
2023-03-09 13:14:49 +02:00
margin-top : calc ( var ( --gap-default ) * 2 ) ;
}
2023-07-05 00:47:39 +03:00
. layout-multiple-columns . flex-spacer ,
. layout-multiple-columns . getting-started ,
. layout-multiple-columns . getting-started__wrapper {
background-color : transparent ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . trends__item__name a {
2023-03-08 15:28:39 +02:00
font-size : var ( --font-size ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . trends__item__name {
2023-03-08 15:28:39 +02:00
display : grid ;
gap : 4px ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__image {
2023-03-08 15:28:39 +02:00
height : 200px ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__bar . avatar . account__avatar {
2023-03-08 15:28:39 +02:00
background-color : transparent ;
border : 0 ;
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
2023-07-05 00:47:39 +03:00
height : 90px ! important ;
2023-03-08 15:28:39 +02:00
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
2023-07-05 00:47:39 +03:00
width : 90px ! important ;
2023-03-08 15:28:39 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__tabs {
2023-03-08 15:28:39 +02:00
overflow : visible ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__tabs . account-role {
2023-03-08 15:28:39 +02:00
display : none ;
2023-07-05 00:47:39 +03:00
width : 90px ;
2023-03-08 15:28:39 +02:00
}
2023-08-04 21:54:35 +03:00
/* Follow/unfollow button */
. layout-multiple-columns . button . button--with-bell {
padding : 7px 18px ;
}
2023-03-23 20:00:34 +02:00
/* Follow/unfollow button */
body . embed . button . logo-button ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification__report__actions . button ,
. layout-multiple-columns . column-inline-form button ,
. layout-multiple-columns . explore__suggestions . account-card__actions__button button ,
2023-07-05 00:54:49 +03:00
. layout-multiple-columns . account__header__tabs__buttons . button ,
. layout-multiple-columns . account . account__relationship > . button ,
. layout-multiple-columns . notification . account__relationship > . button {
2023-03-08 15:28:39 +02:00
background-color : transparent ;
border-bottom-left-radius : 9999px ;
border-bottom-right-radius : 9999px ;
border-top-left-radius : 9999px ;
border-top-right-radius : 9999px ;
color : var ( --color-light-text ) ;
font-size : var ( --font-size ) ;
2023-09-23 13:19:09 +03:00
max-width : 36vw ;
overflow : hidden ;
2023-03-08 15:28:39 +02:00
padding-left : 16px ;
padding-right : 16px ;
2023-09-23 13:19:09 +03:00
text-overflow : ellipsis ;
2023-03-08 15:28:39 +02:00
transition : all 200ms ;
2023-09-23 13:19:09 +03:00
white-space : nowrap ;
2023-03-08 15:28:39 +02:00
}
2023-04-26 08:41:50 +03:00
/* Dark button borders and other things that have borders all around */
body . embed . button . logo-button ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification__report__actions . button ,
. layout-multiple-columns . column-inline-form button ,
. layout-multiple-columns . explore__suggestions . account-card__actions__button button ,
. layout-multiple-columns . account__header__tabs__buttons . button ,
2023-07-05 00:54:49 +03:00
. layout-multiple-columns . account__header__tabs__buttons . icon-button ,
. layout-multiple-columns . notification . account__relationship > . button ,
. layout-multiple-columns . account . account__relationship > . button {
2023-04-26 08:41:50 +03:00
border : 1px solid var ( --color-outer-space ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__tabs__buttons . icon-button {
2023-03-10 17:08:58 +02:00
color : var ( --color-light-text ) ;
}
2023-03-10 21:07:11 +02:00
/* stylelint-disable-next-line */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__tabs__buttons . icon-button {
2023-10-29 13:39:08 +02:00
align-items : center ;
2023-03-08 21:40:05 +02:00
border-bottom-left-radius : 9999px ;
border-bottom-right-radius : 9999px ;
border-top-left-radius : 9999px ;
border-top-right-radius : 9999px ;
display : inline-flex ;
2023-11-26 15:37:54 +02:00
height : 36px ;
2023-03-08 21:40:05 +02:00
justify-content : center ;
2023-11-26 15:37:54 +02:00
padding : 0 ;
width : 36px ;
}
/* Copy-icon size in profile */
2023-11-26 17:39:35 +02:00
. layout-multiple-columns . account__header__tabs__buttons . icon-button svg {
2023-11-26 15:37:54 +02:00
height : 18px ;
width : 18px ;
2023-03-08 21:40:05 +02:00
}
2023-03-23 20:00:34 +02:00
body . embed . button . logo-button : hover ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-inline-form button : hover ,
. layout-multiple-columns . explore__suggestions . account-card__actions__button button : hover ,
. layout-multiple-columns . account__header__tabs__buttons . icon-button . active {
2023-03-08 21:40:05 +02:00
color : var ( --color-light-text ) ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . account__header__tabs__buttons . icon-button . icon-bell-o ,
. layout-multiple-columns . account__header__tabs__buttons . icon-button . icon-bell {
2023-03-25 18:09:27 +02:00
content : var ( --icon-bell-header-tabs ) ;
2023-03-08 21:40:05 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . account__header__tabs__buttons . icon-button . active . icon-bell-o ,
. layout-multiple-columns . account__header__tabs__buttons . icon-button . active . icon-bell {
2023-03-25 18:09:27 +02:00
content : var ( --icon-bell-header-tabs-active ) ;
2023-03-08 21:40:05 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . explore__suggestions . account-card__actions__button button : hover ,
. layout-multiple-columns . account__header__tabs__buttons . button : focus ,
2023-07-05 00:47:39 +03:00
. layout-multiple-columns . account__header__tabs__buttons . button : hover {
2023-03-08 15:28:39 +02:00
background-color : var ( --color-profile-button-hover ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__action-bar . icon-button : focus ,
. layout-multiple-columns . status__action-bar . icon-button : focus ,
. layout-multiple-columns . detailed-status__action-bar . icon-button : hover ,
. layout-multiple-columns . status__action-bar . icon-button : hover {
2023-03-09 19:11:37 +02:00
background-color : transparent ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__action-bar . icon-button : hover :: after ,
. layout-multiple-columns . status__action-bar . icon-button : hover :: after {
2023-03-09 19:11:37 +02:00
opacity : 1 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . conversation__content {
2023-03-18 15:42:05 +02:00
overflow : visible ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__button {
2023-03-09 22:10:09 +02:00
position : relative ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__button . icon-button . star-icon :: after {
2023-03-09 22:10:09 +02:00
transform : translateX ( 3px ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__action-bar . icon-button . icon-button--with-counter :: after {
2023-07-05 00:47:39 +03:00
transform : translateX ( -6px ) translateY ( 2px ) ;
2023-03-09 19:11:37 +02:00
}
2023-03-08 15:28:39 +02:00
/* Misc UI fixes */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . search__icon . icon . active {
2023-07-03 23:06:42 +03:00
opacity : 1 ;
2023-03-08 22:30:57 +02:00
}
2023-03-10 15:26:25 +02:00
/* Explore -> For you shade in bio */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . scrollable . account-card__bio :: after {
2023-03-10 15:26:25 +02:00
/* stylelint-disable-next-line */
background : linear-gradient ( 270deg , var ( --color-bg ) , transparent ) ;
}
2023-03-09 20:53:40 +02:00
/* Empty column */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . empty-column-indicator {
2023-03-09 20:53:40 +02:00
min-height : 120px ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__prepend + . status {
2023-03-08 22:46:06 +02:00
padding-top : 10px ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . search__icon . icon-times-circle {
2023-10-30 18:59:38 +02:00
top : 9px ;
2023-03-08 22:30:57 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . setting-text__toolbar {
2023-03-08 15:28:39 +02:00
align-items : center ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . timeline-hint strong {
2023-03-08 21:40:05 +02:00
display : block ;
margin-bottom : var ( --gap-default ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . timeline-hint br {
2023-03-08 21:40:05 +02:00
display : none ;
}
2023-03-09 12:16:25 +02:00
/* General fixes */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__bar . avatar {
2023-03-09 12:16:25 +02:00
/* stylelint-disable-next-line */
margin-left : 0 ! important ;
}
/* Fix for button line-height */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . button . logo-button {
2023-03-09 12:16:25 +02:00
line-height : 22px ;
}
/ * Visual indicator about direct messages
@ source https : / / github . com / mastodon / mastodon / issues / 22158 # issuecomment-1353661031 * /
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status-direct {
2023-03-09 13:17:39 +02:00
position : relative ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__wrapper-direct :: after ,
. layout-multiple-columns . detailed-status-direct :: after {
2023-03-09 12:28:51 +02:00
border-left : 20px solid transparent ;
border-top : 20px solid var ( --color-accent ) ;
/* Add a ribbon to the corner */
content : '' ;
height : 0 ;
position : absolute ;
right : 0 ;
2023-03-09 13:17:39 +02:00
top : 0 ;
2023-03-09 12:28:51 +02:00
width : 0 ;
2023-03-09 12:16:25 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . notification . status__wrapper-direct :: after {
2023-03-09 13:17:39 +02:00
top : -40px ;
}
2023-03-18 15:42:05 +02:00
/* Private message conversations */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . conversation . status__action-bar {
2023-03-18 15:42:05 +02:00
padding-left : 0 ;
}
2023-03-09 15:30:58 +02:00
/* Default buttons */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . compose-form__buttons button ,
. layout-multiple-columns . button {
2023-03-09 15:30:58 +02:00
border-bottom-left-radius : 9999px ;
border-bottom-right-radius : 9999px ;
border-top-left-radius : 9999px ;
border-top-right-radius : 9999px ;
}
2023-03-08 19:19:31 +02:00
/* Compose hover and focus fix */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . report-dialog-modal__actions . button : hover ,
. layout-multiple-columns . server-banner . button ,
. layout-multiple-columns . sign-in-banner . button ,
. layout-multiple-columns . ui__header__links . button ,
. layout-multiple-columns . compose-form__publish-button-wrapper button {
2023-03-08 21:17:08 +02:00
background-color : var ( --color-accent-dark ) ;
border-color : var ( --color-accent-dark ) ;
2023-03-25 18:02:16 +02:00
color : var ( --color-button-text ) ;
2023-03-08 19:19:31 +02:00
transition : all 200ms ;
}
2023-04-01 22:32:34 +03:00
/* Compose form */
2024-01-27 16:24:11 +02:00
. layout-multiple-columns . compose-panel . compose-form__highlightable ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . compose-panel . compose-form {
2023-04-27 11:25:12 +03:00
background-color : transparent ;
2024-01-27 16:24:11 +02:00
border : 0 ;
2023-04-27 11:25:12 +03:00
margin-bottom : 0 ;
position : relative ;
z-index : 4 ;
}
2024-01-27 16:24:11 +02:00
/* New compose form buttons from 4.3.0-alpha 2024-01-27 */
. layout-multiple-columns . compose-form__dropdowns {
gap : 10px ;
}
. layout-multiple-columns . compose-form__dropdowns . dropdown-button . active ,
. layout-multiple-columns . compose-form__dropdowns . dropdown-button {
background-color : transparent ;
border : 0 ;
color : var ( --color-dim ) ;
padding : 0 ;
}
. layout-multiple-columns . compose-form__dropdowns . dropdown-button . active ,
. layout-multiple-columns . compose-form__dropdowns . dropdown-button : hover ,
. layout-multiple-columns . compose-form__dropdowns . dropdown-button : focus {
color : var ( --color-accent ) ;
}
. layout-multiple-columns . compose-form__submit {
flex : unset ;
}
. layout-multiple-columns . compose-form__actions {
justify-content : space-between ;
}
. layout-multiple-columns . compose-form__actions . icon-button . active {
background-color : transparent ;
color : var ( --color-accent ) ;
}
2023-04-27 11:25:12 +03:00
/* Footer items */
. link-footer {
2023-04-04 21:50:22 +03:00
position : relative ;
2023-04-27 11:25:12 +03:00
z-index : 5 ;
2023-04-04 21:50:22 +03:00
}
2024-01-27 16:46:45 +02:00
. layout-multiple-columns . compose-form__footer {
gap : 4px ;
padding-bottom : 6px ;
}
2024-03-23 18:27:28 +02:00
/* Add slight background color for the compose form */
/* stylelint-disable-next-line no-duplicate-selectors */
. layout-multiple-columns . compose-form__highlightable ,
. layout-multiple-columns . compose-form__highlightable . compose-form__buttons-wrapper ,
. layout-multiple-columns . compose-form . compose-form__autosuggest-wrapper ,
. layout-multiple-columns . compose-form . compose-form__buttons-wrapper {
background-color : var ( --color-bg-compose-form ) ;
border-color : var ( --color-bg-compose-form ) ;
padding-top : 0 ;
transition : all 200ms ;
}
2023-07-30 02:35:09 +03:00
2024-03-23 18:27:28 +02:00
/* Smooth color transition on focus */
. layout-multiple-columns . compose-form__highlightable : focus-within ,
. layout-multiple-columns . compose-form . compose-form__autosuggest-wrapper : focus-within ,
. layout-multiple-columns . compose-form . compose-form__autosuggest-wrapper : focus-within ~ . compose-form__buttons-wrapper ,
. layout-multiple-columns . compose-form__highlightable . compose-form__autosuggest-wrapper : focus-within ~ . compose-form__buttons-wrapper {
background-color : var ( --color-bg-compose-form-focus ) ;
border-color : var ( --color-bg-compose-form-focus ) ;
}
2023-07-30 02:35:09 +03:00
2024-03-23 18:27:28 +02:00
/* Fixes bottom row padding when there's a background */
. layout-multiple-columns . compose-form__highlightable . compose-form__buttons-wrapper ,
. layout-multiple-columns . compose-form . compose-form__buttons-wrapper {
padding : calc ( var ( --gap-default ) / 2 ) ;
2023-04-04 22:59:07 +03:00
}
2024-03-23 18:27:28 +02:00
. layout-multiple-columns . navigation-bar + . compose-form {
padding-top : 10px ;
2023-04-01 22:32:34 +03:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . server-banner . button : hover ,
. layout-multiple-columns . server-banner . button : focus ,
. layout-multiple-columns . sign-in-banner . button : hover ,
. layout-multiple-columns . sign-in-banner . button : hover : focus ,
. layout-multiple-columns . ui__header__links . button : hover ,
. layout-multiple-columns . ui__header__links . button : focus ,
. layout-multiple-columns . compose-form__publish-button-wrapper button : hover ,
. layout-multiple-columns . compose-form__publish-button-wrapper button : focus {
2023-03-08 19:19:31 +02:00
background-color : var ( --color-brand-mastodon-links ) ;
2023-03-08 19:55:53 +02:00
border-color : var ( --color-brand-mastodon-links ) ;
2023-03-25 18:02:16 +02:00
color : var ( --color-button-text ) ;
2023-03-08 19:19:31 +02:00
}
2023-03-08 22:27:50 +02:00
/* Tertiary button */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . button . button-tertiary {
2023-03-08 19:55:53 +02:00
/* stylelint-disable-next-line */
background-color : transparent ! important ;
/* stylelint-disable-next-line */
2023-03-17 19:54:57 +02:00
border : 1px solid var ( --color-accent-dark ) ! important ;
2023-03-25 19:41:29 +02:00
color : var ( --color-ghost-button-text ) ;
2023-03-24 13:58:44 +02:00
padding : 6px 17px ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . button . button-tertiary : active ,
. layout-multiple-columns . button . button-tertiary : focus ,
. layout-multiple-columns . button . button-tertiary : hover {
2023-03-17 19:54:57 +02:00
border : 1px solid var ( --color-accent-dark ) ;
2023-03-08 19:55:53 +02:00
}
2023-03-08 22:27:50 +02:00
/* Secondary button */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . button . button-secondary {
2023-03-08 22:27:50 +02:00
/* stylelint-disable-next-line */
background-color : transparent ! important ;
2023-04-03 11:02:14 +03:00
border : 1px solid var ( --color-dim ) ;
2023-03-09 13:24:58 +02:00
color : var ( --color-dim ) ;
2023-03-08 22:27:50 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . button . button-secondary : hover {
2023-03-08 22:27:50 +02:00
/* stylelint-disable-next-line */
background-color : var ( --color-light-text ) ! important ;
border-color : var ( --color-light-text ) ;
color : var ( --color-bg ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . button . button-tertiary : focus ,
. layout-multiple-columns . button . button-tertiary : hover {
2023-03-08 19:55:53 +02:00
/* stylelint-disable-next-line */
background-color : var ( --color-brand-mastodon-links ) ! important ;
/* stylelint-disable-next-line */
2023-03-15 19:56:02 +02:00
border-color : var ( --color-brand-mastodon-links ) ! important ;
2023-03-08 19:55:53 +02:00
/* stylelint-disable-next-line */
color : var ( --color-bg ) ! important ;
2023-03-24 14:20:20 +02:00
2023-03-25 15:54:04 +02:00
/* This is actually wrong in Mastodon default UI as well, hover should not have padding but yet it has */
padding : 6px 17px ;
2023-03-08 19:55:53 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__action-bar . icon-button--with-counter {
2023-03-08 16:49:17 +02:00
align-items : center ;
display : inline-flex ;
2023-03-08 23:39:07 +02:00
gap : 6px ;
2023-03-08 16:49:17 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__action-bar . icon-button {
2023-03-08 16:49:17 +02:00
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
2023-10-29 21:09:09 +02:00
height : 24px ! important ;
2023-10-30 00:01:18 +02:00
position : relative ;
2023-03-08 16:49:17 +02:00
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
2023-10-29 21:09:09 +02:00
width : 30px ! important ;
2023-03-09 19:27:14 +02:00
}
@ media screen and ( min-width : 890px ) {
2023-03-29 10:06:41 +03:00
/* Hide the space between Lists and the actual lists */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . list-panel > hr ,
. layout-multiple-columns . list-panel + hr {
2023-03-29 10:06:41 +03:00
display : none ;
}
/* Hide lists if there's not enough space on desktop vertically */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . list-panel {
2023-03-29 10:06:41 +03:00
display : none ;
opacity : 0 ;
transition : all 200ms ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . list-panel : focus ,
. layout-multiple-columns . list-panel : hover ,
. layout-multiple-columns . column-link [ href = "/lists" ] : focus ~ . list-panel ,
. layout-multiple-columns . column-link [ href = "/lists" ] : hover ~ . list-panel {
2023-03-29 10:06:41 +03:00
display : block ;
opacity : 1 ;
}
2023-07-05 00:47:39 +03:00
2023-03-29 10:06:41 +03:00
/* Order of the side nav items */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel__logo {
2023-03-29 10:06:41 +03:00
order : 1 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link [ href = "/home" ] {
2023-03-29 10:06:41 +03:00
order : 2 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link [ href = "/notifications" ] {
2023-03-29 10:06:41 +03:00
order : 3 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link [ href = "/explore" ] {
2023-03-29 10:06:41 +03:00
order : 4 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link [ href = "/public/local" ] {
2023-03-29 10:06:41 +03:00
order : 5 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link [ href = "/public" ] {
2023-03-29 10:06:41 +03:00
order : 6 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link [ href = "/conversations" ] {
2023-03-29 10:06:41 +03:00
order : 7 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link [ href = '/follow_requests' ] {
2023-04-28 11:50:12 +09:00
order : 8 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link [ href = "/bookmarks" ] {
2023-03-29 10:06:41 +03:00
order : 9 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link [ href = "/favourites" ] {
2023-03-29 10:06:41 +03:00
order : 10 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link [ href = "/lists" ] {
2023-03-29 10:06:41 +03:00
order : 12 ;
}
/* stylelint-disable-next-line no-duplicate-selectors */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . list-panel {
2023-03-29 10:06:41 +03:00
order : 13 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link [ href = "/settings/preferences" ] {
2023-03-29 10:06:41 +03:00
order : 11 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel__sign-in-banner ,
. layout-multiple-columns . navigation-panel__legal {
2023-03-29 10:06:41 +03:00
order : 14 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . flex-spacer {
2023-03-29 10:06:41 +03:00
order : 15 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . getting-started__trends {
2023-03-29 10:06:41 +03:00
order : 16 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__action-bar . icon-button {
2023-03-09 19:27:14 +02:00
position : relative ;
}
2023-03-18 15:42:05 +02:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . conversation . status__action-bar . icon-button {
2023-03-18 15:42:05 +02:00
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
width : auto ! important ;
}
2023-03-19 19:24:04 +02:00
/* Fix list links if they are too short */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . list-panel . column-link {
2023-03-27 19:37:46 +03:00
display : flex ;
2023-03-19 19:24:04 +02:00
}
2023-03-08 16:49:17 +02:00
}
/* Replace bookmark icon */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . status . icon-button : hover : focus . icon-bookmark ,
. layout-multiple-columns . status . icon-button : focus . icon-bookmark ,
. layout-multiple-columns . status . icon-button . active . icon-bookmark {
background-image : var ( --icon-bookmark-active ) ;
2023-03-08 16:49:17 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . status button . icon-button : hover . icon-bookmark {
background-image : var ( --icon-bookmark-status-hover ) ;
2023-03-08 17:53:25 +02:00
}
2023-10-29 21:09:09 +02:00
/ * Replace the original icons ( after 4 . 3 . 0 )
-------------------------------------------
/* Set size for the filter bar and profile icons */
/* stylelint-disable-next-line */
. layout-multiple-columns . account__header__tabs__buttons . icon ,
. layout-multiple-columns . notification__filter-bar . icon {
--size-icon : 20px ;
2023-03-08 17:53:25 +02:00
}
2023-10-29 21:09:09 +02:00
/* Set size for the column link icons */
. layout-multiple-columns . column-link . icon {
--size-icon : 24px ;
height : 26px ;
width : 26px ;
2023-03-08 17:53:25 +02:00
}
2023-10-29 21:09:09 +02:00
/* Set size for the status icons */
. layout-multiple-columns . detailed-status__action-bar . icon ,
. layout-multiple-columns . status__action-bar . icon {
2023-10-31 18:52:19 +02:00
--size-icon : 19px ;
2023-03-08 17:28:58 +02:00
}
2023-10-29 21:09:09 +02:00
/* General for all column icons */
/* stylelint-disable-next-line */
2023-11-01 18:17:04 +02:00
. layout-multiple-columns . list-adder__lists . list__display-name svg > path ,
2023-10-30 00:01:18 +02:00
. layout-multiple-columns . status__prepend . icon . icon-retweet path ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification-favourite . notification__message > . icon ,
. layout-multiple-columns . notification-reblog . notification__message > . icon ,
. layout-multiple-columns . account__header__tabs__buttons . icon ,
. layout-multiple-columns . detailed-status__action-bar . icon ,
. layout-multiple-columns . status__action-bar . icon ,
. layout-multiple-columns . notification__filter-bar . icon ,
. layout-multiple-columns . column-link . icon {
background-position : center ;
background-repeat : no-repeat ;
position : relative ;
}
/* stylelint-disable-next-line */
2023-11-01 20:15:07 +02:00
. layout-multiple-columns . list-adder__lists . icon-plus ,
. layout-multiple-columns . list-adder__lists . icon-times ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . detailed-status__action-bar . icon ,
. layout-multiple-columns . status__action-bar . icon ,
. layout-multiple-columns . notification__filter-bar . icon ,
2024-03-23 15:14:40 +02:00
. layout-multiple-columns . column-header__button . icon-sliders ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link . icon {
background-size : var ( --size-icon ) var ( --size-icon ) ;
height : var ( --size-icon ) ;
width : var ( --size-icon ) ;
2023-03-08 17:53:25 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . account__header__tabs__buttons . icon {
background-position : center ;
background-size : var ( --size-icon ) var ( --size-icon ) ;
}
2023-10-30 00:01:18 +02:00
. layout-multiple-columns . status__prepend . icon . icon-at {
height : 18px ;
position : relative ;
top : 2px ;
width : 18px ;
}
2023-10-29 21:09:09 +02:00
/* Hide the original icon from behind */
2023-11-01 20:15:07 +02:00
. layout-multiple-columns . list-adder__lists . icon-plus > path ,
. layout-multiple-columns . list-adder__lists . icon-times > path ,
2023-11-01 18:29:29 +02:00
. layout-multiple-columns . list-adder__lists . list__display-name svg > path ,
. layout-multiple-columns . status__prepend . icon . icon-retweet path ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification-reblog . notification__message > . icon path ,
. layout-multiple-columns . notification-favourite . notification__message > . icon path ,
. layout-multiple-columns . account__header__tabs__buttons . icon path ,
. layout-multiple-columns . detailed-status__action-bar . icon path ,
. layout-multiple-columns . notification__filter-bar . icon path ,
. layout-multiple-columns . status__action-bar path ,
2023-10-29 21:36:51 +02:00
. layout-multiple-columns . column-link . icon path ,
2024-03-22 18:34:20 +02:00
. layout-multiple-columns . load-more path ,
2024-03-23 15:14:40 +02:00
. layout-multiple-columns . account__domain-pill__popout__parts > div : nth-child ( 2 ) path ,
. layout-multiple-columns . column-header__button . icon-sliders > path {
2023-10-29 21:09:09 +02:00
display : none ;
}
/* ...except for these icons, we kinda like them as they are */
2024-02-27 20:30:13 +02:00
. layout-multiple-columns . icon-user-plus . column-link__icon path ,
2023-12-30 13:58:08 +02:00
. layout-multiple-columns . icon . icon-undefined path ,
2023-11-08 20:00:36 +02:00
. layout-multiple-columns . icon . icon-users path ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . account__header__tabs__buttons . icon . icon-user-plus path ,
. layout-multiple-columns . notification__filter-bar . icon . icon-user-plus path ,
. layout-multiple-columns . account__header__tabs__buttons . icon . icon-tasks path ,
. layout-multiple-columns . notification__filter-bar . icon . icon-tasks path {
display : block ;
2023-03-10 17:08:58 +02:00
}
/* Home icon */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link . icon-home {
background-image : var ( --icon-home ) ;
2023-03-11 13:19:33 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link . active . icon-home {
background-image : var ( --icon-home-column-link-active ) ;
2023-03-11 13:19:33 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification__filter-bar . icon-home {
background-image : var ( --icon-home-notification ) ;
2023-03-10 17:08:58 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification__filter-bar . active . icon-home {
background-image : var ( --icon-home-notification-active ) ;
2023-03-10 17:08:58 +02:00
}
2023-11-01 20:15:07 +02:00
. layout-multiple-columns . list-adder__lists . icon-plus {
2023-11-01 18:29:29 +02:00
--size-icon : 20px ;
2023-11-02 14:00:21 +02:00
background-image : var ( --icon-plus ) ;
2023-11-01 18:29:29 +02:00
}
2023-11-01 20:15:07 +02:00
. layout-multiple-columns . list-adder__lists . icon-times {
2023-11-01 18:29:29 +02:00
--size-icon : 20px ;
2023-11-03 14:33:20 +02:00
background-image : var ( --icon-checked-green ) ;
2023-11-01 18:29:29 +02:00
}
2023-11-01 20:15:07 +02:00
. layout-multiple-columns . list-adder__lists . icon-button : hover . icon-plus {
2023-11-02 14:05:50 +02:00
background-image : var ( --icon-plus-green ) ;
2023-11-01 18:29:29 +02:00
}
2023-11-01 20:15:07 +02:00
. layout-multiple-columns . list-adder__lists . icon-button : hover . icon-times {
2023-11-02 14:05:50 +02:00
background-image : var ( --icon-cross-red ) ;
2023-11-01 18:29:29 +02:00
}
2023-10-29 21:09:09 +02:00
/* Notifications icon */
2023-11-08 19:56:23 +02:00
. layout-multiple-columns . icon . icon-bell-o ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link . icon-bell {
background-image : var ( --icon-bell ) ;
2023-09-23 13:21:08 -04:00
}
2023-11-08 19:56:23 +02:00
. layout-multiple-columns . active . icon . icon-bell ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link . active . icon-bell {
background-image : var ( --icon-bell-active ) ;
2023-03-10 17:08:58 +02:00
}
/* Explore icon */
2024-02-25 16:38:57 +02:00
. layout-multiple-columns . column-link . icon-explore ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link . icon-hashtag {
background-image : var ( --icon-hashtag ) ;
2023-03-10 17:08:58 +02:00
}
2024-02-25 16:38:57 +02:00
. layout-multiple-columns . column-link . active . icon-explore ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link . active . icon-hashtag {
background-image : var ( --icon-hashtag-active ) ;
2023-03-10 17:08:58 +02:00
}
2023-10-29 21:09:09 +02:00
/* Live feeds icon */
. layout-multiple-columns . column-link . icon-globe {
background-image : var ( --icon-globe ) ;
2023-03-10 17:08:58 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link . active . icon-globe {
background-image : var ( --icon-globe-active ) ;
}
/* Private mentions icon */
. layout-multiple-columns . column-link . icon-at {
background-image : var ( --icon-direct-messages ) ;
}
. layout-multiple-columns . column-link . active . icon-at {
background-image : var ( --icon-direct-messages-active ) ;
2023-03-10 17:08:58 +02:00
transform : scale ( 1 . 15 ) ;
}
2023-10-29 21:09:09 +02:00
/* Bookmarks icon */
. layout-multiple-columns . column-link . icon-bookmarks {
background-image : var ( --icon-bookmark-column-link ) ;
2023-03-10 17:08:58 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link . active . icon-bookmarks {
background-image : var ( --icon-bookmark-column-link-active ) ;
2023-03-11 13:19:33 +02:00
}
2023-10-29 21:09:09 +02:00
/* Preferences icon */
. layout-multiple-columns . column-link . icon-cog {
2024-03-24 11:44:49 +02:00
--size-icon : 24px ;
background-image : var ( --icon-sliders-contrast ) ;
2024-03-23 15:14:40 +02:00
}
/* Settings icon */
. layout-multiple-columns . column-header__button . icon-sliders {
--size-icon : 20px ;
background-image : var ( --icon-sliders ) ;
2023-03-11 13:19:33 +02:00
}
2023-10-29 21:09:09 +02:00
/* Replace retweet icon */
. layout-multiple-columns . notification__filter-bar . icon-retweet {
background-image : var ( --icon-boost-notification-filter-bar ) ;
2023-03-11 13:19:33 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification__filter-bar . active . icon-retweet {
background-image : var ( --icon-boost-notification-filter-bar-active ) ;
2023-03-11 13:19:33 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification__filter-bar . active . icon-mailreply ,
. layout-multiple-columns . notification__filter-bar . active . icon-reply-all ,
. layout-multiple-columns . notification__filter-bar . active . icon-reply {
background-image : var ( --icon-reply-nofitication-filter-bar-active ) ;
}
. layout-multiple-columns . detailed-status button . icon-button . icon-retweet ,
. layout-multiple-columns . status button . icon-button . icon-retweet {
2023-03-25 18:02:16 +02:00
background-image : var ( --icon-boost-status ) ;
2023-03-08 19:17:23 +02:00
background-position : center ;
background-repeat : no-repeat ;
}
2023-03-08 20:10:39 +02:00
/* Replace notification retweet icon */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification-reblog . icon-retweet {
background-image : var ( --icon-boost-notification-wrapper ) ;
2023-03-08 20:10:39 +02:00
}
2023-03-08 19:17:23 +02:00
/* stylelint-disable-next-line */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns button . icon-button . icon-retweet {
--size-icon : 20px ;
2023-03-25 18:02:16 +02:00
background-image : var ( --icon-boost ) ;
2023-03-08 21:47:43 +02:00
background-position : center ;
background-repeat : no-repeat ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns button . icon-button : hover . icon-retweet ,
. layout-multiple-columns button . icon-button . active . icon-retweet {
2023-03-25 18:02:16 +02:00
background-image : var ( --icon-boost-active ) ;
2023-03-08 19:17:23 +02:00
background-position : center ;
background-repeat : no-repeat ;
2023-03-08 17:28:58 +02:00
}
2023-04-08 22:22:55 +03:00
/* Un-boost and un-bookmark styles */
/* Mobile devices */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns button . icon-button : not ( . active ) : focus . icon-retweet ,
. layout-multiple-columns button . icon-button : not ( . active ) : hover . icon-retweet {
2023-04-08 22:22:55 +03:00
animation : none ;
background-image : var ( --icon-boost ) ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . status button . icon-button : not ( . active ) : focus . icon-bookmark ,
. layout-multiple-columns . status button . icon-button : not ( . active ) : hover . icon-bookmark {
background-image : var ( --icon-bookmark ) ;
2023-04-08 22:22:55 +03:00
}
2023-04-08 22:32:49 +03:00
/* Un-boost and un-bookmark numbers on explore page */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns button . icon-button : not ( . active ) : focus . icon-retweet ~ span ,
. layout-multiple-columns button . icon-button : not ( . active ) : hover . icon-retweet ~ span {
2023-04-08 22:32:49 +03:00
color : var ( --color-dim ) ;
}
2023-10-29 21:09:09 +02:00
/* Replace bookmark icon */
. layout-multiple-columns . detailed-status . icon-bookmark ,
. layout-multiple-columns . status . icon-bookmark {
background-image : var ( --icon-bookmark ) ;
}
2023-04-08 23:00:51 +03:00
/* If a hover device */
@ media ( hover : hover ) {
2023-10-29 21:09:09 +02:00
. layout-multiple-columns button . icon-button : not ( . active ) : hover . icon-retweet ,
. layout-multiple-columns button . icon-button : not ( . active ) : hover . icon-retweet ~ span {
2023-04-08 23:00:51 +03:00
color : var ( --color-green ) ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . status button . icon-button : not ( . active ) : hover . icon-bookmark {
2023-04-08 23:00:51 +03:00
/* stylelint-disable-next-line */
2023-10-29 21:09:09 +02:00
background-image : var ( --icon-bookmark-status-hover-red ) ;
2023-04-08 23:00:51 +03:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns button . icon-button : not ( . active ) : hover . icon-retweet {
2023-04-08 23:00:51 +03:00
/* stylelint-disable-next-line */
background-image : var ( --icon-boost-active ) ! important ;
}
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns button . icon-button : hover . icon-retweet ~ span ,
. layout-multiple-columns button . icon-button . active . icon-retweet ~ span {
2023-03-09 15:22:02 +02:00
color : var ( --color-green ) ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns button . icon-button : hover . icon-star ~ span ,
. layout-multiple-columns button . icon-button . active . icon-star ~ span {
2023-03-09 18:23:41 +02:00
color : var ( --color-red ) ;
}
2023-03-08 16:49:17 +02:00
/* Replace reply icon */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification__filter-bar . icon-mail-reply ,
. layout-multiple-columns . notification__filter-bar . icon-reply ,
. layout-multiple-columns . notification__filter-bar . icon-reply-all {
--size-icon : 19px ;
2023-03-11 13:19:33 +02:00
position : relative ;
2023-10-29 21:09:09 +02:00
top : 1px ;
2023-03-11 13:19:33 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . conversation . icon-reply ,
. layout-multiple-columns . notification__filter-bar . icon-mail-reply ,
. layout-multiple-columns . notification__filter-bar . icon-reply ,
. layout-multiple-columns . notification__filter-bar . icon-reply-all ,
. layout-multiple-columns . detailed-status . icon-mail-reply ,
. layout-multiple-columns . detailed-status . icon-reply ,
. layout-multiple-columns . detailed-status . icon-reply-all ,
. layout-multiple-columns . status . icon-mail-reply ,
. layout-multiple-columns . status . icon-reply ,
. layout-multiple-columns . status . icon-reply-all {
background-image : var ( --icon-reply ) ;
2023-03-08 17:28:58 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . detailed-status__action-bar . icon-mail-reply ,
. layout-multiple-columns . detailed-status__action-bar . icon-reply ,
. layout-multiple-columns . detailed-status__action-bar . icon-reply-all {
background-image : var ( --icon-reply-detailed-status-action-bar ) ;
2023-03-08 23:21:11 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . detailed-status__action-bar . icon-button : hover . icon-mail-reply ,
. layout-multiple-columns . detailed-status__action-bar . icon-button : hover . icon-reply ,
. layout-multiple-columns . detailed-status__action-bar . icon-button : hover . icon-reply-all {
background-image : var ( --icon-reply-detailed-status-action-bar-hover ) ;
2023-03-08 23:21:11 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . conversation . icon-button : hover . icon-reply {
background-image : var ( --icon-reply-conversation ) ;
2023-03-18 15:42:05 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . detailed-status__action-bar . icon-bookmark {
background-image : var ( --icon-bookmark-detailed-status-action-bar ) ;
2023-03-08 23:21:11 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . detailed-status__action-bar . icon-button : hover . icon-bookmark {
background-image : var ( --icon-bookmark-detailed-status-action-bar-hover ) ;
2023-03-08 23:21:11 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . detailed-status__action-bar . icon-button . active . icon-bookmark {
background-image : var ( --icon-bookmark-detailed-status-action-bar-active ) ;
2023-03-08 23:21:11 +02:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . status button . icon-button : hover . icon-mail-reply ,
. layout-multiple-columns . status button . icon-button : hover . icon-reply ,
. layout-multiple-columns . status button . icon-button : hover . icon-reply-all {
background-image : var ( --icon-reply-status-hover ) ;
2023-03-08 16:49:17 +02:00
}
2023-03-08 17:03:18 +02:00
2023-03-10 17:08:58 +02:00
/* More icons */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . icon-list-ul {
background-image : var ( --icon-list ) ;
2023-03-10 17:08:58 +02:00
top : 1px ;
}
2023-10-29 21:09:09 +02:00
/* "More" icon */
. layout-multiple-columns . icon-ellipsis-h {
background-image : var ( --icon-more-status-action-bar ) ;
}
. layout-multiple-columns . icon-ellipsis-v {
background-image : var ( --icon-more ) ;
}
/* Close icon */
. layout-multiple-columns . icon-close {
background-image : var ( --icon-close ) ;
}
. layout-multiple-columns . status . icon-close {
background-image : var ( --icon-close-action-bar ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . relationship-tag {
2023-03-08 17:40:21 +02:00
background-color : var ( --color-mud ) ;
color : var ( --color-light-text ) ;
font-size : 11px ;
2023-07-26 01:13:00 +03:00
font-weight : var ( --font-weight-semibold ) ;
2023-03-08 17:40:21 +02:00
line-height : 12px ;
opacity : 1 ;
}
2023-03-08 18:18:32 +02:00
2023-03-10 10:45:23 +02:00
/* iPad etc. */
2023-03-28 22:05:40 +03:00
@ media ( max-width : 1174px ) {
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__action-bar . icon-button :: after ,
. layout-multiple-columns . status__action-bar . icon-button :: after ,
. layout-multiple-columns . detailed-status__action-bar-dropdown . icon-button :: after {
2023-03-10 10:45:23 +02:00
display : none ;
}
2023-03-12 17:03:41 +02:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . ui__header ,
. layout-multiple-columns . columns-area__panels__main > div . tabs-bar__wrapper ,
. layout-multiple-columns . tabs-bar__wrapper {
2023-03-12 17:03:41 +02:00
backdrop-filter : unset ;
background-color : transparent ;
padding : 0 ;
}
2023-03-28 22:05:40 +03:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__main {
2023-03-28 22:05:40 +03:00
width : calc ( 100 % - var ( --width-side-panel ) ) ;
}
2023-03-12 17:03:41 +02:00
}
/* In-between breakpoint */
2023-03-28 22:05:40 +03:00
@ media ( min-width : 889px ) and ( max-width : 1174px ) {
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__main > div {
2023-03-28 22:05:40 +03:00
border-right : 0 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . ui__header ,
. layout-multiple-columns . columns-area__panels__main > div . tabs-bar__wrapper ,
. layout-multiple-columns . tabs-bar__wrapper {
2023-03-12 17:03:41 +02:00
backdrop-filter : blur ( 12px ) ;
background-color : var ( --color-bg-75 ) ;
border-color : var ( --color-border ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels {
2023-03-28 22:05:40 +03:00
width : calc ( 100 % - 1px ) ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__main > . tabs-bar__wrapper {
2023-03-12 17:03:41 +02:00
border-right : 0 ;
}
2023-03-10 10:45:23 +02:00
}
2023-08-04 21:49:03 +03:00
/* iPad */
2023-03-08 18:18:32 +02:00
@ media screen and ( max-width : 889px ) {
2023-08-04 21:49:03 +03:00
. layout-multiple-columns . ui__header {
border-bottom : 1px solid var ( --color-border ) ;
}
. layout-multiple-columns . ui :: after {
display : none ;
}
}
/* Mobile */
@ media screen and ( max-width : 630px ) {
2023-03-12 22:31:00 +02:00
/* Better blur overlay for ui-header */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . ui :: after {
2023-03-12 22:31:00 +02:00
backdrop-filter : blur ( 12px ) ;
background-color : var ( --color-bg-75 ) ;
content : '' ;
/* Height is .ui__header + .tabs-bar__wrapper */
height : calc ( 48px + 56px ) ;
left : 0 ;
position : fixed ;
top : 0 ;
width : 100 % ;
z-index : 1 ;
}
2023-03-13 08:20:32 +02:00
/* Fix navigation-bar getting underneath layer */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-bar {
2023-03-13 08:20:32 +02:00
z-index : 2 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . tabs-bar__wrapper {
2023-03-12 00:10:06 +02:00
margin-right : 0 ;
position : sticky ;
top : 55px ;
2023-03-13 19:58:21 +02:00
z-index : 2 ;
2023-03-12 00:10:06 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__main {
2023-03-08 18:30:24 +02:00
order : 1 ;
2023-03-13 19:58:21 +02:00
position : unset ;
width : 100 % ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels {
2023-03-13 19:58:21 +02:00
flex-direction : column ;
justify-content : flex-start ;
2023-03-11 23:49:19 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__main :: -webkit-scrollbar {
2023-03-11 23:49:19 +02:00
display : none ;
2023-03-08 18:18:32 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__pane--navigational . columns-area__panels__pane__inner {
2023-03-08 18:18:32 +02:00
background-color : var ( --color-bg ) ;
border-top : 1px solid var ( --color-border ) ;
bottom : 0 ;
2023-03-09 14:27:16 +02:00
height : 3 . 5rem ;
2023-03-08 18:18:32 +02:00
left : 0 ;
2023-03-09 14:27:16 +02:00
max-height : 16vh ;
2023-03-08 18:18:32 +02:00
width : 100vw ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__pane--navigational . navigation-panel {
2023-03-08 18:18:32 +02:00
flex-direction : row ;
2023-03-10 17:36:52 +02:00
gap : 0 ;
2023-03-28 01:19:07 +03:00
height : 100 % ;
2023-03-08 18:18:32 +02:00
overflow-x : auto ;
2023-03-10 17:36:52 +02:00
padding : 0 ;
2023-03-08 18:18:32 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__pane--navigational . navigation-panel . flex-spacer {
2023-03-12 00:32:24 +02:00
display : none ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link {
2023-03-09 20:50:00 +02:00
justify-content : center ;
2023-03-08 18:18:32 +02:00
margin-right : unset ;
padding-bottom : 0 ;
2023-09-25 17:35:38 +02:00
padding-left : var ( --gap-column-link ) ;
padding-right : var ( --gap-column-link ) ;
2023-03-08 18:18:32 +02:00
padding-top : 0 ;
2023-03-09 21:10:44 +02:00
width : 38px ;
2023-03-08 18:18:32 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . item-list . column-link {
2023-03-09 21:35:44 +02:00
padding-bottom : 4px ;
padding-top : 4px ;
width : unset ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-link : hover ,
. layout-multiple-columns . column-link : focus {
2023-03-08 20:10:39 +02:00
/* stylelint-disable-next-line */
background-color : transparent ! important ;
}
2023-10-29 21:09:09 +02:00
. columns-area__panels__pane--navigational . column-link__icon . icon-ellipsis-h {
2023-03-09 14:27:16 +02:00
position : relative ;
2023-03-28 09:30:29 +03:00
top : -4px ;
2023-03-09 14:27:16 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . columns-area__panels__main > div ,
. layout-multiple-columns . columns-area__panels__main > div . columns-area . columns-area--mobile {
2023-03-08 18:30:24 +02:00
border : 0 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . ui__header {
2023-03-13 19:58:21 +02:00
align-items : center ;
2023-03-08 18:30:24 +02:00
border-bottom : 0 ;
2023-03-13 19:58:21 +02:00
box-sizing : border-box ;
display : flex ;
2023-03-08 20:26:44 +02:00
height : 56px ;
2023-03-13 19:58:21 +02:00
justify-content : space-between ;
position : sticky ;
2023-03-12 00:10:06 +02:00
top : 0 ;
2023-03-08 20:26:44 +02:00
width : 100 % ;
2023-03-13 19:58:21 +02:00
z-index : 2 ;
2023-03-08 18:30:24 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__bar . avatar . account__avatar {
2023-03-08 18:30:24 +02:00
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
height : 106px ! important ;
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
width : 106px ! important ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . account__header__image {
2023-03-08 18:30:24 +02:00
height : 157px ;
}
2023-03-08 20:26:44 +02:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column > . scrollable {
2023-03-12 00:21:17 +02:00
padding-bottom : 55px ;
2023-03-08 20:31:55 +02:00
}
2023-03-08 20:37:47 +02:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . actions-modal ul li : not ( : empty ) a {
2023-03-08 20:37:47 +02:00
color : var ( --color-light-text ) ;
}
2023-03-09 14:39:37 +02:00
/* "Your lists" view */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . column-subheading ~ article {
2023-03-09 14:39:37 +02:00
padding-bottom : calc ( var ( --gap-default ) / 2 ) ;
padding-top : calc ( var ( --gap-default ) / 2 ) ;
}
2023-03-09 15:04:26 +02:00
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . compose-form {
2023-03-09 15:04:26 +02:00
padding-bottom : calc ( 3 . 5rem + calc ( var ( --gap-default ) * 2 ) ) ;
}
2023-03-09 18:50:43 +02:00
2023-03-10 17:36:52 +02:00
/* Column items order */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel . column-link ,
. layout-multiple-columns . navigation-panel . list-panel ,
. layout-multiple-columns . navigation-panel hr ,
. layout-multiple-columns . navigation-panel . navigation-panel__logo {
2023-03-10 17:36:52 +02:00
order : 99 ;
}
2023-03-11 12:12:55 +02:00
/* Make the column link 1/4 of width of the screen */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel . navigation-panel__legal ,
. layout-multiple-columns . navigation-panel . column-link {
2023-08-10 13:40:01 +03:00
border : 0 ;
2023-03-11 12:12:55 +02:00
flex : 0 0 calc ( 100vw / 4 ) ;
2023-08-10 13:40:01 +03:00
margin-inline : 0 ;
2023-03-10 17:36:52 +02:00
padding : 0 ;
2023-08-10 13:40:01 +03:00
padding-inline : 0 ;
2023-03-10 17:36:52 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel . navigation-panel__legal {
2023-03-12 00:32:24 +02:00
order : 999 ;
text-align : center ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel . column-link : nth-child ( 1 ) {
2023-03-11 12:12:55 +02:00
order : 2 ;
2023-03-10 17:36:52 +02:00
}
2023-03-11 12:12:55 +02:00
/* Home */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel . column-link : nth-child ( 2 ) {
2023-03-11 12:12:55 +02:00
order : 1 ;
2023-03-10 17:36:52 +02:00
}
2023-03-11 12:12:55 +02:00
/* Notifications */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel . column-link : nth-child ( 3 ) {
2023-03-11 12:12:55 +02:00
order : 4 ;
2023-03-10 17:36:52 +02:00
}
2023-03-11 12:12:55 +02:00
/* Explore */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel . column-link : nth-child ( 4 ) {
2023-03-11 12:12:55 +02:00
order : 2 ;
2023-03-10 17:36:52 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel . column-link : nth-child ( 5 ) {
2023-03-10 17:36:52 +02:00
order : 5 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel . column-link : nth-child ( 6 ) {
2023-03-10 17:36:52 +02:00
order : 6 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel . column-link : nth-child ( 7 ) {
2023-03-10 17:36:52 +02:00
order : 7 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel . column-link : nth-child ( 8 ) {
2023-03-10 17:36:52 +02:00
order : 8 ;
}
2023-07-05 00:47:39 +03:00
. layout-multiple-columns . navigation-panel . column-link : nth-child ( 9 ) {
order : 9 ;
}
2023-03-11 12:12:55 +02:00
/* Lists */
2023-07-05 00:55:38 +03:00
. layout-multiple-columns . column-link [ href = "/lists" ] {
2023-03-11 12:12:55 +02:00
order : 4 ;
2023-03-10 17:36:52 +02:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel . column-link : nth-child ( 11 ) {
2023-03-10 17:36:52 +02:00
order : 11 ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . navigation-panel . column-link : nth-child ( 12 ) {
2023-03-10 17:36:52 +02:00
order : 12 ;
}
2023-03-08 18:18:32 +02:00
}
2023-03-09 18:15:52 +02:00
2023-08-30 00:59:15 -07:00
/ * Add bottom padding to the navigation panel for the
Safari PWA on iPhones with the portrait mode home bar * /
2023-08-31 20:19:22 +03:00
@ media screen and ( device-width : 375px ) and ( device-height : 812px ) and ( min-resolution : 2dppx ) and ( orientation : portrait ) and ( display-mode : standalone ) , /* iPhone 12, iPhone 12 Pro, iPhone 13, iPhone 13 Pro, and iPhone 14 */ screen and ( device-width : 390px ) and ( device-height : 844px ) and ( min-resolution : 3dppx ) and ( orientation : portrait ) and ( display-mode : standalone ) , /* iPhone 14 Pro */ screen and ( device-width : 393px ) and ( device-height : 852px ) and ( min-resolution : 3dppx ) and ( orientation : portrait ) and ( display-mode : standalone ) , /* iPhone XR and iPhone 11 */ screen and ( device-width : 414px ) and ( device-height : 896px ) and ( min-resolution : 2dppx ) and ( orientation : portrait ) and ( display-mode : standalone ) , /* iPhone Xs Max and iPhone 11 Pro Max */ screen and ( device-width : 414px ) and ( device-height : 896px ) and ( min-resolution : 3dppx ) and ( orientation : portrait ) and ( display-mode : standalone ) , /* iPhone 12 Pro Max, iPhone 13 Pro Max, and iPhone 14 Plus */ screen and ( device-width : 428px ) and ( device-height : 926px ) and ( min-resolution : 3dppx ) and ( orientation : portrait ) and ( display-mode : standalone ) , /* iPhone 14 Pro Max */ screen and ( device-width : 430px ) and ( device-height : 932px ) and ( min-resolution : 3dppx ) and ( orientation : portrait ) and ( display-mode : standalone ) {
. layout-multiple-columns . columns-area__panels__pane--navigational . columns-area__panels__pane__inner {
padding-bottom : 26px ;
}
2023-08-30 00:52:24 -07:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__action-bar . icon-button {
2023-03-11 19:11:20 +02:00
position : relative ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__action-bar-dropdown . icon-button :: after ,
. layout-multiple-columns . detailed-status__button . icon-button :: after {
2023-03-11 19:11:20 +02:00
transform : translateX ( -6px ) ;
}
2023-03-12 18:16:33 +02:00
/* Add border radius to media */
2023-07-05 00:58:41 +03:00
. layout-multiple-columns . media-gallery ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . audio-player ,
2023-07-05 12:40:27 +03:00
. layout-multiple-columns . video-player ,
. layout-multiple-columns . media-gallery__gifv ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . media-gallery__preview {
2023-07-23 18:50:42 +02:00
border : 1px solid var ( --color-border ) ;
2023-07-05 01:36:21 +03:00
border-radius : var ( --border-radius ) ;
2023-07-05 00:58:41 +03:00
overflow : hidden ;
2023-07-05 00:47:39 +03:00
}
2023-07-31 15:35:11 +03:00
/* Exception for your own profile media gallery */
. layout-multiple-columns . account-gallery__container . media-gallery__gifv {
border-radius : 0 ;
}
/* Hide autoplaying gifs in notifications (they get annoying if you have favs/boosts on) */
. layout-multiple-columns . notification . notification-reblog . media-gallery : has ( . media-gallery__gifv . autoplay ) ,
. layout-multiple-columns . notification . notification-favourite . media-gallery : has ( . media-gallery__gifv . autoplay ) {
display : none ;
}
2023-03-13 20:31:12 +02:00
/* More distinct focus color for accessibility, instead of just white */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns input : focus-visible {
2023-03-13 20:31:12 +02:00
outline-color : var ( --color-accent ) ;
outline-style : solid ;
}
2023-03-16 19:56:41 +02:00
2023-03-23 20:07:09 +02:00
/* Embeds outside Mastodon */
body . embed . entry . detailed-status {
backface-visibility : hidden ;
background-color : # 00000059 ;
/* It's inlined so we have to use !important */
/* stylelint-disable-next-line */
border-radius : 10px ! important ;
overflow : hidden ;
}
2023-03-26 13:34:18 +03:00
2023-03-28 09:49:46 +03:00
/* Destructive colors (For you -suggestions, users when focused to the follow button */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . button . logo-button . button--destructive : active ,
. layout-multiple-columns . button . logo-button . button--destructive : focus {
2023-03-28 09:49:46 +03:00
background-color : var ( --color-destructive ) ;
border-color : var ( --color-destructive ) ;
}
2023-03-29 23:40:32 +03:00
2023-04-09 12:30:57 +03:00
/* Fix character counter color when it's over the limit */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . character-counter . character-counter--over {
2023-04-09 12:30:57 +03:00
color : var ( --color-destructive ) ;
}
2023-04-01 22:46:32 +03:00
/* Show more in server banner */
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . server-banner__meta__column {
2023-04-01 22:46:32 +03:00
max-width : 60 % ;
width : unset ;
}
2023-04-02 12:45:25 +03:00
2023-07-23 18:39:32 +03:00
/* Increase gap for server-banner__meta */
. layout-multiple-columns . server-banner__meta {
gap : 25px ;
}
2023-07-05 01:03:56 +03:00
/* Native Mastodon 4.1.2-nightly threaded lines */
. layout-multiple-columns . status__line--first {
height : calc ( 100 % + var ( --size-avatar ) ) ;
2023-04-02 12:45:25 +03:00
}
2023-07-05 01:03:56 +03:00
. layout-multiple-columns . status__line--full {
height : calc ( 100 % + 32px ) ;
2023-04-02 12:45:25 +03:00
}
2023-07-05 01:03:56 +03:00
/* Default lines when replying in real time */
. layout-multiple-columns div [ tabindex = "-1" ] : has ( . status--in-thread ) . status--in-thread : not ( . status--first-in-thread ) > . status__line : not ( . status__line--full ) {
height : 0 ;
}
/* Hide line before first in thread */
. layout-multiple-columns div [ tabindex = "-1" ] : has ( . status--in-thread ) + div [ tabindex = "-1" ] > . status--in-thread . status--first-in-thread > . status__line : not ( . status__line--full ) ,
. layout-multiple-columns div [ tabindex = "-1" ] : has ( . detailed-status__wrapper ) + div [ tabindex = "-1" ] > . status__wrapper . status__line : not ( . status__line--full ) {
height : 0 ;
2023-07-04 15:01:15 +03:00
}
2023-07-05 01:03:56 +03:00
. layout-multiple-columns div [ tabindex = "-1" ] + div [ tabindex = "-1" ] > . status__wrapper > . status-reply . status--in-thread > . status__line . status__line--full ,
. layout-multiple-columns . status__line--full . status__line--first {
height : 100 % ;
z-index : -1 ;
2023-07-04 16:27:54 +03:00
}
2023-07-05 01:03:56 +03:00
. layout-multiple-columns . detailed-status {
2023-07-04 20:24:27 +03:00
background-color : transparent ;
2023-07-05 01:03:56 +03:00
border-top : 0 ;
2023-04-03 22:27:48 +03:00
}
2023-07-05 01:03:56 +03:00
/* Threaded line, actually */
. layout-multiple-columns . status__line {
border-inline-start : 2px solid var ( --color-thread-line ) ;
-webkit-border-start : 2px solid var ( --color-thread-line ) ;
}
. layout-multiple-columns . status__line--full :: before {
2023-07-02 21:37:53 +03:00
background-color : var ( --color-thread-line ) ;
2023-04-02 12:45:25 +03:00
}
2023-07-05 01:03:56 +03:00
/* Hide the "stub" from the first status line */
div [ tabindex = "-1" ] + div [ tabindex = "-1" ] > . status__wrapper > . status-reply . status--in-thread > . status__line . status__line--full ,
. layout-multiple-columns . status-reply . status--in-thread . status--first-in-thread > . status__line ,
. layout-multiple-columns . status-reply . status--in-thread . status--first-in-thread > . status__line--full :: before {
top : 32px ;
}
. layout-multiple-columns . status--in-thread . status__action-bar ,
. layout-multiple-columns . status--in-thread . status__content {
padding-left : 4px ;
2023-04-02 12:45:25 +03:00
}
2023-04-03 22:34:19 +03:00
/* Scrollbars */
2024-03-23 18:27:28 +02:00
* :: -webkit-scrollbar ,
2023-08-04 21:30:54 +03:00
. layout-multiple-columns . scrollable :: -webkit-scrollbar ,
2023-07-25 15:46:27 +03:00
. layout-multiple-columns . drawer__inner :: -webkit-scrollbar ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns textarea :: -webkit-scrollbar ,
. layout-multiple-columns . autosuggest-textarea__textarea :: -webkit-scrollbar ,
. layout-multiple-columns . reply-indicator :: -webkit-scrollbar ,
2023-07-25 15:46:27 +03:00
. layout-multiple-columns :: -webkit-scrollbar {
2023-04-04 22:10:41 +03:00
height : 6px ;
width : 6px ;
2023-04-03 22:34:19 +03:00
}
2024-03-23 18:27:28 +02:00
* :: -webkit-scrollbar-thumb ,
2023-08-04 21:30:54 +03:00
. layout-multiple-columns . scrollable :: -webkit-scrollbar-thumb ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns textarea :: -webkit-scrollbar-thumb ,
. layout-multiple-columns . autosuggest-textarea__textarea :: -webkit-scrollbar-thumb ,
. layout-multiple-columns . reply-indicator :: -webkit-scrollbar-thumb ,
2023-07-25 15:46:27 +03:00
. layout-multiple-columns :: -webkit-scrollbar-thumb {
2023-04-03 22:34:19 +03:00
background-color : var ( --color-border ) ;
border : 0px solid var ( --color-border ) ;
border-radius : 50px ;
}
2024-03-23 18:27:28 +02:00
* :: -webkit-scrollbar-thumb : hover ,
2023-08-04 21:30:54 +03:00
. layout-multiple-columns . scrollable :: -webkit-scrollbar-thumb : hover ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns textarea :: -webkit-scrollbar-thumb : hover ,
. layout-multiple-columns . autosuggest-textarea__textarea :: -webkit-scrollbar-thumb : hover ,
. layout-multiple-columns . reply-indicator :: -webkit-scrollbar-thumb : hover ,
2023-07-25 15:46:27 +03:00
. layout-multiple-columns :: -webkit-scrollbar-thumb : hover {
2023-04-03 22:34:19 +03:00
background-color : var ( --color-light-purple ) ;
}
2024-03-23 18:27:28 +02:00
* :: -webkit-scrollbar-thumb : active ,
2023-08-04 21:30:54 +03:00
. layout-multiple-columns . scrollable :: -webkit-scrollbar-thumb : active ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns textarea :: -webkit-scrollbar-thumb : active ,
. layout-multiple-columns . autosuggest-textarea__textarea :: -webkit-scrollbar-thumb : active ,
. layout-multiple-columns . reply-indicator :: -webkit-scrollbar-thumb : active ,
2023-07-25 15:46:27 +03:00
. layout-multiple-columns :: -webkit-scrollbar-thumb : active {
2023-05-13 19:41:18 +03:00
background-color : var ( --color-black-coral ) ;
2023-04-03 22:34:19 +03:00
}
2024-03-23 18:27:28 +02:00
* :: -webkit-scrollbar-track ,
2023-08-04 21:30:54 +03:00
. layout-multiple-columns . scrollable :: -webkit-scrollbar-track ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns textarea :: -webkit-scrollbar-track ,
. layout-multiple-columns . autosuggest-textarea__textarea :: -webkit-scrollbar-track ,
. layout-multiple-columns . reply-indicator :: -webkit-scrollbar-track ,
2023-07-25 15:46:27 +03:00
. layout-multiple-columns :: -webkit-scrollbar-track {
2023-04-03 22:34:19 +03:00
background-color : var ( --color-bg ) ;
border : 0px solid var ( --color-border ) ;
border-radius : 0 ;
}
2024-03-23 18:27:28 +02:00
* :: -webkit-scrollbar-track : hover ,
2023-08-04 21:30:54 +03:00
. layout-multiple-columns . scrollable :: -webkit-scrollbar-track : hover ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns textarea :: -webkit-scrollbar-track : hover ,
. layout-multiple-columns . autosuggest-textarea__textarea :: -webkit-scrollbar-track : hover ,
. layout-multiple-columns . reply-indicator :: -webkit-scrollbar-track : hover ,
2023-07-25 15:46:27 +03:00
. layout-multiple-columns :: -webkit-scrollbar-track : hover {
2023-04-03 22:34:19 +03:00
background-color : var ( --color-bg ) ;
}
2024-03-23 18:27:28 +02:00
* :: -webkit-scrollbar-track : active ,
2023-08-04 21:30:54 +03:00
. layout-multiple-columns . scrollable :: -webkit-scrollbar-track : active ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns textarea :: -webkit-scrollbar-track : active ,
. layout-multiple-columns . autosuggest-textarea__textarea :: -webkit-scrollbar-track : active ,
. layout-multiple-columns . reply-indicator :: -webkit-scrollbar-track : active ,
2023-07-25 15:46:27 +03:00
. layout-multiple-columns :: -webkit-scrollbar-track : active {
2023-04-03 22:34:19 +03:00
background-color : var ( --color-bg ) ;
}
2024-03-23 18:27:28 +02:00
* :: -webkit-scrollbar-corner ,
2023-08-04 21:30:54 +03:00
. layout-multiple-columns . scrollable :: -webkit-scrollbar-corner ,
2023-07-25 15:46:27 +03:00
. layout-multiple-columns . drawer__inner :: -webkit-scrollbar-corner ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns textarea :: -webkit-scrollbar-corner ,
. layout-multiple-columns . autosuggest-textarea__textarea :: -webkit-scrollbar-corner ,
. layout-multiple-columns . reply-indicator :: -webkit-scrollbar-corner ,
2023-07-25 15:46:27 +03:00
. layout-multiple-columns :: -webkit-scrollbar-corner {
2023-04-03 22:34:19 +03:00
background-color : transparent ;
}
2023-04-05 18:54:13 +03:00
2023-07-25 15:46:27 +03:00
/* Drawer scollbars */
. layout-multiple-columns . drawer__inner :: -webkit-scrollbar-thumb {
background-color : var ( --color-dim ) ;
border : 0 ;
border-radius : 50px ;
}
. layout-multiple-columns . drawer__inner :: -webkit-scrollbar-thumb : hover {
background-color : var ( --color-light-purple ) ;
}
. layout-multiple-columns . drawer__inner :: -webkit-scrollbar-thumb : active {
background-color : var ( --color-light-text ) ;
}
. layout-multiple-columns . drawer__inner :: -webkit-scrollbar-track {
background-color : var ( --color-dark ) ;
border : 0 ;
border-radius : 0 ;
}
. layout-multiple-columns . drawer__inner :: -webkit-scrollbar-track : hover ,
. layout-multiple-columns . drawer__inner :: -webkit-scrollbar-track : active {
background-color : var ( --color-dark ) ;
}
2023-12-17 14:17:57 +02:00
/* New onboarding in /start in v4.3.0-alpha.0+mementomods-2023-12-16 */
. layout-multiple-columns . onboarding__steps__item ,
. layout-multiple-columns . onboarding__link {
background-color : var ( --color-dark ) ;
margin-bottom : 10px ;
}
. layout-multiple-columns . onboarding__steps__item__progress > svg > path {
fill : var ( --color-dark ) ;
}
. layout-multiple-columns . onboarding__links > * {
margin-bottom : 10px ;
}
2024-03-22 20:12:36 +02:00
/* Fixes for the design for v4.3.0-alpha.3-2024-03-22 with new popout layout */
. layout-multiple-columns . drawer__pager ,
. layout-multiple-columns . explore__search-results {
2024-03-22 20:06:34 +02:00
border : 0 ;
}
2024-03-22 20:12:36 +02:00
. layout-multiple-columns . column-back-button ,
. layout-multiple-columns . account__section-headline {
2024-03-22 20:06:34 +02:00
border-left : 0 ;
border-right : 0 ;
}
2024-03-22 20:12:36 +02:00
. layout-multiple-columns . column-back-button {
2024-03-22 20:06:34 +02:00
border-top : 0 ;
}
2023-09-23 18:16:49 +03:00
/ *
* Boost animation micro-interaction start
* ---------------------------------------
* /
2024-02-11 18:13:50 +02:00
. layout-multiple-columns . icon-button : has ( . icon-retweet ) {
height : 24px ;
width : 24px ;
}
2024-01-28 20:06:35 +02:00
@ keyframes boost-animate {
2023-09-23 18:16:49 +03:00
100 % {
background-position : -7770px ;
}
}
2023-10-07 18:19:53 +03:00
@ media ( prefers-reduced-motion : no-preference ) {
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . icon-button . active : focus . icon-retweet {
2023-10-07 18:19:53 +03:00
/* 37 frames */
2023-10-29 21:09:09 +02:00
animation : boost-animate 1 . 45s steps ( 37 ) forwards ;
2023-10-07 18:19:53 +03:00
/* stylelint-disable-next-line */
2023-10-29 21:09:09 +02:00
background-image : url ( data : image / png ; base64 , iVBORw0KGgoAAAANSUhEUgAAHyIAAABkCAYAAADeSNK + AAAAAXNSR0IArs4c6QAAIABJREFUeF7s3QuclXW1 / / HvevaeCzfxhmaamYoKeioPFy9ZMinOgHd0UNHMOqVdrJOC187Jbf9KDRDLjiZ1ypMCOqOiqQwDFlgeTWHSSkFFTTumKSoXh8vM3vtZ / 9cDYoAoM8zeM8 / ez2e / Xud1iv0867fWez2rjZuRZeKFAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAKxE7DYZURCCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCAgFpHzECCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCAQQwEWkcewKaSEAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAIvIeQYQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQiKEAi8hj2BRSQgABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQIBF5DwDCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCMRQgEXkMWwKKSGAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCDAInKeAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQRiKMAi8hg2hZQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQYBE5zwACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACMRRgEXkMm0JKCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCLCInGcAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAgRgKsIg8hk0hJQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQRYRM4zgAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggEAMBVhEHsOmkBICCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACCCCAAAIIIIAAAggggAACLCLnGUAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAghgIsIo9hU0gJAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAAQQQQAABBBBAAAEEEEAAARaR8wwggAACCCCAAAIIIIAAAggggAA
2023-10-07 18:19:53 +03:00
background-position : left ;
background-repeat : no-repeat ;
2023-10-29 21:09:09 +02:00
background-size : inherit ;
2023-10-07 18:19:53 +03:00
/* stylelint-disable-next-line */
content : '' ! important ;
/* stylelint-disable-next-line */
display : block ! important ;
height : 101px ;
2023-10-29 21:09:09 +02:00
left : -85px ;
2023-10-07 18:19:53 +03:00
min-height : 23px ;
min-width : 42 . 22px ;
pointer-events : none ;
position : absolute ;
2024-02-11 18:13:50 +02:00
top : -38px ;
transform : scale ( 0 . 82 ) translateX ( 0 ) ;
2023-10-07 18:19:53 +03:00
width : 200px ;
}
/* Detailed status offset for boost animation */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . detailed-status__button . icon-button . active : focus . icon-retweet {
2024-02-16 20:03:00 +02:00
left : -89px ;
2024-04-06 17:04:10 +03:00
top : -37px ;
2023-10-07 18:19:53 +03:00
}
/* Offset in numbered item */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . status__action-bar . icon-button . icon-button--with-counter . active : focus . icon-retweet {
2024-01-28 21:00:26 +02:00
left : -92px ;
2024-01-28 20:06:35 +02:00
}
/* Offset fixes for especially multiple column view */
. layout-multiple-columns . no-reduce-motion . detailed-status__button . icon-button . active : focus . icon-retweet ,
. layout-multiple-columns . no-reduce-motion . status . icon-button . icon-button--with-counter . star-icon . activate {
2024-02-11 18:13:50 +02:00
transform : scale ( 0 . 82 ) translate ( 2px , -2px ) ;
2024-01-28 20:06:35 +02:00
}
2024-01-28 20:34:11 +02:00
/* stylelint-disable-next-line */
2024-01-28 20:06:35 +02:00
. layout-multiple-columns . no-reduce-motion . status . icon-button . icon-button--with-counter . star-icon . activate . icon-star + . icon-button__counter > . animated-number {
top : 2px ;
2024-01-28 20:34:11 +02:00
transform : translateX ( 10px ) ;
2024-01-28 20:06:35 +02:00
}
2024-01-28 20:34:11 +02:00
/* stylelint-disable-next-line */
2024-01-28 20:06:35 +02:00
. layout-multiple-columns . no-reduce-motion . status__action-bar . icon-button . icon-button--with-counter . active : focus . icon-retweet + . icon-button__counter > . animated-number {
2024-01-28 21:00:26 +02:00
top : 0 ;
transform : translateX ( 13px ) ;
2023-10-07 18:19:53 +03:00
}
2023-09-23 18:16:49 +03:00
}
2023-10-07 18:19:53 +03:00
@ media ( prefers-reduced-motion : reduce ) {
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . icon-button . active : focus . icon-retweet {
2023-10-07 18:19:53 +03:00
/* stylelint-disable-next-line */
2023-10-29 21:09:09 +02:00
background-image : var ( --icon-boost-active ) ! important ;
2023-10-07 18:19:53 +03:00
}
2023-09-23 18:16:49 +03:00
}
2023-09-23 21:40:32 +03:00
/* Detailed status offset for boost animation on mobile */
@ media ( max-width : 890px ) {
/* stylelint-disable-next-line */
2023-10-30 00:01:18 +02:00
. layout-multiple-columns . no-reduce-motion . icon-button . active : focus . icon-retweet {
/* stylelint-disable-next-line */
2023-11-04 00:02:36 +02:00
transform : scale ( . 82 ) translateY ( 1px ) translateX ( -2px ) ! important ;
2023-09-23 21:40:32 +03:00
}
}
2023-09-23 18:16:49 +03:00
/ *
* Boost animation micro-interaction ends
* --------------------------------------
* /
2023-04-05 18:54:13 +03:00
/ *
2023-10-07 18:19:53 +03:00
* Heart animation micro-interaction start
* ---------------------------------------
2023-04-05 18:54:13 +03:00
* /
@ keyframes heart-animate {
100 % {
background-position : -2800px ;
}
}
2023-04-05 19:24:16 +03:00
/* Left sidebar column links */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link . icon-star {
background-image : var ( --icon-heart-column-link ) ;
2023-04-05 18:54:13 +03:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link . active . icon-star {
background-image : var ( --icon-heart-column-link-active ) ;
2023-04-05 18:54:13 +03:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification-favourite . icon-star {
background-image : var ( --icon-heart-notification ) ;
2023-04-05 18:54:13 +03:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification__filter-bar . icon-star ,
. layout-multiple-columns . detailed-status__action-bar . icon-button . icon-star ,
. layout-multiple-columns . status__action-bar . icon-button . icon-star {
background-image : var ( --icon-heart ) ;
2023-04-05 18:54:13 +03:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification__filter-bar . active . icon-star {
background-image : var ( --icon-heart-active ) ;
2023-04-05 18:54:13 +03:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . detailed-status__action-bar . active : not ( . activated ) . icon-star ,
. layout-multiple-columns . status__action-bar . active : not ( . activated ) . icon-star {
background-image : var ( --icon-heart-active-red ) ;
2023-04-05 18:54:13 +03:00
}
. icon-button . star-icon . active ,
2023-10-29 21:09:09 +02:00
. notification-favourite . star-icon {
2023-04-05 18:54:13 +03:00
color : var ( --color-red ) ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . detailed-status__action-bar . icon-button : hover . icon-star ,
. layout-multiple-columns . detailed-status button . icon-button : hover . icon-star ,
. layout-multiple-columns . status button . icon-button : hover . icon-star {
background-image : var ( --icon-heart-hover ) ;
2023-04-05 18:54:13 +03:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . no-reduce-motion . icon-button . star-icon {
2023-10-29 21:09:09 +02:00
max-height : 23px ;
max-width : 42 . 22px ;
2023-04-05 18:54:13 +03:00
min-height : 23px ;
min-width : 42 . 22px ;
position : relative ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . status__action-bar . icon-button . star-icon :: after {
2023-10-31 18:41:40 +02:00
left : -3px ;
2023-10-29 21:09:09 +02:00
}
2023-04-05 18:54:13 +03:00
/* Disable default Mastodon animation: spring-rotate-in 1s linear; */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . icon-button . star-icon . icon-star {
2023-04-05 18:54:13 +03:00
/* stylelint-disable-next-line */
animation : none ! important ;
}
2023-10-07 18:19:53 +03:00
/* While active, hide the original icon */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . icon-button . star-icon . activate : hover . icon-star {
2023-04-05 18:54:13 +03:00
/* stylelint-disable-next-line */
content : '' ! important ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . icon-button . star-icon . activate . icon-star {
2023-04-05 18:54:13 +03:00
/* stylelint-disable-next-line */
2023-10-29 21:09:09 +02:00
background-image : url ( data : image / png ; base64 , iVBORw0KGgoAAAANSUhEUgAAC1QAAABkCAMAAAAM7mAaAAADAFBMVEUAAACzq8zkMFXkJlOxqc3iJk3jJk3Ci + fiKVTiJk3iJU3LlO3iJ07jJUziJk3jJk3iJk3jJk / hJ0 / iJk3iJk3Mj / XiJk3iJk3Nj / XiJk3iJk3iJk3iJk3Mj / biJk2U1avNj / bjJk3Nku3Kk / PjJk3LkfXLkPXjJ1DMj / XNjvaXuNrou4DiJU3MjvXMjvXjJk3Lj / R5vtTiJk3iJk3jJk3MjvbMk / XAXMnjJk3NkPXXZ7PhJUys5qSm7bbMjvXMkPTMjvWf4s + Tr97Nj / biJU2xxria4LeeMOLSjrTiJk3bhL63WM / 0ujCwtvrWnPTMkPbjKFHMj / ab2MPgyoCb37rgoJ6Y5cOfx / ozn + / TldOX5sLstpHut3yg3sKT37nVb8LNkvXJrMXqqmfTasHB6pCV0 + + nn7aclsbVa8CT58Cf5MCV48Kcx / rSasLIxp + Vz / XqwnCz25iJlvNnnNmgZ8zdRoiU0ffJ7IzdmbijyfDgvZHEXNKr5JWq2KGutMQ8oO3Fp / rL6ozeRoiV1fHsl6XdRojimKbev46sUdVgmvPGuouV1POiNd / OZ8PnvI / uuUc + x5bUar / Wb8On5qLTasCrusO306PdRohan + XeRYifNeKspr9cod / aesuTwI2R0vmsu8Myn + / Mp8ymp8PTms2iTNdYw5E7yY2Ll + / xvjfkJU3iJk2V5MKimr1MoOu7y7HLxp0qyo3dRojbj8ToykXL6n22sviVyI1ByI6s1sr3v5CbyPrzvzCqtcHQodOfZ8ud2djdR4iQmN6S4ciw9prnvZCfMOLalctlm + vor5czoe9omuSKmeqU2uWwxcWb3dTCqvr0jqmhmrjLxJa9rPqwy8LEkfSgZ8udL + PdRomquMK / Ws2SlfFVur / qqmdOw54zr + Kw9prbktC / vNyzQt5Qwb7Tyrix063lIlKwkfXi0UziJk3MjvXUar / dRoiquMKR0vqM6MOw1aWW2On0jqew9pqxwsXglMW7vNywkfXi0UyzQt7U4GjBnPJbtsN52bDbH1E9AAAA63RSTlMABAUMCPPkDBT92hQZafm1fSUh7ZRLpp1BzL5zOyPFD7tBHTOuezgslqEeF9T87EcrFWCMhfViFVmIQTIb / uJay / 4qrkwzJ / 78Uiwi / fz + UTDV / Sf + / F7 + / v6hNA1NPXNt / fqPPDP + / ebIinZfW / 57UVX9 / fvhmHhUSf77rW1pU / 7 + v76noId2bf360aimlngz + MzMvaudi3VXUUZB / vvn4d6ciXo + + rJjOzc04aaPiGf89LWs1J + Jhv373c / Lx8W6ZVD74t7Z2NK9tbWJ8evo4 + PgzMK0qZt / c / Hb0MypY / z46ebSm / zx7 + bhp + NmuQAAKXNJREFUeNrs3UFIU3EcB / DvHx68wzsPdhmTDaMGxbpMDGXhKMF4EzssCGZGLbBejCBGDysGXYLqUnSZmKF4MzoEExnUoahTJaEkdMuOHiaBChL0VzpEJQTtCw2 / H9j5u + OX7 / s9HkRERERERERERERERERERERERERERERERERERERERERERERERERa5LADulIKdGEJdEEIuiAAXVAGXakMERGRPSuRiYFtfCoEW3HpEtgKo6cNyAprow7Iii9n6Rmlt + / pGamvk6BrNEBXLoOurwQREZG9yssNdRtwpfP5 / D5w9W1ubobgis / PzxdBNtvbS88YXVsbBtnFtbXDILOl2oDMVMqgS6UgIiIiPJGFhU6QHbCFNwOuTpvRDa6btlRPg + uwLdUFkI329h7HH7XXUh2 / WMCu2unERERERKiCet0Dl1O1kuDq4BdeZG3GCLi8lc3NYyC79G7JAVnPpWGIiIiI7BGh7 / uL4HKr1iC4MrbwJsFlOju6Dci8UI / QRURERFoobDQqBjSuC6DuWy5YYglYi9XqggeWZBLboiNp0IQh6AoF / EoZuzh + HHSOTjJERESogkYjAFng + wHcUxYvKlOtZnaS / AWw2Pk4C8DJjCTAEsnnIyCzbw / 2gW1 + HnSnT + NP2q7wioiISNsrnbL6TLlSNmBxfcvZSaqAZcHOx4Cp + 4slsOTy + RzIMvwXFOGtrHhgKxYhIiIislcEp6yg0mw2K2BJ + ZbnNKhLtb3JWATZYD4 / CDKns9OgFboc7Mq0JsKdccF2YsYBW60GNuf2DNi6 + Bk4Np0C25U5B2xzc6C7fgVszoMesMWvgy5 + HiIibKlyOQWuvp2lurkNNHXfrwOlW40yaGL1egJsnodWGHj27Bq43PsTE0fANTA29ukEuGpbW18MuJb7 + 5dBdre / fwZkL65eNSD7cOEJ2B49GgbbqwfYRVuValzRpbyIyN9xJ5vNyTi4wjt3Qkw2bRJ4ku3zRS9n6uzzcVCZNxsbGwOgOjMxMXEfXOfGxsbOgOvu1tYWu7jbwvsaZDajBrKPV1 + AbfrDONiGbxiwxeMQEZG9JGxaIYi8ZDQaiUSjZRsU4P / nPHy8dAxUN89aBkyJDesaftdmpfqMLdWXwXWbv1Sjxi + 8OHF32YDMmemCiIhImzGxaCSbjURjBiTpTHduqGkN5bozabSeSf7891NBNpI0 + DfxQtEB1dP19fXHBkxTZy0PTOYzf6nusucf7MLr3vt0zoCsdrsLbK4LERER + YUXGdmf6zh6tCO3fyTigSCRPTB0cPWHg0MHsgm0mDOYO7S6zW82 / W / 2t3ooN + iglWKRNH6TjsTwD3pmT54cdcC0tG71gGncdurn2FW73FTDDHgQERGR7 + zdP2gTURwH8O + LBydkDnQJlYQE45FSh6Q0lDQQ2iFGpIYKbc6mxA5WEeNQ4z + EVKkOalAqoiBIqUPAQTR1EBFFRFy6iIOLgzjJSzGLSO3gi8Y / oU3u7t09EX2fqTSQL78p3 / x4ufdvUmK5fRfnr1yZv7gvF1PgvN7 + BG2R6O + Fo9ToFrrOlqgK5 / i2Nhp1T7J / sMvv9fobx513Nv6x1QdbJn7ds + z3EGyIePzgdmA3swfCNDfVywRCHVtYkHVUkiRJkqS / Vl9u / nLtN5fnc31wkhJN0A0kogqc4g700A31BNxwhi8UpnQk0Ium7R + Zo72BEUrDIR / 4HazX6webW2qCtojH + xeX6u6ry7eGIEmSJEmS9L + Kzdc2MB + DU0g0TtuIR4kzEZMR2lZkkjgREYjQcDKI35xp / lgxmAzTSIA7RKk3dAPE4zY6QMMZMrSbGYAkSZIkSZIkRuxKrY0rMTjCn6AdJPxORIzQjkbsh3jZFMletNh + + OhxfNObZJN4wWd7vWE7fF0w1OUDl4nxA / JKZ0mSJEmSJMDlgvP6LtY6uNjnxII3TDsKBwhsmmQRBiGTsGcwQuMedOCJ08gg + EyzTj0NvxcmeP1gFu8vKhAse3ZOg2B6 + W0GopWrFYiWqRYgGimXIVyhCOEGigqEK3ZDuOwAxJNXiEiSJDlp8 / VrszP3Vlbuzcxeu74ZDortr3W0Pwab3FuooS1u2KGEqAkhBdwGxu98DieNjmYkKQ2Aw / De4fHp8e4uN0xxdwGLY2NjC7BgaIjAIm10dPQlzCNDPlj2Np / PW8lIKbCskk6nCUxTU + DwKJ3W8Y3LRFafCg6F1VUN3 + gVzTiDgMfSWvOtSaVinAEuU6UBfJeZIjBAwKeo4Tt9ShcUAYX8HGkAwmUyEE7PQrwsgXCaDuF0DeL9Kxk6QRvyC6j0Z7mezq60mH3qgkNyNUM52OIboSaM + MBPXV / bI / F4ZH11VwEbm + QnMBSgtN8dCHhhyUF22nkY6FJND9yFx6xUv7P2ZI7XsCg7ylh7iPQx7lJNspq56w5fKFyl2gUm8 / ZtAUbU / TdzsK6afuRCQzmdLsNA38mTO2CdVq2S73 + wCm80yY4vF8AjU / gx0eqq0SC37V7vXVhbW0JnNy7AHn2ptKQYzLEDNhVLpQHRH / dTpdIURHt14hxEO / fwEkTTH76EcJeeQ7jsQwLhLukQLqNBPB2SZMD1ZmZlnZk3LjhhX82EfbDBG6emxL3gpbR26p5Q1K + CU
2023-04-05 18:54:13 +03:00
background-position : 0px ;
background-repeat : no-repeat ;
2023-10-29 21:09:09 +02:00
background-size : unset ;
2023-04-05 18:54:13 +03:00
/* stylelint-disable-next-line */
content : '' ! important ;
height : 100px ;
left : -38px ;
pointer-events : none ;
position : absolute ;
top : -38px ;
2024-02-16 20:00:45 +02:00
transform : scale ( . 65 ) ;
2023-04-05 18:54:13 +03:00
width : 100px ;
}
2023-10-07 18:19:53 +03:00
@ media ( prefers-reduced-motion : no-preference ) {
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . icon-button . star-icon . activate . icon-star {
2023-10-07 18:19:53 +03:00
/* 28 frames */
2023-10-29 21:09:09 +02:00
/* stylelint-disable-next-line */
animation : heart-animate 0 . 8s steps ( 28 ) forwards ! important ;
2023-10-07 18:19:53 +03:00
}
}
2023-04-05 18:54:13 +03:00
/* stylelint-disable-next-line */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . status . icon-button . star-icon . activate . icon-star {
2024-02-11 18:13:50 +02:00
left : -29px ;
2024-01-28 20:24:03 +02:00
top : -40px ;
2023-04-05 18:54:13 +03:00
}
/* stylelint-disable-next-line */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . status . icon-button . icon-button--with-counter . star-icon . activate . icon-star {
2023-04-05 18:54:13 +03:00
left : -38px ;
2024-01-28 20:27:38 +02:00
top : -38px ;
2023-04-05 18:54:13 +03:00
}
/* stylelint-disable-next-line */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . detailed-status__action-bar . icon-button . star-icon . activate . icon-star {
2023-04-05 18:54:13 +03:00
left : -29px ;
2024-01-28 20:06:35 +02:00
top : -41px ;
}
. layout-multiple-columns . no-reduce-motion . detailed-status__action-bar {
height : 25 . 5px ;
2023-04-05 18:54:13 +03:00
}
2023-10-07 18:19:53 +03:00
@ media screen and ( max-width : 889px ) {
/* stylelint-disable-next-line */
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . status . icon-button . star-icon . activate . icon-star {
2023-10-07 18:19:53 +03:00
left : -28px ;
}
}
2023-04-05 18:54:13 +03:00
/ *
2023-04-05 19:24:16 +03:00
* --------------------------------------
2023-10-07 18:19:53 +03:00
* Heart animation micro-interaction ends
2023-04-05 18:54:13 +03:00
* /
/ *
2023-10-29 21:09:09 +02:00
* Star animation micro-interaction start ( depends on the hearts above )
2023-04-05 19:24:16 +03:00
* -------------------------------------------------------------------------
2023-04-05 18:54:13 +03:00
* /
2023-10-29 21:09:09 +02:00
/ * 1 / 2 : If you prefer stars remove this line and the last line of this file
2023-04-08 23:00:51 +03:00
@ media ( hover : hover ) {
2023-10-29 21:09:09 +02:00
. layout-multiple-columns button . icon-button : not ( . active ) : hover . icon-star ~ span ,
. layout-multiple-columns button . icon-button : not ( . active ) : hover . icon-star {
2023-04-08 23:00:51 +03:00
color : var ( --color-yellow ) ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns button . icon-button . active : hover . icon-star ~ span {
2023-04-08 23:00:51 +03:00
color : var ( --color-dim ) ;
}
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link . icon-star {
background-image : var ( --icon-star-column-link ) ;
2023-04-05 18:54:13 +03:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . column-link . active . icon-star {
background-image : var ( --icon-star-column-link-active ) ;
2023-04-05 18:54:13 +03:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification-favourite . icon-star {
background-image : var ( --icon-star-notification ) ;
2023-04-05 19:24:16 +03:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification__filter-bar . active . icon-star {
background-image : var ( --icon-star-active ) ;
2023-04-05 18:54:13 +03:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns button . icon-button : hover . icon-star ~ span {
2023-04-07 13:42:29 +03:00
color : var ( --color-dim ) ;
2023-04-05 20:02:24 +03:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns button . icon-button . activate . icon-star ~ span ,
. layout-multiple-columns button . icon-button . active . icon-star ~ span {
2023-04-07 13:44:27 +03:00
color : var ( --color-yellow ) ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification__filter-bar . icon-star ,
. layout-multiple-columns . detailed-status__action-bar . icon-button . icon-star ,
. layout-multiple-columns . status__action-bar . icon-button . icon-star {
--size-icon : 20px ;
background-image : var ( --icon-star-detailed-status-action-bar ) ;
2023-04-05 18:54:13 +03:00
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification__filter-bar button . icon-button . active . icon-star ,
. layout-multiple-columns . detailed-status__action-bar button . icon-button . active . icon-star ,
. layout-multiple-columns . status__action-bar button . icon-button . active . icon-star {
background-image : var ( --icon-star-detailed-status-action-bar ) ! important ;
2023-04-05 18:54:13 +03:00
display : block ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . icon-button . star-icon . activate . icon-star {
2023-04-05 18:54:13 +03:00
background-color : unset ! important ;
2023-10-29 21:09:09 +02:00
background-image : var ( --icon-star-detailed-status-action-bar-active ) ! important ;
background-position : center ;
2023-04-05 18:54:13 +03:00
color : var ( --color-yellow ) ;
left : unset ! important ;
position : relative ;
top : 0 ;
transform : none ;
width : unset ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . icon-button . star-icon . active . icon-star {
animation : none ! important ;
background-image : var ( --icon-star-detailed-status-action-bar-active ) ! important ;
}
2023-10-07 18:19:53 +03:00
@ media ( prefers-reduced-motion : no-preference ) {
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . icon-button . star-icon . activate . icon-star {
animation : sparkles-width . 65s 1 , sparkles-size . 65s 1 , popping . 5s 1 ! important ;
2023-10-07 18:19:53 +03:00
}
. layout-multiple-columns . detailed-status__action-bar button . icon-button . star-icon . activate :: after ,
. layout-multiple-columns . status__action-bar button . icon-button . activate . star-icon :: after {
animation : sparkles-width . 65s 1 , sparkles-size . 65s 1 ;
}
. layout-multiple-columns . detailed-status__action-bar button . icon-button . activate . star-icon :: before ,
. layout-multiple-columns . status__action-bar button . icon-button . activate . star-icon :: before {
animation : ring-border-width . 35s 1 , ring-size . 35s 1 ;
}
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__action-bar button . icon-button . star-icon . activate :: after ,
. layout-multiple-columns . status__action-bar button . icon-button . activate . star-icon :: after {
2023-04-05 18:54:13 +03:00
background-color : unset ! important ;
content : '' ;
height : 50px ! important ;
left : 50 % ! important ;
margin-left : -24px ;
margin-top : -20px ;
opacity : unset ;
position : absolute ;
top : calc ( 50 % + 1px ) ;
transform : none ;
width : 50px ! important ;
z-index : unset ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . no-reduce-motion . icon-button . star-icon . activate . icon-star ,
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__action-bar button . icon-button . star-icon . activate :: after ,
. layout-multiple-columns . status__action-bar button . icon-button . activate . star-icon :: after {
2023-04-05 20:39:34 +03:00
display : block ! important ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__action-bar button . icon-button . activate . star-icon :: before ,
. layout-multiple-columns . status__action-bar button . icon-button . activate . star-icon :: before {
2023-04-05 18:54:13 +03:00
border : 0px solid var ( --color-yellow ) ;
border-radius : 10em ;
content : '' ;
height : 0em ;
left : 50 % ;
position : absolute ;
top : 50 % ;
transform : translate ( -50 % , -50 % ) ;
transform-origin : 50px 50px ;
width : 0em ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . icon-button . star-icon . active ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . notification-favourite . star-icon {
2023-04-05 18:54:13 +03:00
color : var ( --color-yellow ) ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . detailed-status__action-bar button . icon-button . star-icon . deactivate : hover . icon-star ,
. layout-multiple-columns . status__action-bar button . icon-button . deactivate . star-icon : hover . icon-star ,
2023-10-30 00:01:18 +02:00
. layout-multiple-columns . detailed-status__action-bar . icon-button . deactivate . icon-star ,
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . detailed-status button . icon-button . deactivate . icon-star ,
. layout-multiple-columns . status button . icon-button . deactivate . icon-star {
background-image : var ( --icon-star-detailed-status-action-bar-hover ) ! important ;
2023-04-05 20:39:34 +03:00
color : var ( --color-dim ) ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . detailed-status__action-bar button . icon-button . star-icon . activate : hover . icon-star ,
. layout-multiple-columns . status__action-bar button . icon-button . activate . star-icon : hover . icon-star ,
. layout-multiple-columns . detailed-status__action-bar . icon-button : hover . icon-star ,
. layout-multiple-columns . detailed-status button . icon-button : hover . icon-star ,
. layout-multiple-columns . status button . icon-button : hover . icon-star {
background-image : var ( --icon-star-detailed-status-action-bar-active ) ! important ;
2023-04-05 18:54:13 +03:00
color : var ( --color-yellow ) ;
position : relative ;
top : 0 ;
}
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . detailed-status__action-bar . icon-button : focus . icon-star ,
. layout-multiple-columns . detailed-status button . icon-button : focus . icon-star ,
. layout-multiple-columns . status button . icon-button : hover . icon-star {
2023-04-06 19:30:05 +03:00
color : var ( --color-dim ) ;
}
2023-07-23 18:39:32 +03:00
. layout-multiple-columns button : focus ,
. layout-multiple-columns . icon-button : focus {
outline : 0 ;
}
. layout-multiple-columns button : focus-visible ,
. layout-multiple-columns . icon-button : focus-visible {
outline : 2px solid var ( --color-accent ) ;
}
2023-09-23 19:22:25 +03:00
. layout-multiple-columns . search__popout__menu__item {
2023-09-23 13:54:39 +03:00
align-items : initial ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__action-bar button . icon-button . star-icon . icon-button--with-counter . star-icon . activate :: after ,
. layout-multiple-columns . status__action-bar button . icon-button . icon-button--with-counter . star-icon . activate . star-icon :: after {
2024-04-06 17:00:58 +03:00
left : calc ( 50 % - 8px ) ! important ;
2023-04-05 20:14:55 +03:00
top : calc ( 50 % + -1px ) ! important ;
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__action-bar button . icon-button . icon-button--with-counter . activate . star-icon :: before ,
. layout-multiple-columns . status__action-bar button . icon-button . icon-button--with-counter . activate . star-icon :: before {
2024-04-06 17:00:58 +03:00
left : calc ( 50 % - 8px ) ! important ;
}
. layout-multiple-columns button . icon-button . icon-button--with-counter . activate . star-icon > . icon-star {
position : absolute ! important ;
top : unset ! important ;
left : -34px ! important ;
2023-04-07 12:30:50 +03:00
}
2023-10-07 18:19:53 +03:00
@ media ( hover : none ) {
2023-10-29 21:09:09 +02:00
. layout-multiple-columns . detailed-status__action-bar button . icon-button . star-icon . activate : hover . icon-star ,
. layout-multiple-columns . status__action-bar button . icon-button . activate . star-icon : hover . icon-star ,
. layout-multiple-columns . detailed-status__action-bar . icon-button : hover . icon-star ,
. layout-multiple-columns . detailed-status button . icon-button : hover . icon-star ,
. layout-multiple-columns . status button . icon-button : hover . icon-star {
content : var ( --icon-star-detailed-status-action-bar-active ) ! important ;
2023-10-07 18:19:53 +03:00
}
}
2023-04-07 11:26:58 +03:00
@ media ( max-width : 888px ) {
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . status__action-bar button . icon-button . icon-button--with-counter . star-icon . activate . star-icon :: after {
2023-04-09 21:42:07 +03:00
left : calc ( 50 % - 11px ) ! important ;
2023-04-07 11:26:58 +03:00
}
2023-07-03 22:21:53 +03:00
. layout-multiple-columns . detailed-status__action-bar button . icon-button . icon-button--with-counter . activate . star-icon :: before ,
. layout-multiple-columns . status__action-bar button . icon-button . icon-button--with-counter . activate . star-icon :: before {
2023-04-09 21:42:07 +03:00
left : calc ( 50 % - 11px ) ! important ;
2023-04-07 12:30:50 +03:00
}
2023-04-05 20:14:55 +03:00
}
2023-04-05 18:54:13 +03:00
@ keyframes popping {
0 % {
transform : scale ( 0 , 0 ) ;
}
40 % {
transform : scale ( 0 , 0 ) ;
}
75 % {
transform : scale ( 1 . 3 , 1 . 3 ) ;
}
100 % {
transform : scale ( 1 , 1 ) ;
}
}
@ keyframes ring-border-width {
0 % {
border-width : 0 ;
}
50 % {
border-width : 0 . 22em ;
}
100 % {
border-width : 0 ;
}
}
@ keyframes ring-size {
0 % {
height : 0 ;
width : 0 ;
}
100 % {
height : 2em ;
width : 2em ;
}
}
@ keyframes sparkles-width {
0 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='1.3' fill='transparent' /%3E%3C/svg%3E" ) ;
}
1 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='2.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
2 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='3.9' fill='transparent' /%3E%3C/svg%3E" ) ;
}
3 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='5.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
4 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='6.5' fill='transparent' /%3E%3C/svg%3E" ) ;
}
5 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='7.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
6 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='9.1' fill='transparent' /%3E%3C/svg%3E" ) ;
}
7 % {
2023-04-10 11:59:49 +03:00
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='10.4' fill='transparent' /%3E%3C/svg%3E" ) ;
2023-04-05 18:54:13 +03:00
}
8 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='11.7' fill='transparent' /%3E%3C/svg%3E" ) ;
}
9 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='13' fill='transparent' /%3E%3C/svg%3E" ) ;
}
10 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='14.3' fill='transparent' /%3E%3C/svg%3E" ) ;
}
11 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='15.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
12 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='16.9' fill='transparent' /%3E%3C/svg%3E" ) ;
}
13 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='17.3' fill='transparent' /%3E%3C/svg%3E" ) ;
}
14 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='17.3' fill='transparent' /%3E%3C/svg%3E" ) ;
}
15 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='18' fill='transparent' /%3E%3C/svg%3E" ) ;
}
16 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='14.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
17 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='14.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
18 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='14.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
19 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='14.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
20 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='14' fill='transparent' /%3E%3C/svg%3E" ) ;
}
21 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='13.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
22 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='13.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
23 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='13.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
24 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='13.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
25 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='13' fill='transparent' /%3E%3C/svg%3E" ) ;
}
26 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='12.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
27 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='12.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
28 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='12.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
29 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='12.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
30 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='12' fill='transparent' /%3E%3C/svg%3E" ) ;
}
31 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='11.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
32 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='11.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
33 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='11.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
34 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='11.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
35 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='11' fill='transparent' /%3E%3C/svg%3E" ) ;
}
36 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='10.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
37 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='10.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
38 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='10.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
39 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='10.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
40 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='10' fill='transparent' /%3E%3C/svg%3E" ) ;
}
41 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='9.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
42 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='9.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
43 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='9.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
44 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='9.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
45 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='9' fill='transparent' /%3E%3C/svg%3E" ) ;
}
46 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='8.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
47 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='8.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
48 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='8.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
49 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='8.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
50 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
51 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='7.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
52 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='7.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
53 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='7.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
54 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='7.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
55 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='7' fill='transparent' /%3E%3C/svg%3E" ) ;
}
56 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='6.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
57 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='6.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
58 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='6.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
59 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='6.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
60 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
61 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='5.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
62 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='5.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
63 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='5.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
64 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='5.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
65 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='4.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
66 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='4.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
67 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='4.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
68 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='4.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
69 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
70 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='3.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
71 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='3.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
72 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='3.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
73 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='3.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
74 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='3' fill='transparent' /%3E%3C/svg%3E" ) ;
}
75 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='2.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
76 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='2.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
77 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='2.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
78 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='2.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
79 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
80 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='1.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
81 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='1.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
82 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='1.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
83 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='1.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
84 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='1' fill='transparent' /%3E%3C/svg%3E" ) ;
}
86 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0.8' fill='transparent' /%3E%3C/svg%3E" ) ;
}
87 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0.6' fill='transparent' /%3E%3C/svg%3E" ) ;
}
88 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0.4' fill='transparent' /%3E%3C/svg%3E" ) ;
}
89 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0.2' fill='transparent' /%3E%3C/svg%3E" ) ;
}
90 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0' fill='transparent' /%3E%3C/svg%3E" ) ;
}
91 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0' fill='transparent' /%3E%3C/svg%3E" ) ;
}
92 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0' fill='transparent' /%3E%3C/svg%3E" ) ;
}
93 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0' fill='transparent' /%3E%3C/svg%3E" ) ;
}
94 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0' fill='transparent' /%3E%3C/svg%3E" ) ;
}
95 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0' fill='transparent' /%3E%3C/svg%3E" ) ;
}
96 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0' fill='transparent' /%3E%3C/svg%3E" ) ;
}
97 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0' fill='transparent' /%3E%3C/svg%3E" ) ;
}
98 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0' fill='transparent' /%3E%3C/svg%3E" ) ;
}
99 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0' fill='transparent' /%3E%3C/svg%3E" ) ;
}
100 % {
content : url ( "data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='40' width='40' class='stardust'%3E%3Ccircle cx='20' cy='20' r='14' stroke='%23fa733e' stroke-dasharray='1 15' stroke-dashoffset='23' stroke-width='0' fill='transparent' /%3E%3C/svg%3E" ) ;
}
}
@ keyframes sparkles-size {
0 % {
transform : scale ( 0 . 1 , 0 . 1 ) ;
}
5 % {
transform : scale ( 0 . 1 , 0 . 1 ) ;
}
85 % {
transform : scale ( 1 , 1 ) ;
}
}
2023-10-29 21:09:09 +02:00
2 / 2 : If you prefer stars remove this line too * /
/* Advanced web interface specific styles */
/* Make the side input last in order */
. layout-multiple-columns . drawer {
order : 999999 ;
padding : 0 10px ;
width : var ( --width-column ) ;
}
. layout-multiple-columns . drawer__header ,
. layout-multiple-columns . drawer__inner {
background-color : var ( --color-bg ) ;
border-color : var ( --color-bg ) ;
}
. layout-multiple-columns . column-back-button ,
. layout-multiple-columns . drawer__header ,
. layout-multiple-columns . drawer__inner__mastodon {
background-color : transparent ;
}
/* Hide the elephant */
. layout-multiple-columns . drawer__inner__mastodon {
display : none ;
}
. layout-multiple-columns . list-editor__search . search__icon . icon {
margin : 15px ;
}
/* Hashtag list */
. layout-multiple-columns . column-settings__hashtags . column-select__multi-value ,
. layout-multiple-columns . column-settings__hashtags . column-select__control {
color : var ( --color-light-purple ) ;
}
. layout-multiple-columns . column-settings__hashtags . column-select__multi-value {
background-color : var ( --color-bg-75 ) ;
}