summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--css/Properties/Properties.scss29
-rw-r--r--css/Properties/PropertyTitle.scss4
-rw-r--r--src/components/Properties/PropertyDateTime.vue3
-rw-r--r--src/components/Properties/PropertyMultipleText.vue3
-rw-r--r--src/components/Properties/PropertySelect.vue3
-rw-r--r--src/components/Properties/PropertyText.vue4
-rw-r--r--src/components/Properties/PropertyTitle.vue13
-rw-r--r--src/models/rfcProps.js45
8 files changed, 44 insertions, 60 deletions
diff --git a/css/Properties/Properties.scss b/css/Properties/Properties.scss
index 8dbf2785..5a9aca79 100644
--- a/css/Properties/Properties.scss
+++ b/css/Properties/Properties.scss
@@ -135,6 +135,11 @@ $property-ext-padding-right: 8px;
}
}
+ // Hide delete buttons initially
+ .action-item.icon-delete {
+ opacity: 0;
+ }
+
// Property value within row, after label
&__value {
flex: 1 1;
@@ -152,19 +157,25 @@ $property-ext-padding-right: 8px;
input&--with-ext {
// ext icon width + 8px padding
padding-right: 24px;
- &:hover,
- &:focus,
- &:active {
- ~ .property__ext {
- opacity: .5;
- }
+ }
+
+ // Show ext and delete icon permanently on focus
+ &:hover,
+ &:focus,
+ &:active {
+ ~ .property__ext,
+ ~ .action-item.icon-delete {
+ opacity: .5;
}
}
}
- // show ext button on full row hover
- &:hover &__ext {
- opacity: .5;
+ // Show ext and delete buttons on full row hover
+ &:hover {
+ .property__ext,
+ .action-item {
+ opacity: .5;
+ }
}
// External link (tel, mailto, http, ftp...)
diff --git a/css/Properties/PropertyTitle.scss b/css/Properties/PropertyTitle.scss
index eed16496..b4a579d8 100644
--- a/css/Properties/PropertyTitle.scss
+++ b/css/Properties/PropertyTitle.scss
@@ -25,7 +25,6 @@
align-items: center;
margin: 0;
user-select: none;
- opacity: .6;
.property__title--right {
display: flex;
@@ -34,7 +33,4 @@
.property__title--icon {
background-position: center right;
}
- .property__title--icon-details {
- margin-left: 7px;
- }
}
diff --git a/src/components/Properties/PropertyDateTime.vue b/src/components/Properties/PropertyDateTime.vue
index 342ab7f6..7acc7233 100644
--- a/src/components/Properties/PropertyDateTime.vue
+++ b/src/components/Properties/PropertyDateTime.vue
@@ -25,8 +25,7 @@
<!-- title if first element -->
<PropertyTitle v-if="isFirstProperty && propModel.icon"
:icon="propModel.icon"
- :readable-name="propModel.readableName"
- :info="propModel.info" />
+ :readable-name="propModel.readableName" />
<div class="property__row">
<!-- type selector -->
diff --git a/src/components/Properties/PropertyMultipleText.vue b/src/components/Properties/PropertyMultipleText.vue
index af7bb430..d23d9434 100644
--- a/src/components/Properties/PropertyMultipleText.vue
+++ b/src/components/Properties/PropertyMultipleText.vue
@@ -25,8 +25,7 @@
<!-- title if first element -->
<PropertyTitle v-if="isFirstProperty && propModel.icon"
:icon="propModel.icon"
- :readable-name="propModel.readableName"
- :info="propModel.info" />
+ :readable-name="propModel.readableName" />
<div class="property__row">
<!-- type selector -->
diff --git a/src/components/Properties/PropertySelect.vue b/src/components/Properties/PropertySelect.vue
index 321ec771..67b7a35c 100644
--- a/src/components/Properties/PropertySelect.vue
+++ b/src/components/Properties/PropertySelect.vue
@@ -25,8 +25,7 @@
<!-- title if first element -->
<PropertyTitle v-if="isFirstProperty && propModel.icon"
:icon="propModel.icon"
- :readable-name="propModel.readableName"
- :info="propModel.info" />
+ :readable-name="propModel.readableName" />
<div class="property__row">
<!-- if we do not support any type on our model but one is set anyway -->
diff --git a/src/components/Properties/PropertyText.vue b/src/components/Properties/PropertyText.vue
index 8bb254fb..39554ef3 100644
--- a/src/components/Properties/PropertyText.vue
+++ b/src/components/Properties/PropertyText.vue
@@ -25,8 +25,7 @@
<!-- title if first element -->
<PropertyTitle v-if="isFirstProperty && propModel.icon"
:icon="propModel.icon"
- :readable-name="propModel.readableName"
- :info="propModel.info" />
+ :readable-name="propModel.readableName" />
<div class="property__row">
<!-- type selector -->
@@ -73,6 +72,7 @@
:class="{'property__value--with-ext': haveExtHandler}"
type="text"
class="property__value"
+ :placeholder="type"
@input="updateValue">
<!-- external link -->
diff --git a/src/components/Properties/PropertyTitle.vue b/src/components/Properties/PropertyTitle.vue
index 4bda3363..fcaa731a 100644
--- a/src/components/Properties/PropertyTitle.vue
+++ b/src/components/Properties/PropertyTitle.vue
@@ -23,11 +23,9 @@
<template>
<h3 class="property__title property__row">
<div :class="icon" class="property__label property__title--icon" />
- <span class="property__value property__title--right">
- <div>{{ readableName }}</div>
- <!-- display tooltip with hint if available -->
- <div v-if="info" v-tooltip.auto="info" class="property__title--icon-details icon-details" />
- </span>
+ <div class="property__value property__title--right">
+ {{ readableName }}
+ </div>
</h3>
</template>
@@ -46,11 +44,6 @@ export default {
default: '',
required: true,
},
- info: {
- type: String,
- default: '',
- required: false,
- },
},
}
</script>
diff --git a/src/models/rfcProps.js b/src/models/rfcProps.js
index f23aff77..62f1d3c5 100644
--- a/src/models/rfcProps.js
+++ b/src/models/rfcProps.js
@@ -141,7 +141,6 @@ const properties = {
},
anniversary: {
readableName: t('contacts', 'Anniversary'),
- info: t('contacts', 'The date of marriage, or equivalent, of this contact'),
icon: 'icon-calendar-dark',
force: 'date', // most ppl prefer date for birthdays, time is usually irrelevant
defaultValue: {
@@ -228,35 +227,27 @@ const properties = {
value: '',
type: ['facebook'],
},
- info: t(
- 'contacts',
- 'The link of the profile. e.g. https://www.facebook.com/Nextclouders/ '
- ),
options: [
- { id: 'FACEBOOK', name: 'Facebook' },
- { id: 'GITHUB', name: 'GitHub' },
- { id: 'GOOGLEPLUS', name: 'Google+' },
- { id: 'INSTAGRAM', name: 'Instagram' },
- { id: 'LINKEDIN', name: 'LinkedIn' },
- { id: 'PINTEREST', name: 'Pinterest' },
- { id: 'QZONE', name: 'QZone' },
- { id: 'TUMBLR', name: 'Tumblr' },
- { id: 'TWITTER', name: 'Twitter' },
- { id: 'WECHAT', name: 'WeChat' },
- { id: 'YOUTUBE', name: 'YouTube' },
- { id: 'MASTODON', name: 'Mastodon' },
- { id: 'DIASPORA', name: 'Diaspora' },
- { id: 'OTHER', name: 'other Social Media' },
+ { id: 'FACEBOOK', name: 'Facebook', placeholder: 'https://facebook.com/…' },
+ { id: 'GITHUB', name: 'GitHub', placeholder: 'https://github.com/…' },
+ { id: 'GOOGLEPLUS', name: 'Google+', placeholder: 'https://plus.google.com/…' },
+ { id: 'INSTAGRAM', name: 'Instagram', placeholder: 'https://instagram.com/…' },
+ { id: 'LINKEDIN', name: 'LinkedIn', placeholder: 'https://linkedin.com/…' },
+ { id: 'PINTEREST', name: 'Pinterest', placeholder: 'https://pinterest.com/…' },
+ { id: 'QZONE', name: 'QZone', placeholder: 'https://qzone.com/…' },
+ { id: 'TUMBLR', name: 'Tumblr', placeholder: 'https://tumblr.com/…' },
+ { id: 'TWITTER', name: 'Twitter', placeholder: 'https://twitter.com/…' },
+ { id: 'WECHAT', name: 'WeChat', placeholder: 'https://wechat.com/…' },
+ { id: 'YOUTUBE', name: 'YouTube', placeholder: 'https://youtube.com/…' },
+ { id: 'MASTODON', name: 'Mastodon', placeholder: 'https://mastodon.social/…' },
+ { id: 'DIASPORA', name: 'Diaspora', placeholder: 'https://joindiaspora.com/…' },
+ { id: 'OTHER', name: 'Other social media', placeholder: 'https://example.com/…' },
],
},
relationship: {
- readableName: t('contacts', 'Relationship'),
+ readableName: t('contacts', 'Relationship to you'),
force: 'select',
icon: 'icon-group',
- info: t(
- 'contacts',
- 'Specify a relationship between you and the entity represented by this vCard.'
- ),
options: [
{ id: 'SPOUSE', name: t('contacts', 'Spouse') },
{ id: 'CHILD', name: t('contacts', 'Child') },
@@ -274,12 +265,8 @@ const properties = {
},
related: {
multiple: true,
- readableName: t('contacts', 'Related'),
+ readableName: t('contacts', 'Related contacts'),
icon: 'icon-group',
- info: t(
- 'contacts',
- 'Specify a relationship between another entity and the entity represented by this vCard.'
- ),
defaultValue: {
value: [''],
type: ['CONTACT'],
generated by cgit v1.2.3 (git 2.25.1) at 2024-07-29 21:46:43 +0000