UNPKG

@amaury-tobias/v-avatar

Version:

Componente de avatar basado en Vue.js

amaury-tobias.github.io/v-avatar/

amaury-tobias/v-avatar

78 lines (65 loc) • 1.43 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
--- prev: /guide/ next: false --- # Demo ## Default <br> <v-avatar /> ```html <v-avatar username="Amaury Tobias" /> ``` ## Properties <br> <v-avatar inline username="Amaury-Tobias Quiroz" background-color="#FFC107" :size="100" rounded :lighten="20"></v-avatar> <v-avatar inline username="Amaury-Tobias Quiroz" background-color="#FFC107" :size="100" color="#fff"></v-avatar> ```html <v-avatar inline username="Amaury-Tobias Quiroz" background-color="#FFC107" :size="100" rounded :lighten="20" ></v-avatar> <v-avatar inline username="Amaury-Tobias Quiroz" background-color="#FFC107" :size="100" color="#fff" ></v-avatar> ``` ## Using `src` <br> <v-avatar inline username="Cutte Puppy" src="https://www.welt.de/img/wissenschaft/umwelt/mobile132259361/3372502257-ci102l-w1024/MEXICAN-AXOLOTL.jpg" :size="100" rounded ></v-avatar> <v-avatar inline username="Cutte Puppy" src="https://i.pinimg.com/236x/45/37/ab/4537abebd9bebe9ac09ca93707367b19.jpg" :size="100" rounded ></v-avatar> <v-avatar inline username="Cutte Puppy" src="http://stylearena.net/wp-content/uploads/2015/04/beautiful-cats-hd-wallpapers-16.jpg" :size="100" rounded ></v-avatar> ```html <v-avatar username="Cutte Puppy" src="CuttePuppy.jpg" :size="100" rounded ></v-avatar> ``` ## Colors <v-avatar inline v-for="i in 18" :username='"A".repeat(i)' :initials="i.toString()" :key="i"></v-avatar>