oss/FrankerFaceZ
oss/FrankerFaceZ
1
0
Fork 0
mirror of https://github.com/FrankerFaceZ/FrankerFaceZ.git synced 2025-08-11 00:20:54 +00:00
Code Wiki Activity

4.20.56

Browse source 
* Fixed: Appearance issues caused by Twitch making changes to their site CSS, including white backgrounds for icons and incorrect placement of menus.
This commit is contained in:
SirStendec 2020-12-17 16:51:26 -05:00
parent 05cf8fa1fd
commit 9a2a6f2acf
39 changed files with 299 additions and 285 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/modules/chat/override-editor.vue
View file

@ -26,7 +26,7 @@
>
<button
class="tw-mg-l-05 tw-button tw-button--text tw-tooltip-wrapper"
class="tw-mg-l-05 tw-button tw-button--text tw-tooltip__container"
:class="{'tw-button--disabled': name == null}"
@click="clearName"
>
@ -52,7 +52,7 @@
/>
<button
class="tw-mg-l-05 tw-button tw-button--text tw-tooltip-wrapper"
class="tw-mg-l-05 tw-button tw-button--text tw-tooltip__container"
:class="{'tw-button--disabled': color == null}"
@click="clearColor"
>

2
src/modules/main_menu/components/addon.vue
View file

@ -50,7 +50,7 @@
<button
v-if="external"
disabled
class="tw-button ffz-button--hollow tw-button--disabled tw-tooltip-wrapper tw-mg-r-1"
class="tw-button ffz-button--hollow tw-button--disabled tw-tooltip__container tw-mg-r-1"
>
<span class="tw-button__icon tw-button__icon--left">
<figure class="ffz-i-trash" />

14
src/modules/main_menu/components/badge-term-editor.vue
View file

@ -43,7 +43,7 @@
</figure>
</div>
</div>
<div v-if="removable" class="tw-flex-shrink-0 tw-mg-r-05 tw-relative tw-tooltip-wrapper">
<div v-if="removable" class="tw-flex-shrink-0 tw-mg-r-05 tw-relative tw-tooltip__container">
<button
v-if="editing"
:class="{active: edit_data.remove}"
@ -76,13 +76,13 @@
</button>
</div>
<div v-else-if="editing" class="tw-flex-shrink-0">
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="save">
<button class="tw-button tw-button--text tw-tooltip__container" @click="save">
<span class="tw-button__text ffz-i-floppy" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.save', 'Save') }}
</div>
</button>
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="cancel">
<button class="tw-button tw-button--text tw-tooltip__container" @click="cancel">
<span class="tw-button__text ffz-i-cancel" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.cancel', 'Cancel') }}
@ -90,13 +90,13 @@
</button>
</div>
<div v-else-if="deleting" class="tw-flex-shrink-0">
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="$emit('remove', term)">
<button class="tw-button tw-button--text tw-tooltip__container" @click="$emit('remove', term)">
<span class="tw-button__text ffz-i-trash" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.delete', 'Delete') }}
</div>
</button>
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="deleting = false">
<button class="tw-button tw-button--text tw-tooltip__container" @click="deleting = false">
<span class="tw-button__text ffz-i-cancel" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.cancel', 'Cancel') }}
@ -104,13 +104,13 @@
</button>
</div>
<div v-else class="tw-flex-shrink-0">
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="edit">
<button class="tw-button tw-button--text tw-tooltip__container" @click="edit">
<span class="tw-button__text ffz-i-cog" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.edit', 'Edit') }}
</div>
</button>
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="deleting = true">
<button class="tw-button tw-button--text tw-tooltip__container" @click="deleting = true">
<span class="tw-button__text ffz-i-trash" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.delete', 'Delete') }}

4
src/modules/main_menu/components/badge-visibility.vue
View file

@ -12,7 +12,7 @@
<button
:disabled="! has_value"
:class="{'tw-button--disabled': ! has_value}"
class="tw-mg-l-05 tw-button ffz-button--hollow tw-tooltip-wrapper"
class="tw-mg-l-05 tw-button ffz-button--hollow tw-tooltip__container"
@click="clear"
>
<span class="tw-button__icon tw-button__icon--left">
@ -93,7 +93,7 @@
/>
</section>
<button
class="tw-mg-t-05 tw-button ffz-button--hollow tw-tooltip-wrapper"
class="tw-mg-t-05 tw-button ffz-button--hollow tw-tooltip__container"
@click="reset(i.id)"
>
<span class="tw-button__text">Reset</span>

