diff options
| author | Marco <marcoambrosini@icloud.com> | 2022-12-19 19:27:53 +0100 |
|---|---|---|
| committer | Marco <marcoambrosini@icloud.com> | 2023-01-24 15:10:55 +0000 |
| commit | 7e3a700f6cbedbae76460b25f55204a7b7988a15 (patch) | |
| tree | 1cb4d0a8c6f63f1448e0ad2b0188b4979a1e6346 | |
| parent | 5557191a8f2fbf282da68921e3e2fa579fc5db08 (diff) | |
Improve breakoutrooms actions layout
| -rw-r--r-- | src/components/RightSidebar/BreakoutRooms/BreakoutRoomsTab.vue | 40 |
1 files changed, 24 insertions, 16 deletions
diff --git a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsTab.vue b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsTab.vue index 733f5f3e3..3d36f9009 100644 --- a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsTab.vue +++ b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsTab.vue @@ -21,24 +21,28 @@ <template> <div class="breakout-rooms"> - <!-- Configuration button --> - <NcButton v-if="!breakoutRoomsConfigured" - type="secondary" - @click="openBreakoutRoomsEditor"> - <template #icon> - <DotsCircle :size="20" /> - </template> - {{ t('spreed', 'Setup breakout rooms for this conversation') }} - </NcButton> - <template v-if="breakoutRoomsConfigured"> - <NcButton v-tooltip.auto="t('spreed', 'Delete breakout rooms')" + <div class="breakout-rooms__actions"> + <!-- Configuration button --> + <NcButton v-if="!breakoutRoomsConfigured" + :wide="true" + type="secondary" + @click="openBreakoutRoomsEditor"> + <template #icon> + <DotsCircle :size="20" /> + </template> + {{ t('spreed', 'Setup breakout rooms for this conversation') }} + </NcButton> + <NcButton v-if="breakoutRoomsConfigured" + v-tooltip.auto="t('spreed', 'Delete breakout rooms')" type="tertiary-no-background" @click="deleteBreakoutRooms"> <template #icon> <Delete :size="20" /> </template> </NcButton> - <div v-if="false"> + </div> + <template v-if="breakoutRoomsConfigured"> + <template v-if="breakoutRooms"> <template v-for="breakoutRoom in breakoutRooms"> <NcAppNavigationItem :key="breakoutRoom.displayName" :title="breakoutRoom.displayName" @@ -53,7 +57,7 @@ </template> </NcAppNavigationItem> </template> - </div> + </template> </template> <!-- Breakout rooms editor --> @@ -105,7 +109,6 @@ export default { }, computed: { - // TODO: get actual rooms breakoutRooms() { return this.$store.getters.breakoutRoomsReferences(this.token).map(reference => { return this.$store.getters.conversation(reference) @@ -118,13 +121,11 @@ export default { }, mounted() { - /** if (this.breakoutRoomsConfigured) { this.$store.dispatch('getBreakoutRoomsAction', { token: this.token, }) } - */ }, methods: { @@ -158,6 +159,13 @@ export default { <style lang="scss" scoped> +.breakout-rooms { + &__actions { + display: flex; + justify-content: flex-end; + } +} + ::v-deep .app-navigation-entry__title { font-weight: bold !important; } |