From f6b2f6eaeed78ba4e4a6d12189b7d96474e54915 Mon Sep 17 00:00:00 2001 From: shpuld Date: Mon, 20 Nov 2017 22:45:09 +0200 Subject: [PATCH 1/3] Fix usercard from breaking with certain colors, clean up code structure a bit. --- .../style_switcher/style_switcher.js | 9 +-- .../user_card_content/user_card_content.js | 64 +++++++++++++++++++ .../user_card_content/user_card_content.vue | 64 +------------------ src/services/color_convert/color_convert.js | 34 ++++++++++ src/services/style_setter/style_setter.js | 22 +------ 5 files changed, 103 insertions(+), 90 deletions(-) create mode 100644 src/components/user_card_content/user_card_content.js create mode 100644 src/services/color_convert/color_convert.js diff --git a/src/components/style_switcher/style_switcher.js b/src/components/style_switcher/style_switcher.js index b1359d13..a762f914 100644 --- a/src/components/style_switcher/style_switcher.js +++ b/src/components/style_switcher/style_switcher.js @@ -1,3 +1,5 @@ +import { rgbstr2hex } from '../../services/color_convert/color_convert.js' + export default { data () { return { @@ -19,13 +21,6 @@ export default { }) }, mounted () { - const rgbstr2hex = (rgb) => { - if (rgb[0] === '#') { - return rgb - } - rgb = rgb.match(/\d+/g) - return `#${((Number(rgb[0]) << 16) + (Number(rgb[1]) << 8) + Number(rgb[2])).toString(16)}` - } this.bgColorLocal = rgbstr2hex(this.$store.state.config.colors['base00']) this.fgColorLocal = rgbstr2hex(this.$store.state.config.colors['base02']) this.textColorLocal = rgbstr2hex(this.$store.state.config.colors['base05']) diff --git a/src/components/user_card_content/user_card_content.js b/src/components/user_card_content/user_card_content.js new file mode 100644 index 00000000..6e67a321 --- /dev/null +++ b/src/components/user_card_content/user_card_content.js @@ -0,0 +1,64 @@ +import { hex2rgb } from '../../services/color_convert/color_convert.js' + +export default { + props: [ 'user', 'switcher' ], + computed: { + headingStyle () { + const color = this.$store.state.config.colors['base00'] + if (color) { + const rgb = hex2rgb(color) + console.log(rgb) + return { + backgroundColor: `rgb(${Math.floor(rgb[0] * 0.53)}, ${Math.floor(rgb[1] * 0.56)}, ${Math.floor(rgb[2] * 0.59)})`, + backgroundImage: `url(${this.user.cover_photo})` + } + } + }, + bodyStyle () { + return { + background: `linear-gradient(to bottom, rgba(0, 0, 0, 0), ${this.$store.state.config.colors['base00']} 80%)` + } + }, + isOtherUser () { + return this.user.id !== this.$store.state.users.currentUser.id + }, + loggedIn () { + return this.$store.state.users.currentUser + }, + dailyAvg () { + const days = Math.ceil((new Date() - new Date(this.user.created_at)) / (60 * 60 * 24 * 1000)) + return Math.round(this.user.statuses_count / days) + } + }, + methods: { + followUser () { + const store = this.$store + store.state.api.backendInteractor.followUser(this.user.id) + .then((followedUser) => store.commit('addNewUsers', [followedUser])) + }, + unfollowUser () { + const store = this.$store + store.state.api.backendInteractor.unfollowUser(this.user.id) + .then((unfollowedUser) => store.commit('addNewUsers', [unfollowedUser])) + }, + blockUser () { + const store = this.$store + store.state.api.backendInteractor.blockUser(this.user.id) + .then((blockedUser) => store.commit('addNewUsers', [blockedUser])) + }, + unblockUser () { + const store = this.$store + store.state.api.backendInteractor.unblockUser(this.user.id) + .then((unblockedUser) => store.commit('addNewUsers', [unblockedUser])) + }, + toggleMute () { + const store = this.$store + store.commit('setMuted', {user: this.user, muted: !this.user.muted}) + store.state.api.backendInteractor.setUserMute(this.user) + }, + setProfileView (v) { + const store = this.$store + store.commit('setProfileView', { v }) + } + } +} diff --git a/src/components/user_card_content/user_card_content.vue b/src/components/user_card_content/user_card_content.vue index 5635a177..d49a7d6c 100644 --- a/src/components/user_card_content/user_card_content.vue +++ b/src/components/user_card_content/user_card_content.vue @@ -84,69 +84,7 @@ - + diff --git a/src/components/user_card_content/user_card_content.vue b/src/components/user_card_content/user_card_content.vue index d49a7d6c..4c40c55f 100644 --- a/src/components/user_card_content/user_card_content.vue +++ b/src/components/user_card_content/user_card_content.vue @@ -102,7 +102,6 @@ .profile-panel-body { top: -0em; padding-top: 4em; - word-wrap: break-word; } From 4e07b89bcfb821afb65d39eb389bcb0b4de697c8 Mon Sep 17 00:00:00 2001 From: shpuld Date: Tue, 21 Nov 2017 10:52:09 +0200 Subject: [PATCH 3/3] not so \!important after all --- src/components/attachment/attachment.vue | 7 +++++++ src/components/post_status_form/post_status_form.vue | 7 +------ 2 files changed, 8 insertions(+), 6 deletions(-) diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue index 7a5923b4..57ff2625 100644 --- a/src/components/attachment/attachment.vue +++ b/src/components/attachment/attachment.vue @@ -34,6 +34,13 @@ display: flex; flex-wrap: wrap; margin-right: -0.7em; + + .attachment.media-upload-container { + flex: 0 0 auto; + max-height: 300px; + max-width: 100%; + } + .attachment { flex: 1 0 30%; margin: 0.5em 0.7em 0.6em 0.0em; diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue index a0000654..19a00aeb 100644 --- a/src/components/post_status_form/post_status_form.vue +++ b/src/components/post_status_form/post_status_form.vue @@ -25,7 +25,7 @@
-
+
@@ -40,11 +40,6 @@