diff --git a/docker/production/Dockerfile b/docker/production/Dockerfile index 3aaa41b1..6f0f36d9 100644 --- a/docker/production/Dockerfile +++ b/docker/production/Dockerfile @@ -2,8 +2,9 @@ FROM node:16-alpine as assets RUN apk add --no-cache python3 build-base libwebp-tools bash imagemagick ncurses - +WORKDIR /build COPY js . +RUN ls -a RUN yarn install \ && yarn run build @@ -24,7 +25,7 @@ COPY config/config.exs config/prod.exs ./config/ COPY config/docker.exs ./config/runtime.exs COPY rel ./rel COPY support ./support -COPY --from=assets ./priv/static ./priv/static +COPY --from=assets ./build/priv/static ./priv/static RUN mix phx.digest \ && mix release diff --git a/js/package.json b/js/package.json index 06c8c2d3..cafffcbc 100644 --- a/js/package.json +++ b/js/package.json @@ -73,14 +73,14 @@ "@types/vuedraggable": "^2.23.0", "@typescript-eslint/eslint-plugin": "^4.18.0", "@typescript-eslint/parser": "^4.18.0", - "@vue/cli-plugin-babel": "~5.0.0-beta.0", - "@vue/cli-plugin-e2e-cypress": "~5.0.0-beta.0", - "@vue/cli-plugin-eslint": "~5.0.0-beta.0", - "@vue/cli-plugin-pwa": "~5.0.0-beta.0", - "@vue/cli-plugin-router": "~5.0.0-beta.0", - "@vue/cli-plugin-typescript": "~5.0.0-beta.0", - "@vue/cli-plugin-unit-jest": "~5.0.0-beta.0", - "@vue/cli-service": "~5.0.0-beta.0", + "@vue/cli-plugin-babel": "~5.0.0-beta.2", + "@vue/cli-plugin-e2e-cypress": "~5.0.0-beta.2", + "@vue/cli-plugin-eslint": "~5.0.0-beta.2", + "@vue/cli-plugin-pwa": "~5.0.0-beta.2", + "@vue/cli-plugin-router": "~5.0.0-beta.2", + "@vue/cli-plugin-typescript": "~5.0.0-beta.2", + "@vue/cli-plugin-unit-jest": "~5.0.0-beta.2", + "@vue/cli-service": "~5.0.0-beta.2", "@vue/eslint-config-prettier": "^6.0.0", "@vue/eslint-config-typescript": "^7.0.0", "@vue/test-utils": "^1.1.0", diff --git a/js/src/components/Account/ActorInline.vue b/js/src/components/Account/ActorInline.vue new file mode 100644 index 00000000..3fa9af53 --- /dev/null +++ b/js/src/components/Account/ActorInline.vue @@ -0,0 +1,48 @@ + + + diff --git a/js/src/components/Activity/DiscussionActivityItem.vue b/js/src/components/Activity/DiscussionActivityItem.vue index c05c145f..036ef128 100644 --- a/js/src/components/Activity/DiscussionActivityItem.vue +++ b/js/src/components/Activity/DiscussionActivityItem.vue @@ -41,7 +41,7 @@ > - {{ + {{ activity.insertedAt | formatTimeString }} diff --git a/js/src/components/Activity/EventActivityItem.vue b/js/src/components/Activity/EventActivityItem.vue index 573ee11a..8fd38305 100644 --- a/js/src/components/Activity/EventActivityItem.vue +++ b/js/src/components/Activity/EventActivityItem.vue @@ -27,7 +27,7 @@ > - {{ + {{ activity.insertedAt | formatTimeString }} diff --git a/js/src/components/Activity/GroupActivityItem.vue b/js/src/components/Activity/GroupActivityItem.vue index d54bf896..ba8d0d19 100644 --- a/js/src/components/Activity/GroupActivityItem.vue +++ b/js/src/components/Activity/GroupActivityItem.vue @@ -34,7 +34,7 @@ v-for="detail in details" :key="detail" tag="p" - class="has-text-grey" + class="has-text-grey-dark" > - {{ + {{ activity.insertedAt | formatTimeString }} diff --git a/js/src/components/Activity/MemberActivityItem.vue b/js/src/components/Activity/MemberActivityItem.vue index c03c21b9..3434c4df 100644 --- a/js/src/components/Activity/MemberActivityItem.vue +++ b/js/src/components/Activity/MemberActivityItem.vue @@ -34,7 +34,7 @@ > - {{ + {{ activity.insertedAt | formatTimeString }} diff --git a/js/src/components/Activity/PostActivityItem.vue b/js/src/components/Activity/PostActivityItem.vue index a2a5a650..07597f7c 100644 --- a/js/src/components/Activity/PostActivityItem.vue +++ b/js/src/components/Activity/PostActivityItem.vue @@ -27,7 +27,7 @@ > - {{ + {{ activity.insertedAt | formatTimeString }} diff --git a/js/src/components/Activity/ResourceActivityItem.vue b/js/src/components/Activity/ResourceActivityItem.vue index d9de2c24..f546571b 100644 --- a/js/src/components/Activity/ResourceActivityItem.vue +++ b/js/src/components/Activity/ResourceActivityItem.vue @@ -37,7 +37,7 @@ > - {{ + {{ activity.insertedAt | formatTimeString }} diff --git a/js/src/components/Discussion/DiscussionListItem.vue b/js/src/components/Discussion/DiscussionListItem.vue index 11d8acbd..c8efe750 100644 --- a/js/src/components/Discussion/DiscussionListItem.vue +++ b/js/src/components/Discussion/DiscussionListItem.vue @@ -32,10 +32,10 @@ }} -
+
{{ htmlTextEllipsis }}
-
+
{{ $t("[This comment has been deleted]") }}
@@ -98,10 +98,9 @@ export default class DiscussionListItem extends Vue { .discussion-minimalist-title { color: #3c376e; - font-family: "Liberation Sans", "Helvetica Neue", Roboto, Helvetica, - Arial, serif; - font-size: 1.25rem; - font-weight: 700; + font-family: Roboto, Helvetica, Arial, serif; + font-size: 16px; + font-weight: 500; flex: 1; } } diff --git a/js/src/components/Group/GroupMemberCard.vue b/js/src/components/Group/GroupMemberCard.vue index 784f6fc1..1bc330e8 100644 --- a/js/src/components/Group/GroupMemberCard.vue +++ b/js/src/components/Group/GroupMemberCard.vue @@ -99,7 +99,9 @@ export default class GroupMemberCard extends Vue { } .media-content { - overflow: hidden; + ::v-deep .tags { + margin-bottom: 0; + } } } diff --git a/js/src/components/Group/GroupSection.vue b/js/src/components/Group/GroupSection.vue index 5ecdf1f4..8b75de6b 100644 --- a/js/src/components/Group/GroupSection.vue +++ b/js/src/components/Group/GroupSection.vue @@ -55,20 +55,21 @@ section { } div.group-section-title { + --title-color: $violet-2; display: flex; align-items: stretch; background: $secondary; - color: #3a384c; + color: var(--title-color); &.privateSection { - color: $violet-2; - background: $purple-2; + color: $purple-3; + background: $violet-2; } ::v-deep & > a { align-self: center; margin-right: 5px; - color: $orange-3; + color: var(--title-color); } h2 { diff --git a/js/src/components/Group/JoinGroupWithAccount.vue b/js/src/components/Group/JoinGroupWithAccount.vue index 85b51bae..33dfe696 100644 --- a/js/src/components/Group/JoinGroupWithAccount.vue +++ b/js/src/components/Group/JoinGroupWithAccount.vue @@ -30,6 +30,17 @@ import { IGroup } from "@/types/actor"; }, }, }, + metaInfo() { + return { + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + title: this.$t("Join group {group}", { + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + group: this.groupTitle, + }) as string, + }; + }, }) export default class JoinGroupWithAccount extends Vue { @Prop({ type: String, required: true }) preferredUsername!: string; @@ -40,6 +51,10 @@ export default class JoinGroupWithAccount extends Vue { return this.group?.url; } + get groupTitle(): undefined | string { + return this.group?.name || this.group?.preferredUsername; + } + sentence = this.$t( "We will redirect you to your instance in order to interact with this group" ); diff --git a/js/src/components/Group/ShareGroupModal.vue b/js/src/components/Group/ShareGroupModal.vue new file mode 100644 index 00000000..132f4a05 --- /dev/null +++ b/js/src/components/Group/ShareGroupModal.vue @@ -0,0 +1,138 @@ + + + + diff --git a/js/src/components/Image/LazyImageWrapper.vue b/js/src/components/Image/LazyImageWrapper.vue index 7c27f44b..2c6f8a54 100644 --- a/js/src/components/Image/LazyImageWrapper.vue +++ b/js/src/components/Image/LazyImageWrapper.vue @@ -12,27 +12,38 @@ import { IMedia } from "@/types/media.model"; import { Component, Prop, Vue } from "vue-property-decorator"; import LazyImage from "../Image/LazyImage.vue"; +const DEFAULT_CARD_URL = "/img/mobilizon_default_card.png"; +const DEFAULT_BLURHASH = "MCHKI4El-P-U}+={R-WWoes,Iu-P=?R,xD"; +const DEFAULT_WIDTH = 630; +const DEFAULT_HEIGHT = 350; +const DEFAULT_PICTURE = { + url: DEFAULT_CARD_URL, + metadata: { + width: DEFAULT_WIDTH, + height: DEFAULT_HEIGHT, + blurhash: DEFAULT_BLURHASH, + }, +}; + @Component({ components: { LazyImage, }, }) export default class LazyImageWrapper extends Vue { - @Prop({ required: true, default: null }) - picture!: IMedia | null; + @Prop({ required: true }) + picture!: IMedia; get pictureOrDefault(): Partial { + if (this.picture === null) { + return DEFAULT_PICTURE; + } return { - url: - this?.picture === null - ? "/img/mobilizon_default_card.png" - : this?.picture?.url, + url: this?.picture?.url, metadata: { - width: this?.picture?.metadata?.width || 630, - height: this?.picture?.metadata?.height || 350, - blurhash: - this?.picture?.metadata?.blurhash || - "MCHKI4El-P-U}+={R-WWoes,Iu-P=?R,xD", + width: this?.picture?.metadata?.width, + height: this?.picture?.metadata?.height, + blurhash: this?.picture?.metadata?.blurhash, }, }; } diff --git a/js/src/components/NavBar.vue b/js/src/components/NavBar.vue index 1d6cda13..938e9025 100644 --- a/js/src/components/NavBar.vue +++ b/js/src/components/NavBar.vue @@ -112,7 +112,12 @@
- +
@@ -133,11 +138,6 @@ :to="{ name: RouteName.UPDATE_IDENTITY }" >{{ $t("My account") }} - - - - -

{{ post.title }}

- {{ + {{ formatDistanceToNow(new Date(post.publishAt || post.insertedAt), { locale: $dateFnsLocale, addSuffix: true, @@ -43,10 +43,9 @@ export default class PostListItem extends Vue { .post-minimalist-title { color: #3c376e; - font-family: "Liberation Sans", "Helvetica Neue", Roboto, Helvetica, Arial, - serif; - font-size: 1rem; - font-weight: 700; + font-family: Roboto, Helvetica, Arial, serif; + font-size: 16px; + font-weight: 500; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; diff --git a/js/src/components/Resource/ResourceItem.vue b/js/src/components/Resource/ResourceItem.vue index bdd2c0ea..6099a10a 100644 --- a/js/src/components/Resource/ResourceItem.vue +++ b/js/src/components/Resource/ResourceItem.vue @@ -23,6 +23,7 @@
@@ -31,7 +32,8 @@