@burh/nuxt-core 1.0.180 → 1.0.181
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -0,0 +1,149 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="card-body">
|
|
3
|
+
<h4 class="aria-text">Funcionalidades</h4>
|
|
4
|
+
<ul class="list-unstyled list line-card">
|
|
5
|
+
<li class="functionality-item text-center cursor-pointer card-item">
|
|
6
|
+
<div class="functionality-item--icone item"></div>
|
|
7
|
+
</li>
|
|
8
|
+
<li
|
|
9
|
+
class="functionality-item text-center cursor-pointer border-left card-item"
|
|
10
|
+
>
|
|
11
|
+
<div class="functionality-item--icone item"></div>
|
|
12
|
+
</li>
|
|
13
|
+
</ul>
|
|
14
|
+
<hr />
|
|
15
|
+
<div class="item-text"></div>
|
|
16
|
+
<ul class="list-unstyled list line-card">
|
|
17
|
+
<li class="performance-item primary">
|
|
18
|
+
<span class="performance-item--title item"></span>
|
|
19
|
+
<span class="performance-item--value"></span>
|
|
20
|
+
</li>
|
|
21
|
+
<li class="performance-item">
|
|
22
|
+
<span class="performance-item--title item"></span>
|
|
23
|
+
<span class="performance-item--value"></span>
|
|
24
|
+
</li>
|
|
25
|
+
<li class="performance-item">
|
|
26
|
+
<span class="performance-item--title item"></span>
|
|
27
|
+
<span class="performance-item--value"></span>
|
|
28
|
+
</li>
|
|
29
|
+
</ul>
|
|
30
|
+
<div class="item-text w-50 mt-5"></div>
|
|
31
|
+
</div>
|
|
32
|
+
</template>
|
|
33
|
+
|
|
34
|
+
<script>
|
|
35
|
+
export default {
|
|
36
|
+
name: 'home-skeleton'
|
|
37
|
+
};
|
|
38
|
+
</script>
|
|
39
|
+
|
|
40
|
+
<style lang="scss" scoped>
|
|
41
|
+
.item {
|
|
42
|
+
width: 50px;
|
|
43
|
+
height: 50px;
|
|
44
|
+
border-radius: 50%;
|
|
45
|
+
|
|
46
|
+
-webkit-animation-duration: 1s;
|
|
47
|
+
-webkit-animation-fill-mode: forwards;
|
|
48
|
+
-webkit-animation-iteration-count: infinite;
|
|
49
|
+
-webkit-animation-name: placeholderSkeleton;
|
|
50
|
+
-webkit-animation-timing-function: linear;
|
|
51
|
+
background: #e0e3e6;
|
|
52
|
+
background-image: -webkit-gradient(
|
|
53
|
+
linear,
|
|
54
|
+
left center,
|
|
55
|
+
right center,
|
|
56
|
+
from(#e0e3e6),
|
|
57
|
+
color-stop(0.2, #edeef1),
|
|
58
|
+
color-stop(0.4, #e0e3e6),
|
|
59
|
+
to(#e0e3e6)
|
|
60
|
+
);
|
|
61
|
+
background-image: -webkit-linear-gradient(
|
|
62
|
+
left,
|
|
63
|
+
#e0e3e6 0%,
|
|
64
|
+
#edeef1 20%,
|
|
65
|
+
#e0e3e6 40%,
|
|
66
|
+
#e0e3e6 100%
|
|
67
|
+
);
|
|
68
|
+
background-repeat: no-repeat;
|
|
69
|
+
background-size: 800px 104px;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
.item-text {
|
|
73
|
+
width: 100px;
|
|
74
|
+
height: 20px;
|
|
75
|
+
border-radius: 5px;
|
|
76
|
+
|
|
77
|
+
-webkit-animation-duration: 1s;
|
|
78
|
+
-webkit-animation-fill-mode: forwards;
|
|
79
|
+
-webkit-animation-iteration-count: infinite;
|
|
80
|
+
-webkit-animation-name: placeholderSkeleton;
|
|
81
|
+
-webkit-animation-timing-function: linear;
|
|
82
|
+
background: #e0e3e6;
|
|
83
|
+
background-image: -webkit-gradient(
|
|
84
|
+
linear,
|
|
85
|
+
left center,
|
|
86
|
+
right center,
|
|
87
|
+
from(#e0e3e6),
|
|
88
|
+
color-stop(0.2, #edeef1),
|
|
89
|
+
color-stop(0.4, #e0e3e6),
|
|
90
|
+
to(#e0e3e6)
|
|
91
|
+
);
|
|
92
|
+
background-image: -webkit-linear-gradient(
|
|
93
|
+
left,
|
|
94
|
+
#e0e3e6 0%,
|
|
95
|
+
#edeef1 20%,
|
|
96
|
+
#e0e3e6 40%,
|
|
97
|
+
#e0e3e6 100%
|
|
98
|
+
);
|
|
99
|
+
background-repeat: no-repeat;
|
|
100
|
+
background-size: 800px 104px;
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
.functionality-item {
|
|
104
|
+
display: flex;
|
|
105
|
+
flex-direction: column;
|
|
106
|
+
color: #258bf4;
|
|
107
|
+
line-height: 2.5;
|
|
108
|
+
|
|
109
|
+
&--icone {
|
|
110
|
+
margin-left: 7rem;
|
|
111
|
+
font-size: 1.75rem;
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
&--text {
|
|
115
|
+
font-size: 1rem;
|
|
116
|
+
}
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
.performance-item {
|
|
120
|
+
display: flex;
|
|
121
|
+
flex-direction: column;
|
|
122
|
+
&--title {
|
|
123
|
+
font-size: 1rem;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
&--value {
|
|
127
|
+
font-size: 1.75rem;
|
|
128
|
+
align-self: center;
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
.list {
|
|
133
|
+
margin: 1.8rem 0;
|
|
134
|
+
display: flex;
|
|
135
|
+
justify-content: space-evenly;
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
.line-card {
|
|
139
|
+
ul {
|
|
140
|
+
&:not(:first-child) {
|
|
141
|
+
border: 2px solid #e9ecef;
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
.card-item {
|
|
147
|
+
width: 50%;
|
|
148
|
+
}
|
|
149
|
+
</style>
|