diff options
-rw-r--r-- | css/icons.scss | 1 | ||||
-rw-r--r-- | img/lobby.svg | 1 | ||||
-rw-r--r-- | src/components/LobbyScreen.vue | 6 | ||||
-rw-r--r-- | src/components/missingMaterialDesignIcons/Lobby.vue | 41 |
4 files changed, 46 insertions, 3 deletions
diff --git a/css/icons.scss b/css/icons.scss index 1a2779f58..b3bcc7c59 100644 --- a/css/icons.scss +++ b/css/icons.scss @@ -1,5 +1,4 @@ @include icon-black-white('no-password', 'spreed', 1); -@include icon-black-white('lobby', 'spreed', 1); @include icon-black-white('folder-multiple-image', 'spreed', 1); // Mention bubbles in the chat input and messages diff --git a/img/lobby.svg b/img/lobby.svg deleted file mode 100644 index 4cf0189ed..000000000 --- a/img/lobby.svg +++ /dev/null @@ -1 +0,0 @@ -<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M2 17h20v2H2zm11.84-9.21c.1-.24.16-.51.16-.79 0-1.1-.9-2-2-2s-2 .9-2 2c0 .28.06.55.16.79C6.25 8.6 3.27 11.93 3 16h18c-.27-4.07-3.25-7.4-7.16-8.21z"/></svg> diff --git a/src/components/LobbyScreen.vue b/src/components/LobbyScreen.vue index 2a0ad32d4..5aa726c2c 100644 --- a/src/components/LobbyScreen.vue +++ b/src/components/LobbyScreen.vue @@ -21,7 +21,9 @@ <template> <div class="lobby"> <div class="lobby emptycontent"> - <div class="icon icon-lobby" /> + <Lobby decorative + :size="64" + title="" /> <h2>{{ currentConversationName }}</h2> <p class="lobby__timer"> @@ -51,6 +53,7 @@ import moment from '@nextcloud/moment' import RichText from '@juliushaertl/vue-richtext' import SetGuestUsername from './SetGuestUsername.vue' +import Lobby from './missingMaterialDesignIcons/Lobby.vue' export default { @@ -59,6 +62,7 @@ export default { components: { SetGuestUsername, RichText, + Lobby, }, computed: { diff --git a/src/components/missingMaterialDesignIcons/Lobby.vue b/src/components/missingMaterialDesignIcons/Lobby.vue new file mode 100644 index 000000000..577a68d2b --- /dev/null +++ b/src/components/missingMaterialDesignIcons/Lobby.vue @@ -0,0 +1,41 @@ +<template functional> + <span :aria-hidden="props.decorative" + :aria-label="props.title" + :class="[data.class, data.staticClass]" + class="material-design-icon present-to-all-icon" + role="img" + v-bind="data.attrs" + v-on="listeners"> + <svg :fill="props.fillColor" + class="material-design-icon__svg" + :width="props.size" + :height="props.size" + viewBox="0 0 24 24"> + <path d="M2 17h20v2H2zm11.84-9.21c.1-.24.16-.51.16-.79 0-1.1-.9-2-2-2s-2 .9-2 2c0 .28.06.55.16.79C6.25 8.6 3.27 11.93 3 16h18c-.27-4.07-3.25-7.4-7.16-8.21z" /> + </svg> + </span> +</template> + +<script> +export default { + name: 'Lobby', + props: { + title: { + type: String, + default: 'Lobby icon', + }, + decorative: { + type: Boolean, + default: false, + }, + fillColor: { + type: String, + default: 'currentColor', + }, + size: { + type: Number, + default: 24, + }, + }, +} +</script> |