UI improvements part 3

This commit is contained in:
Čarodej
2022-01-27 17:04:12 +01:00
parent d855739bf2
commit f74bb7cec5
12 changed files with 223 additions and 204 deletions

View File

@@ -12,7 +12,7 @@
"/chunks/admin~chunks/files~chunks/my-shared-items~chunks/platform~chunks/recent-uploads~chunks/settin~673d1ac3.js": "/chunks/admin~chunks/files~chunks/my-shared-items~chunks/platform~chunks/recent-uploads~chunks/settin~673d1ac3.js?id=34845d890e9e65d2adc0",
"/chunks/admin~chunks/files~chunks/my-shared-items~chunks/platform~chunks/recent-uploads~chunks/settin~97130d1f.js": "/chunks/admin~chunks/files~chunks/my-shared-items~chunks/platform~chunks/recent-uploads~chunks/settin~97130d1f.js?id=8da02dcc87f434aca532",
"/chunks/admin~chunks/platform~chunks/settings.js": "/chunks/admin~chunks/platform~chunks/settings.js?id=457420de4eafe9f1c5d3",
"/chunks/admin~chunks/platform~chunks/settings~chunks/shared.js": "/chunks/admin~chunks/platform~chunks/settings~chunks/shared.js?id=d70888d9345ad027bff8",
"/chunks/admin~chunks/platform~chunks/settings~chunks/shared.js": "/chunks/admin~chunks/platform~chunks/settings~chunks/shared.js?id=62b88fffd7ec54bc951e",
"/chunks/admin~chunks/platform~chunks/shared.js": "/chunks/admin~chunks/platform~chunks/shared.js?id=3e732ede912619794ed9",
"/chunks/app-appearance.js": "/chunks/app-appearance.js?id=f320fe6298f15a06d573",
"/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/payments/billings~chunks/payments/set~0dc0a1dd.js": "/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/payments/billings~chunks/payments/set~0dc0a1dd.js?id=85c3dcde9e03e25b549e",
@@ -39,7 +39,7 @@
"/chunks/dynamic-page.js": "/chunks/dynamic-page.js?id=6c86916c6c6f679fa86b",
"/chunks/email-verified.js": "/chunks/email-verified.js?id=fcba9acf60a855b730d5",
"/chunks/environment-setup.js": "/chunks/environment-setup.js?id=037716aec84bcf2dbd87",
"/chunks/files.js": "/chunks/files.js?id=34950cf3b0c8f604bf38",
"/chunks/files.js": "/chunks/files.js?id=7b9fd5464561931f8db7",
"/chunks/files~chunks/my-shared-items~chunks/platform~chunks/recent-uploads~chunks/shared~chunks/share~c7960950.js": "/chunks/files~chunks/my-shared-items~chunks/platform~chunks/recent-uploads~chunks/shared~chunks/share~c7960950.js?id=f41b30739fcbba3ae537",
"/chunks/files~chunks/my-shared-items~chunks/recent-uploads~chunks/shared-with-me~chunks/shared/files~~34b5eb22.js": "/chunks/files~chunks/my-shared-items~chunks/recent-uploads~chunks/shared-with-me~chunks/shared/files~~34b5eb22.js?id=94ead73a2f7abcbc3214",
"/chunks/files~chunks/my-shared-items~chunks/recent-uploads~chunks/shared-with-me~chunks/shared/files~~bf3ddedc.js": "/chunks/files~chunks/my-shared-items~chunks/recent-uploads~chunks/shared-with-me~chunks/shared/files~~bf3ddedc.js?id=6489d55d6d88986008c9",
@@ -64,13 +64,13 @@
"/chunks/plan-settings.js": "/chunks/plan-settings.js?id=2bad17d45da8aa6450c6",
"/chunks/plan-subscribers.js": "/chunks/plan-subscribers.js?id=58d2f439052b4a01bb78",
"/chunks/plans.js": "/chunks/plans.js?id=1ac621b39dd45f6d33de",
"/chunks/platform.js": "/chunks/platform.js?id=c571ce8c6e3dcdc87c31",
"/chunks/platform~chunks/shared.js": "/chunks/platform~chunks/shared.js?id=3903a0b3dd6bbb244375",
"/chunks/platform.js": "/chunks/platform.js?id=2d41d43a7e1f64ee47a3",
"/chunks/platform~chunks/shared.js": "/chunks/platform~chunks/shared.js?id=f3b3cd45e0bba7df79aa",
"/chunks/platform~chunks/shared~chunks/shared-with-me~chunks/team-folders.js": "/chunks/platform~chunks/shared~chunks/shared-with-me~chunks/team-folders.js?id=66e964be4ab127b1f723",
"/chunks/profile.js": "/chunks/profile.js?id=f86f4783c664ca19e6ed",
"/chunks/purchase-code.js": "/chunks/purchase-code.js?id=d9af0efad2af2679954b",
"/chunks/recent-uploads.js": "/chunks/recent-uploads.js?id=376eafcf7e98317b5092",
"/chunks/settings.js": "/chunks/settings.js?id=655804d5542f6c3907d5",
"/chunks/settings.js": "/chunks/settings.js?id=948d4f3ab1151c2b0a7d",
"/chunks/settings-password.js": "/chunks/settings-password.js?id=5663c0b40d30395b1800",
"/chunks/settings-storage.js": "/chunks/settings-storage.js?id=03dc91e6eca3401c7264",
"/chunks/setup-wizard.js": "/chunks/setup-wizard.js?id=651d5accf401908724c5",
@@ -90,10 +90,10 @@
"/chunks/team-folders.js": "/chunks/team-folders.js?id=7ffd359b25ff016da5de",
"/chunks/temporary-unavailable.js": "/chunks/temporary-unavailable.js?id=145f1b0766214eee1aad",
"/chunks/trash.js": "/chunks/trash.js?id=1a2baf87714da126f8f7",
"/chunks/user.js": "/chunks/user.js?id=45f0a820b34424ad3fe9",
"/chunks/user.js": "/chunks/user.js?id=7dcb59d34ee4ad2165b9",
"/chunks/user-create.js": "/chunks/user-create.js?id=ec5e0749e0fc93be4664",
"/chunks/user-delete.js": "/chunks/user-delete.js?id=91cd831e23203fd3157c",
"/chunks/user-detail.js": "/chunks/user-detail.js?id=6f4e3cc41a6803895594",
"/chunks/user-detail.js": "/chunks/user-detail.js?id=ab7fb2d499aa1a7e7057",
"/chunks/user-password.js": "/chunks/user-password.js?id=c8869f60d85ee1e54db5",
"/chunks/user-storage.js": "/chunks/user-storage.js?id=f3f616b4ea29972f1232",
"/chunks/user-subscription.js": "/chunks/user-subscription.js?id=0eec28eb9f9d3fdf1081",
@@ -399,5 +399,104 @@
"/js/main.c0c79fc6ab3ea3113995.hot-update.js": "/js/main.c0c79fc6ab3ea3113995.hot-update.js",
"/js/main.866acfdd88418791a158.hot-update.js": "/js/main.866acfdd88418791a158.hot-update.js",
"/js/main.a6730a78442e26530fba.hot-update.js": "/js/main.a6730a78442e26530fba.hot-update.js",
"/js/main.f7c7fe63fce4501b3c61.hot-update.js": "/js/main.f7c7fe63fce4501b3c61.hot-update.js"
"/js/main.f7c7fe63fce4501b3c61.hot-update.js": "/js/main.f7c7fe63fce4501b3c61.hot-update.js",
"/chunks/platform~chunks/shared.bcaea5248bcfd749c4c7.hot-update.js": "/chunks/platform~chunks/shared.bcaea5248bcfd749c4c7.hot-update.js",
"/chunks/platform.7ec296074532468f3359.hot-update.js": "/chunks/platform.7ec296074532468f3359.hot-update.js",
"/chunks/platform.a4b4e6c15d1aa84e0b79.hot-update.js": "/chunks/platform.a4b4e6c15d1aa84e0b79.hot-update.js",
"/chunks/settings.8c493ceeaca26c456688.hot-update.js": "/chunks/settings.8c493ceeaca26c456688.hot-update.js",
"/chunks/settings.0c4643ac5d8389dad149.hot-update.js": "/chunks/settings.0c4643ac5d8389dad149.hot-update.js",
"/chunks/settings.4bc3850486e8da762d6d.hot-update.js": "/chunks/settings.4bc3850486e8da762d6d.hot-update.js",
"/chunks/settings.9378c980e3409a25ca60.hot-update.js": "/chunks/settings.9378c980e3409a25ca60.hot-update.js",
"/chunks/settings.0e602b2f8924eddd8d0b.hot-update.js": "/chunks/settings.0e602b2f8924eddd8d0b.hot-update.js",
"/chunks/settings.d0056c1e4dea620c96ec.hot-update.js": "/chunks/settings.d0056c1e4dea620c96ec.hot-update.js",
"/chunks/settings.3910c1b055292586fb00.hot-update.js": "/chunks/settings.3910c1b055292586fb00.hot-update.js",
"/chunks/settings.11a98d106368a3cb27fd.hot-update.js": "/chunks/settings.11a98d106368a3cb27fd.hot-update.js",
"/chunks/settings.a7e5adc27b23444dc17c.hot-update.js": "/chunks/settings.a7e5adc27b23444dc17c.hot-update.js",
"/chunks/settings.2d2407227ceb44f6e29b.hot-update.js": "/chunks/settings.2d2407227ceb44f6e29b.hot-update.js",
"/chunks/settings.964ff5c286cde0e84c79.hot-update.js": "/chunks/settings.964ff5c286cde0e84c79.hot-update.js",
"/chunks/settings.947378359caa07379b8a.hot-update.js": "/chunks/settings.947378359caa07379b8a.hot-update.js",
"/chunks/settings.288024fecf0f61f72934.hot-update.js": "/chunks/settings.288024fecf0f61f72934.hot-update.js",
"/chunks/settings.6b10e41561beede37516.hot-update.js": "/chunks/settings.6b10e41561beede37516.hot-update.js",
"/chunks/settings.e212b46a5d040d2ed8d2.hot-update.js": "/chunks/settings.e212b46a5d040d2ed8d2.hot-update.js",
"/chunks/settings.9cdb3fb1bf2d386bc496.hot-update.js": "/chunks/settings.9cdb3fb1bf2d386bc496.hot-update.js",
"/chunks/settings.a4f3b419d08218a7dfe9.hot-update.js": "/chunks/settings.a4f3b419d08218a7dfe9.hot-update.js",
"/chunks/settings.57c8b1df945a1846d6ea.hot-update.js": "/chunks/settings.57c8b1df945a1846d6ea.hot-update.js",
"/chunks/settings.3b05ee1c522f30e1ce56.hot-update.js": "/chunks/settings.3b05ee1c522f30e1ce56.hot-update.js",
"/chunks/settings.6e7676bd5ec3b4ab145d.hot-update.js": "/chunks/settings.6e7676bd5ec3b4ab145d.hot-update.js",
"/chunks/settings.482836e338e264c83f87.hot-update.js": "/chunks/settings.482836e338e264c83f87.hot-update.js",
"/chunks/settings.de947755457e5240c791.hot-update.js": "/chunks/settings.de947755457e5240c791.hot-update.js",
"/chunks/settings.c1f428073c39071383d9.hot-update.js": "/chunks/settings.c1f428073c39071383d9.hot-update.js",
"/chunks/settings.755cfde7cb61f89c7434.hot-update.js": "/chunks/settings.755cfde7cb61f89c7434.hot-update.js",
"/chunks/settings.0d95748a9453f67c5609.hot-update.js": "/chunks/settings.0d95748a9453f67c5609.hot-update.js",
"/chunks/settings.652d09332527d826e2f7.hot-update.js": "/chunks/settings.652d09332527d826e2f7.hot-update.js",
"/chunks/settings.59b3e5a98bd606e001f1.hot-update.js": "/chunks/settings.59b3e5a98bd606e001f1.hot-update.js",
"/chunks/settings.3f313d8fa520e516566e.hot-update.js": "/chunks/settings.3f313d8fa520e516566e.hot-update.js",
"/js/main.236421da4ed64012a438.hot-update.js": "/js/main.236421da4ed64012a438.hot-update.js",
"/js/main.c08dc1f671270990e9ad.hot-update.js": "/js/main.c08dc1f671270990e9ad.hot-update.js",
"/js/main.5fab75ef7e2116564b80.hot-update.js": "/js/main.5fab75ef7e2116564b80.hot-update.js",
"/chunks/profile.bf72c9c8599892763344.hot-update.js": "/chunks/profile.bf72c9c8599892763344.hot-update.js",
"/chunks/profile.8c5f8cab2a63c08b6675.hot-update.js": "/chunks/profile.8c5f8cab2a63c08b6675.hot-update.js",
"/chunks/profile.ad766bea2782d6af5712.hot-update.js": "/chunks/profile.ad766bea2782d6af5712.hot-update.js",
"/chunks/user-detail.300ec599e85dca2c20ec.hot-update.js": "/chunks/user-detail.300ec599e85dca2c20ec.hot-update.js",
"/chunks/user-detail.3a180613f3d65e2f3398.hot-update.js": "/chunks/user-detail.3a180613f3d65e2f3398.hot-update.js",
"/chunks/user-detail.1de5813cdec7b6be5584.hot-update.js": "/chunks/user-detail.1de5813cdec7b6be5584.hot-update.js",
"/chunks/user-detail.2e1f5cf8ef94f50028e4.hot-update.js": "/chunks/user-detail.2e1f5cf8ef94f50028e4.hot-update.js",
"/chunks/user-detail.9e3154cefcfae2d1d75b.hot-update.js": "/chunks/user-detail.9e3154cefcfae2d1d75b.hot-update.js",
"/chunks/user-detail.16d990ee2e2b86fc3e47.hot-update.js": "/chunks/user-detail.16d990ee2e2b86fc3e47.hot-update.js",
"/chunks/user-detail.a9a652261a7201185d00.hot-update.js": "/chunks/user-detail.a9a652261a7201185d00.hot-update.js",
"/chunks/user-detail.bebb9a14eaa693bc7838.hot-update.js": "/chunks/user-detail.bebb9a14eaa693bc7838.hot-update.js",
"/chunks/user-detail.92dedd216d8402cb6024.hot-update.js": "/chunks/user-detail.92dedd216d8402cb6024.hot-update.js",
"/js/main.8ff6ec2be7718917b943.hot-update.js": "/js/main.8ff6ec2be7718917b943.hot-update.js",
"/chunks/user-detail.a452af7f144b7b168439.hot-update.js": "/chunks/user-detail.a452af7f144b7b168439.hot-update.js",
"/chunks/user-detail.d2a6dfcfe4524efb5886.hot-update.js": "/chunks/user-detail.d2a6dfcfe4524efb5886.hot-update.js",
"/chunks/user-detail.9873dcee482b989676b5.hot-update.js": "/chunks/user-detail.9873dcee482b989676b5.hot-update.js",
"/chunks/user-detail.90431dcd430d5f2a8cba.hot-update.js": "/chunks/user-detail.90431dcd430d5f2a8cba.hot-update.js",
"/chunks/user-detail.79e5d29c748f82b338aa.hot-update.js": "/chunks/user-detail.79e5d29c748f82b338aa.hot-update.js",
"/chunks/user-detail.22bceaed32d693566182.hot-update.js": "/chunks/user-detail.22bceaed32d693566182.hot-update.js",
"/chunks/user-detail.18e4fc9dd2205256c175.hot-update.js": "/chunks/user-detail.18e4fc9dd2205256c175.hot-update.js",
"/chunks/user-detail.4764e411965ddc466cef.hot-update.js": "/chunks/user-detail.4764e411965ddc466cef.hot-update.js",
"/chunks/user-detail.1032856ab3d7bb41e1d5.hot-update.js": "/chunks/user-detail.1032856ab3d7bb41e1d5.hot-update.js",
"/chunks/user-detail.36db560c5e47d742a0e3.hot-update.js": "/chunks/user-detail.36db560c5e47d742a0e3.hot-update.js",
"/chunks/user-detail.bb65599b865cb6c6fd94.hot-update.js": "/chunks/user-detail.bb65599b865cb6c6fd94.hot-update.js",
"/chunks/user-detail.054c759ab277669b911d.hot-update.js": "/chunks/user-detail.054c759ab277669b911d.hot-update.js",
"/chunks/user-detail.efe8479c4d966a3637cd.hot-update.js": "/chunks/user-detail.efe8479c4d966a3637cd.hot-update.js",
"/chunks/admin~chunks/platform~chunks/settings~chunks/shared.0476f9dee6936d40d67d.hot-update.js": "/chunks/admin~chunks/platform~chunks/settings~chunks/shared.0476f9dee6936d40d67d.hot-update.js",
"/chunks/admin~chunks/platform~chunks/settings~chunks/shared.4381d093140851cab911.hot-update.js": "/chunks/admin~chunks/platform~chunks/settings~chunks/shared.4381d093140851cab911.hot-update.js",
"/chunks/files.c872880210d244308cb8.hot-update.js": "/chunks/files.c872880210d244308cb8.hot-update.js",
"/chunks/files.7a96194fd2f1d1376aa2.hot-update.js": "/chunks/files.7a96194fd2f1d1376aa2.hot-update.js",
"/js/main.efe74fff9706704ac048.hot-update.js": "/js/main.efe74fff9706704ac048.hot-update.js",
"/chunks/admin~chunks/platform~chunks/settings~chunks/shared.659981866351d19d0764.hot-update.js": "/chunks/admin~chunks/platform~chunks/settings~chunks/shared.659981866351d19d0764.hot-update.js",
"/js/main.7df5e807a2d740b9cd45.hot-update.js": "/js/main.7df5e807a2d740b9cd45.hot-update.js",
"/js/main.39b7277f6835aa7e25e3.hot-update.js": "/js/main.39b7277f6835aa7e25e3.hot-update.js",
"/chunks/admin~chunks/platform~chunks/settings~chunks/shared.295c68b9a8a0897e9546.hot-update.js": "/chunks/admin~chunks/platform~chunks/settings~chunks/shared.295c68b9a8a0897e9546.hot-update.js",
"/chunks/user.8f96214379adc060d678.hot-update.js": "/chunks/user.8f96214379adc060d678.hot-update.js",
"/js/main.60174dff1b4a369b6146.hot-update.js": "/js/main.60174dff1b4a369b6146.hot-update.js",
"/js/main.7419a56b92cec81b994a.hot-update.js": "/js/main.7419a56b92cec81b994a.hot-update.js",
"/chunks/files.07eb2ca74dbfccd76dd7.hot-update.js": "/chunks/files.07eb2ca74dbfccd76dd7.hot-update.js",
"/chunks/files.62bb2b2571784a23189c.hot-update.js": "/chunks/files.62bb2b2571784a23189c.hot-update.js",
"/chunks/files.5def7db6494900156cfc.hot-update.js": "/chunks/files.5def7db6494900156cfc.hot-update.js",
"/chunks/files.9306c4fb41e05ba548ba.hot-update.js": "/chunks/files.9306c4fb41e05ba548ba.hot-update.js",
"/chunks/admin~chunks/platform~chunks/settings~chunks/shared.365deddc7e2deb1642b5.hot-update.js": "/chunks/admin~chunks/platform~chunks/settings~chunks/shared.365deddc7e2deb1642b5.hot-update.js",
"/chunks/admin~chunks/platform~chunks/settings~chunks/shared.55d5048c7066b0e543f6.hot-update.js": "/chunks/admin~chunks/platform~chunks/settings~chunks/shared.55d5048c7066b0e543f6.hot-update.js",
"/chunks/admin~chunks/platform~chunks/settings~chunks/shared.45dc39b8441992867a5a.hot-update.js": "/chunks/admin~chunks/platform~chunks/settings~chunks/shared.45dc39b8441992867a5a.hot-update.js",
"/js/main.c92cc03fddf6d6417564.hot-update.js": "/js/main.c92cc03fddf6d6417564.hot-update.js",
"/js/main.91f8c050a2b9c017fd2c.hot-update.js": "/js/main.91f8c050a2b9c017fd2c.hot-update.js",
"/chunks/user.6633e3b99a118103afcd.hot-update.js": "/chunks/user.6633e3b99a118103afcd.hot-update.js",
"/chunks/user.b6c5cadce1a4cc3e57b1.hot-update.js": "/chunks/user.b6c5cadce1a4cc3e57b1.hot-update.js",
"/chunks/files.72b9223e613c0cc96ec6.hot-update.js": "/chunks/files.72b9223e613c0cc96ec6.hot-update.js",
"/chunks/user.e22b4a2882ffbf332733.hot-update.js": "/chunks/user.e22b4a2882ffbf332733.hot-update.js",
"/chunks/admin.89ed40f37951f2dc8561.hot-update.js": "/chunks/admin.89ed40f37951f2dc8561.hot-update.js",
"/chunks/user.33012ef1c526d159da35.hot-update.js": "/chunks/user.33012ef1c526d159da35.hot-update.js",
"/chunks/admin.2f60d06d2221a8692392.hot-update.js": "/chunks/admin.2f60d06d2221a8692392.hot-update.js",
"/chunks/user.8a69fedbc7629db9b892.hot-update.js": "/chunks/user.8a69fedbc7629db9b892.hot-update.js",
"/chunks/user.aa99854157f12061ec2b.hot-update.js": "/chunks/user.aa99854157f12061ec2b.hot-update.js",
"/chunks/user.e9d13004aeae43dab7dd.hot-update.js": "/chunks/user.e9d13004aeae43dab7dd.hot-update.js",
"/chunks/user.f5db99a4daa8976e3847.hot-update.js": "/chunks/user.f5db99a4daa8976e3847.hot-update.js",
"/chunks/user.8de7c768ca03be80f100.hot-update.js": "/chunks/user.8de7c768ca03be80f100.hot-update.js",
"/chunks/user.70bef041652071b397e0.hot-update.js": "/chunks/user.70bef041652071b397e0.hot-update.js",
"/chunks/admin~chunks/platform~chunks/settings~chunks/shared.35b687434114d1927d15.hot-update.js": "/chunks/admin~chunks/platform~chunks/settings~chunks/shared.35b687434114d1927d15.hot-update.js",
"/chunks/user.d40e7525468051298d56.hot-update.js": "/chunks/user.d40e7525468051298d56.hot-update.js",
"/chunks/user.90ecc2120cd7c9976a85.hot-update.js": "/chunks/user.90ecc2120cd7c9976a85.hot-update.js",
"/chunks/user.e1e01ba03c299e562cc2.hot-update.js": "/chunks/user.e1e01ba03c299e562cc2.hot-update.js",
"/chunks/user.45ce716c540fc3c1d8ee.hot-update.js": "/chunks/user.45ce716c540fc3c1d8ee.hot-update.js"
}