6
src/modules/main_menu/components/blocked-type-editor.vue
View file

@ -27,13 +27,13 @@
</button>
</div>
<div v-else-if="deleting" class="tw-flex-shrink-0">
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="$emit('remove', term)">
<button class="tw-button tw-button--text tw-tooltip__container" @click="$emit('remove', term)">
<span class="tw-button__text ffz-i-trash" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.delete', 'Delete') }}
</div>
</button>
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="deleting = false">
<button class="tw-button tw-button--text tw-tooltip__container" @click="deleting = false">
<span class="tw-button__text ffz-i-cancel" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.cancel', 'Cancel') }}
@ -41,7 +41,7 @@
</button>
</div>
<div v-else class="tw-flex-shrink-0">
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="deleting = true">
<button class="tw-button tw-button--text tw-tooltip__container" @click="deleting = true">
<span class="tw-button__text ffz-i-trash" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.delete', 'Delete') }}

2
src/modules/main_menu/components/changelog.vue
View file

@ -11,7 +11,7 @@
<div v-if=" ! addons" class="tw-mg-b-1 tw-flex tw-align-items-center">
<div class="tw-flex-grow-1" />
<div class="tw-checkbox tw-relative tw-tooltip-wrapper">
<div class="tw-checkbox tw-relative tw-tooltip__container">
<input
id="nonversioned"
ref="nonversioned"

8
src/modules/main_menu/components/chat-actions.vue
View file

@ -281,7 +281,7 @@
</div>
<button
v-if="! maybe_clear && val.length"
class="tw-mg-l-1 tw-button tw-button--text tw-tooltip-wrapper"
class="tw-mg-l-1 tw-button tw-button--text tw-tooltip__container"
@click="maybe_clear = true"
>
<span class="tw-button__text ffz-i-trash">
@ -293,7 +293,7 @@
</button>
<button
v-if="maybe_clear"
class="tw-mg-l-1 tw-button tw-button--text tw-tooltip-wrapper"
class="tw-mg-l-1 tw-button tw-button--text tw-tooltip__container"
@click="doClear"
>
<span class="tw-button__text ffz-i-trash">
@ -305,7 +305,7 @@
</button>
<button
v-if="maybe_clear"
class="tw-mg-l-1 tw-button tw-button--text tw-tooltip-wrapper"
class="tw-mg-l-1 tw-button tw-button--text tw-tooltip__container"
@click="maybe_clear = false"
>
<span class="tw-button__text ffz-i-cancel">
@ -314,7 +314,7 @@
</button>
<button
v-if="! val.length && has_default"
class="tw-mg-l-1 tw-button tw-button--text tw-tooltip-wrapper"
class="tw-mg-l-1 tw-button tw-button--text tw-tooltip__container"
@click="populate"
>
<span class="tw-button__text ffz-i-trash">

4
src/modules/main_menu/components/chat-reasons.vue
View file

@ -6,7 +6,7 @@
</div>
<button
v-if="! empty"
class="tw-mg-l-1 tw-button tw-button--text tw-tooltip-wrapper"
class="tw-mg-l-1 tw-button tw-button--text tw-tooltip__container"
@click="clear"
>
<span class="tw-button__text ffz-i-trash">
@ -18,7 +18,7 @@
</button>
<button
v-if="empty"
class="tw-mg-l-1 tw-button tw-button--text tw-tooltip-wrapper"
class="tw-mg-l-1 tw-button tw-button--text tw-tooltip__container"
@click="populate"
>
<span class="tw-button__text ffz-i-trash">

8
src/modules/main_menu/components/experiments.vue
View file

