diff --git a/CHANGELOG.md b/CHANGELOG.md index 2fd4165..0f3d4e7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,24 @@ # Changelog +## [1.1.6] - 2019-02-23 +### Added +- Add selected channel styles +- Add more padding to current user +- Remove vertical dividers from title bar +### Changed +- Increase channel bar transition duration +- Optimize channel bar hover behavior +- Optimize channel category title font size +- Decrease channel title font size +- Better emphasize unread channels titles by decreasing opacity of read channel titles +- Increase link color contrast (similar to Discord’s default colors) +- Update mentions colors (similar to Discord’s default colors +- Decrease username font size +- Update sidebar styles +- Move typing notifications under the text input area +### Fixed +- Remove channel bar item height changes + ## [1.1.5] - 2019-02-16 ### Fixed - Fix :smile: Emoji mapping diff --git a/dist/base.css b/dist/base.css index 3b44019..411b6fa 100644 --- a/dist/base.css +++ b/dist/base.css @@ -1 +1 @@ -:root{--font-family:"Lato-Regular","Helvetica Neue",Helvetica,"Segoe UI",-apple-system,BlinkMacSystemFont,Tahoma,Arial,sans-serif;--font-family-mono:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;--message-max-width:50rem;--avatar-border-radius:3px;--sidebar-icon-width:35px;--sidebar-icon-border-radius:8px;--channel-bar-width:11.5rem;--channel-bar-item-height:1.5rem;--message-padding:.5rem;--username-weight:900;--code-block-bg-color:#2f3136}.theme-dark{--font-smoothing:antialiased;--message-hover-background:rgba(243,243,244,0.04);--message-color:#f3f3f4;--text-input-color:#f3f3f4;--ui-border-color:rgba(243,243,244,0.2);--scrollbar-color:rgba(243,243,244,0.3)}.theme-light{--message-hover-background:rgba(32,34,37,0.03);--message-color:#202225;--text-input-color:#202225;--ui-border-color:rgba(32,34,37,0.3);--text-input-background-color:#fff;--scrollbar-color:rgba(32,34,37,0.3);--mention-color:#f04747;--mention-bg-color:#fdf2f1;--link-color:#4a7cf6;--inline-code-bg-color:#e3e4e7;--code-block-color:#dcddde}[class*=avatar-] [class*=image-]{border-radius:var(--avatar-border-radius)!important}*{-webkit-font-smoothing:var(--font-smoothing)!important}#app-mount,#app-mount textarea{font-family:var(--font-family)!important}[class*=base-]{border-radius:0!important}[class*=channels-]{width:var(--channel-bar-width);transition:width .1s ease-out}@media (max-width:1100px){[class*=channels-]{width:0}[class*=channels-]:hover,[class*=guildsWrapper]:hover+div>:nth-child(2)>[class*=channels-]{position:relative;width:var(--channel-bar-width)}[class*=channels-]:after{content:"";position:absolute;z-index:1;top:0;bottom:0;left:100%;width:3rem}}[class*=channels-] [class*=wrapper-]{height:calc(var(--channel-bar-item-height) + 2px);overflow:visible}[class*=channels-] [class*=content-]{height:var(--channel-bar-item-height)}[class*=channels-] [class*=name-]{line-height:var(--channel-bar-item-height);font-size:.9rem}[class*=markup-] code.inline{background:var(--inline-code-bg-color);padding:2px 4px}[class*=markup-] pre{background:var(--code-block-bg-color);border-color:var(--ui-border-color)}[class*=markup-] code:not(.inline){background:var(--code-block-bg-color);color:var(--code-block-color)}code{font-family:var(--font-family-mono)!important}[class*=markup-] a{color:var(--link-color)}.theme-light [class*=mention]{background-color:var(--mention-bg-color)!important;color:var(--mention-color)!important}.theme-light [class*=mention]:hover{background-color:var(--mention-color)!important;color:#fff!important}.theme-light [class*=isMentioned-] [class*=mention]:hover{color:var(--mention-color)!important}[class*=containerCozyBounded-]{padding-bottom:var(--message-padding);padding-top:var(--message-padding)}@media (min-width:1100px){[class*=containerCozy-] [class*=contentCozy-]{max-width:var(--message-max-width)}}[class*=containerCozy-] [class*=contentCozy-] [class*=markup-]{color:var(--message-color)!important}[class*=containerCozyBounded-]:hover{background-color:var(--message-hover-background)}[class*=scroller-]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color)!important}[class*=systemPad-] [class*=guildInner]{border-radius:var(--sidebar-icon-border-radius)!important}[class*=guildsWrapper] [class*=guildInner-],[class*=guildsWrapper] [class*=guildsAdd-]{-webkit-transform:translateX(8px);transform:translateX(8px)}[class*=guildsWrapper] [class*=avatar-],[class*=guildsWrapper] [class*=guild-],[class*=guildsWrapper] [class*=guildInner-] a,[class*=guildsWrapper] [class*=iconSizeLarge]{width:var(--sidebar-icon-width)!important;height:var(--sidebar-icon-width)!important;line-height:var(--sidebar-icon-width)!important}[class*=guild-]+[class*=guild-]{margin-top:12px!important}[class*=guildsWrapper] [class*=friendsOnline-]{width:calc(var(--sidebar-icon-width) + 16px)!important}[class*=guildsWrapper] [class*=guildsAdd-]{display:block;height:calc(var(--sidebar-icon-width)/2);border:none}[class*=guildsWrapper] button[class*=guildsAdd-]{margin-top:20px!important}[class*=guildsWrapper] [class*=downloadAppButton-]:after,[class*=guildsWrapper] [class*=guildSeparator-]{display:none}[class*=guildsWrapper] [class*=downloadAppButton-]{width:100%;margin-top:20px;margin-left:-4px;padding:0;font-size:8px}[class*=guildsWrapper] [class*=downloadAppButton-]>svg{display:none}[class*=channelTextArea-]{padding-top:0;border-top:0!important;margin-bottom:10px!important}[class*=innerNoAutocomplete-],[class*=titleWrapper-] [class*=searchBar-]{border:2px solid var(--ui-border-color)!important}[class*=inner-],[class*=titleWrapper-] [class*=searchBar-]{background-color:var(--text-input-background-color)!important}[class*=textArea-],[class*=titleWrapper-] [class*=searchBar-]{color:var(--text-input-color)!important}[class*=DraftEditorPlaceholder-root]{padding-top:1px!important}[class*=searchBar-] [class*=icon-]{top:-.5px!important}[class*=DraftEditorPlaceholder-inner],textarea::-webkit-input-placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=DraftEditorPlaceholder-inner],textarea:-ms-input-placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=DraftEditorPlaceholder-inner],textarea::-ms-input-placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=DraftEditorPlaceholder-inner],textarea::placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=username-]{font-weight:var(--username-weight)} \ No newline at end of file +:root{--font-family:"Lato-Regular","Helvetica Neue",Helvetica,"Segoe UI",-apple-system,BlinkMacSystemFont,Tahoma,Arial,sans-serif;--font-family-mono:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;--message-max-width:50rem;--avatar-border-radius:3px;--sidebar-icon-width:35px;--sidebar-icon-border-radius:8px;--channel-bar-width:11.5rem;--message-padding:.5rem;--username-weight:900;--username-size:.8rem;--code-block-bg-color:#2f3136;--channel-highlight-color:$base-color-dark;--channel-highlight-bg-color:rgba(243,243,244,0.7)}.theme-dark{--font-smoothing:antialiased;--message-hover-background:rgba(243,243,244,0.04);--message-color:#f3f3f4;--text-input-color:#f3f3f4;--ui-border-color:rgba(243,243,244,0.2);--scrollbar-color:rgba(243,243,244,0.3);--mention-color:#6f8fff;--mention-bg-color:rgba(114,137,218,0.1);--mention-hover-color:var(--mention-color);--mention-hover-bg-color:rgba(114,137,218,0.3);--link-color:#0096cf}.theme-light{--message-hover-background:rgba(32,34,37,0.03);--message-color:#202225;--text-input-color:#202225;--ui-border-color:rgba(32,34,37,0.3);--text-input-background-color:#fff;--scrollbar-color:rgba(32,34,37,0.3);--mention-color:#506bcc;--mention-bg-color:#f1f3fb;--mention-hover-color:var(--mention-color);--mention-hover-bg-color:#e1e5f6;--link-color:#08b;--inline-code-bg-color:#e3e4e7;--code-block-color:#dcddde}[class*=avatar-] [class*=image-]{border-radius:var(--avatar-border-radius)!important}*{-webkit-font-smoothing:var(--font-smoothing)!important}#app-mount,#app-mount textarea{font-family:var(--font-family)!important}[class*=base-]{border-radius:0!important}[class*=channels-]{width:var(--channel-bar-width)!important;transition:width .2s ease-out!important}@media (max-width:1100px){[class*=channels-]{position:relative;width:0!important}[class*=channels-]:hover,[class*=guildsWrapper]:hover+div>:nth-child(2)>[class*=channels-]{width:var(--channel-bar-width)!important}[class*=channels-]:after{content:"";position:absolute;z-index:1;top:0;bottom:0;left:100%;width:17px}[class*=channels-]:hover:after{width:3rem}}[class*=nameCollapsed-],[class*=nameDefault-],[class*=nameHovered-],[class*=nameHoveredCollapsed-]{font-size:.7rem;letter-spacing:.05em}[class*=channels-] [class*=name-]{font-size:14px!important;opacity:.8}[class*=channels-] [class*=nameUnreadText-]{opacity:1}[class*=channels-] [class*=contentSelectedText-],[class*=channels-] [class*=contentSelectedVoice-]{background-color:var(--channel-highlight-bg-color)!important}[class*=channels-] [class*=contentSelectedText-] [class*=actionIcon-],[class*=channels-] [class*=contentSelectedText-] [class*=icon-],[class*=channels-] [class*=contentSelectedText-] [class*=name-],[class*=channels-] [class*=contentSelectedVoice-] [class*=actionIcon-],[class*=channels-] [class*=contentSelectedVoice-] [class*=icon-],[class*=channels-] [class*=contentSelectedVoice-] [class*=name-]{color:var(--channel-highlight-color)}[class*=markup-] code.inline{background:var(--inline-code-bg-color);padding:2px 4px}[class*=markup-] pre{background:var(--code-block-bg-color);border-color:var(--ui-border-color)}[class*=markup-] code:not(.inline){background:var(--code-block-bg-color);color:var(--code-block-color)}code{font-family:var(--font-family-mono)!important}[class*=markup-] a{color:var(--link-color)!important}[class*=mention]{background-color:var(--mention-bg-color)!important;color:var(--mention-color)!important}[class*=mention]:hover{background-color:var(--mention-hover-bg-color)!important;color:var(--mention-hover-color)!important;text-decoration:underline}[class*=isMentioned-]{padding-top:.3rem;padding-bottom:.3rem}[class*=containerCozyBounded-]{padding-bottom:var(--message-padding);padding-top:var(--message-padding)}@media (min-width:1100px){[class*=containerCozy-] [class*=contentCozy-]{max-width:var(--message-max-width)}}[class*=containerCozy-] [class*=contentCozy-] [class*=markup-]{color:var(--message-color)!important}[class*=containerCozyBounded-]:hover{background-color:var(--message-hover-background)}[class*=scroller-]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color)!important}[class*=systemPad-] [class*=guildInner]{border-radius:var(--sidebar-icon-border-radius)!important}[class*=guildsWrapper] [class*=guildInner-],[class*=guildsWrapper] [class*=guildsAdd-]{-webkit-transform:translateX(8px)!important;transform:translateX(8px)!important}[class*=guildsWrapper] [class*=avatar-],[class*=guildsWrapper] [class*=guild-],[class*=guildsWrapper] [class*=guildInner-] a,[class*=guildsWrapper] [class*=iconSizeLarge]{width:var(--sidebar-icon-width)!important;height:var(--sidebar-icon-width)!important;line-height:var(--sidebar-icon-width)!important}[class*=guild-]+[class*=guild-]{margin-top:12px!important}[class*=guildsWrapper] [class*=friendsOnline-]{width:calc(var(--sidebar-icon-width) + 16px)!important}[class*=guildsWrapper] [class*=guildsAdd-]{display:block;height:calc(var(--sidebar-icon-width)/2);border:none}[class*=guildsWrapper] button[class*=guildsAdd-]{margin-top:20px!important}[class*=guildsWrapper] [class*=downloadAppButton-],[class*=guildsWrapper] [class*=downloadAppButton-]>svg,[class*=guildsWrapper] [class*=guildSeparator-]{display:none}[class*=channelTextArea-]{padding-top:0;border-top:0!important;margin-bottom:20px!important}[class*=innerNoAutocomplete-],[class*=titleWrapper-] [class*=searchBar-]{border:2px solid var(--ui-border-color)!important}[class*=inner-],[class*=titleWrapper-] [class*=searchBar-]{background-color:var(--text-input-background-color)!important}[class*=textArea-],[class*=titleWrapper-] [class*=searchBar-]{color:var(--text-input-color)!important}[class*=DraftEditorPlaceholder-root]{padding-top:1px!important}[class*=searchBar-] [class*=icon-]{top:-.5px!important}[class*=DraftEditorPlaceholder-inner],textarea::-webkit-input-placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=DraftEditorPlaceholder-inner],textarea:-ms-input-placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=DraftEditorPlaceholder-inner],textarea::-ms-input-placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=DraftEditorPlaceholder-inner],textarea::placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=typing-]{margin-bottom:-4px;background:none;font-size:12px;opacity:.8}[class*=titleWrapper-] [class*=divider-],[class*=titleWrapper-] [class*=topic-]:before{display:none}[class*=username-]{font-weight:var(--username-weight);font-size:var(--username-size)} \ No newline at end of file diff --git a/dist/complete.css b/dist/complete.css index 0cce8aa..75f7101 100644 --- a/dist/complete.css +++ b/dist/complete.css @@ -1,26 +1 @@ -:root{--font-family:"Lato-Regular","Helvetica Neue",Helvetica,"Segoe UI",-apple-system,BlinkMacSystemFont,Tahoma,Arial,sans-serif;--font-family-mono:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;--message-max-width:50rem;--avatar-border-radius:3px;--sidebar-icon-width:35px;--sidebar-icon-border-radius:8px;--channel-bar-width:11.5rem;--channel-bar-item-height:1.5rem;--message-padding:.5rem;--username-weight:900;--code-block-bg-color:#2f3136}.theme-dark{--font-smoothing:antialiased;--message-hover-background:rgba(243,243,244,0.04);--message-color:#f3f3f4;--text-input-color:#f3f3f4;--ui-border-color:rgba(243,243,244,0.2);--scrollbar-color:rgba(243,243,244,0.3)}.theme-light{--message-hover-background:rgba(32,34,37,0.03);--message-color:#202225;--text-input-color:#202225;--ui-border-color:rgba(32,34,37,0.3);--text-input-background-color:#fff;--scrollbar-color:rgba(32,34,37,0.3);--mention-color:#f04747;--mention-bg-color:#fdf2f1;--link-color:#4a7cf6;--inline-code-bg-color:#e3e4e7;--code-block-color:#dcddde}[class*=avatar-] [class*=image-]{border-radius:var(--avatar-border-radius)!important}*{-webkit-font-smoothing:var(--font-smoothing)!important}#app-mount,#app-mount textarea{font-family:var(--font-family)!important}[class*=base-]{border-radius:0!important}[class*=channels-]{width:var(--channel-bar-width);transition:width .1s ease-out}@media (max-width:1100px){[class*=channels-]{width:0}[class*=channels-]:hover,[class*=guildsWrapper]:hover+div>:nth-child(2)>[class*=channels-]{position:relative;width:var(--channel-bar-width)}[class*=channels-]:after{content:"";position:absolute;z-index:1;top:0;bottom:0;left:100%;width:3rem}}[class*=channels-] [class*=wrapper-]{height:calc(var(--channel-bar-item-height) + 2px);overflow:visible}[class*=channels-] [class*=content-]{height:var(--channel-bar-item-height)}[class*=channels-] [class*=name-]{line-height:var(--channel-bar-item-height);font-size:.9rem}[class*=markup-] code.inline{background:var(--inline-code-bg-color);padding:2px 4px}[class*=markup-] pre{background:var(--code-block-bg-color);border-color:var(--ui-border-color)}[class*=markup-] code:not(.inline){background:var(--code-block-bg-color);color:var(--code-block-color)}code{font-family:var(--font-family-mono)!important}[class*=markup-] a{color:var(--link-color)}.theme-light [class*=mention]{background-color:var(--mention-bg-color)!important;color:var(--mention-color)!important}.theme-light [class*=mention]:hover{background-color:var(--mention-color)!important;color:#fff!important}.theme-light [class*=isMentioned-] [class*=mention]:hover{color:var(--mention-color)!important}[class*=containerCozyBounded-]{padding-bottom:var(--message-padding);padding-top:var(--message-padding)}@media (min-width:1100px){[class*=containerCozy-] [class*=contentCozy-]{max-width:var(--message-max-width)}}[class*=containerCozy-] [class*=contentCozy-] [class*=markup-]{color:var(--message-color)!important}[class*=containerCozyBounded-]:hover{background-color:var(--message-hover-background)}[class*=scroller-]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color)!important}[class*=systemPad-] [class*=guildInner]{border-radius:var(--sidebar-icon-border-radius)!important}[class*=guildsWrapper] [class*=guildInner-],[class*=guildsWrapper] [class*=guildsAdd-]{-webkit-transform:translateX(8px);transform:translateX(8px)}[class*=guildsWrapper] [class*=avatar-],[class*=guildsWrapper] [class*=guild-],[class*=guildsWrapper] [class*=guildInner-] a,[class*=guildsWrapper] [class*=iconSizeLarge]{width:var(--sidebar-icon-width)!important;height:var(--sidebar-icon-width)!important;line-height:var(--sidebar-icon-width)!important}[class*=guild-]+[class*=guild-]{margin-top:12px!important}[class*=guildsWrapper] [class*=friendsOnline-]{width:calc(var(--sidebar-icon-width) + 16px)!important}[class*=guildsWrapper] [class*=guildsAdd-]{display:block;height:calc(var(--sidebar-icon-width)/2);border:none}[class*=guildsWrapper] button[class*=guildsAdd-]{margin-top:20px!important}[class*=guildsWrapper] [class*=downloadAppButton-]:after,[class*=guildsWrapper] [class*=guildSeparator-]{display:none}[class*=guildsWrapper] [class*=downloadAppButton-]{width:100%;margin-top:20px;margin-left:-4px;padding:0;font-size:8px}[class*=guildsWrapper] [class*=downloadAppButton-]>svg{display:none}[class*=channelTextArea-]{padding-top:0;border-top:0!important;margin-bottom:10px!important}[class*=innerNoAutocomplete-],[class*=titleWrapper-] [class*=searchBar-]{border:2px solid var(--ui-border-color)!important}[class*=inner-],[class*=titleWrapper-] [class*=searchBar-]{background-color:var(--text-input-background-color)!important}[class*=textArea-],[class*=titleWrapper-] [class*=searchBar-]{color:var(--text-input-color)!important}[class*=DraftEditorPlaceholder-root]{padding-top:1px!important}[class*=searchBar-] [class*=icon-]{top:-.5px!important}[class*=DraftEditorPlaceholder-inner],textarea::-webkit-input-placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=DraftEditorPlaceholder-inner],textarea:-ms-input-placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=DraftEditorPlaceholder-inner],textarea::-ms-input-placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=DraftEditorPlaceholder-inner],textarea::placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=username-]{font-weight:var(--username-weight)} -[alt=":grinning:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/grinning-face_1f600.png)}[alt=":grimacing:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/grimacing-face_1f62c.png)}[alt=":grin:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-open-mouth-and-smiling-eyes_1f604.png)}[alt=":joy:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-with-tears-of-joy_1f602.png)}[alt=":scream:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-screaming-in-fear_1f631.png)}[alt=":sunglasses:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-sunglasses_1f60e.png)}[alt=":smiley:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-open-mouth_1f603.png)}[alt=":smile:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-open-mouth-and-smiling-eyes_1f604.png)}[alt=":sweat_smile:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-open-mouth-and-cold-sweat_1f605.png)}[alt=":laughing:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-open-mouth-and-tightly-closed-eyes_1f606.png)}[alt=":innocent:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-halo_1f607.png)}[alt=":slight_smile:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/slightly-smiling-face_1f642.png)}[alt=":slight_frown:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/slightly-frowning-face_1f641.png)}[alt=":upside_down:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/upside-down-face_1f643.png)}[alt=":wink:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/winking-face_1f609.png)}[alt=":stuck_out_tongue:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-with-stuck-out-tongue_1f61b.png)}[alt=":stuck_out_tongue_winking_eye:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-with-stuck-out-tongue-and-winking-eye_1f61c.png)}[alt=":stuck_out_tongue_closed_eyes:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-with-stuck-out-tongue-and-tightly-closed-eyes_1f61d.png)}[alt=":thinking:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/thinking-face_1f914.png)}[alt=":rolling_eyes:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-with-rolling-eyes_1f644.png)}[alt=":kissing_heart:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-throwing-a-kiss_1f618.png)}[alt=":heart_eyes:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-heart-shaped-eyes_1f60d.png)}[alt=":no_mouth:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-without-mouth_1f636.png)}[alt=":confused:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/confused-face_1f615.png)}[alt=":flushed:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/flushed-face_1f633.png)}[alt=":cry:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/crying-face_1f622.png)}[alt=":eyes:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/eyes_1f440.png)}[alt=":thumbsup:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/thumbs-up-sign_1f44d.png)}[alt=":thumbsdown:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/thumbs-down-sign_1f44e.png)}[alt=":fingers_crossed:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/hand-with-index-and-middle-fingers-crossed_1f91e.png)}[alt=":point_up_2:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/white-up-pointing-backhand-index_1f446.png)}[alt=":middle_finger:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/reversed-hand-with-middle-finger-extended_1f595.png)}[alt=":ok_hand:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/ok-hand-sign_1f44c.png)}[alt=":vulcan:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/raised-hand-with-part-between-middle-and-ring-fingers_1f596.png)}[alt=":wave:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/waving-hand-sign_1f44b.png)}[alt=":fist:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/raised-fist_270a.png)}[alt=":punch:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/fisted-hand-sign_1f44a.png)}[alt=":clap:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/clapping-hands-sign_1f44f.png)}[alt=":raised_hands:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/person-raising-both-hands-in-celebration_1f64c.png)}[alt=":pray:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/person-with-folded-hands_1f64f.png)}[alt=":handshake:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/handshake_1f91d.png)}[alt=":heart:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/heavy-black-heart_2764.png)}[alt=":beer:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/beer-mug_1f37a.png)}[alt=":beers:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/clinking-beer-mugs_1f37b.png)}[alt=":rocket:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/rocket_1f680.png)}[alt=":100:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/hundred-points-symbol_1f4af.png)}[alt=":fire:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/fire_1f525.png)}[alt=":popcorn:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/popcorn_1f37f.png)}[alt=":bulb:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/electric-light-bulb_1f4a1.png)}[alt=":eggplant:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/aubergine_1f346.png)}[alt=":poop:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/pile-of-poo_1f4a9.png)} -[class*=markup-] > em:last-child > strong, -[class*=markup-] > em:nth-last-child(2) > strong { - font-size: 0; - font-style: normal; - font-weight: normal; - opacity: 0.5; - padding: 0.1em 0.2em; - background: #eee; - white-space: nowrap; -} - -[class*=markup-] > em:last-child > strong::before, -[class*=markup-] > em:nth-last-child(2) > strong::before { - content: "ID "; - opacity: 0.5; - font-size: 0.7rem; -} - -[class*=markup-]:hover > em:last-child > strong, -[class*=markup-]:hover > em:nth-last-child(2) > strong { - opacity: 1; - font-size: 0.7rem; -} - +:root{--font-family:"Lato-Regular","Helvetica Neue",Helvetica,"Segoe UI",-apple-system,BlinkMacSystemFont,Tahoma,Arial,sans-serif;--font-family-mono:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;--message-max-width:50rem;--avatar-border-radius:3px;--sidebar-icon-width:35px;--sidebar-icon-border-radius:8px;--channel-bar-width:11.5rem;--message-padding:.5rem;--username-weight:900;--username-size:.8rem;--code-block-bg-color:#2f3136;--channel-highlight-color:$base-color-dark;--channel-highlight-bg-color:rgba(243,243,244,0.7)}.theme-dark{--font-smoothing:antialiased;--message-hover-background:rgba(243,243,244,0.04);--message-color:#f3f3f4;--text-input-color:#f3f3f4;--ui-border-color:rgba(243,243,244,0.2);--scrollbar-color:rgba(243,243,244,0.3);--mention-color:#6f8fff;--mention-bg-color:rgba(114,137,218,0.1);--mention-hover-color:var(--mention-color);--mention-hover-bg-color:rgba(114,137,218,0.3);--link-color:#0096cf}.theme-light{--message-hover-background:rgba(32,34,37,0.03);--message-color:#202225;--text-input-color:#202225;--ui-border-color:rgba(32,34,37,0.3);--text-input-background-color:#fff;--scrollbar-color:rgba(32,34,37,0.3);--mention-color:#506bcc;--mention-bg-color:#f1f3fb;--mention-hover-color:var(--mention-color);--mention-hover-bg-color:#e1e5f6;--link-color:#08b;--inline-code-bg-color:#e3e4e7;--code-block-color:#dcddde}[class*=avatar-] [class*=image-]{border-radius:var(--avatar-border-radius)!important}*{-webkit-font-smoothing:var(--font-smoothing)!important}#app-mount,#app-mount textarea{font-family:var(--font-family)!important}[class*=base-]{border-radius:0!important}[class*=channels-]{width:var(--channel-bar-width)!important;transition:width .2s ease-out!important}@media (max-width:1100px){[class*=channels-]{position:relative;width:0!important}[class*=channels-]:hover,[class*=guildsWrapper]:hover+div>:nth-child(2)>[class*=channels-]{width:var(--channel-bar-width)!important}[class*=channels-]:after{content:"";position:absolute;z-index:1;top:0;bottom:0;left:100%;width:17px}[class*=channels-]:hover:after{width:3rem}}[class*=nameCollapsed-],[class*=nameDefault-],[class*=nameHovered-],[class*=nameHoveredCollapsed-]{font-size:.7rem;letter-spacing:.05em}[class*=channels-] [class*=name-]{font-size:14px!important;opacity:.8}[class*=channels-] [class*=nameUnreadText-]{opacity:1}[class*=channels-] [class*=contentSelectedText-],[class*=channels-] [class*=contentSelectedVoice-]{background-color:var(--channel-highlight-bg-color)!important}[class*=channels-] [class*=contentSelectedText-] [class*=actionIcon-],[class*=channels-] [class*=contentSelectedText-] [class*=icon-],[class*=channels-] [class*=contentSelectedText-] [class*=name-],[class*=channels-] [class*=contentSelectedVoice-] [class*=actionIcon-],[class*=channels-] [class*=contentSelectedVoice-] [class*=icon-],[class*=channels-] [class*=contentSelectedVoice-] [class*=name-]{color:var(--channel-highlight-color)}[class*=markup-] code.inline{background:var(--inline-code-bg-color);padding:2px 4px}[class*=markup-] pre{background:var(--code-block-bg-color);border-color:var(--ui-border-color)}[class*=markup-] code:not(.inline){background:var(--code-block-bg-color);color:var(--code-block-color)}code{font-family:var(--font-family-mono)!important}[class*=markup-] a{color:var(--link-color)!important}[class*=mention]{background-color:var(--mention-bg-color)!important;color:var(--mention-color)!important}[class*=mention]:hover{background-color:var(--mention-hover-bg-color)!important;color:var(--mention-hover-color)!important;text-decoration:underline}[class*=isMentioned-]{padding-top:.3rem;padding-bottom:.3rem}[class*=containerCozyBounded-]{padding-bottom:var(--message-padding);padding-top:var(--message-padding)}@media (min-width:1100px){[class*=containerCozy-] [class*=contentCozy-]{max-width:var(--message-max-width)}}[class*=containerCozy-] [class*=contentCozy-] [class*=markup-]{color:var(--message-color)!important}[class*=containerCozyBounded-]:hover{background-color:var(--message-hover-background)}[class*=scroller-]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color)!important}[class*=systemPad-] [class*=guildInner]{border-radius:var(--sidebar-icon-border-radius)!important}[class*=guildsWrapper] [class*=guildInner-],[class*=guildsWrapper] [class*=guildsAdd-]{-webkit-transform:translateX(8px)!important;transform:translateX(8px)!important}[class*=guildsWrapper] [class*=avatar-],[class*=guildsWrapper] [class*=guild-],[class*=guildsWrapper] [class*=guildInner-] a,[class*=guildsWrapper] [class*=iconSizeLarge]{width:var(--sidebar-icon-width)!important;height:var(--sidebar-icon-width)!important;line-height:var(--sidebar-icon-width)!important}[class*=guild-]+[class*=guild-]{margin-top:12px!important}[class*=guildsWrapper] [class*=friendsOnline-]{width:calc(var(--sidebar-icon-width) + 16px)!important}[class*=guildsWrapper] [class*=guildsAdd-]{display:block;height:calc(var(--sidebar-icon-width)/2);border:none}[class*=guildsWrapper] button[class*=guildsAdd-]{margin-top:20px!important}[class*=guildsWrapper] [class*=downloadAppButton-],[class*=guildsWrapper] [class*=downloadAppButton-]>svg,[class*=guildsWrapper] [class*=guildSeparator-]{display:none}[class*=channelTextArea-]{padding-top:0;border-top:0!important;margin-bottom:20px!important}[class*=innerNoAutocomplete-],[class*=titleWrapper-] [class*=searchBar-]{border:2px solid var(--ui-border-color)!important}[class*=inner-],[class*=titleWrapper-] [class*=searchBar-]{background-color:var(--text-input-background-color)!important}[class*=textArea-],[class*=titleWrapper-] [class*=searchBar-]{color:var(--text-input-color)!important}[class*=DraftEditorPlaceholder-root]{padding-top:1px!important}[class*=searchBar-] [class*=icon-]{top:-.5px!important}[class*=DraftEditorPlaceholder-inner],textarea::-webkit-input-placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=DraftEditorPlaceholder-inner],textarea:-ms-input-placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=DraftEditorPlaceholder-inner],textarea::-ms-input-placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=DraftEditorPlaceholder-inner],textarea::placeholder{color:var(--text-input-color)!important;opacity:.45!important}[class*=typing-]{margin-bottom:-4px;background:0 0;font-size:12px;opacity:.8}[class*=titleWrapper-] [class*=divider-],[class*=titleWrapper-] [class*=topic-]:before{display:none}[class*=username-]{font-weight:var(--username-weight);font-size:var(--username-size)}[alt=":grinning:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/grinning-face_1f600.png)}[alt=":grimacing:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/grimacing-face_1f62c.png)}[alt=":grin:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-open-mouth-and-smiling-eyes_1f604.png)}[alt=":joy:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-with-tears-of-joy_1f602.png)}[alt=":scream:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-screaming-in-fear_1f631.png)}[alt=":sunglasses:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-sunglasses_1f60e.png)}[alt=":smiley:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-open-mouth_1f603.png)}[alt=":smile:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-open-mouth-and-smiling-eyes_1f604.png)}[alt=":sweat_smile:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-open-mouth-and-cold-sweat_1f605.png)}[alt=":laughing:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-open-mouth-and-tightly-closed-eyes_1f606.png)}[alt=":innocent:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-halo_1f607.png)}[alt=":slight_smile:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/slightly-smiling-face_1f642.png)}[alt=":slight_frown:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/slightly-frowning-face_1f641.png)}[alt=":upside_down:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/upside-down-face_1f643.png)}[alt=":wink:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/winking-face_1f609.png)}[alt=":stuck_out_tongue:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-with-stuck-out-tongue_1f61b.png)}[alt=":stuck_out_tongue_winking_eye:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-with-stuck-out-tongue-and-winking-eye_1f61c.png)}[alt=":stuck_out_tongue_closed_eyes:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-with-stuck-out-tongue-and-tightly-closed-eyes_1f61d.png)}[alt=":thinking:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/thinking-face_1f914.png)}[alt=":rolling_eyes:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-with-rolling-eyes_1f644.png)}[alt=":kissing_heart:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-throwing-a-kiss_1f618.png)}[alt=":heart_eyes:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/smiling-face-with-heart-shaped-eyes_1f60d.png)}[alt=":no_mouth:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/face-without-mouth_1f636.png)}[alt=":confused:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/confused-face_1f615.png)}[alt=":flushed:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/flushed-face_1f633.png)}[alt=":cry:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/crying-face_1f622.png)}[alt=":eyes:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/eyes_1f440.png)}[alt=":thumbsup:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/thumbs-up-sign_1f44d.png)}[alt=":thumbsdown:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/thumbs-down-sign_1f44e.png)}[alt=":fingers_crossed:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/hand-with-index-and-middle-fingers-crossed_1f91e.png)}[alt=":point_up_2:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/white-up-pointing-backhand-index_1f446.png)}[alt=":middle_finger:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/reversed-hand-with-middle-finger-extended_1f595.png)}[alt=":ok_hand:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/ok-hand-sign_1f44c.png)}[alt=":vulcan:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/raised-hand-with-part-between-middle-and-ring-fingers_1f596.png)}[alt=":wave:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/waving-hand-sign_1f44b.png)}[alt=":fist:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/raised-fist_270a.png)}[alt=":punch:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/fisted-hand-sign_1f44a.png)}[alt=":clap:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/clapping-hands-sign_1f44f.png)}[alt=":raised_hands:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/person-raising-both-hands-in-celebration_1f64c.png)}[alt=":pray:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/person-with-folded-hands_1f64f.png)}[alt=":handshake:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/handshake_1f91d.png)}[alt=":heart:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/heavy-black-heart_2764.png)}[alt=":beer:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/beer-mug_1f37a.png)}[alt=":beers:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/clinking-beer-mugs_1f37b.png)}[alt=":rocket:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/rocket_1f680.png)}[alt=":100:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/hundred-points-symbol_1f4af.png)}[alt=":fire:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/fire_1f525.png)}[alt=":popcorn:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/popcorn_1f37f.png)}[alt=":bulb:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/electric-light-bulb_1f4a1.png)}[alt=":eggplant:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/aubergine_1f346.png)}[alt=":poop:"]{content:url(https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/120/apple/155/pile-of-poo_1f4a9.png)} diff --git a/mix-manifest.json b/mix-manifest.json index db215a1..d6cfb20 100644 --- a/mix-manifest.json +++ b/mix-manifest.json @@ -1,5 +1,5 @@ { - "/dist/base.css": "/dist/base.css?id=55f4224b177b3eaedd47", - "/dist/plugins/apple-emojis.css": "/dist/plugins/apple-emojis.css?id=35b78f9f234661de9d36", - "/dist/complete.css": "/dist/complete.css?id=ec1552ad7afcb5b1af12" + "/dist/base.css": "/dist/base.css?id=583dfedf24333b3a78d2", + "/dist/plugins/apple-emojis.css": "/dist/plugins/apple-emojis.css?id=fd32bbb9626d9978215b", + "/dist/complete.css": "/dist/complete.css?id=934c7f3e7218b3a1936c" } diff --git a/src/base.scss b/src/base.scss index abe0ff1..fbc1858 100644 --- a/src/base.scss +++ b/src/base.scss @@ -13,10 +13,12 @@ $base-color-light: #f3f3f4; --sidebar-icon-width: 35px; --sidebar-icon-border-radius: 8px; --channel-bar-width: 11.5rem; - --channel-bar-item-height: 1.5rem; --message-padding: .5rem; --username-weight: 900; + --username-size: .8rem; --code-block-bg-color: #2f3136; + --channel-highlight-color: $base-color-dark; + --channel-highlight-bg-color: #{rgba($base-color-light, .7)}; } .theme-dark { @@ -26,6 +28,11 @@ $base-color-light: #f3f3f4; --text-input-color: #{$base-color-light}; --ui-border-color: #{rgba($base-color-light, .2)}; --scrollbar-color: #{rgba($base-color-light, .3)}; + --mention-color: #6f8fff; + --mention-bg-color: rgba(114,137,218,.1); + --mention-hover-color: var(--mention-color); + --mention-hover-bg-color: rgba(114,137,218,.3); + --link-color: #0096cf; } .theme-light { @@ -36,9 +43,13 @@ $base-color-light: #f3f3f4; --text-input-background-color: #fff; --scrollbar-color: #{rgba($base-color-dark, .3)}; - --mention-color: #F04747; - --mention-bg-color: #FDF2F1; - --link-color: #4A7CF6; + //--mention-color: #F04747; + //--mention-bg-color: #FDF2F1; + --mention-color: #506bcc; + --mention-bg-color: #f1f3fb; + --mention-hover-color: var(--mention-color); + --mention-hover-bg-color: #e1e5f6; + --link-color: #0088bb; --inline-code-bg-color: #e3e4e7; --code-block-color: #dcddde; } @@ -54,4 +65,5 @@ $base-color-light: #f3f3f4; @import "components/scrollbar"; @import "components/sidebar"; @import "components/textinput"; +@import "components/titlebar"; @import "components/username"; diff --git a/src/components/channelbar.scss b/src/components/channelbar.scss index fce4782..a62aea1 100644 --- a/src/components/channelbar.scss +++ b/src/components/channelbar.scss @@ -1,7 +1,7 @@ /* Channel Bar Widths */ [class*="channels-"] { - width: var(--channel-bar-width); - transition: width .1s ease-out; + width: var(--channel-bar-width) !important; + transition: width .2s ease-out !important; } @@ -9,38 +9,71 @@ @media (max-width: 1100px) { [class*="channels-"] { - width: 0; + position: relative; + width: 0 !important; } [class*="guildsWrapper"]:hover + div > :nth-child(2) > [class*="channels-"], [class*="channels-"]:hover { - position: relative; - width: var(--channel-bar-width); + width: var(--channel-bar-width) !important; } + /* Invisible Area Besides Channel Bar */ - [class*="channels-"]::after { - content: ""; - position: absolute; - z-index: 1; - top: 0; - bottom: 0; - left: 100%; - width: 3rem; + [class*="channels-"] { + + &::after { + content: ""; + position: absolute; + z-index: 1; + top: 0; + bottom: 0; + left: 100%; + width: 17px; + } + + &:hover { + + &::after { + width: 3rem; + } + } } } -/* Channel Bar Items */ -[class*="channels-"] [class*="wrapper-"] { - height: calc(var(--channel-bar-item-height) + 2px); - overflow: visible; -} -[class*="channels-"] [class*="content-"] { - height: var(--channel-bar-item-height); +/* Channel Bar Category Titles */ +[class*="nameDefault-"], +[class*="nameHovered-"], +[class*="nameCollapsed-"], +[class*="nameHoveredCollapsed-"] { + font-size: .7rem; + letter-spacing: .05em; } -[class*="channels-"] [class*="name-"] { - line-height: var(--channel-bar-item-height); - font-size: .9rem; + +/* Channels */ +[class*="channels-"] { + + [class*="name-"] { + font-size: 14px !important; + opacity: .8; + } + + /* Unread Channels */ + [class*="nameUnreadText-"] { + opacity: 1; + } + + /* Selected Channel */ + [class*="contentSelectedText-"], + [class*="contentSelectedVoice-"] { + background-color: var(--channel-highlight-bg-color) !important; + + [class*="icon-"], + [class*="actionIcon-"], + [class*="name-"] { + color: var(--channel-highlight-color); + } + } } diff --git a/src/components/links.scss b/src/components/links.scss index a8207ec..d1f8155 100644 --- a/src/components/links.scss +++ b/src/components/links.scss @@ -1,4 +1,4 @@ /* Links */ [class*="markup-"] a { - color: var(--link-color); + color: var(--link-color) !important; } diff --git a/src/components/mentions.scss b/src/components/mentions.scss index 64b448c..869ca3b 100644 --- a/src/components/mentions.scss +++ b/src/components/mentions.scss @@ -1,13 +1,17 @@ /* Mentions */ -.theme-light [class*="mention"] { +[class*="mention"] { background-color: var(--mention-bg-color) !important; color: var(--mention-color) !important; -} -.theme-light [class*="mention"]:hover { - background-color: var(--mention-color) !important; - color: #FFFFFF !important; -} -.theme-light [class*="isMentioned-"] [class*="mention"]:hover { - color: var(--mention-color) !important; + + &:hover { + background-color: var(--mention-hover-bg-color) !important; + color: var(--mention-hover-color) !important; + text-decoration: underline; + } } +/* Current User Mention */ +[class*="isMentioned-"] { + padding-top: .3rem; + padding-bottom: .3rem; +} diff --git a/src/components/sidebar.scss b/src/components/sidebar.scss index 07542fb..a92d9fd 100644 --- a/src/components/sidebar.scss +++ b/src/components/sidebar.scss @@ -9,7 +9,7 @@ /* Center Sidebar Items */ [class*="guildsWrapper"] [class*="guildInner-"], [class*="guildsWrapper"] [class*="guildsAdd-"] { - transform: translateX(8px); + transform: translateX(8px) !important; } [class*="guildsWrapper"] [class*="iconSizeLarge"], @@ -44,21 +44,17 @@ /* Sidebar Separators */ -[class*="guildsWrapper"] [class*="guildSeparator-"], -[class*="guildsWrapper"] [class*="downloadAppButton-"]::after { +[class*="guildsWrapper"] [class*="guildSeparator-"] { display: none; } /* Download Apps Button */ [class*="guildsWrapper"] [class*="downloadAppButton-"] { - width: 100%; - margin-top: 20px; - margin-left: -4px; - padding: 0; - font-size: 8px; + display: none; } + [class*="guildsWrapper"] [class*="downloadAppButton-"] > svg { display: none; } diff --git a/src/components/textinput.scss b/src/components/textinput.scss index 45a7810..7bfbdff 100644 --- a/src/components/textinput.scss +++ b/src/components/textinput.scss @@ -2,7 +2,7 @@ [class*="channelTextArea-"] { padding-top: 0; border-top: 0 !important; - margin-bottom: 10px !important; + margin-bottom: 20px !important; } [class*="innerNoAutocomplete-"], @@ -33,3 +33,11 @@ textarea::placeholder { color: var(--text-input-color) !important; opacity: 0.45 !important; } + +/* Typing notification */ +[class*="typing-"] { + margin-bottom: -4px; + background: none; + font-size: 12px; + opacity: .8; +} diff --git a/src/components/titlebar.scss b/src/components/titlebar.scss new file mode 100644 index 0000000..ccd2e19 --- /dev/null +++ b/src/components/titlebar.scss @@ -0,0 +1,9 @@ +/* Title Bar */ +[class*="titleWrapper-"] { + + /* Vertical dividers */ + [class*="divider-"], + [class*="topic-"]::before { + display: none; + } +} diff --git a/src/components/username.scss b/src/components/username.scss index 032827e..1d535b2 100644 --- a/src/components/username.scss +++ b/src/components/username.scss @@ -1,4 +1,5 @@ /* Username */ [class*="username-"] { font-weight: var(--username-weight); + font-size: var(--username-size); }