Add full addressbook display name title

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
This commit is contained in:
John Molakvoæ (skjnldsv) 2020-09-08 16:21:52 +02:00
parent fa81480d32
commit 02c9ff36b6
No known key found for this signature in database
GPG Key ID: 60C25B8C072916CF
3 changed files with 46 additions and 67 deletions

View File

@ -1,65 +0,0 @@
/**
* @copyright Copyright (c) 2018 John Molakvoæ <skjnldsv@protonmail.com>
*
* @author John Molakvoæ <skjnldsv@protonmail.com>
* @author Team Popcorn <teampopcornberlin@gmail.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/>.
*
*/
.addressbook {
display: flex;
flex-wrap: wrap;
align-items: center;
white-space: nowrap;
text-overflow: ellipsis;
> .addressbook__name {
+ a,
+ div {
// put actions at the end
margin-left: auto;
}
}
&__name {
display: block;
flex: 0 1 auto;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
&__share,
&__menu .icon-more {
width: 44px;
height: 44px;
opacity: .5;
&:hover,
&:focus,
&:active {
opacity: .7;
}
}
&__share {
&--shared {
opacity: .7;
}
}
&--disabled &__name {
opacity: .5;
}
}

View File

@ -28,7 +28,6 @@ $grid-input-height-with-margin: $grid-height-unit - $grid-input-margin * 2;
// components
@import 'SettingsSection';
@import 'Settings/SettingsAddressbook';
@import 'Settings/SettingsAddressbookShares';
@import 'Settings/SettingsAddressbookSharee';
@import 'ContactsListItem';

View File

@ -23,7 +23,7 @@
<template>
<li :class="{'addressbook--disabled': !addressbook.enabled}" class="addressbook">
<!-- addressbook name -->
<span class="addressbook__name">
<span class="addressbook__name" :title="addressbook.displayName">
{{ addressbook.displayName }}
</span>
@ -278,3 +278,48 @@ export default {
},
}
</script>
<style lang="scss" scoped>
.addressbook {
display: flex;
flex-wrap: wrap;
align-items: center;
white-space: nowrap;
text-overflow: ellipsis;
> .addressbook__name {
+ a,
+ div {
// put actions at the end
margin-left: auto;
}
}
&__name {
display: block;
flex: 0 1 auto;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
&__share,
&__menu .icon-more {
width: 44px;
height: 44px;
opacity: .5;
&:hover,
&:focus,
&:active {
opacity: .7;
}
}
&__share {
&--shared {
opacity: .7;
}
}
&--disabled &__name {
opacity: .5;
}
}
</style>