diff options
Diffstat (limited to 'apps/files_sharing/src/components/SharingEntrySimple.vue')
| -rw-r--r-- | apps/files_sharing/src/components/SharingEntrySimple.vue | 75 |
1 files changed, 33 insertions, 42 deletions
diff --git a/apps/files_sharing/src/components/SharingEntrySimple.vue b/apps/files_sharing/src/components/SharingEntrySimple.vue index de545a497a8..a00333ba0ce 100644 --- a/apps/files_sharing/src/components/SharingEntrySimple.vue +++ b/apps/files_sharing/src/components/SharingEntrySimple.vue @@ -1,53 +1,35 @@ <!-- - - @copyright Copyright (c) 2019 John Molakvoæ <skjnldsv@protonmail.com> - - - - @author John Molakvoæ <skjnldsv@protonmail.com> - - - - @license GNU AGPL version 3 or any later version - - - - This program is free software: you can redistribute it and/or modify - - it under the terms of the GNU Affero General Public License as - - published by the Free Software Foundation, either version 3 of the - - License, or (at your option) any later version. - - - - This program is distributed in the hope that it will be useful, - - but WITHOUT ANY WARRANTY; without even the implied warranty of - - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - - GNU Affero General Public License for more details. - - - - You should have received a copy of the GNU Affero General Public License - - along with this program. If not, see <http://www.gnu.org/licenses/>. - - - --> + - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors + - SPDX-License-Identifier: AGPL-3.0-or-later +--> <template> <li class="sharing-entry"> <slot name="avatar" /> - <div v-tooltip="tooltip" class="sharing-entry__desc"> - <h5>{{ title }}</h5> + <div class="sharing-entry__desc"> + <span class="sharing-entry__title">{{ title }}</span> <p v-if="subtitle"> {{ subtitle }} </p> </div> - <Actions v-if="$slots['default']" menu-align="right" class="sharing-entry__actions"> + <NcActions v-if="$slots['default']" + ref="actionsComponent" + class="sharing-entry__actions" + menu-align="right" + :aria-expanded="ariaExpandedValue"> <slot /> - </Actions> + </NcActions> </li> </template> <script> -import Actions from '@nextcloud/vue/dist/Components/Actions' -import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip' +import NcActions from '@nextcloud/vue/components/NcActions' export default { name: 'SharingEntrySimple', components: { - Actions, - }, - - directives: { - Tooltip, + NcActions, }, props: { @@ -56,10 +38,6 @@ export default { default: '', required: true, }, - tooltip: { - type: String, - default: '', - }, subtitle: { type: String, default: '', @@ -68,8 +46,20 @@ export default { type: Boolean, default: true, }, + ariaExpanded: { + type: Boolean, + default: null, + }, }, + computed: { + ariaExpandedValue() { + if (this.ariaExpanded === null) { + return this.ariaExpanded + } + return this.ariaExpanded ? 'true' : 'false' + }, + }, } </script> @@ -80,22 +70,23 @@ export default { min-height: 44px; &__desc { padding: 8px; + padding-inline-start: 10px; line-height: 1.2em; position: relative; flex: 1 1; min-width: 0; - h5 { - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; - max-width: inherit; - } p { color: var(--color-text-maxcontrast); } } + &__title { + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + max-width: inherit; + } &__actions { - margin-left: auto !important; + margin-inline-start: auto !important; } } </style> |