diff options
author | Marco <marcoambrosini@pm.me> | 2022-04-06 10:36:21 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-04-06 10:36:21 +0300 |
commit | 47207131144cc80d98cf4f5570625e8b69a9b0ff (patch) | |
tree | da3a9a84be158d208d7e7c79ffc2356a8be49ab1 /src | |
parent | 43ccc6514b3c18b76ca1e1d5280d9cce156f49e0 (diff) | |
parent | d72d9fb60a63da2f7902f72580a57bd12ef90e44 (diff) |
Merge pull request #6962 from nextcloud/feat/6927/button-for-room-selector
6927: updated button for room selector
Diffstat (limited to 'src')
-rw-r--r-- | src/components/MessagesList/MessagesList.vue | 1 | ||||
-rw-r--r-- | src/views/RoomSelector.spec.js | 5 | ||||
-rw-r--r-- | src/views/RoomSelector.vue | 32 |
3 files changed, 19 insertions, 19 deletions
diff --git a/src/components/MessagesList/MessagesList.vue b/src/components/MessagesList/MessagesList.vue index 482944196..a4ba07e27 100644 --- a/src/components/MessagesList/MessagesList.vue +++ b/src/components/MessagesList/MessagesList.vue @@ -902,6 +902,7 @@ export default { <style lang="scss" scoped> @import '../../assets/variables'; + .scroller { flex: 1 0; overflow-y: auto; diff --git a/src/views/RoomSelector.spec.js b/src/views/RoomSelector.spec.js index 14da0efe2..4daa617ac 100644 --- a/src/views/RoomSelector.spec.js +++ b/src/views/RoomSelector.spec.js @@ -2,7 +2,7 @@ import mockAxios from '../__mocks__/axios' import { generateOcsUrl } from '@nextcloud/router' import { shallowMount } from '@vue/test-utils' import { CONVERSATION } from '../constants' - +import Button from '@nextcloud/vue/dist/Components/Button' import RoomSelector from './RoomSelector' describe('RoomSelector.vue', () => { @@ -139,8 +139,7 @@ describe('RoomSelector.vue', () => { const list = wrapper.findAll('li') await list.at(1).trigger('click') - - await wrapper.find('button').trigger('click') + await wrapper.findComponent(Button).vm.$emit('click') expect(eventHandler).toHaveBeenCalledWith('token-3') }) diff --git a/src/views/RoomSelector.vue b/src/views/RoomSelector.vue index 4431b1cf7..7522949df 100644 --- a/src/views/RoomSelector.vue +++ b/src/views/RoomSelector.vue @@ -21,7 +21,8 @@ --> <template> - <Modal :container="container" + <Modal size="small" + :container="container" @close="close"> <div id="modal-inner" class="talk-modal" :class="{ 'icon-loading': loading }"> <div id="modal-content"> @@ -55,12 +56,12 @@ </div> </div> <div id="modal-buttons"> - <button v-if="!loading && availableRooms.length > 0" - class="primary" + <Button v-if="!loading && availableRooms.length > 0" + type="primary" :disabled="!selectedRoom" @click="select"> {{ t('spreed', 'Select conversation') }} - </button> + </Button> </div> </div> </div> @@ -73,12 +74,14 @@ import axios from '@nextcloud/axios' import { generateOcsUrl } from '@nextcloud/router' import { CONVERSATION } from '../constants' import ConversationIcon from '../components/ConversationIcon' +import Button from '@nextcloud/vue/dist/Components/Button' export default { name: 'RoomSelector', components: { ConversationIcon, Modal, + Button, }, props: { container: { @@ -164,10 +167,15 @@ export default { </script> <style lang="scss" scoped> + +.talk-modal { + height: 80vh; +} + #modal-inner { - width: 90vw; - max-width: 400px; - height: 55vh; + width: 100%; + padding: 16px; + margin: 0 auto; position: relative; display: flex; align-items: center; @@ -183,7 +191,6 @@ export default { height: calc(100% - 40px); display: flex; flex-direction: column; - padding: 20px; } #room-list { @@ -220,14 +227,7 @@ li { #modal-buttons { overflow: hidden; flex-shrink: 0; - button { - height: 44px; - margin: 0; - } - - .primary { - float: right; - } + margin-left: auto; } .subtitle { |