View File

@@ -34,7 +34,7 @@ import {mapGetters} from 'vuex'
import {events} from './bus'
export default {
name: 'app',
name: 'App',
components: {
CookieDisclaimer,
ToasterWrapper,

View File

@@ -61,7 +61,7 @@
v-if="singleFile.data.attributes.isTeamFolder"
:title="$t('Shared with the Team')"
>
<div class="action-button" @click="$updateTeamFolder(singleFile)">
<div class="flex items-center cursor-pointer" @click="$updateTeamFolder(singleFile)">
<TeamMembersPreview :folder="singleFile" :avatar-size="32" />
<Edit2Icon size="10" class="ml-2" />
</div>

View File

@@ -0,0 +1,62 @@
<template>
<div class="relative cursor-pointer">
<input
ref="file"
type="file"
@change="showImagePreview($event)"
class="absolute opacity-0 top-0 bottom-0 left-0 right-0 w-full z-10 cursor-pointer"
/>
<img
v-if="imagePreview"
ref="image"
:src="imagePreview"
class="md:w-16 w-14 md:h-16 h-14 object-cover rounded-xl relative z-0 shadow-lg cursor-pointer"
alt="avatar"
/>
</div>
</template>
<script>
export default {
name: 'AvatarInput',
props: [
'avatar',
],
data() {
return {
imagePreview: undefined
}
},
watch: {
imagePreview(val) {
this.$store.commit('UPDATE_AVATAR', val)
}
},
methods: {
showImagePreview(event) {
let imgPath = event.target.files[0].name,
extension = imgPath
.substring(imgPath.lastIndexOf('.') + 1)
.toLowerCase()
if (['png', 'jpg', 'jpeg'].includes(extension)) {
let file = event.target.files[0],
reader = new FileReader()
reader.onload = () => (this.imagePreview = reader.result)
reader.readAsDataURL(file)
// Update user avatar
this.$updateImage('/user/settings', 'avatar', event.target.files[0])
} else {
alert(this.$t('validation_errors.wrong_image'))
}
}
},
created() {
// If there is default image then load
if (this.avatar) this.imagePreview = this.avatar
}
}
</script>

View File

@@ -350,6 +350,7 @@
this.shareOptions = undefined
this.pickedItem = undefined
this.activeSection = undefined
this.qrCode = undefined
}, 150)
})
}

