emoji tab fixes

This commit is contained in:
Henry Jameson 2025-12-11 14:05:46 +02:00
commit 952800410e
3 changed files with 31 additions and 16 deletions

View file

@ -1,6 +1,6 @@
.EmojiTab { .EmojiTab {
.setting-list { .setting-list {
padding-left: 0.75em; margin: 0.5em 2em;
} }
.toolbar { .toolbar {
@ -39,6 +39,7 @@
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
gap: 0.5em; gap: 0.5em;
margin-left: 1em;
} }
h5 { h5 {
@ -74,13 +75,21 @@
flex-wrap: wrap; flex-wrap: wrap;
gap: 1em; gap: 1em;
.button-unstyled {
display: flex;
}
.emoji-item,
.placeholder { .placeholder {
background: var(--textFaint);
border-radius: 0.5em;
width: 2em; width: 2em;
height: 2em; height: 2em;
opacity: 0.5; opacity: 0.5;
} }
.placeholder {
background: var(--textFaint);
border-radius: 0.5em;
}
} }
} }

View file

@ -116,7 +116,7 @@
<h4 class="toolbar"> <h4 class="toolbar">
{{ $t('admin_dash.emoji.edit_pack') }} {{ $t('admin_dash.emoji.edit_pack') }}
</h4> </h4>
<div class="selector-buttons"> <div class="setting-item selector-buttons">
<button <button
:disabled="!pack || pack.remote !== undefined" :disabled="!pack || pack.remote !== undefined"
class="button button-default btn" class="button button-default btn"
@ -265,13 +265,12 @@
/> />
{{ $t('admin_dash.emoji.description') }} {{ $t('admin_dash.emoji.description') }}
</span> </span>
<div>
<textarea <textarea
v-model="packMeta.description" v-model="packMeta.description"
:disabled="!pack || pack.remote !== undefined" :disabled="!pack || pack.remote !== undefined"
class="bio resize-height input setting-control" height="4"
class="bio resize-height input textarea setting-control"
/> />
</div>
</label> </label>
</li> </li>
<li> <li>
@ -380,6 +379,7 @@
> >
<EmojiEditingPopover <EmojiEditingPopover
v-if="pack && pack.remote === undefined" v-if="pack && pack.remote === undefined"
class="emoji-item"
placement="bottom" placement="bottom"
new-upload new-upload
:title="$t('admin_dash.emoji.adding_new')" :title="$t('admin_dash.emoji.adding_new')"

View file

@ -31,7 +31,7 @@
h5 { h5 {
font-size: 1rem; font-size: 1rem;
margin-right: 1em; margin-left: 1em;
margin-bottom: 0.25em; margin-bottom: 0.25em;
margin-top: 0.75em; margin-top: 0.75em;
} }
@ -70,6 +70,7 @@
.setting-label { .setting-label {
grid-area: label; grid-area: label;
text-align: right; text-align: right;
align-self: baseline;
} }
.ModifiedIndicator, .ModifiedIndicator,
@ -80,6 +81,11 @@
.setting-control { .setting-control {
grid-area: control; grid-area: control;
&.textarea {
align-self: baseline;
overflow: auto;
}
&.checkbox { &.checkbox {
display: grid; display: grid;
grid-template-columns: subgrid; grid-template-columns: subgrid;