diff --git a/js/src/components/Event/EventCard.vue b/js/src/components/Event/EventCard.vue index a2f9f12c9..3576c59b5 100644 --- a/js/src/components/Event/EventCard.vue +++ b/js/src/components/Event/EventCard.vue @@ -39,34 +39,36 @@ />
-

{{ event.title }}

-
-
{{ event.title }} +
+
+
+ +
+ + + {{ organizerDisplayName(event) }} + +
+ +
- -
- - - {{ organizerDisplayName(event) }} - -
- -
- - {{ $t("Online") }} + + {{ $t("Online") }} +
@@ -201,12 +203,14 @@ a.card { } .card-content { + height: 100%; padding: 0.5rem; & > .media { position: relative; display: flex; flex-direction: column; + height: 100%; & > .media-left { margin-top: -15px; @@ -222,6 +226,9 @@ a.card { flex: 1; width: 100%; overflow-x: inherit; + display: flex; + flex-direction: column; + justify-content: space-between; } } diff --git a/js/src/components/Event/MultiCard.vue b/js/src/components/Event/MultiCard.vue index 3eca7f19c..5a9c75e8c 100644 --- a/js/src/components/Event/MultiCard.vue +++ b/js/src/components/Event/MultiCard.vue @@ -27,9 +27,9 @@ export default class MultiCard extends Vue { .multi-card-event { display: grid; grid-auto-rows: 1fr; - grid-column-gap: 30px; + grid-column-gap: 20px; grid-row-gap: 30px; - grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); + grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); .event-card { height: 100%; display: flex; diff --git a/js/src/components/Group/GroupCard.vue b/js/src/components/Group/GroupCard.vue index 3300a00d7..a94d43d93 100644 --- a/js/src/components/Group/GroupCard.vue +++ b/js/src/components/Group/GroupCard.vue @@ -15,7 +15,7 @@
-
+
@@ -24,12 +24,12 @@

{{ displayName(group) }}

- + {{ `@${usernameWithDomain(group)}` }}
-
+