View File

@@ -1,101 +0,0 @@
<template>
<div class="dropzone" :class="{ 'is-error': error }">
<input
ref="file"
type="file"
@change="showImagePreview($event)"
:name="name"
class="dummy"
/>
<img
ref="image"
:src="imagePreview"
class="image-preview"
v-if="imagePreview"
/>
<img
ref="image"
:src="imagePreview"
class="image-preview blurred"
v-if="imagePreview"
/>
</div>
</template>
<script>
export default {
props: ['label', 'name', 'avatar', 'info', 'error'],
data() {
return {
imagePreview: undefined
}
},
watch: {
imagePreview(val) {
this.$store.commit('UPDATE_AVATAR', val)
}
},
methods: {
showImagePreview(event) {
const imgPath = event.target.files[0].name,
extn = imgPath
.substring(imgPath.lastIndexOf('.') + 1)
.toLowerCase()
if (['png', 'jpg', 'jpeg'].includes(extn)) {
const file = event.target.files[0],
reader = new FileReader()
reader.onload = () => (this.imagePreview = reader.result)
reader.readAsDataURL(file)
// Update user avatar
this.$updateImage('/user/settings', 'avatar', event.target.files[0])
} else {
alert( this.$t('validation_errors.wrong_image') )
}
}
},
created() {
// If has default image then load
if (this.avatar) this.imagePreview = this.avatar
}
}
</script>
<style lang="scss" scoped>
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.dropzone {
position: relative;
line-height: 0;
input[type='file'] {
opacity: 0;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 2;
width: 100%;
cursor: pointer;
}
.image-preview {
width: 62px;
height: 62px;
object-fit: cover;
border-radius: 8px;
z-index: 1;
position: relative;
}
.blurred {
@include blurred-image;
}
}
</style>

