Skip to content

Commit

Permalink
show edit btn also when mouse over photo, removed transition
Browse files Browse the repository at this point in the history
  • Loading branch information
call-me-matt committed May 28, 2020
1 parent fc89384 commit 4c2683d
Show file tree
Hide file tree
Showing 2 changed files with 9 additions and 6 deletions.
4 changes: 3 additions & 1 deletion css/ContactDetailsAvatar.scss
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,9 @@
background-size: cover;
// White background for avatars with transparency, also in dark theme
background-color: #fff;
&:hover + .overlay {
opacity: .25;
}
}
&__options {
position: absolute;
Expand All @@ -70,7 +73,6 @@
height: 35px;
z-index: 11;
cursor: pointer;
transition: .5s ease;
opacity: 0;
border-radius: 50%;
background: rgba(0, 0, 0, .5);
Expand Down
11 changes: 6 additions & 5 deletions src/components/ContactDetails/ContactDetailsAvatar.vue
Original file line number Diff line number Diff line change
Expand Up @@ -24,11 +24,6 @@
<template>
<div class="contact-header-avatar">
<div class="contact-header-avatar__wrapper">
<div v-if="contact.photo"
class="overlay"
@click.stop.prevent="toggleMenu">
<div class="overlay-icon icon-picture-force-white" />
</div>
<div class="contact-header-avatar__background" @click="toggleModal" />

<div v-if="contact.photo"
Expand All @@ -44,6 +39,12 @@
@change="processFile">
</div>

<div v-if="contact.photo"
class="overlay"
@click.stop.prevent="toggleMenu">
<div class="overlay-icon icon-picture-force-white" />
</div>

<div v-if="!contact.photo"
v-click-outside="closeMenu"
class="contact-header-avatar__options">
Expand Down

0 comments on commit 4c2683d

Please sign in to comment.