@ -105,7 +105,7 @@
<button
:disabled="exp.default"
:class="{'tw-button--disabled': exp.default}"
class="tw-mg-t-05 tw-button tw-button--text tw-tooltip-wrapper"
class="tw-mg-t-05 tw-button tw-button--text tw-tooltip__container"
@click="reset(key)"
>
<span class="tw-button__text ffz-i-cancel" />
@ -147,12 +147,12 @@
class="ffz--experiment-row tw-elevation-1 tw-c-background-base tw-border tw-pd-y-05 tw-pd-x-1 tw-mg-y-05 tw-flex"
>
<div v-if="unused" class="tw-flex tw-flex-shrink-0 tw-align-items-center tw-border-r tw-mg-r-1 tw-pd-r-1">
<div v-if="exp.in_use" class="ffz--profile__icon ffz-i-ok tw-tooltip-wrapper">
<div v-if="exp.in_use" class="ffz--profile__icon ffz-i-ok tw-tooltip__container">
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-left">
{{ t('setting.experiments.active', 'This experiment is active.') }}
</div>
</div>
<div v-else class="ffz--profile__icon ffz-i-cancel tw-tooltip-wrapper">
<div v-else class="ffz--profile__icon ffz-i-cancel tw-tooltip__container">
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-left">
{{ t('setting.experiments.inactive', 'This experiment is not active.') }}
</div>
@ -190,7 +190,7 @@
<button
:disabled="exp.default"
:class="{'tw-button--disabled': exp.default}"
class="tw-mg-t-05 tw-button tw-button--text tw-tooltip-wrapper"
class="tw-mg-t-05 tw-button tw-button--text tw-tooltip__container"
@click="resetTwitch(key)"
>
<span class="tw-button__text ffz-i-cancel" />

10
src/modules/main_menu/components/filter-rule-editor.vue
View file

@ -14,7 +14,7 @@
<div
v-if="isShort"
class="tw-mg-l-1 tw-pd-x-1 tw-border-l tw-flex tw-align-items-center ffz--profile__icon tw-relative tw-tooltip-wrapper"
class="tw-mg-l-1 tw-pd-x-1 tw-border-l tw-flex tw-align-items-center ffz--profile__icon tw-relative tw-tooltip__container"
>
<figure :class="[passes ? 'ffz-i-ok' : 'ffz-i-cancel']" />
<div class="tw-tooltip tw-tooltip--up tw-tooltip--align-right">
@ -31,7 +31,7 @@
:class="[isShort ? '' : 'tw-mg-l-1']"
class="tw-border-l tw-pd-l-1 tw-flex tw-flex-column tw-flex-wrap tw-justify-content-start tw-align-items-start"
>
<div v-if="! isShort" class="tw-mg-b-1 tw-border-b tw-pd-b-1 tw-full-width tw-flex tw-justify-content-center ffz--profile__icon tw-relative tw-tooltip-wrapper">
<div v-if="! isShort" class="tw-mg-b-1 tw-border-b tw-pd-b-1 tw-full-width tw-flex tw-justify-content-center ffz--profile__icon tw-relative tw-tooltip__container">
<figure :class="[passes ? 'ffz-i-ok' : 'ffz-i-cancel']" />
<div class="tw-tooltip tw-tooltip--up tw-tooltip--align-right">
<span v-if="passes">
@ -44,13 +44,13 @@
</div>
<template v-if="deleting">
<button class="tw-button tw-button--text tw-relative tw-tooltip-wrapper" @click="$emit('delete')">
<button class="tw-button tw-button--text tw-relative tw-tooltip__container" @click="$emit('delete')">
<span class="tw-button__text ffz-i-trash" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.delete', 'Delete') }}
</div>
</button>
<button class="tw-button tw-button--text tw-relative tw-tooltip-wrapper" @click="deleting = false">
<button class="tw-button tw-button--text tw-relative tw-tooltip__container" @click="deleting = false">
<span class="tw-button__text ffz-i-cancel" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.cancel', 'Cancel') }}
@ -58,7 +58,7 @@
</button>
</template>
<template v-else>
<button class="tw-button tw-button--text tw-relative tw-tooltip-wrapper" @click="deleting = true">
<button class="tw-button tw-button--text tw-relative tw-tooltip__container" @click="deleting = true">
<span class="tw-button__text ffz-i-trash" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.delete', 'Delete') }}

2
src/modules/main_menu/components/game-list-editor.vue
View file

@ -65,7 +65,7 @@
</span>
</div>
<div class="tw-flex-shrink-0">
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="remove(i)">
<button class="tw-button tw-button--text tw-tooltip__container" @click="remove(i)">
<span class="tw-button__text ffz-i-trash" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.delete', 'Delete') }}