View File

@@ -128,6 +128,7 @@
v-if="activeFilter === 'users' && !result.action"
:class="{'dark:bg-4x-dark-foreground bg-light-background rounded-xl': (i + actions.length) === index}"
class="flex items-center px-2.5 py-3.5"
@click="openUser(result)"
>
<MemberAvatar
:is-border="false"
@@ -733,7 +734,9 @@ export default {
this.isVisible = true
this.activeFilter = filter
this.$nextTick(() => this.$refs.searchInput.focus())
this.$nextTick(() => {
if (this.$refs.searchInput) this.$refs.searchInput.focus()
})
})
events.$on('spotlight:hide', () => this.exitSpotlight())

View File

@@ -3,19 +3,29 @@
<div id="page-content" v-if="! isLoading">
<!--Page Tab links-->
<div class="card shadow-card pt-4 sticky top-0 z-10" style="padding-bottom: 0;">
<div class="user-thumbnail">
<div class="avatar">
<img :src="user.data.relationships.settings.data.attributes.avatar.sm" :alt="user.data.relationships.settings.data.attributes.name">
<!--<img :src="user.data.attributes.avatar" :alt="user.data.attributes.name" class="blurred">-->
</div>
<div class="info">
<b class="name">
{{ user.data.relationships.settings.data.attributes.name }}
<!--User thumbnail-->
<div class="flex items-center mb-3">
<!--Image input for replace avatar-->
<img
:src="user.data.relationships.settings.data.attributes.avatar.sm" :alt="user.data.relationships.settings.data.attributes.name"
class="md:w-16 w-14 md:h-16 h-14 object-cover rounded-xl relative z-0 shadow-lg cursor-pointer"
/>
<!--User name & email-->
<div class="ml-4">
<b class="sm:text-lg text-md font-bold block">
{{ user.data.relationships.settings.data.attributes.first_name }} {{ user.data.relationships.settings.data.attributes.last_name }}
<ColorLabel color="purple">
{{ user.data.attributes.role }}
</ColorLabel>
</b>
<span class="email">{{ user.data.attributes.email }}</span>
<small class="sm:text-sm text-xs text-gray-600 block">
{{ user.data.attributes.email }}
</small>
</div>
</div>
@@ -26,7 +36,7 @@
<router-view :user="user" @reload-user="fetchUser"/>
</div>
<div id="loader" v-if="isLoading">
<Spinner></Spinner>
<Spinner />
</div>
</div>
</template>
@@ -59,6 +69,11 @@
LockIcon,
Spinner,
},
watch: {
'$route.fullPath': function() {
this.fetchUser()
}
},
computed: {
...mapGetters([
'config'
@@ -134,66 +149,3 @@
}
}
</script>
<style lang="scss" scoped>
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.user-thumbnail {
display: flex;
align-items: center;
cursor: pointer;
padding-bottom: 10px;
padding-top: 15px;
.avatar {
margin-right: 20px;
position: relative;
img {
line-height: 0;
width: 62px;
height: 62px;
border-radius: 12px;
z-index: 1;
position: relative;
&.blurred {
@include blurred-image;
top: 0;
}
}
}
.info {
.name {
display: block;
@include font-size(17);
line-height: 1;
}
.email {
color: $text-muted;
@include font-size(14);
}
}
}
@media only screen and (max-width: 960px) {
}
.dark {
.user-thumbnail {
.info {
.email {
color: $dark_mode_text_secondary;
}
}
}
}
</style>

View File

@@ -31,7 +31,7 @@
:value="user.data.relationships.settings.data.attributes.first_name"
:placeholder="$t('page_registration.placeholder_name')"
type="text"
class="focus-border-theme input-dark"
class="disabled:text-gray-900 disabled:opacity-100 focus-border-theme input-dark"
/>
</AppInputText>
<AppInputText :title="$t('Last Name')" class="w-full">
@@ -40,7 +40,7 @@
:value="user.data.relationships.settings.data.attributes.last_name"
:placeholder="$t('page_registration.placeholder_name')"
type="text"
class="focus-border-theme input-dark"
class="disabled:text-gray-900 disabled:opacity-100 focus-border-theme input-dark"
/>
</AppInputText>
</div>
@@ -49,7 +49,7 @@
<input :value="user.data.relationships.settings.data.attributes.name"
:placeholder="$t('page_registration.placeholder_name')"
type="text"
class="focus-border-theme input-dark"
class="disabled:text-gray-900 disabled:opacity-100 focus-border-theme input-dark"
disabled
/>
</AppInputText>
@@ -59,7 +59,7 @@
<AppInputText :title="$t('user_settings.name')">
<input :value="user.data.relationships.settings.data.attributes.name"
type="text"
class="focus-border-theme input-dark"
class="disabled:text-gray-900 disabled:opacity-100 focus-border-theme input-dark"
disabled
/>
</AppInputText>
@@ -67,14 +67,14 @@
<input :value="user.data.relationships.settings.data.attributes.address"
type="text"
disabled
class="focus-border-theme input-dark"
class="disabled:text-gray-900 disabled:opacity-100 focus-border-theme input-dark"
/>
</AppInputText>
<AppInputText :title="$t('user_settings.country')">
<input :value="user.data.relationships.settings.data.attributes.country"
type="text"
disabled
class="focus-border-theme input-dark"
class="disabled:text-gray-900 disabled:opacity-100 focus-border-theme input-dark"
/>
</AppInputText>
<div class="flex space-x-4">
@@ -82,14 +82,14 @@
<input :value="user.data.relationships.settings.data.attributes.city"
type="text"
disabled
class="focus-border-theme input-dark"
class="disabled:text-gray-900 disabled:opacity-100 focus-border-theme input-dark"
/>
</AppInputText>
<AppInputText :title="$t('user_settings.postal_code')" class="w-full">
<input :value="user.data.relationships.settings.data.attributes.postal_code"
type="text"
disabled
class="focus-border-theme input-dark"
class="disabled:text-gray-900 disabled:opacity-100 focus-border-theme input-dark"
/>
</AppInputText>
</div>
@@ -97,14 +97,14 @@
<input :value="user.data.relationships.settings.data.attributes.state"
type="text"
disabled
class="focus-border-theme input-dark"
class="disabled:text-gray-900 disabled:opacity-100 focus-border-theme input-dark"
/>
</AppInputText>
<AppInputText :title="$t('user_settings.phone_number')" :is-last="true">
<input :value="user.data.relationships.settings.data.attributes.phone_number"
type="text"
disabled
class="focus-border-theme input-dark"
class="disabled:text-gray-900 disabled:opacity-100 focus-border-theme input-dark"
/>
</AppInputText>
</div>

View File

@@ -208,8 +208,8 @@
this.$store.dispatch('getFolder', this.$route.params.id)
events.$on('context-menu:show', (event, item) => this.item = item)
events.$on('mobile-context-menu:show', item => this.item = item)
events.$on('context-menu:current-folder', folder => this.item = folder)
events.$on('mobile-context-menu:show', item => this.item = item)
}
}
</script>

