0
0
Fork 0

Add icon for missing profile pictures.

This commit is contained in:
Tyler-A 2020-08-02 16:15:00 -06:00
parent 0e15049416
commit bbc424069a

View file

@ -4,10 +4,26 @@
v-if="username" v-if="username"
id="user_data" id="user_data"
> >
<img
v-if="user.image"
src="user.image"
alt="`${user.name}'s profile picture`"
:width="img_size"
:height="img_size"
>
<icon
v-else
type="notes"
:size="40"
:border="20"
:inner_size="20"
:primary="css_var('--missing-picture-foreground')"
:background="css_var('--missing-picture-background')"
/>
{{ username }} {{ username }}
</div> </div>
<div id="type"> <div id="type">
<select v-model="type"> <select v-model="type" @change="verify_request_amount()">
<option value="" disabled>Select a Type</option> <option value="" disabled>Select a Type</option>
<option>Tracks</option> <option>Tracks</option>
<option>Artists</option> <option>Artists</option>
@ -54,6 +70,8 @@
</template> </template>
<script> <script>
import Icon from "./Icon.vue";
export default { export default {
name: `ControlBar`, name: `ControlBar`,
props: { props: {
@ -61,8 +79,11 @@ export default {
dev: Boolean, dev: Boolean,
preview: Boolean, preview: Boolean,
}, },
components: {}, components: {
icon: Icon,
},
data() { return { data() { return {
img_size: '50',
error: ``, error: ``,
user: { user: {
name: ``, name: ``,
@ -120,14 +141,11 @@ export default {
} }
}, },
data_request() { data_request() {
let amount = parseInt(this.amount);
if (amount) {
this.event(`data_request`, { this.event(`data_request`, {
type: this.type, type: this.type,
amount: amount, amount: this.amount || `10`,
duration: this.duration, duration: this.duration,
}); });
};
}, },
} }
} }
@ -166,7 +184,6 @@ export default {
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
#control { #control {
flex-direction: row; flex-direction: row;
flex-wrap: wrap;
} }
} }
</style> </style>