diff --git a/public/js/components/Cis/Coodle/Coodle.js b/public/js/components/Cis/Coodle/Coodle.js
index d888f8dff..3b37a54a5 100644
--- a/public/js/components/Cis/Coodle/Coodle.js
+++ b/public/js/components/Cis/Coodle/Coodle.js
@@ -99,46 +99,48 @@ export default {
 	template: /*html*/ `
 	<div class="h-100 d-flex flex-column gap-2">
 		<h2 class="m-0">Coodle</h2>
-		<div class="d-flex flex-row gap-2 w-100 overflow-x-auto">
-			<div
-				@click="switchToTab('activeSurveysTable')"
-				:class="getTabStylingClass(view === 'activeSurveysTable')"
-				class="btn d-flex flex-row gap-2 align-items-center py-2"
-			>
-				<div>
-					<i class="fa-solid fa-person-booth fa-lg"></i>
+		<div>
+			<div class="d-flex flex-row gap-2 w-100 overflow-x-auto">
+				<div
+					@click="switchToTab('activeSurveysTable')"
+					:class="getTabStylingClass(view === 'activeSurveysTable')"
+					class="btn d-flex flex-row gap-2 align-items-center py-2"
+				>
+					<div>
+						<i class="fa-solid fa-person-booth fa-lg"></i>
+					</div>
+					<span class="text-nowrap">{{ "Active surveys" }}</span>
 				</div>
-				<span class="text-nowrap">{{ "Active surveys" }}</span>
-			</div>
-			<div
-				@click="switchToTab('pastSurveysTable')"
-				:class="getTabStylingClass(view === 'pastSurveysTable')"
-				class="btn d-flex flex-row gap-2 align-items-center py-2"
-			>
-				<div>
-					<i class="fa-solid fa-flag-checkered fa-lg"></i>
+				<div
+					@click="switchToTab('pastSurveysTable')"
+					:class="getTabStylingClass(view === 'pastSurveysTable')"
+					class="btn d-flex flex-row gap-2 align-items-center py-2"
+				>
+					<div>
+						<i class="fa-solid fa-flag-checkered fa-lg"></i>
+					</div>
+					<span class="text-nowrap">{{ "Past surveys" }}</span>
 				</div>
-				<span class="text-nowrap">{{ "Past surveys" }}</span>
-			</div>
-			<div
-				@click="switchToTab('survey')"
-				:class="getTabStylingClass(view === 'survey' && !survey?.id)"
-				class="btn d-flex flex-row gap-2 align-items-center py-2"
-			>
-				<div>
-					<i class="fa-solid fa-circle-plus fa-lg"></i>
+				<div
+					@click="switchToTab('survey')"
+					:class="getTabStylingClass(view === 'survey' && !survey?.id)"
+					class="btn d-flex flex-row gap-2 align-items-center py-2"
+				>
+					<div>
+						<i class="fa-solid fa-circle-plus fa-lg"></i>
+					</div>
+					<span class="text-nowrap">{{ "Create new survey" }}</span>
 				</div>
-				<span class="text-nowrap">{{ "Create new survey" }}</span>
-			</div>
-			<div
-				@click="switchToTab('freeBusySettings')"
-				:class="getTabStylingClass(view === 'freeBusySettings')"
-				class="btn d-flex flex-row gap-2 align-items-center py-2"
-			>
-				<div>
-					<i class="fa-solid fa-gear fa-lg"></i>
+				<div
+					@click="switchToTab('freeBusySettings')"
+					:class="getTabStylingClass(view === 'freeBusySettings')"
+					class="btn d-flex flex-row gap-2 align-items-center py-2"
+				>
+					<div>
+						<i class="fa-solid fa-gear fa-lg"></i>
+					</div>
+					<span class="text-nowrap">{{ "FreeBusy Settings" }}</span>
 				</div>
-				<span class="text-nowrap">{{ "FreeBusy Settings" }}</span>
 			</div>
 		</div>
 		<div class="flex-grow-1 mt-1">