diff --git a/src/sites/twitch-twilight/modules/menu_button.jsx b/src/sites/twitch-twilight/modules/menu_button.jsx
index b16ed2f1..002e1efd 100644
--- a/src/sites/twitch-twilight/modules/menu_button.jsx
+++ b/src/sites/twitch-twilight/modules/menu_button.jsx
@@ -9,7 +9,7 @@ import {SiteModule} from 'utilities/module';
import {createElement, ClickOutside, setChildren} from 'utilities/dom';
import Twilight from 'site';
-import getMD from 'src/utilities/markdown';
+import awaitMD, {getMD} from 'utilities/markdown';
export default class MenuButton extends SiteModule {
@@ -292,6 +292,12 @@ export default class MenuButton extends SiteModule {
/*if ( ! data.id )
data.id = generateUUID();*/
+ if ( data.markdown ) {
+ const md = getMD();
+ if ( ! md )
+ return awaitMD().then(() => this.addToast(data));
+ }
+
this.toasts.push(data);
// TODO: Sort by ending time?
if ( this.toasts.length > 5 )
@@ -385,6 +391,9 @@ export default class MenuButton extends SiteModule {
}
let progress_bar = null;
+ const md = data.markdown ? getMD() : null;
+ if ( data.markdown && ! md )
+ return null;
if ( data.timeout ) {
const now = performance.now();
diff --git a/src/sites/twitch-twilight/styles/chat.scss b/src/sites/twitch-twilight/styles/chat.scss
index 5960ac5f..43129940 100644
--- a/src/sites/twitch-twilight/styles/chat.scss
+++ b/src/sites/twitch-twilight/styles/chat.scss
@@ -318,32 +318,44 @@
}
}*/
- .whispers-thread .emote-picker-and-button & .emote-picker__tab-content {
- max-height: 30rem;
- }
-
- .emote-picker__nav-content-overflow,
- .emote-picker__tab-content {
- height: unset !important;
- max-height: 50rem;
- }
-
- .whispers-thread {
- overflow: visible !important;
- }
-
- @media only screen and (max-height: 750px) {
+ &:not(.ffz--emote-picker__tall) {
.emote-picker__nav-content-overflow {
- height: 100% !important;
+ height: 30.5rem !important;
+ }
+
+ .emote-picker__nav-content-overflow-whisper {
+ height: 18rem !important;
+ }
+ }
+
+ &.ffz--emote-picker__tall {
+ .whispers-thread .emote-picker-and-button & .emote-picker__tab-content {
+ max-height: 30rem;
}
.emote-picker__nav-content-overflow,
.emote-picker__tab-content {
- #root & {
- max-height: calc(100vh - 31rem);
+ height: unset !important;
+ max-height: 50rem;
+ }
+
+ .whispers-thread {
+ overflow: visible !important;
+ }
+
+ @media only screen and (max-height: 750px) {
+ .emote-picker__nav-content-overflow {
+ height: 100% !important;
}
- max-height: calc(100vh - 26rem);
+ .emote-picker__nav-content-overflow,
+ .emote-picker__tab-content {
+ #root & {
+ max-height: calc(100vh - 31rem);
+ }
+
+ max-height: calc(100vh - 26rem);
+ }
}
}
diff --git a/src/std-components/autocomplete-game.vue b/src/std-components/autocomplete-game.vue
new file mode 100644
index 00000000..e1182566
--- /dev/null
+++ b/src/std-components/autocomplete-game.vue
@@ -0,0 +1,22 @@
+
+
+
+
+
+
+
+
+
+
+
+ {{ props.game.displayName }}
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/std-components/autocomplete-user.vue b/src/std-components/autocomplete-user.vue
new file mode 100644
index 00000000..c9588917
--- /dev/null
+++ b/src/std-components/autocomplete-user.vue
@@ -0,0 +1,35 @@
+
+
+
+
+
+
+
+
+
+
+
+
{{ props.user.displayName }}
+
+ ({{ props.user.login }})
+
+
+
+ {{ props.user.displayName }}
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/std-components/autocomplete.vue b/src/std-components/autocomplete.vue
index da469646..ef1c2d4b 100644
--- a/src/std-components/autocomplete.vue
+++ b/src/std-components/autocomplete.vue
@@ -129,6 +129,11 @@ export default {
logger: {
type: Object,
required: false
+ },
+ allowFilter: {
+ type: Boolean,
+ required: false,
+ default: true
}
},
@@ -172,7 +177,7 @@ export default {
if ( this.errored )
return null;
- if ( ! this.search || ! this.search.length )
+ if ( ! this.search || ! this.search.length || ! this.allowFilter )
return this.cachedItems;
const needle = this.search.toLowerCase();
@@ -180,6 +185,9 @@ export default {
if ( typeof item.displayName === 'string' && item.displayName.toLowerCase().includes(needle) )
return true;
+ if ( typeof item.login === 'string' && item.login.toLowerCase().includes(needle) )
+ return true;
+
if ( typeof item.label === 'string' && item.label.toLowerCase().includes(needle) )
return true;
diff --git a/src/std-components/markdown.vue b/src/std-components/markdown.vue
index cb54e5a9..0edf1d5a 100644
--- a/src/std-components/markdown.vue
+++ b/src/std-components/markdown.vue
@@ -5,21 +5,31 @@