diff --git a/com/static/bundled/com/components/upcoming-news-loader-index.ts b/com/static/bundled/com/components/upcoming-news-loader-index.ts
index ccc1e714..2bda7fba 100644
--- a/com/static/bundled/com/components/upcoming-news-loader-index.ts
+++ b/com/static/bundled/com/components/upcoming-news-loader-index.ts
@@ -8,13 +8,17 @@ interface ParsedNewsDateSchema extends Omit<NewsDateSchema, "start_date" | "end_
 }
 
 document.addEventListener("alpine:init", () => {
-  Alpine.data("upcomingNewsLoader", (startDate: Date) => ({
+  Alpine.data("upcomingNewsLoader", (startDate: Date, locale: string) => ({
     startDate: startDate,
     currentPage: 1,
     pageSize: 6,
     hasNext: true,
     loading: false,
     newsDates: [] as NewsDateSchema[],
+    dateFormat: new Intl.DateTimeFormat(locale, {
+      dateStyle: "medium",
+      timeStyle: "short",
+    }),
 
     async loadMore() {
       this.loading = true;
diff --git a/com/templates/com/news_list.jinja b/com/templates/com/news_list.jinja
index e9ff641a..e4b31e26 100644
--- a/com/templates/com/news_list.jinja
+++ b/com/templates/com/news_list.jinja
@@ -84,11 +84,11 @@
                           <a href="{{ date.news.club.get_absolute_url() }}">{{ date.news.club }}</a>
                           <div class="news_date">
                             <time datetime="{{ date.start_date.isoformat(timespec="seconds") }}">
-                              {{ date.start_date|localtime|date(DATETIME_FORMAT) }}
+                              {{ date.start_date|localtime|date(DATETIME_FORMAT) }},
                               {{ date.start_date|localtime|time(DATETIME_FORMAT) }}
                             </time> -
                             <time datetime="{{ date.end_date.isoformat(timespec="seconds") }}">
-                              {{ date.end_date|localtime|date(DATETIME_FORMAT) }}
+                              {{ date.end_date|localtime|date(DATETIME_FORMAT) }},
                               {{ date.end_date|localtime|time(DATETIME_FORMAT) }}
                             </time>
                           </div>
@@ -103,7 +103,7 @@
               </div>
             </div>
           {% endfor %}
-          <div x-data="upcomingNewsLoader(new Date('{{ last_day + timedelta(days=1) }}'))">
+          <div x-data="upcomingNewsLoader(new Date('{{ last_day + timedelta(days=1) }}'), '{{ get_language() }}')">
             <template x-for="newsList in Object.values(groupedDates())">
               <div class="news_events_group">
                 <div class="news_events_group_date">
@@ -139,11 +139,11 @@
                             <div class="news_date">
                               <time
                                 :datetime="newsDate.start_date.toISOString()"
-                                x-text="`${newsDate.start_date.getHours()}:${newsDate.start_date.getMinutes()}`"
+                                x-text="dateFormat.format(newsDate.start_date)"
                               ></time> -
                               <time
                                 :datetime="newsDate.end_date.toISOString()"
-                                x-text="`${newsDate.end_date.getHours()}:${newsDate.end_date.getMinutes()}`"
+                                x-text="dateFormat.format(newsDate.end_date)"
                               ></time>
                             </div>
                           </div>