mirror of
https://github.com/crater-invoice/crater.git
synced 2025-10-27 11:41:09 -04:00
add default-avatar and change hover icon
This commit is contained in:
BIN
public/images/default-avatar.jpg
Normal file
BIN
public/images/default-avatar.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
@ -13,7 +13,7 @@
|
||||
<label class="input-label">{{ $tc('settings.company_info.company_logo') }}</label>
|
||||
<div id="pick-avatar" class="image-upload-box">
|
||||
<div class="overlay">
|
||||
<font-awesome-icon class="white-icon" icon="cloud-upload-alt"/>
|
||||
<font-awesome-icon class="white-icon" icon="camera"/>
|
||||
</div>
|
||||
<img v-if="previewLogo" :src="previewLogo" class="preview-logo">
|
||||
<div v-else class="upload-content">
|
||||
|
||||
@ -16,7 +16,7 @@
|
||||
<font-awesome-icon class="white-icon" icon="camera"/>
|
||||
</div>
|
||||
<img v-if="previewAvatar" :src="previewAvatar" class="preview-logo">
|
||||
<div v-else class="upload-content">
|
||||
<div v-if="!previewAvatar" class="upload-content">
|
||||
<font-awesome-icon class="upload-icon" icon="cloud-upload-alt"/>
|
||||
<p class="upload-text"> {{ $tc('general.choose_file') }} </p>
|
||||
</div>
|
||||
@ -183,7 +183,11 @@ export default {
|
||||
let response = await this.loadData()
|
||||
this.formData.name = response.data.name
|
||||
this.formData.email = response.data.email
|
||||
this.previewAvatar = response.data.avatar
|
||||
if (response.data.avatar) {
|
||||
this.previewAvatar = response.data.avatar
|
||||
} else {
|
||||
this.previewAvatar = '/images/default-avatar.jpg'
|
||||
}
|
||||
},
|
||||
async updateUserData () {
|
||||
this.$v.formData.$touch()
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
<label class="input-label">{{ $tc('settings.company_info.company_logo') }}</label>
|
||||
<div id="pick-avatar" class="image-upload-box">
|
||||
<div class="overlay">
|
||||
<font-awesome-icon class="white-icon" icon="cloud-upload-alt"/>
|
||||
<font-awesome-icon class="white-icon" icon="camera"/>
|
||||
</div>
|
||||
<img v-if="previewLogo" :src="previewLogo" class="preview-logo">
|
||||
<div v-else class="upload-content">
|
||||
|
||||
@ -129,7 +129,7 @@ export default {
|
||||
confirm_password: null
|
||||
},
|
||||
loading: false,
|
||||
previewAvatar: null,
|
||||
previewAvatar: '/images/default-avatar.jpg',
|
||||
fileObject: null
|
||||
}
|
||||
},
|
||||
|
||||
@ -11,8 +11,10 @@
|
||||
cursor: pointer;
|
||||
|
||||
.preview-logo {
|
||||
max-height: 50%;
|
||||
max-height: 80%;
|
||||
position: absolute;
|
||||
opacity: 1;
|
||||
animation: fadeIn 2s ease;
|
||||
}
|
||||
|
||||
.upload-content {
|
||||
@ -69,7 +71,17 @@
|
||||
height: 130px;
|
||||
width: 130px;
|
||||
.preview-logo {
|
||||
max-height: 80% !important;
|
||||
max-width: 80% !important;
|
||||
}
|
||||
|
||||
@keyframes fadeIn{
|
||||
0%{
|
||||
opacity: 0;
|
||||
}
|
||||
100%{
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user