From 38142182774ea772aacc88f26586512d6279267f Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Mon, 19 Oct 2020 19:38:49 +0300 Subject: Some initial work on replacing icons with FA5 --- src/components/poll/poll_form.vue | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) (limited to 'src/components/poll/poll_form.vue') diff --git a/src/components/poll/poll_form.vue b/src/components/poll/poll_form.vue index d53f3837..3a8a2f42 100644 --- a/src/components/poll/poll_form.vue +++ b/src/components/poll/poll_form.vue @@ -24,8 +24,8 @@ v-if="options.length > 2" class="icon-container" > - @@ -35,7 +35,8 @@ class="add-option faint" @click="addOption" > - + + {{ $t("polls.add_option") }}
@@ -55,7 +56,7 @@ - +
- +
@@ -103,6 +104,7 @@ .add-option { align-self: flex-start; padding-top: 0.25em; + padding-left: 0.1em; cursor: pointer; } @@ -124,8 +126,8 @@ .icon-container { // Hack: Move the icon over the input box - width: 2em; - margin-left: -2em; + width: 1.5em; + margin-left: -1.5em; z-index: 1; } -- cgit v1.2.3-70-g09d2 From 3cbaa0044943341fa4af4e4eb880649fc7eecda4 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Tue, 20 Oct 2020 22:54:43 +0300 Subject: more replacements + small renames --- src/App.scss | 6 ++-- src/App.vue | 26 ++++++++------ src/components/font_control/font_control.vue | 2 +- .../interface_language_switcher.vue | 2 +- src/components/poll/poll_form.vue | 4 +-- .../post_status_form/post_status_form.vue | 2 +- src/components/search_bar/search_bar.js | 3 +- src/components/search_bar/search_bar.vue | 41 ++++++++++++---------- .../settings_modal/settings_modal_content.js | 23 ++++++++++++ .../settings_modal/settings_modal_content.vue | 8 ++--- .../settings_modal/tabs/filtering_tab.vue | 2 +- src/components/settings_modal/tabs/general_tab.vue | 4 +-- .../settings_modal/tabs/theme_tab/preview.vue | 28 ++++++++++----- .../settings_modal/tabs/theme_tab/theme_tab.vue | 4 +-- src/components/shadow_control/shadow_control.vue | 2 +- src/components/tab_switcher/tab_switcher.js | 3 +- src/components/tab_switcher/tab_switcher.scss | 3 +- src/components/user_card/user_card.vue | 2 +- 18 files changed, 106 insertions(+), 59 deletions(-) (limited to 'src/components/poll/poll_form.vue') diff --git a/src/App.scss b/src/App.scss index 126a3297..06915e16 100644 --- a/src/App.scss +++ b/src/App.scss @@ -188,7 +188,7 @@ input, textarea, .select, .input { opacity: 0.5; } - .icon-down-open { + .select-down-icon { position: absolute; top: 0; bottom: 0; @@ -368,7 +368,9 @@ i[class*=icon-], .svg-inline--fa { flex-wrap: wrap; .nav-icon { - margin-left: 0.4em; + margin-left: 0.2em; + width: 2em; + text-align: center; } &.right { diff --git a/src/App.vue b/src/App.vue index 0276c6a6..5efaf717 100644 --- a/src/App.vue +++ b/src/App.vue @@ -42,36 +42,42 @@
-
diff --git a/src/components/font_control/font_control.vue b/src/components/font_control/font_control.vue index 40aed190..6070ab22 100644 --- a/src/components/font_control/font_control.vue +++ b/src/components/font_control/font_control.vue @@ -41,7 +41,7 @@ {{ option === 'custom' ? $t('settings.style.fonts.custom') : option }} - + - + diff --git a/src/components/poll/poll_form.vue b/src/components/poll/poll_form.vue index 3a8a2f42..8c4ada89 100644 --- a/src/components/poll/poll_form.vue +++ b/src/components/poll/poll_form.vue @@ -56,7 +56,7 @@ - +
- +
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue index 7f7ac72f..817b2fa0 100644 --- a/src/components/post_status_form/post_status_form.vue +++ b/src/components/post_status_form/post_status_form.vue @@ -199,7 +199,7 @@ {{ $t(`post_status.content_type["${postFormat}"]`) }} - +
({ searchTerm: undefined, hidden: true, - error: false, - loading: false + error: false }), watch: { '$route': function (route) { diff --git a/src/components/search_bar/search_bar.vue b/src/components/search_bar/search_bar.vue index ecc0febf..fbbbbfe0 100644 --- a/src/components/search_bar/search_bar.vue +++ b/src/components/search_bar/search_bar.vue @@ -1,17 +1,17 @@ @@ -907,7 +907,7 @@ {{ $t('settings.style.shadows.components.' + shadow) }} - +
diff --git a/src/components/shadow_control/shadow_control.vue b/src/components/shadow_control/shadow_control.vue index 1f63f3f2..32220ae8 100644 --- a/src/components/shadow_control/shadow_control.vue +++ b/src/components/shadow_control/shadow_control.vue @@ -78,7 +78,7 @@ {{ $t('settings.style.shadows.shadow_id', { value: index }) }} - +
-- cgit v1.2.3-70-g09d2 From a50cd7e37dce6e95f2c3d6cc63c382af71a2926e Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Wed, 21 Oct 2020 00:01:28 +0300 Subject: remaining changes... --- src/components/attachment/attachment.js | 22 +++++++++-- src/components/attachment/attachment.vue | 14 ++++--- src/components/chat_panel/chat_panel.vue | 7 ++-- .../global_notice_list/global_notice_list.vue | 2 +- src/components/image_cropper/image_cropper.js | 6 ++- src/components/image_cropper/image_cropper.vue | 5 ++- src/components/importer/importer.js | 11 ++++++ src/components/importer/importer.vue | 14 ++++--- src/components/login_form/login_form.vue | 2 +- src/components/mfa_form/recovery_form.vue | 2 +- src/components/mfa_form/totp_form.vue | 6 ++- src/components/password_reset/password_reset.vue | 2 +- src/components/poll/poll_form.vue | 9 +++++ .../post_status_form/post_status_form.js | 6 ++- .../post_status_form/post_status_form.vue | 46 +++++++--------------- src/components/settings_modal/tabs/profile_tab.js | 6 ++- .../settings_modal/tabs/profile_tab.scss | 6 +-- src/components/settings_modal/tabs/profile_tab.vue | 28 +++++++------ src/components/status/status.scss | 5 --- src/components/status_content/status_content.js | 18 +++++++++ src/components/status_content/status_content.vue | 28 +++++++------ src/components/user_profile/user_profile.js | 8 ++++ src/components/user_profile/user_profile.vue | 6 ++- 23 files changed, 162 insertions(+), 97 deletions(-) (limited to 'src/components/poll/poll_form.vue') diff --git a/src/components/attachment/attachment.js b/src/components/attachment/attachment.js index cb31020d..e23fcb1b 100644 --- a/src/components/attachment/attachment.js +++ b/src/components/attachment/attachment.js @@ -3,6 +3,20 @@ import VideoAttachment from '../video_attachment/video_attachment.vue' import nsfwImage from '../../assets/nsfw.png' import fileTypeService from '../../services/file_type/file_type.service.js' import { mapGetters } from 'vuex' +import { library } from '@fortawesome/fontawesome-svg-core' +import { + faFile, + faMusic, + faImage, + faVideo +} from '@fortawesome/free-solid-svg-icons' + +library.add( + faFile, + faMusic, + faImage, + faVideo +) const Attachment = { props: [ @@ -39,10 +53,10 @@ const Attachment = { return this.attachment.description }, placeholderIconClass () { - if (this.type === 'image') return 'icon-picture' - if (this.type === 'video') return 'icon-video' - if (this.type === 'audio') return 'icon-music' - return 'icon-doc' + if (this.type === 'image') return 'image' + if (this.type === 'video') return 'video' + if (this.type === 'audio') return 'music' + return 'file' }, referrerpolicy () { return this.$store.state.instance.mediaProxyAvailable ? '' : 'no-referrer' diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue index 19c713d5..0b7a3f9c 100644 --- a/src/components/attachment/attachment.vue +++ b/src/components/attachment/attachment.vue @@ -12,7 +12,7 @@ :alt="attachment.description" :title="attachment.description" > - + {{ nsfw ? "NSFW / " : "" }}{{ placeholderName }} @@ -36,9 +36,9 @@ :src="nsfwImage" :class="{'small': isSmall}" > -
- @@ -142,6 +142,10 @@ white-space: nowrap; text-overflow: ellipsis; max-width: 100%; + + svg { + color: inherit; + } } .nsfw-placeholder { diff --git a/src/components/chat_panel/chat_panel.vue b/src/components/chat_panel/chat_panel.vue index fc06f542..51b99563 100644 --- a/src/components/chat_panel/chat_panel.vue +++ b/src/components/chat_panel/chat_panel.vue @@ -11,7 +11,7 @@ >
{{ $t('shoutbox.title') }} - @@ -63,7 +63,7 @@ @click.stop.prevent="togglePanel" >
- + {{ $t('shoutbox.title') }}
@@ -87,7 +87,8 @@ .chat-panel { .chat-heading { cursor: pointer; - .icon-comment-empty { + + .icon { color: $fallback--text; color: var(--text, $fallback--text); } diff --git a/src/components/global_notice_list/global_notice_list.vue b/src/components/global_notice_list/global_notice_list.vue index 2965cd0d..3a7139f4 100644 --- a/src/components/global_notice_list/global_notice_list.vue +++ b/src/components/global_notice_list/global_notice_list.vue @@ -9,7 +9,7 @@
{{ $t(notice.messageKey, notice.messageArgs) }}
- diff --git a/src/components/image_cropper/image_cropper.js b/src/components/image_cropper/image_cropper.js index 9027b6eb..59e4d07e 100644 --- a/src/components/image_cropper/image_cropper.js +++ b/src/components/image_cropper/image_cropper.js @@ -2,11 +2,13 @@ import Cropper from 'cropperjs' import 'cropperjs/dist/cropper.css' import { library } from '@fortawesome/fontawesome-svg-core' import { - faTimes + faTimes, + faCircleNotch } from '@fortawesome/free-solid-svg-icons' library.add( - faTimes + faTimes, + faCircleNotch ) const ImageCropper = { diff --git a/src/components/image_cropper/image_cropper.vue b/src/components/image_cropper/image_cropper.vue index 389b06b9..e69cbd0b 100644 --- a/src/components/image_cropper/image_cropper.vue +++ b/src/components/image_cropper/image_cropper.vue @@ -31,9 +31,10 @@ @click="submit(false)" v-text="saveWithoutCroppingText" /> -
-
diff --git a/src/components/status/status.scss b/src/components/status/status.scss index cd5366ed..ea9e538d 100644 --- a/src/components/status/status.scss +++ b/src/components/status/status.scss @@ -156,11 +156,6 @@ $status-margin: 0.75em; text-overflow: ellipsis; overflow-x: hidden; } - - .icon-reply { - // mirror the icon - transform: scaleX(-1); - } } & .reply-to-popover, diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js index df095de3..a6f79d76 100644 --- a/src/components/status_content/status_content.js +++ b/src/components/status_content/status_content.js @@ -7,6 +7,24 @@ import fileType from 'src/services/file_type/file_type.service' import { processHtml } from 'src/services/tiny_post_html_processor/tiny_post_html_processor.service.js' import { mentionMatchesUrl, extractTagFromUrl } from 'src/services/matcher/matcher.service.js' import { mapGetters, mapState } from 'vuex' +import { library } from '@fortawesome/fontawesome-svg-core' +import { + faCircleNotch, + faFile, + faMusic, + faImage, + faLink, + faPollH +} from '@fortawesome/free-solid-svg-icons' + +library.add( + faCircleNotch, + faFile, + faMusic, + faImage, + faLink, + faPollH +) const StatusContent = { name: 'StatusContent', diff --git a/src/components/status_content/status_content.vue b/src/components/status_content/status_content.vue index f7fb5ee2..321cd477 100644 --- a/src/components/status_content/status_content.vue +++ b/src/components/status_content/status_content.vue @@ -55,29 +55,29 @@ @click.prevent="toggleShowMore" > {{ $t("status.show_content") }} - - - - - - $store.dispatch('fetchFollowers', props.userId), diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue index b26499b4..f1f51840 100644 --- a/src/components/user_profile/user_profile.vue +++ b/src/components/user_profile/user_profile.vue @@ -122,9 +122,10 @@
{{ error }} -
@@ -142,6 +143,7 @@ .user-profile-fields { margin: 0 0.5em; + img { object-fit: contain; vertical-align: middle; -- cgit v1.2.3-70-g09d2 From f561e755530063b2e8e0db210264b1d244543bd0 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Wed, 21 Oct 2020 00:31:16 +0300 Subject: lint --- src/App.vue | 17 +++-- src/components/account_actions/account_actions.vue | 5 +- src/components/attachment/attachment.vue | 6 +- src/components/chat/chat.vue | 5 +- src/components/chat_new/chat_new.vue | 11 ++- src/components/chat_panel/chat_panel.vue | 5 +- src/components/emoji_picker/emoji_picker.vue | 10 ++- src/components/exporter/exporter.vue | 6 +- src/components/extra_buttons/extra_buttons.js | 2 +- src/components/extra_buttons/extra_buttons.vue | 48 ++++++++++--- src/components/font_control/font_control.vue | 5 +- .../global_notice_list/global_notice_list.vue | 3 +- src/components/image_cropper/image_cropper.vue | 3 +- .../interface_language_switcher.vue | 5 +- src/components/login_form/login_form.vue | 3 +- src/components/media_modal/media_modal.vue | 10 ++- src/components/mfa_form/recovery_form.vue | 3 +- src/components/mobile_nav/mobile_nav.vue | 18 ++++- src/components/nav_panel/nav_panel.vue | 35 +++++++-- src/components/notification/notification.vue | 33 +++++++-- src/components/notifications/notifications.vue | 6 +- src/components/panel_loading/panel_loading.vue | 6 +- src/components/poll/poll_form.vue | 15 +++- .../post_status_form/post_status_form.vue | 12 ++-- src/components/retweet_button/retweet_button.vue | 18 ++--- src/components/scope_selector/scope_selector.vue | 36 +++++++--- src/components/search/search.vue | 6 +- src/components/search_bar/search_bar.vue | 12 ++-- .../settings_modal/tabs/filtering_tab.vue | 5 +- src/components/settings_modal/tabs/general_tab.vue | 10 ++- src/components/settings_modal/tabs/profile_tab.vue | 12 ++-- .../settings_modal/tabs/theme_tab/preview.vue | 12 ++-- .../settings_modal/tabs/theme_tab/theme_tab.vue | 10 ++- src/components/shadow_control/shadow_control.vue | 25 +++++-- src/components/side_drawer/side_drawer.vue | 84 ++++++++++++++++++---- src/components/status/status.vue | 44 +++++++++--- src/components/status_popover/status_popover.vue | 6 +- src/components/timeline/timeline.vue | 6 +- src/components/timeline_menu/timeline_menu.vue | 40 +++++++++-- src/components/user_card/user_card.vue | 33 +++++++-- .../user_list_popover/user_list_popover.vue | 6 +- 41 files changed, 497 insertions(+), 140 deletions(-) (limited to 'src/components/poll/poll_form.vue') diff --git a/src/App.vue b/src/App.vue index 5efaf717..c27f51bf 100644 --- a/src/App.vue +++ b/src/App.vue @@ -54,7 +54,8 @@ @@ -64,9 +65,10 @@ class="mobile-hidden nav-icon" target="_blank" > diff --git a/src/components/account_actions/account_actions.vue b/src/components/account_actions/account_actions.vue index 61099d4f..e3ae376e 100644 --- a/src/components/account_actions/account_actions.vue +++ b/src/components/account_actions/account_actions.vue @@ -63,7 +63,10 @@ slot="trigger" class="btn btn-default ellipsis-button" > - + diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue index 0b7a3f9c..f1fac2c8 100644 --- a/src/components/attachment/attachment.vue +++ b/src/components/attachment/attachment.vue @@ -38,7 +38,8 @@ >
diff --git a/src/components/chat/chat.vue b/src/components/chat/chat.vue index 0670f1ac..5f58b9a6 100644 --- a/src/components/chat/chat.vue +++ b/src/components/chat/chat.vue @@ -14,7 +14,10 @@ class="go-back-button" @click="goBack" > - +
- +
- +
- + {{ $t('shoutbox.title') }}
diff --git a/src/components/emoji_picker/emoji_picker.vue b/src/components/emoji_picker/emoji_picker.vue index bd093c99..3262a3d9 100644 --- a/src/components/emoji_picker/emoji_picker.vue +++ b/src/components/emoji_picker/emoji_picker.vue @@ -13,7 +13,10 @@ :title="group.text" @click.prevent="highlight(group.id)" > - + - +
diff --git a/src/components/exporter/exporter.vue b/src/components/exporter/exporter.vue index 156db9a3..ecd71bf1 100644 --- a/src/components/exporter/exporter.vue +++ b/src/components/exporter/exporter.vue @@ -1,7 +1,11 @@ diff --git a/src/components/login_form/login_form.vue b/src/components/login_form/login_form.vue index f6b767a2..4ab5d192 100644 --- a/src/components/login_form/login_form.vue +++ b/src/components/login_form/login_form.vue @@ -77,7 +77,8 @@
{{ error }}
diff --git a/src/components/media_modal/media_modal.vue b/src/components/media_modal/media_modal.vue index cbcfc6d2..ea7f7a7f 100644 --- a/src/components/media_modal/media_modal.vue +++ b/src/components/media_modal/media_modal.vue @@ -34,7 +34,10 @@ class="modal-view-button-arrow modal-view-button-arrow--prev" @click.stop.prevent="goPrev" > - + diff --git a/src/components/mfa_form/recovery_form.vue b/src/components/mfa_form/recovery_form.vue index 61dbda24..f6526d2a 100644 --- a/src/components/mfa_form/recovery_form.vue +++ b/src/components/mfa_form/recovery_form.vue @@ -55,7 +55,8 @@
{{ error }}
diff --git a/src/components/mobile_nav/mobile_nav.vue b/src/components/mobile_nav/mobile_nav.vue index 4d91af77..db9b0ba0 100644 --- a/src/components/mobile_nav/mobile_nav.vue +++ b/src/components/mobile_nav/mobile_nav.vue @@ -15,7 +15,11 @@ class="mobile-nav-button" @click.stop.prevent="toggleMobileSidebar()" > - +
- +
- +
- + {{ $t("nav.timelines") }}
  • - + {{ $t("nav.interactions") }}
    • @@ -25,13 +35,23 @@ > {{ unreadChatCount }}
    - + {{ $t("nav.chats") }}
  • - + {{ $t("nav.friend_requests") }}
  • - {{ $t("nav.about") }} + {{ $t("nav.about") }}
    • diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue index 857727a4..b609ae04 100644 --- a/src/components/notification/notification.vue +++ b/src/components/notification/notification.vue @@ -18,7 +18,10 @@ href="#" class="unmute" @click.prevent="toggleMute" - > + >
    {{ notification.from_profile.name }} - + {{ $t('notifications.favorited_you') }} {{ $t('notifications.repeated_you') }} - + {{ $t('notifications.followed_you') }} - + {{ $t('notifications.follow_request') }} - + {{ $t('notifications.migrated_to') }} @@ -120,7 +136,10 @@ v-if="needMute" href="#" @click.prevent="toggleMute" - > + >
    - +
    diff --git a/src/components/panel_loading/panel_loading.vue b/src/components/panel_loading/panel_loading.vue index 9bf3ab32..b15e7d38 100644 --- a/src/components/panel_loading/panel_loading.vue +++ b/src/components/panel_loading/panel_loading.vue @@ -1,7 +1,11 @@ @@ -61,7 +65,10 @@ v-if="showPinned" class="pin" > - + {{ $t('status.pinned') }}
    - + > + - + - + - +
    @@ -230,7 +253,7 @@ icon="reply" size="lg" flip="horizontal" - /> + /> @@ -358,7 +381,6 @@ @onSuccess="clearError" /> -
    - +
    diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue index ab17cbbc..aaf0349c 100644 --- a/src/components/timeline/timeline.vue +++ b/src/components/timeline/timeline.vue @@ -92,7 +92,11 @@ v-else class="new-status-notification text-center panel-footer" > - + diff --git a/src/components/timeline_menu/timeline_menu.vue b/src/components/timeline_menu/timeline_menu.vue index 1e546fae..8099ddd5 100644 --- a/src/components/timeline_menu/timeline_menu.vue +++ b/src/components/timeline_menu/timeline_menu.vue @@ -16,27 +16,52 @@
    • - {{ $t("nav.timeline") }} + {{ $t("nav.timeline") }}
    • - {{ $t("nav.bookmarks") }} + {{ $t("nav.bookmarks") }}
    • - {{ $t("nav.dms") }} + {{ $t("nav.dms") }}
    • - {{ $t("nav.public_tl") }} + {{ $t("nav.public_tl") }}
    • - {{ $t("nav.twkn") }} + {{ $t("nav.twkn") }}
    @@ -46,7 +71,10 @@ class="title timeline-menu-title" > {{ timelineName() }} - + diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue index 6c35c781..c5f10b75 100644 --- a/src/components/user_card/user_card.vue +++ b/src/components/user_card/user_card.vue @@ -21,7 +21,11 @@ :user="user" /> - + - + Striped bg - + @@ -162,8 +176,15 @@ :title="$t('user_card.unsubscribe')" > - - + + diff --git a/src/components/user_list_popover/user_list_popover.vue b/src/components/user_list_popover/user_list_popover.vue index dd6977d2..95673733 100644 --- a/src/components/user_list_popover/user_list_popover.vue +++ b/src/components/user_list_popover/user_list_popover.vue @@ -31,7 +31,11 @@
    - +
    -- cgit v1.2.3-70-g09d2