oss/FrankerFaceZ
oss/FrankerFaceZ
1
0
Fork 0
mirror of https://github.com/FrankerFaceZ/FrankerFaceZ.git synced 2025-07-31 06:58:30 +00:00
Code Wiki Activity

tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-tw-

Browse source
This commit is contained in:
SirStendec 2017-12-13 17:35:20 -05:00
parent 5a9a3d221b
commit 4b246ade44
50 changed files with 1564 additions and 2167 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1,6 +1,6 @@
<template lang="html">
<div class="ffz--changelog border-t pd-t-1">
<div class="align-center">
<div class="ffz--changelog tw-border-t tw-pd-t-1">
<div class="tw-align-center">
<h2>{{ t('home.changelog', 'Changelog') }}</h2>
</div>

4
src/modules/main_menu/components/feedback-page.vue
View file

@ -1,8 +1,8 @@
<template lang="html">
<div class="ffz--home border-t pd-t-1">
<div class="ffz--home tw-border-t tw-pd-t-1">
<h2>Feedback</h2>
<div class="mg-y-1 c-background-accent c-text-overlay pd-1">
<div class="tw-mg-y-1 tw-c-background-accent tw-c-text-overlay tw-pd-1">
<h3 class="ffz-i-attention">
Please keep in mind that FrankerFaceZ v4 is under heavy development.
</h3>

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

@ -3,25 +3,25 @@
<div ref="list" class="ffz--rule-list">
<section v-for="(rule, idx) in rules">
<div
class="ffz--rule elevation-1 c-background border mg-b-05 pd-y-05 pd-r-1 flex flex--nowrap align-items-start"
class="ffz--rule tw-elevation-1 tw-c-background tw-border tw-mg-b-05 tw-pd-y-05 tw-pd-r-1 tw-flex tw-flex-nowrap tw-align-items-start"
tabindex="0"
>
<div class="flex flex-shrink-0 align-items-center handle pd-x-05 pd-y-1">
<div class="tw-flex tw-flex-shrink-0 tw-align-items-center tw-handle tw-pd-x-05 tw-pd-y-1">
<span class="ffz-i-ellipsis-vert" />
</div>
<div class="flex-shrink-0 pd-y-05">
<div class="tw-flex-shrink-0 tw-pd-y-05">
Channel
</div>
<div class="mg-x-1 flex flex-grow-1">
<div class="flex-shrink-0 mg-r-1">
<div class="tw-mg-x-1 tw-flex tw-flex-grow-1">
<div class="tw-flex-shrink-0 tw-mg-r-1">
<select class="tw-select">
<option>is one of</option>
<option>is not one of</option>
</select>
</div>
<div class="flex-grow-1">
<div class="tw-flex-grow-1">
<input
type="text"
class="tw-input"
@ -30,7 +30,7 @@
</div>
</div>
<div class="flex flex-shrink-0 align-items-center">
<div class="tw-flex tw-flex-shrink-0 tw-align-items-center">
<button class="tw-button tw-button--text" @click="del(idx)">
<span class="tw-button__text ffz-i-trash">
{{ t('setting.filters.delete', 'Delete') }}
@ -42,7 +42,7 @@
</div>
<button
class="tw-button tw-button--hollow mg-y-1 full-width"
class="tw-button tw-button--hollow tw-mg-y-1 tw-full-width"
@click="newRule"
>
<span class="tw-button__text ffz-i-plus">

16
src/modules/main_menu/components/home-page.vue
View file

