diff --git a/src/components/ActivityGroup.vue b/src/components/ActivityGroup.vue
index 947cdf030..1ec273e91 100644
--- a/src/components/ActivityGroup.vue
+++ b/src/components/ActivityGroup.vue
@@ -4,7 +4,7 @@
 -->
 
 <template>
-	<Fragment>
+	<div class="activity-group">
 		<h2 class="activity-group__heading" :title="fullDate">
 			{{ dateText }}
 		</h2>
@@ -14,7 +14,7 @@
 				:activity="activity"
 				:show-previews="true" />
 		</ul>
-	</Fragment>
+	</div>
 </template>
 
 <script setup lang="ts">
@@ -24,7 +24,6 @@ import moment from '@nextcloud/moment'
 import Activity from './Activity.vue'
 
 import { translate as t } from '@nextcloud/l10n'
-import { Fragment } from 'vue-frag'
 import { computed } from 'vue'
 
 const props = defineProps<{
@@ -60,12 +59,8 @@ const fullDate = computed(() => {
 .activity-group {
 	&__heading {
 		line-height: 1.5;
-		margin-block: 30px 12px;
-
-		&:first-of-type {
-			// Already padding from h1
-			margin-block-start: 0;
-		}
+		// Left margin in line with text position
+		margin: 0 0 calc(var(--default-grid-baseline) * 3) 25px;
 	}
 }
 </style>
diff --git a/src/views/ActivityAppFeed.vue b/src/views/ActivityAppFeed.vue
index 886c9420b..0f871e59c 100644
--- a/src/views/ActivityAppFeed.vue
+++ b/src/views/ActivityAppFeed.vue
@@ -24,7 +24,9 @@
 			</template>
 		</NcEmptyContent>
 		<div ref="container" class="activity-app__container">
-			<ActivityGroup v-for="activities, date of groupedActivities" :key="date" :activities="activities" />
+			<div class="activity-app__groups-list">
+				<ActivityGroup v-for="activities, date of groupedActivities" :key="date" :activities="activities" />
+			</div>
 			<!-- Only show if not showing the inital empty content for loading -->
 			<NcLoadingIcon v-if="hasMoreActivites && allActivities.length > 0"
 				:name="t('activity', 'Loading more activities')"
@@ -194,6 +196,8 @@ watch(props, () => {
 	flex-direction: column;
 	overflow: hidden;
 
+	--app-navigation-toggle-offset: calc(2 * var(--app-navigation-padding, 8px) + var(--default-clickable-area));
+
 	&__empty-content {
 		height: 100%;
 	}
@@ -208,21 +212,25 @@ watch(props, () => {
 	&__container {
 		display: flex;
 		flex-direction: column;
-
 		height: 100%;
-		width: min(100%, 924px);
-		max-width: 924px;
-		margin: 0 auto;
-		padding-inline: 12px;
+		// Inline by headings without 25px icon
+		margin-inline-start: calc(var(--app-navigation-toggle-offset) - 25px);
+		padding-inline: 0 var(--default-clickable-area);
 		overflow-y: scroll;
 	}
 
 	&__heading {
 		font-weight: bold;
 		font-size: 20px;
-		line-height: 44px; // to align height with the app navigation toggle
-		// Align with app navigation toggle
-		margin: var(--app-navigation-padding, 8px) 0 0 calc(2 * var(--app-navigation-padding, 8px) + 44px);
+		line-height: var(--default-clickable-area);
+		margin: calc(var(--default-grid-baseline) * 2) 0 0 var(--app-navigation-toggle-offset);
+	}
+
+	&__groups-list {
+		display: flex;
+		flex-direction: column;
+		gap: 30px;
+		max-width: 924px;
 	}
 }
 </style>