aboutsummaryrefslogtreecommitdiff
path: root/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/components')
-rw-r--r--src/components/attachment/attachment.vue11
-rw-r--r--src/components/post_status_form/post_status_form.vue3
-rw-r--r--src/components/style_switcher/style_switcher.js9
-rw-r--r--src/components/user_card/user_card.vue7
-rw-r--r--src/components/user_card_content/user_card_content.js64
-rw-r--r--src/components/user_card_content/user_card_content.vue65
6 files changed, 83 insertions, 76 deletions
diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue
index 20d10cce..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;
@@ -82,9 +89,7 @@
img.media-upload {
margin-bottom: -2px;
max-height: 300px;
- width: 100%;
- height: 100%;
- flex: 1;
+ max-width: 100%;
}
.oembed {
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index d0210286..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 @@
<i class="icon-cancel" @click="clearError"></i>
</div>
<div class="attachments">
- <div class="attachment base03-border" v-for="file in newStatus.files">
+ <div class="media-upload-container attachment base03-border" v-for="file in newStatus.files">
<i class="fa icon-cancel" @click="removeMediaFile(file)"></i>
<img class="thumbnail media-upload" :src="file.image" v-if="type(file) === 'image'"></img>
<video v-if="type(file) === 'video'" :src="file.image" controls></video>
@@ -40,6 +40,7 @@
<script src="./post_status_form.js"></script>
<style lang="scss">
+
.tribute-container {
ul {
padding: 0px;
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/user_card.vue b/src/components/user_card/user_card.vue
index ba315faa..6c150a7a 100644
--- a/src/components/user_card/user_card.vue
+++ b/src/components/user_card/user_card.vue
@@ -63,9 +63,14 @@
width: -moz-webkit-fill-available;
stretch: fill;
margin: 0.2em 0 0.7em 0;
- border-radius: 5px;
+ border-radius: 10px;
border-style: solid;
border-color: inherit;
border-width: 1px;
+ overflow: hidden;
+
+ p {
+ margin-bottom: 0;
+ }
}
</style>
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..4c40c55f 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 @@
</div>
</template>
-<script>
- export default {
- props: [ 'user', 'switcher' ],
- computed: {
- headingStyle () {
- let color = this.$store.state.config.colors['base00']
- if (color) {
- let rgb = this.$store.state.config.colors['base00'].match(/\d+/g)
- 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 })
- }
- }
- }
-</script>
+<script src="./user_card_content.js"></script>
<style lang="scss">
@import '../../_variables.scss';
@@ -164,7 +102,6 @@
.profile-panel-body {
top: -0em;
padding-top: 4em;
-
word-wrap: break-word;
}
generated by cgit v1.2.3-70-g09d2 (git 2.49.0) at 2025-11-17 03:54:04 +0000