@ -1,14 +1,14 @@
<template lang="html">
<div class="ffz--home flex flex--nowrap">
<div class="flex-grow-1">
<div class="align-center">
<div class="ffz--home tw-flex tw-flex-nowrap">
<div class="tw-flex-grow-1">
<div class="tw-align-center">
<h1 class="ffz-i-zreknarf ffz-i-pd-1">FrankerFaceZ</h1>
<span class="c-text-alt">
<span class="tw-c-text-alt">
{{ t('home.tag-line', 'The Twitch Enhancement Suite') }}
</span>
</div>
<section class="pd-t-1 border-t mg-t-1">
<section class="tw-pd-t-1 tw-border-t tw-mg-t-1">
<h2>Welcome to the v4.0 Beta</h2>
<p>
@ -26,7 +26,7 @@
now, here are some of the bigger issues:
</p>
<ul class="mg-b-2">
<ul class="tw-mg-b-2">
<li>Settings from the old version are not being imported.</li>
<li>Settings cannot be searched.</li>
<li>FFZ badges do not display.</li>
@ -35,7 +35,7 @@
<p>And the biggest features still under development:</p>
<ul class="mg-b-2">
<ul class="tw-mg-b-2">
<li>Dark Theme (Pls No Purple)</li>
<li>Badge Customization</li>
<li>Emoji Rendering</li>
@ -66,7 +66,7 @@
</div>
<div class="mg-l-1 flex-shrink-0 tweet-column">
<div class="tw-mg-l-1 tw-flex-shrink-0 tweet-column">
<a class="twitter-timeline" data-width="300" data-theme="dark" href="https://twitter.com/FrankerFaceZ?ref_src=twsrc%5Etfw">
Tweets by FrankerFaceZ
</a>

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

@ -1,8 +1,8 @@
<template lang="html">
<div class="ffz-main-menu elevation-3 c-background-alt border flex flex--nowrap flex-column" :class="{ maximized }">
<header class="c-background full-width align-items-center flex flex-nowrap" @dblclick="resize">
<div class="ffz-main-menu tw-elevation-3 tw-c-background-alt tw-border tw-flex tw-flex-nowrap tw-flex-column" :class="{ maximized }">
<header class="tw-c-background tw-full-width tw-align-items-center tw-flex tw-flex-nowrap" @dblclick="resize">
<h3 class="ffz-i-zreknarf ffz-i-pd-1">FrankerFaceZ</h3>
<div class="flex-grow-1 pd-x-2">
<div class="tw-flex-grow-1 tw-pd-x-2">
<!--div class="tw-search-input">
<label for="ffz-main-menu.search" class="hide-accessible">{{ t('main-menu.search', 'Search Settings') }}</label>
<div class="relative">
@ -15,27 +15,27 @@
</div>
</div-->
</div>
<button class="tw-button-icon mg-x-05" @click="resize">
<button class="tw-button-icon tw-mg-x-05" @click="resize">
<span class="tw-button-icon__icon">
<figure :class="{'ffz-i-window-maximize': !maximized, 'ffz-i-window-restore': maximized}" />
</span>
</button>
<button class="tw-button-icon mg-x-05" @click="close">
<button class="tw-button-icon tw-mg-x-05" @click="close">
<span class="tw-button-icon__icon">
<figure class="ffz-i-window-close" />
</span>
</button>
</header>
<section class="border-t full-height full-width flex flex-nowrap overflow-hidden">
<nav class="ffz-vertical-nav c-background-alt-2 border-r full-height flex flex-column flex-shrink-0 flex-nowrap">
<header class="border-b pd-1">
<section class="tw-border-t tw-full-height tw-full-width tw-flex tw-flex-nowrap tw-overflow-hidden">
<nav class="ffz-vertical-nav tw-c-background-alt-2 tw-border-r tw-full-height tw-flex tw-flex-column tw-flex-shrink-0 tw-flex-nowrap">
<header class="tw-border-b tw-pd-1">
<profile-selector
:context="context"
@navigate="navigate"
/>
</header>
<div class="full-width full-height overflow-hidden flex flex-nowrap relative">
<div class="ffz-vertical-nav__items full-width flex-grow-1 scrollable-area" data-simplebar>
<div class="tw-full-width tw-full-height tw-overflow-hidden tw-flex tw-flex-nowrap tw-relative">
<div class="ffz-vertical-nav__items tw-full-width tw-flex-grow-1 scrollable-area" data-simplebar>
<div class="simplebar-scroll-content">
<div class="simplebar-content">
<menu-tree
@ -48,16 +48,16 @@
</div>
</div>
</div>
<footer class="c-text-alt border-t pd-1">
<footer class="tw-c-text-alt tw-border-t tw-pd-1">
<div>
{{ t('main-menu.version', 'Version %{version}', {version: version.toString()}) }}
</div>
<div class="c-text-alt-2">
<div class="tw-c-text-alt-2">
{{version.build}}
</div>
</footer>
</nav>
<main class="flex-grow-1 scrollable-area" data-simplebar>
<main class="tw-flex-grow-1 scrollable-area" data-simplebar>
<div class="simplebar-scroll-content">
<div class="simplebar-content">
<menu-page