2
src/modules/main_menu/components/main-menu.vue
View file

@ -33,7 +33,7 @@
<figure :class="faded ? 'ffz-i-eye-off' : 'ffz-i-eye'" />
</span>
</button>
<button v-if="!exclusive" class="tw-button-icon tw-mg-x-05 tw-relative tw-tooltip-wrapper" @click="popout">
<button v-if="!exclusive" class="tw-button-icon tw-mg-x-05 tw-relative tw-tooltip__container" @click="popout">
<span class="tw-button-icon__icon">
<figure class="ffz-i-link-ext" />
</span>

4
src/modules/main_menu/components/profile-editor.vue
View file

@ -42,7 +42,7 @@
</div>
</section>
<button
class="tw-button tw-button--text tw-relative tw-tooltip-wrapper"
class="tw-button tw-button--text tw-relative tw-tooltip__container"
@click="resetExport"
>
<span class="tw-button__text ffz-i-cancel" />
@ -57,7 +57,7 @@
{{ export_message }}
</section>
<button
class="tw-button tw-button--text tw-relative tw-tooltip-wrapper"
class="tw-button tw-button--text tw-relative tw-tooltip__container"
@click="resetExport"
>
<span class="tw-button__text ffz-i-cancel" />

14
src/modules/main_menu/components/profile-manager.vue
View file

@ -32,7 +32,7 @@
</div>
</section>
<button
class="tw-button tw-button--text tw-relative tw-tooltip-wrapper"
class="tw-button tw-button--text tw-relative tw-tooltip__container"
@click="resetImport"
>
<span class="tw-button__text ffz-i-cancel" />
@ -47,7 +47,7 @@
{{ import_message }}
</section>
<button
class="tw-button tw-button--text tw-relative tw-tooltip-wrapper"
class="tw-button tw-button--text tw-relative tw-tooltip__container"
@click="resetImport"
>
<span class="tw-button__text ffz-i-cancel" />
@ -66,7 +66,7 @@
<button
v-for="(profile, idx) in import_profiles"
:key="idx"
class="tw-block tw-full-width tw-mg-y-05 tw-mg-r-1 tw-pd-05 tw-button ffz-button--hollow tw-c-text-overlay tw-relative tw-tooltip-wrapper"
class="tw-block tw-full-width tw-mg-y-05 tw-mg-r-1 tw-pd-05 tw-button ffz-button--hollow tw-c-text-overlay tw-relative tw-tooltip__container"
@click="importProfile(profile)"
>
<span class="tw-button__text tw-c-text-overlay">
@ -78,7 +78,7 @@
</button>
</section>
<button
class="tw-button tw-button--text tw-relative tw-tooltip-wrapper"
class="tw-button tw-button--text tw-relative tw-tooltip__container"
@click="resetImport"
>
<span class="tw-button__text ffz-i-cancel" />
@ -113,7 +113,7 @@
</button>
</section>
<button
class="tw-button tw-button--text tw-relative tw-tooltip-wrapper"
class="tw-button tw-button--text tw-relative tw-tooltip__container"
@click="resetImport"
>
<span class="tw-button__text ffz-i-cancel" />
@ -138,7 +138,7 @@
<span class="ffz-i-ellipsis-vert" />
</div>
<div v-if="p.url" class="tw-flex tw-flex-shrink-0 tw-align-items-center tw-mg-r-1 tw-relative tw-tooltip-wrapper tw-font-size-4">
<div v-if="p.url" class="tw-flex tw-flex-shrink-0 tw-align-items-center tw-mg-r-1 tw-relative tw-tooltip__container tw-font-size-4">
<span class="ffz-i-download-cloud" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-left">
<div class="tw-mg-b-05">
@ -171,7 +171,7 @@
'ffz-i-cancel': ! p.toggled,
'ffz-i-minus': p.toggled && ! p.live
}"
class="ffz--profile__icon tw-relative tw-tooltip-wrapper"
class="ffz--profile__icon tw-relative tw-tooltip__container"
>
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
<span v-if="p.live">

6
src/modules/main_menu/components/profile-selector.vue
View file

