diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue index ed830f57..73f6a4f1 100644 --- a/src/components/post_status_form/post_status_form.vue +++ b/src/components/post_status_form/post_status_form.vue @@ -302,11 +302,12 @@ :key="file.url" class="media-upload-wrapper" > - <FAIcon - class="fa-scale-110 fa-old-padding" - icon="times" + <button + class="button-unstyled hider" @click="removeMediaFile(file)" - /> + > + <FAIcon icon="times" /> + </button> <attachment :attachment="file" :set-media="() => $store.dispatch('setMedia', newStatus.files)" @@ -516,26 +517,11 @@ } .attachments .media-upload-wrapper { - padding: 0 0.5em; + position: relative; .attachment { margin: 0; padding: 0; - position: relative; - } - - .fa-scale-110 fa-old-padding { - position: absolute; - margin: 10px; - margin: .75em; - padding: .5em; - background: rgba(230,230,230,0.6); - z-index: 2; - color: black; - border-radius: $fallback--attachmentRadius; - border-radius: var(--attachmentRadius, $fallback--attachmentRadius); - font-weight: bold; - cursor: pointer; } } diff --git a/src/components/settings_modal/tabs/profile_tab.scss b/src/components/settings_modal/tabs/profile_tab.scss index e821f952..1a19b50d 100644 --- a/src/components/settings_modal/tabs/profile_tab.scss +++ b/src/components/settings_modal/tabs/profile_tab.scss @@ -111,16 +111,17 @@ .profile-fields { display: flex; - &>.emoji-input { + & > .emoji-input { flex: 1 1 auto; - margin: 0 .2em .5em; + margin: 0 0.2em 0.5em; min-width: 0; } - &>.icon-container { + & > .button-unstyled { width: 20px; align-self: center; - margin: 0 .2em .5em; + margin: 0 0.2em 0.5em; + padding: 0 0.5em; } } } diff --git a/src/components/settings_modal/tabs/profile_tab.vue b/src/components/settings_modal/tabs/profile_tab.vue index b7ef21d7..abb16db2 100644 --- a/src/components/settings_modal/tabs/profile_tab.vue +++ b/src/components/settings_modal/tabs/profile_tab.vue @@ -124,24 +124,24 @@ :placeholder="$t('settings.profile_fields.value')" > </EmojiInput> - <div - class="icon-container" + <button + class="button-unstyled" + @click="deleteField(i)" > <FAIcon v-show="newFields.length > 1" icon="times" - @click="deleteField(i)" /> - </div> + </button> </div> - <a + <button v-if="newFields.length < maxFields" - class="add-field faint" + class="add-field faint button-unstyled" @click="addField" > <FAIcon icon="plus" /> {{ $t("settings.profile_fields.add_field") }} - </a> + </button> </div> <p> <Checkbox v-model="bot">