diff --git a/webapp/components/DateTimeRange/DateTimeRange.vue b/webapp/components/DateTimeRange/DateTimeRange.vue
index de9b442c5..726eb1823 100644
--- a/webapp/components/DateTimeRange/DateTimeRange.vue
+++ b/webapp/components/DateTimeRange/DateTimeRange.vue
@@ -1,6 +1,6 @@
 <template>
   <ds-text class="date-time-range" align="left" color="soft" :size="size">
-    <div>
+    <div class="date-time-row">
       <div>
         <base-icon name="calendar" data-test="calendar" />
         {{ getStartDateString }}
@@ -14,8 +14,8 @@
       </div>
     </div>
     <template v-if="!isSameDayLocal">
-      &nbsp;&mdash;&nbsp;
-      <div>
+      <base-icon name="arrow-down" />
+      <div class="ds-flex date-time-row">
         <div>
           <base-icon name="calendar" data-test="calendar" />
           {{ getEndDateString }}
@@ -69,11 +69,7 @@ export default {
       return !this.endDateAsDate || isSameYear(this.endDateAsDate, this.startDateAsDate)
     },
     getStartDateString() {
-      let startDateFormat = this.$t('components.dateTimeRange.yearMonthDay')
-      if (!this.isSameDayLocal && this.isSameYearLocal) {
-        startDateFormat = this.$t('components.dateTimeRange.monthDay')
-      }
-      return format(this.startDateAsDate, startDateFormat)
+      return format(this.startDateAsDate, this.$t('components.dateTimeRange.yearMonthDay'))
     },
     getStartTimeString() {
       return format(new Date(this.startDate), this.$t('components.dateTimeRange.hourMinute'))
@@ -95,7 +91,12 @@ export default {
 <style lang="scss">
 .date-time-range {
   display: flex;
-  align-items: center;
+  flex-direction: column;
   gap: 2px;
+
+  .date-time-row {
+    display: flex;
+    gap: 10px;
+  }
 }
 </style>
diff --git a/webapp/components/PostTeaser/PostTeaser.vue b/webapp/components/PostTeaser/PostTeaser.vue
index d852d9e23..7a8fe8c35 100644
--- a/webapp/components/PostTeaser/PostTeaser.vue
+++ b/webapp/components/PostTeaser/PostTeaser.vue
@@ -16,7 +16,8 @@
       </template>
       <client-only>
         <div class="post-user-row">
-          <user-teaser :user="post.author" :group="post.group" :date-time="post.createdAt" />
+          <!-- <user-teaser :user="post.author" :group="post.group" :date-time="post.createdAt" /> -->
+          <user-teaser :user="post.author" :group="post.group" />
           <hc-ribbon
             :class="[isPinned ? '--pinned' : '', post.image ? 'post-ribbon-w-img' : 'post-ribbon']"
             :text="ribbonText"
@@ -32,14 +33,14 @@
       >
         <location-teaser
           class="event-info"
-          size="small"
+          size="base"
           :venue="post.eventVenue"
           :locationName="post.eventLocationName"
           :isOnline="post.eventIsOnline"
         />
         <date-time-range
           class="event-info"
-          size="small"
+          size="base"
           :startDate="post.eventStart"
           :endDate="post.eventEnd"
         />
@@ -98,6 +99,12 @@
           />
         </client-only>
       </footer>
+      <div class="date-row">
+        <span class="text">
+          <relative-date-time :date-time="post.createdAt" />
+          <slot name="dateTime"></slot>
+        </span>
+      </div>
     </base-card>
   </nuxt-link>
 </template>
@@ -109,6 +116,7 @@ import CounterIcon from '~/components/_new/generic/CounterIcon/CounterIcon'
 import DateTimeRange from '~/components/DateTimeRange/DateTimeRange'
 import HcRibbon from '~/components/Ribbon'
 import LocationTeaser from '~/components/LocationTeaser/LocationTeaser'
+import RelativeDateTime from '~/components/RelativeDateTime'
 import UserTeaser from '~/components/UserTeaser/UserTeaser'
 import { mapGetters } from 'vuex'
 import PostMutations from '~/graphql/PostMutations'
@@ -123,6 +131,7 @@ export default {
     DateTimeRange,
     HcRibbon,
     LocationTeaser,
+    RelativeDateTime,
     UserTeaser,
   },
   props: {
@@ -251,6 +260,7 @@ export default {
   flex-direction: column;
   overflow: visible;
   height: 100%;
+  padding-bottom: $space-x-small;
 
   > .hero-image {
     border-top-left-radius: 5px;
@@ -266,12 +276,6 @@ export default {
     margin-bottom: $space-small;
   }
 
-  & .event-info {
-    display: flex;
-    align-items: center;
-    gap: 2px;
-  }
-
   > .footer {
     display: flex;
     justify-content: space-between;
@@ -301,5 +305,21 @@ export default {
   .user-teaser {
     margin-bottom: $space-small;
   }
+  > .date-row {
+    display: flex;
+    justify-content: end;
+    margin-top: $space-small;
+    > .text {
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      color: $text-color-soft;
+      font-size: $font-size-small;
+
+      > .ds-text {
+        display: inline;
+      }
+    }
+  }
 }
 </style>
diff --git a/webapp/components/UserTeaser/UserTeaser.vue b/webapp/components/UserTeaser/UserTeaser.vue
index a82b91039..d4e70b653 100644
--- a/webapp/components/UserTeaser/UserTeaser.vue
+++ b/webapp/components/UserTeaser/UserTeaser.vue
@@ -14,12 +14,12 @@
           <nuxt-link v-if="linkToProfile" :to="userLink">
             <span class="text">
               <span class="slug">{{ userSlug }}</span>
-              <span v-if="!userOnly" class="name">{{ userName }}</span>
+              <span class="name">{{ userName }}</span>
             </span>
           </nuxt-link>
           <span v-else class="text">
             <span class="slug">{{ userSlug }}</span>
-            <span v-if="!userOnly" class="name">{{ userName }}</span>
+            <span class="name">{{ userName }}</span>
           </span>
           <span v-if="wide">&nbsp;</span>
           <span v-if="group">
@@ -34,12 +34,11 @@
             </nuxt-link>
           </span>
         </div>
-        <span v-if="!userOnly" class="text">
+        <span v-if="!userOnly && dateTime" class="text">
           <base-icon name="clock" />
           <relative-date-time :date-time="dateTime" />
           <slot name="dateTime"></slot>
         </span>
-        <span v-else class="text">{{ userName }}</span>
       </div>
     </div>
   </div>