@ -18,7 +18,7 @@
<div
v-if="opened"
v-on-clickaway="hide"
class="tw-balloon tw-block tw-balloon--lg tw-balloon--down tw-balloon--left"
class="tw-balloon tw-block tw-balloon--lg tw-balloon--down tw-balloon--left tw-z-above"
>
<div
class="ffz--profile-list tw-elevation-2 tw-c-background-alt"
@ -53,7 +53,7 @@
>
<div
v-if="! p.toggled"
class="tw-tooltip-wrapper ffz--profile-row__icon ffz-i-cancel tw-absolute"
class="tw-tooltip__container ffz--profile-row__icon ffz-i-cancel tw-absolute"
>
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.profiles.disabled', 'This profile is disabled.') }}
@ -61,7 +61,7 @@
</div>
<div
v-if="p.live"
class="tw-tooltip-wrapper ffz--profile-row__icon ffz-i-ok tw-absolute"
class="tw-tooltip__container ffz--profile-row__icon ffz-i-ok tw-absolute"
>
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.profiles.active', 'This profile is enabled and active.') }}

12
src/modules/main_menu/components/reason-editor.vue
View file

@ -23,13 +23,13 @@
</button>
</div>
<div v-else-if="editing" class="tw-flex-shrink-0">
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="save">
<button class="tw-button tw-button--text tw-tooltip__container" @click="save">
<span class="tw-button__text ffz-i-floppy" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.save', 'Save') }}
</div>
</button>
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="cancel">
<button class="tw-button tw-button--text tw-tooltip__container" @click="cancel">
<span class="tw-button__text ffz-i-cancel" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.cancel', 'Cancel') }}
@ -37,13 +37,13 @@
</button>
</div>
<div v-else-if="deleting" class="tw-flex-shrink-0">
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="$emit('remove', reason)">
<button class="tw-button tw-button--text tw-tooltip__container" @click="$emit('remove', reason)">
<span class="tw-button__text ffz-i-trash" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.delete', 'Delete') }}
</div>
</button>
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="deleting = false">
<button class="tw-button tw-button--text tw-tooltip__container" @click="deleting = false">
<span class="tw-button__text ffz-i-cancel" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.cancel', 'Cancel') }}
@ -51,13 +51,13 @@
</button>
</div>
<div v-else class="tw-flex-shrink-0">
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="edit">
<button class="tw-button tw-button--text tw-tooltip__container" @click="edit">
<span class="tw-button__text ffz-i-cog" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.edit', 'Edit') }}
</div>
</button>
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="deleting = true">
<button class="tw-button tw-button--text tw-tooltip__container" @click="deleting = true">
<span class="tw-button__text ffz-i-trash" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.delete', 'Delete') }}

2
src/modules/main_menu/components/setting-check-box.vue
View file

@ -39,7 +39,7 @@
</button>
<div class="ffz--reset-button">
<button v-if="has_value" class="tw-mg-l-05 tw-button tw-button--text tw-tooltip-wrapper" @click="clear">
<button v-if="has_value" class="tw-mg-l-05 tw-button tw-button--text tw-tooltip__container" @click="clear">
<span class="tw-button__text ffz-i-cancel" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.reset', 'Reset to Default') }}

2
src/modules/main_menu/components/setting-color-box.vue
View file

@ -37,7 +37,7 @@
</span>
</button>
<button v-if="has_value" class="tw-mg-l-05 tw-button tw-button--text tw-tooltip-wrapper" @click="clear">
<button v-if="has_value" class="tw-mg-l-05 tw-button tw-button--text tw-tooltip__container" @click="clear">
<span class="tw-button__text ffz-i-cancel" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.reset', 'Reset to Default') }}

2
src/modules/main_menu/components/setting-combo-box.vue
View file

@ -54,7 +54,7 @@
</span>
</button>
<button v-if="has_value" class="tw-mg-l-05 tw-mg-y-05 tw-button tw-button--text tw-tooltip-wrapper" @click="clear">
<button v-if="has_value" class="tw-mg-l-05 tw-mg-y-05 tw-button tw-button--text tw-tooltip__container" @click="clear">
<span class="tw-button__text ffz-i-cancel" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.reset', 'Reset to Default') }}

2
src/modules/main_menu/components/setting-select-box.vue
View file

@ -60,7 +60,7 @@
</span>
</button>
<button v-if="has_value" class="tw-mg-l-05 tw-button tw-button--text tw-tooltip-wrapper" @click="clear">
<button v-if="has_value" class="tw-mg-l-05 tw-button tw-button--text tw-tooltip__container" @click="clear">
<span class="tw-button__text ffz-i-cancel" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.reset', 'Reset to Default') }}