4
src/modules/main_menu/components/menu-container.vue
View file

@ -6,7 +6,7 @@
<section
v-if="item.description"
v-html="t(item.desc_i18n_key, item.description, item)"
class="pd-b-1"
class="tw-pd-b-1"
/>
<component
v-for="i in item.contents"
@ -26,7 +26,7 @@ export default {
classes() {
return [
'ffz--menu-container',
this.item.full_box ? 'border' : 'border-t'
this.item.full_box ? 'tw-border' : 'tw-border-t'
]
}
}

12
src/modules/main_menu/components/menu-page.vue
View file

@ -1,14 +1,14 @@
<template lang="html">
<div class="ffz--menu-page">
<header class="mg-b-1">
<header class="tw-mg-b-1">
<template v-for="i in breadcrumbs">
<a v-if="i !== item" href="#" @click="$emit('change-item', i, false)">{{ t(i.i18n_key, i.title, i) }}</a>
<strong v-if="i === item">{{ t(i.i18n_key, i.title, i) }}</strong>
<template v-if="i !== item">&raquo; </template>
</template>
</header>
<section v-if="! context.currentProfile.live && item.profile_warning !== false" class="border-t pd-t-1 pd-b-2">
<div class="c-background-accent c-text-overlay pd-1">
<section v-if="! context.currentProfile.live && item.profile_warning !== false" class="tw-border-t tw-pd-t-1 tw-pd-b-2">
<div class="tw-c-background-accent tw-c-text-overlay tw-pd-1">
<h3 class="ffz-i-attention">
{{ t('setting.profiles.inactive', "This profile isn't active.") }}
</h3>
@ -22,13 +22,13 @@
</section>
<section
v-if="item.description"
class="border-t pd-y-1"
class="tw-border-t tw-pd-y-1"
v-html="t(item.desc_i18n_key || item.i18n_key + '.description', item.description, item)"
/>
</section>
<template v-if="! item.contents">
<ul class="border-t pd-y-1">
<li class="pd-x-1" v-for="i in item.items">
<ul class="tw-border-t tw-pd-y-1">
<li class="tw-pd-x-1" v-for="i in item.items">
<a href="#" @click="$emit('change-item', i, false)">
{{ t(i.i18n_key, i.title, i) }}
</a>

4
src/modules/main_menu/components/menu-tree.vue
View file

@ -17,7 +17,7 @@
role="presentation"
>
<div
class="flex__item flex flex--nowrap align-items-center pd-y-05 pd-r-05"
class="tw-flex__item tw-flex tw-flex-nowrap tw-align-items-center tw-pd-y-05 tw-pd-r-05"
role="treeitem"
:aria-expanded="item.expanded"
@ -32,7 +32,7 @@
item.expanded ? 'ffz-i-down-dir' : 'ffz-i-right-dir'
]"
/>
<span class="flex-grow-1">
<span class="tw-flex-grow-1">
{{ t(item.i18n_key, item.title, item) }}
</span>
<span v-if="item.pill" class="pill">

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