View File

@@ -35,20 +35,20 @@
<div class="flex items-center mb-3">
<!--Image input for replace avatar-->
<UserImageInput v-model="avatar" :avatar="user.data.relationships.settings.data.attributes.avatar.md" />
<AvatarInput v-model="avatar" :avatar="user.data.relationships.settings.data.attributes.avatar.md" />
<!--User name & email-->
<div class="pl-4">
<b class="sm:text-lg text-md font-bold block sm:leading-6 leading-3">
<div class="ml-4">
<b class="sm:text-lg text-md font-bold block">
{{ user.data.relationships.settings.data.attributes.first_name }} {{ user.data.relationships.settings.data.attributes.last_name }}
<ColorLabel v-if="config.subscriptionType === 'fixed'" :color="subscriptionColor">
{{ subscriptionStatus }}
</ColorLabel>
</b>
<span class="sm:text-sm text-xs text-gray-600">
<small class="sm:text-sm text-xs text-gray-600 block">
{{ user.data.attributes.email }}
</span>
</small>
</div>
</div>
@@ -75,7 +75,7 @@
import TwoFactorRecoveryCodesPopup from '/resources/js/components/Others/TwoFactorRecoveryCodesPopup'
import CreatePersonalTokenPopup from '/resources/js/components/Others/CreatePersonalTokenPopup'
import TwoFactorQrSetupPopup from '/resources/js/components/Others/TwoFactorQrSetupPopup'
import UserImageInput from '/resources/js/components/Others/UserImageInput'
import AvatarInput from '/resources/js/components/Others/Forms/AvatarInput'
import SidebarNavigation from "../components/Sidebar/SidebarNavigation"
import ColorLabel from '/resources/js/components/Others/ColorLabel'
import Spinner from '/resources/js/components/FilesView/Spinner'
@@ -100,7 +100,7 @@
CreatePersonalTokenPopup,
TwoFactorQrSetupPopup,
SidebarNavigation,
UserImageInput,
AvatarInput,
ColorLabel,
Spinner,

5
tailwind.config.js vendored
View File

@@ -58,7 +58,10 @@ module.exports = {
},
},
variants: {
extend: {},
extend: {
textColor: ['disabled'],
opacity: ['disabled'],
},
},
plugins: [
require('tailwindcss-debug-screens'),