diff options
Diffstat (limited to 'apps/user_status/src/components/PredefinedStatus.vue')
| -rw-r--r-- | apps/user_status/src/components/PredefinedStatus.vue | 37 |
1 files changed, 16 insertions, 21 deletions
diff --git a/apps/user_status/src/components/PredefinedStatus.vue b/apps/user_status/src/components/PredefinedStatus.vue index a5c621aea28..b12892d4add 100644 --- a/apps/user_status/src/components/PredefinedStatus.vue +++ b/apps/user_status/src/components/PredefinedStatus.vue @@ -1,23 +1,7 @@ <!-- - - @copyright Copyright (c) 2020 Georg Ehrke <oc.list@georgehrke.com> - - @author Georg Ehrke <oc.list@georgehrke.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: 2020 Nextcloud GmbH and Nextcloud contributors + - SPDX-License-Identifier: AGPL-3.0-or-later +--> <template> <li class="predefined-status"> <input :id="id" @@ -97,10 +81,19 @@ export default { flex-basis: 100%; border-radius: var(--border-radius); align-items: center; - min-height: 44px; + min-height: var(--default-clickable-area); + padding-inline: var(--default-grid-baseline); + + &, & * { + cursor: pointer; + } + + &:hover { + background-color: var(--color-background-dark); + } &--icon { - flex-basis: 40px; + flex-basis: var(--default-clickable-area); text-align: center; } @@ -122,11 +115,13 @@ export default { &__label:active { outline: 2px solid var(--color-main-text); box-shadow: 0 0 0 4px var(--color-main-background); + background-color: var(--color-background-dark); border-radius: var(--border-radius-large); } &__input:focus-visible + &__label { outline: 2px solid var(--color-primary-element) !important; + background-color: var(--color-background-dark); border-radius: var(--border-radius-large); } } |