ease DOM structure, fix styles

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
nextcloud · Sep 14, 2023 · 1ff6968 · 1ff6968
1 parent affd2ce
commit 1ff6968
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 13 deletions.
diff --git a/src/components/RightSidebar/Participants/ParticipantsList/ParticipantsList.vue b/src/components/RightSidebar/Participants/ParticipantsList/ParticipantsList.vue
@@ -20,17 +20,15 @@
 -->
 
 <template>
-	<div>
-		<ul>
-			<Participant v-for="item in items"
-				:key="generateKey(item)"
-				:participant="item"
-				:is-selectable="participantsSelectable"
-				:show-user-status="showUserStatus"
-				@click-participant="handleClickParticipant" />
-		</ul>
+	<ul>
+		<Participant v-for="item in items"
+			:key="generateKey(item)"
+			:participant="item"
+			:is-selectable="participantsSelectable"
+			:show-user-status="showUserStatus"
+			@click-participant="handleClickParticipant" />
 		<LoadingPlaceholder v-if="loading" type="participants" :count="dummyParticipants" />
-	</div>
+	</ul>
 </template>
 
 <script>

diff --git a/src/components/RightSidebar/Participants/ParticipantsTab.vue b/src/components/RightSidebar/Participants/ParticipantsTab.vue
@@ -20,7 +20,7 @@
 -->
 
 <template>
-	<div>
+	<div class="wrapper">
 		<SearchBox v-if="canSearch"
 			:value.sync="searchText"
 			:is-focused.sync="isFocused"
@@ -32,7 +32,7 @@
 			:participants="participants"
 			:loading="!participantsInitialised" />
 
-		<template v-else>
+		<div v-else class="scroller">
 			<NcAppNavigationCaption v-if="canAdd" :title="t('spreed', 'Participants')" />
 
 			<ParticipantsList v-if="filteredParticipants.length"
@@ -46,7 +46,7 @@
 				:no-results="noResults"
 				:search-text="searchText"
 				@click="addParticipants" />
-		</template>
+		</div>
 	</div>
 </template>
 
@@ -266,6 +266,15 @@ export default {
 </script>
 
 <style scoped>
+.wrapper {
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+}
+
+.scroller {
+	overflow-y: auto;
+}
 
 /** TODO: fix these in the nextcloud-vue library **/