@ -1,7 +1,7 @@
<template lang="html">
<div class="ffz--profile-editor">
<div class="flex align-items-center border-t pd-1">
<div class="flex-grow-1"></div>
<div class="tw-flex tw-align-items-center tw-border-t tw-pd-1">
<div class="tw-flex-grow-1"></div>
<button
class="tw-button tw-button--text"
@click="save"
@ -11,7 +11,7 @@
</span>
</button>
<button
class="mg-l-1 tw-button tw-button--text"
class="tw-mg-l-1 tw-button tw-button--text"
:disabled="item.profile && context.profiles.length < 2"
@click="del"
>
@ -19,19 +19,19 @@
{{ t('setting.profiles.delete', 'Delete') }}
</span>
</button>
<!--button class="mg-l-1 tw-button tw-button--text">
<!--button class="tw-mg-l-1 tw-button tw-button--text">
<span class="tw-button__text ffz-i-download">
{{ t('setting.profiles.export', 'Export') }}
</span>
</button-->
</div>
<div class="ffz--menu-container border-t">
<div class="ffz--menu-container tw-border-t">
<header>
{{ t('settings.data_management.profiles.edit.general', 'General') }}
</header>
<div class="ffz--widget flex flex--nowrap">
<div class="ffz--widget tw-flex tw-flex-nowrap">
<label for="ffz:editor:name">
{{ t('settings.data_management.profiles.edit.name', 'Name') }}
</label>
@ -44,7 +44,7 @@
/>
</div>
<div class="ffz--widget flex flex--nowrap">
<div class="ffz--widget tw-flex tw-flex-nowrap">
<label for="ffz:editor:description">
{{ t('settings.data_management.profiles.edit.desc', 'Description') }}
</label>
@ -58,11 +58,11 @@
</div>
</div>
<div class="ffz--menu-container border-t">
<div class="ffz--menu-container tw-border-t">
<header>
{{ t('settings.data_management.profiles.edit.rules', 'Rules') }}
</header>
<section class="pd-b-1">
<section class="tw-pd-b-1">
{{ t(
'settings.data_management.profiles.edit.rules.description',
'Rules allows you to define a series of conditions under which this profile will be active.'

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

@ -1,22 +1,22 @@
<template lang="html">
<div class="ffz--widget ffz--profile-manager border-t pd-y-1">
<div class="c-background-accent c-text-overlay pd-1 mg-b-1">
<div class="ffz--widget ffz--profile-manager tw-border-t tw-pd-y-1">
<div class="tw-c-background-accent tw-c-text-overlay tw-pd-1 tw-mg-b-1">
<h3 class="ffz-i-attention">
This feature is not yet finished.
</h3>
Creating and editing profiles is disabled until the rule editor is finished.
</div>
<div class="flex align-items-center pd-b-05">
<div class="flex-grow-1">
<div class="tw-flex tw-align-items-center tw-pd-b-05">
<div class="tw-flex-grow-1">
{{ t('setting.profiles.drag', 'Drag profiles to change their priority.') }}
</div>
<button class="mg-l-1 tw-button tw-button--text" disabled @notclick="edit()">
<button class="tw-mg-l-1 tw-button tw-button--text" disabled @notclick="edit()">
<span class="tw-button__text ffz-i-plus">
{{ t('setting.profiles.new', 'New Profile') }}
</span>
</button>
<!--button class="mg-l-1 tw-button tw-button--text">
<!--button class="tw-mg-l-1 tw-button tw-button--text">
<span class="tw-button__text ffz-i-upload">
{{ t('setting.profiles.import', 'Import…') }}
</span>
@ -30,22 +30,22 @@
:data-profile="p.id"
>
<div
class="ffz--profile elevation-1 c-background border pd-y-05 pd-r-1 mg-y-05 flex flex--nowrap"
class="ffz--profile tw-elevation-1 tw-c-background tw-border tw-pd-y-05 tw-pd-r-1 tw-mg-y-05 tw-flex tw-flex-nowrap"
:class="{live: p.live}"
tabindex="0"
>
<div class="flex flex-shrink-0 align-items-center handle pd-x-05 pd-t-1 pd-b-05">
<div class="tw-flex tw-flex-shrink-0 tw-align-items-center tw-handle tw-pd-x-05 tw-pd-t-1 tw-pd-b-05">
<span class="ffz-i-ellipsis-vert" />
</div>
<div class="flex-grow-1">
<div class="tw-flex-grow-1">
<h4>{{ t(p.i18n_key, p.title, p) }}</h4>
<div v-if="p.description" class="description">
{{ t(p.desc_i18n_key, p.description, p) }}
</div>
</div>
<div class="flex flex-shrink-0 align-items-center">
<div class="tw-flex tw-flex-shrink-0 tw-align-items-center">
<button class="tw-button tw-button--text" disabled @notclick="edit(p)">
<span class="tw-button__text ffz-i-cog">
{{ t('setting.profiles.configure', 'Configure') }}
@ -53,7 +53,7 @@
</button>
</div>
<div class="flex flex-shrink-0 align-items-center border-l mg-l-1 pd-l-1">
<div class="tw-flex tw-flex-shrink-0 tw-align-items-center tw-border-l tw-mg-l-1 tw-pd-l-1">
<div v-if="p.live" class="ffz--profile__icon ffz-i-ok tw-tooltip-wrapper">
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.profiles.active', 'This profile is active.') }}

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

@ -15,20 +15,20 @@
>
{{ t(context.currentProfile.i18n_key, context.currentProfile.title, context.currentProfile) }}
</div>
<div v-if="opened" v-on-clickaway="hide" class="tw-balloon block tw-balloon--lg tw-balloon--down tw-balloon--left">
<div v-if="opened" v-on-clickaway="hide" class="tw-balloon tw-block tw-balloon--lg tw-balloon--down tw-balloon--left">
<div
class="ffz--profile-list elevation-2 c-background-alt"
class="ffz--profile-list tw-elevation-2 tw-c-background-alt"
@keyup.escape="focusHide"
@focusin="focus"
@focusout="blur"
>
<div class="scrollable-area border-b" data-simplebar>
<div class="scrollable-area tw-border-b" data-simplebar>
<div class="simplebar-scroll-content">
<div class="simplebar-content" ref="popup">
<div
v-for="(p, idx) in context.profiles"
tabindex="0"
class="ffz--profile-row relative border-b pd-y-05 pd-r-3 pd-l-1"
class="ffz--profile-row tw-relative tw-border-b tw-pd-y-05 tw-pd-r-3 tw-pd-l-1"
:class="{
live: p.live,
current: p === context.currentProfile
@ -48,7 +48,7 @@
>
<div
v-if="p.live"
class="tw-tooltip-wrapper ffz--profile-row__icon ffz-i-ok absolute"
class="tw-tooltip-wrapper 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 active.') }}
@ -64,7 +64,7 @@
</div>
</div>
</div>
<div class="pd-y-05 pd-x-05 align-right">
<div class="tw-pd-y-05 tw-pd-x-05 tw-align-right">
<button class="tw-button tw-button--text" @click="openConfigure">
<span class="tw-button__text ffz-i-cog">
{{ t('setting.profiles.configure', 'Configure') }}

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

@ -1,6 +1,6 @@
<template lang="html">
<div class="ffz--widget ffz--checkbox" :class="{inherits: isInherited, default: isDefault}">
<div class="flex align-items-center">
<div class="tw-flex tw-align-items-center">
<input
type="checkbox"
class="tw-checkbox__input"
@ -16,7 +16,7 @@
<button
v-if="source && source !== profile"
class="mg-l-05 tw-button tw-button--text"
class="tw-mg-l-05 tw-button tw-button--text"
@click="context.currentProfile = source"
>
<span class="tw-button__text ffz-i-right-dir">
@ -24,7 +24,7 @@
</span>
</button>
<button v-if="has_value" class="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-wrapper" @click="clear">
<span class="tw-button__text ffz-i-cancel"></span>
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.reset', 'Reset to Default') }}
@ -33,7 +33,7 @@
</div>
<section
v-if="item.description"
class="c-text-alt-2"
class="tw-c-text-alt-2"
style="padding-left:2.2rem"
v-html="t(item.desc_i18n_key || item.i18n_key + '.description', item.description, item)"
/>

4
src/modules/main_menu/components/setting-hotkey.vue
View file

@ -4,7 +4,7 @@
:for="item.full_key"
v-html="t(item.i18n_key, item.title, item)"
/>
<div class="relative">
<div class="tw-relative">
<div class="tw-input__icon-group tw-input__icon-group--right">
<div class="tw-input__icon">
<figure class="ffz-i-keyboard" />
@ -12,7 +12,7 @@
</div>
<div
type="text"
class="mg-05 tw-input tw-input--icon-right"
class="tw-mg-05 tw-input tw-input--icon-right"
ref="display"
:id="item.full_key"
tabindex="0"

8
src/modules/main_menu/components/setting-radio-buttons.vue
View file

@ -1,16 +1,16 @@
<template lang="html">
<div class="atw-input">
<div class="tw-input">
<header>
{{ t(item.i18n_key, item.title, item) }}
</header>
<section
v-if="item.description"
class="c-text-alt-2"
class="tw-c-text-alt-2"
v-html="t(item.desc_i18n_key || item.i18n_key + '.description', item.description, item)"
/>
<div v-for="(i, idx) in data" class="mg-l-1">
<div v-for="(i, idx) in data" class="tw-mg-l-1">
<input type="radio" :name="item.full_key" :id="item.full_key + idx" :value="i.value" class="tw-radio__input">
<label :for="item.full_key + idx" class="pd-y-05 tw-radio__label">{{ t(i.i18n_key, i.title, i) }}</label>
<label :for="item.full_key + idx" class="tw-pd-y-05 tw-radio__label">{{ t(i.i18n_key, i.title, i) }}</label>
</div>
</div>
</template>

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

@ -1,12 +1,12 @@
<template lang="html">
<div class="ffz--widget ffz--select-box" :class="{inherits: isInherited, default: isDefault}">
<div class="flex align-items-center">
<div class="tw-flex tw-align-items-center">
<label :for="item.full_key">
{{ t(item.i18n_key, item.title, item) }}
</label>
<select
class="mg-05 tw-select display-inline width-auto"
class="tw-mg-05 tw-select tw-display-inline tw-width-auto"
ref="control"
:id="item.full_key"
@change="onChange"
@ -18,7 +18,7 @@
<button
v-if="source && source !== profile"
class="mg-l-05 tw-button tw-button--text"
class="tw-mg-l-05 tw-button tw-button--text"
@click="context.currentProfile = source"
>
<span class="tw-button__text ffz-i-right-dir">
@ -26,7 +26,7 @@
</span>
</button>
<button v-if="has_value" class="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-wrapper" @click="clear">
<span class="tw-button__text ffz-i-cancel"></span>
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.reset', 'Reset to Default') }}
@ -36,7 +36,7 @@
<section
v-if="item.description"
class="c-text-alt-2"
class="tw-c-text-alt-2"
v-html="t(item.desc_i18n_key || item.i18n_key + '.description', item.description, item)"
/>
</div>

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

@ -1,12 +1,12 @@
<template lang="html">
<div class="ffz--widget ffz--text-box" :class="{inherits: isInherited, default: isDefault}">
<div class="flex align-items-center">
<div class="tw-flex tw-align-items-center">
<label :for="item.full_key">
{{ t(item.i18n_key, item.title, item) }}
</label>
<input
class="mg-05 tw-input display-inline width-auto"
class="tw-mg-05 tw-input tw-display-inline tw-width-auto"
ref="control"
:id="item.full_key"
@change="onChange"
@ -15,7 +15,7 @@
<button
v-if="source && source !== profile"
class="mg-l-05 tw-button tw-button--text"
class="tw-mg-l-05 tw-button tw-button--text"
@click="context.currentProfile = source"
>
<span class="tw-button__text ffz-i-right-dir">
@ -23,7 +23,7 @@
</span>
</button>
<button v-if="has_value" class="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-wrapper" @click="clear">
<span class="tw-button__text ffz-i-cancel"></span>
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.reset', 'Reset to Default') }}
@ -33,7 +33,7 @@
<section
v-if="item.description"
class="c-text-alt-2"
class="tw-c-text-alt-2"
v-html="t(item.desc_i18n_key || item.i18n_key + '.description', item.description, item)"
/>
</div>