2
src/modules/main_menu/components/setting-text-box.vue
View file

@ -37,7 +37,7 @@
</span>
</button>
<button v-if="has_value" class="tw-mg-l-05 tw-button tw-button--text tw-tooltip-wrapper" @click="clear">
<button v-if="has_value" class="tw-mg-l-05 tw-button tw-button--text tw-tooltip__container" @click="clear">
<span class="tw-button__text ffz-i-cancel" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.reset', 'Reset to Default') }}

18
src/modules/main_menu/components/term-editor.vue
View file

@ -1,13 +1,13 @@
<template lang="html">
<div class="ffz--term">
<div class="tw-align-items-center tw-flex tw-flex-nowrap tw-flex-row tw-full-width">
<div v-if="! is_valid" class="tw-relative tw-tooltip-wrapper tw-mg-r-05">
<div v-if="! is_valid" class="tw-relative tw-tooltip__container tw-mg-r-05">
<figure class="tw-c-text-error ffz-i-attention" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-left">
{{ t('setting.terms.warn-invalid', 'This highlight term is invalid.') }}
</div>
</div>
<div v-if="! is_safe" class="tw-relative tw-tooltip-wrapper tw-mg-r-05">
<div v-if="! is_safe" class="tw-relative tw-tooltip__container tw-mg-r-05">
<figure class="tw-c-text-hint ffz-i-attention" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-left">
{{ t('setting.terms.warn-complex', 'This highlight term is potentially too complex. It may cause client lag.') }}
@ -56,7 +56,7 @@
</option>
</select>
</div>
<div v-if="removable" class="tw-flex-shrink-0 tw-mg-r-05 tw-relative tw-tooltip-wrapper">
<div v-if="removable" class="tw-flex-shrink-0 tw-mg-r-05 tw-relative tw-tooltip__container">
<button
v-if="editing"
:class="{active: edit_data.remove}"
@ -89,13 +89,13 @@
</button>
</div>
<div v-else-if="editing" class="tw-flex-shrink-0">
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="save">
<button class="tw-button tw-button--text tw-tooltip__container" @click="save">
<span class="tw-button__text ffz-i-floppy" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.save', 'Save') }}
</div>
</button>
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="cancel">
<button class="tw-button tw-button--text tw-tooltip__container" @click="cancel">
<span class="tw-button__text ffz-i-cancel" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.cancel', 'Cancel') }}
@ -103,13 +103,13 @@
</button>
</div>
<div v-else-if="deleting" class="tw-flex-shrink-0">
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="$emit('remove', term)">
<button class="tw-button tw-button--text tw-tooltip__container" @click="$emit('remove', term)">
<span class="tw-button__text ffz-i-trash" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.delete', 'Delete') }}
</div>
</button>
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="deleting = false">
<button class="tw-button tw-button--text tw-tooltip__container" @click="deleting = false">
<span class="tw-button__text ffz-i-cancel" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.cancel', 'Cancel') }}
@ -117,13 +117,13 @@
</button>
</div>
<div v-else class="tw-flex-shrink-0">
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="edit">
<button class="tw-button tw-button--text tw-tooltip__container" @click="edit">
<span class="tw-button__text ffz-i-cog" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.edit', 'Edit') }}
</div>
</button>
<button class="tw-button tw-button--text tw-tooltip-wrapper" @click="deleting = true">
<button class="tw-button tw-button--text tw-tooltip__container" @click="deleting = true">
<span class="tw-button__text ffz-i-trash" />
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.delete', 'Delete') }}

6
src/modules/metadata.jsx
View file

@ -225,7 +225,7 @@ export default class Metadata extends Module {
value={url}
onFocus={e => e.target.select()}
/>
{can_copy && <div class="tw-relative tw-tooltip-wrapper tw-mg-l-1">
{can_copy && <div class="tw-relative tw-tooltip__container tw-mg-l-1">
<button
class="tw-align-items-center tw-align-middle tw-border-bottom-left-radius-medium tw-border-bottom-right-radius-medium tw-border-top-left-radius-medium tw-border-top-right-radius-medium tw-button-icon tw-core-button tw-core-button--border tw-inline-flex tw-interactive tw-justify-content-center tw-overflow-hidden tw-relative"
aria-label={ this.i18n.t('metadata.uptime.copy', 'Copy to Clipboard') }
@ -639,7 +639,7 @@ export default class Metadata extends Module {
if ( def.popup && def.click ) {
el = (<div
class={`tw-align-items-center tw-inline-flex tw-relative tw-tooltip-wrapper ffz-stat tw-stat ffz-stat--fix-padding ${border ? 'tw-mg-r-1' : 'tw-mg-r-05 ffz-mg-l--05'}`}
class={`tw-align-items-center tw-inline-flex tw-relative tw-tooltip__container ffz-stat tw-stat ffz-stat--fix-padding ${border ? 'tw-mg-r-1' : 'tw-mg-r-05 ffz-mg-l--05'}`}
data-key={key}
tip_content={null}
>
@ -766,7 +766,7 @@ export default class Metadata extends Module {
icon = (<span class="tw-stat__icon"><figure class={icon} /></span>);
el = (<div
class={`tw-align-items-center tw-inline-flex tw-relative tw-tooltip-wrapper ffz-stat tw-stat tw-mg-r-1${def.tooltip ? ' ffz-tooltip ffz-tooltip--no-mouse' : ''}`}
class={`tw-align-items-center tw-inline-flex tw-relative tw-tooltip__container ffz-stat tw-stat tw-mg-r-1${def.tooltip ? ' ffz-tooltip ffz-tooltip--no-mouse' : ''}`}
data-tooltip-type="metadata"
data-key={key}
tip_content={null}

2
src/modules/translation_ui/components/i18n-entry.vue
View file

@ -93,7 +93,7 @@
</div>
<button
class="tw-button-icon tw-mg-l-05 tw-relative tw-tooltip-wrapper"
class="tw-button-icon tw-mg-l-05 tw-relative tw-tooltip__container"
@click="open = false"
>
<span class="tw-button-icon__icon">

24
src/modules/translation_ui/components/translation-ui.vue
View file

@ -26,7 +26,7 @@
</div>
</div>
</div>
<button class="tw-button-icon tw-mg-x-05 tw-relative tw-tooltip-wrapper" @click="saveBlob">
<button class="tw-button-icon tw-mg-x-05 tw-relative tw-tooltip__container" @click="saveBlob">
<span class="tw-button-icon__icon">
<figure class="ffz-i-floppy" />
</span>
@ -34,7 +34,7 @@
{{ t('i18n.ui.save', 'Generate Change Blob') }}
</div>
</button>
<button v-if="can_upload" class="tw-button-icon tw-mg-x-05 tw-relative tw-tooltip-wrapper" @click="uploadBlob">
<button v-if="can_upload" class="tw-button-icon tw-mg-x-05 tw-relative tw-tooltip__container" @click="uploadBlob">
<span class="tw-button-icon__icon">
<figure class="ffz-i-upload-cloud" />
</span>
@ -42,7 +42,7 @@
{{ t('i18n.ui.upload', 'Upload Changes') }}
</div>
</button>
<button class="tw-button-icon tw-mg-x-05 tw-relative tw-tooltip-wrapper" @click="requestKeys">
<button class="tw-button-icon tw-mg-x-05 tw-relative tw-tooltip__container" @click="requestKeys">
<span class="tw-button-icon__icon">
<figure class="ffz-i-arrows-cw" />
</span>
@ -55,7 +55,7 @@
<figure :class="faded ? 'ffz-i-eye-off' : 'ffz-i-eye'" />
</span>
</button>
<button v-if="!exclusive" class="tw-button-icon tw-mg-x-05 tw-relative tw-tooltip-wrapper" @click="popout">
<button v-if="!exclusive" class="tw-button-icon tw-mg-x-05 tw-relative tw-tooltip__container" @click="popout">
<span class="tw-button-icon__icon">
<figure class="ffz-i-link-ext" />
</span>
@ -76,7 +76,7 @@
</header>
<section class="tw-border-t tw-full-height tw-full-width tw-flex tw-flex-column tw-overflow-hidden">
<header class="tw-border-b tw-pd-05 tw-c-background-base tw-flex tw-align-items-center">
<button class="tw-border-radius-medium tw-pd-x-05 tw-core-button tw-core-button--text tw-c-text-base tw-interactive tw-relative tw-tooltip-wrapper" @click="prevPage">
<button class="tw-border-radius-medium tw-pd-x-05 tw-core-button tw-core-button--text tw-c-text-base tw-interactive tw-relative tw-tooltip__container" @click="prevPage">
<span class="tw-button-icon__icon">
<figure class="ffz-i-left-dir" />
</span>
@ -105,7 +105,7 @@
@keydown.enter="closePage"
@blur="closePage"
>
<button class="tw-border-radius-medium tw-pd-x-05 tw-core-button tw-core-button--text tw-c-text-base tw-interactive tw-relative tw-tooltip-wrapper" @click="nextPage">
<button class="tw-border-radius-medium tw-pd-x-05 tw-core-button tw-core-button--text tw-c-text-base tw-interactive tw-relative tw-tooltip__container" @click="nextPage">
<span class="tw-button-icon__icon">
<figure class="ffz-i-right-dir" />
</span>
@ -115,7 +115,7 @@
</button>
<div class="tw-flex-grow-1" />
<button
class="tw-border-radius-medium tw-pd-x-05 tw-core-button tw-c-text-base tw-interactive tw-relative tw-tooltip-wrapper"
class="tw-border-radius-medium tw-pd-x-05 tw-core-button tw-c-text-base tw-interactive tw-relative tw-tooltip__container"
:class="[mode === 0 ? 'tw-core-button--primary' : 'tw-core-button--text']"
@click="mode = 0"
>
@ -131,7 +131,7 @@
</button>
<button
v-if="existing != total"
class="tw-mg-l-05 tw-border-radius-medium tw-pd-x-05 tw-core-button tw-c-text-base tw-interactive tw-relative tw-tooltip-wrapper"
class="tw-mg-l-05 tw-border-radius-medium tw-pd-x-05 tw-core-button tw-c-text-base tw-interactive tw-relative tw-tooltip__container"
:class="[mode === 1 ? 'tw-core-button--primary' : 'tw-core-button--text']"
@click="mode = 1"
>
@ -147,7 +147,7 @@
</button>
<button
v-if="added"
class="tw-mg-l-05 tw-border-radius-medium tw-pd-x-05 tw-core-button tw-c-text-base tw-interactive tw-relative tw-tooltip-wrapper"
class="tw-mg-l-05 tw-border-radius-medium tw-pd-x-05 tw-core-button tw-c-text-base tw-interactive tw-relative tw-tooltip__container"
:class="[mode === 2 ? 'tw-core-button--primary' : 'tw-core-button--text']"
@click="mode = 2"
>
@ -163,7 +163,7 @@
</button>
<button
v-if="changed"
class="tw-mg-l-05 tw-border-radius-medium tw-pd-x-05 tw-core-button tw-c-text-base tw-interactive tw-relative tw-tooltip-wrapper"
class="tw-mg-l-05 tw-border-radius-medium tw-pd-x-05 tw-core-button tw-c-text-base tw-interactive tw-relative tw-tooltip__container"
:class="[mode === 3 ? 'tw-core-button--primary' : 'tw-core-button--text']"
@click="mode = 3"
>
@ -179,7 +179,7 @@
</button>
<button
v-if="pending"
class="tw-mg-l-05 tw-border-radius-medium tw-pd-x-05 tw-core-button tw-c-text-base tw-interactive tw-relative tw-tooltip-wrapper"
class="tw-mg-l-05 tw-border-radius-medium tw-pd-x-05 tw-core-button tw-c-text-base tw-interactive tw-relative tw-tooltip__container"
:class="[mode === 4 ? 'tw-core-button--primary' : 'tw-core-button--text']"
@click="mode = 4"
>
@ -195,7 +195,7 @@
</button>
<button
v-if="invalid"
class="tw-mg-l-05 tw-border-radius-medium tw-pd-x-05 tw-core-button tw-c-text-base tw-interactive tw-relative tw-tooltip-wrapper"
class="tw-mg-l-05 tw-border-radius-medium tw-pd-x-05 tw-core-button tw-c-text-base tw-interactive tw-relative tw-tooltip__container"
:class="[mode === 5 ? 'tw-core-button--primary' : 'tw-core-button--text']"
@click="mode = 5"
>