@burh/nuxt-core 1.0.406 → 1.0.407

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.
@@ -1,261 +1,261 @@
1
- <template>
2
- <el-dialog
3
- :visible.sync="isActive"
4
- width="54%"
5
- custom-class="position-relative"
6
- @close="$emit('close')"
7
- >
8
- <template>
9
- <h2 class="display-4 mt-5 ml-5">Compartilhar</h2>
10
- <div class="d-flex justify-content-center align-items-center">
11
- <ul class="col-12 list-inline mb-4 mt-3 ml-5">
12
- <li
13
- class="p list-inline-item ml-2 cursor-pointer"
14
- @click="$emit('whatsapp-modal')"
15
- >
16
- <base-button
17
- icon
18
- type="whatsapp"
19
- class="btn--rounded mr-2"
20
- >
21
- <span class="btn-inner--icon"
22
- ><i class="fab fa-whatsapp"></i
23
- ></span>
24
- </base-button>
25
- <span class="btn-inner--text">Whatsapp</span>
26
- </li>
27
- <a
28
- v-if="slug"
29
- :href="`https://www.facebook.com/sharer/sharer.php?u=${baseUrl}/${slug}`"
30
- target="_blank"
31
- rel="noopener noreferrer"
32
- class="social social-link"
33
- >
34
- <li class="p list-inline-item ml-2 cursor-pointer">
35
- <base-button
36
- icon
37
- class="btn-facebook btn--rounded mr-2"
38
- >
39
- <span class="btn-inner--icon"
40
- ><i class="fab fa-facebook-f"></i
41
- ></span>
42
- </base-button>
43
- <span class="btn-inner--text">Facebook</span>
44
- </li>
45
- </a>
46
- <a
47
- v-if="slug"
48
- :href="`https://twitter.com/intent/tweet?text=${baseUrl}/${slug}`"
49
- target="_blank"
50
- rel="noopener noreferrer"
51
- class="social social-link"
52
- >
53
- <li class="p list-inline-item ml-2 cursor-pointer">
54
- <base-button
55
- icon
56
- class="btn-twitter btn--rounded mr-2"
57
- >
58
- <span class="btn-inner--icon"
59
- ><i class="fab fa-twitter"></i
60
- ></span>
61
- </base-button>
62
- <span class="btn-inner--text">Twitter</span>
63
- </li>
64
- </a>
65
- <a
66
- v-if="slug"
67
- :href="`https://www.linkedin.com/sharing/share-offsite/?url=${baseUrl}/${slug}`"
68
- target="_blank"
69
- rel="noopener noreferrer"
70
- class="social social-link"
71
- >
72
- <li class="p list-inline-item ml-2 cursor-pointer">
73
- <base-button
74
- icon
75
- class="btn-linkedin btn--rounded mr-2"
76
- >
77
- <span class="btn-inner--icon"
78
- ><i class="fab fa-linkedin-in"></i
79
- ></span>
80
- </base-button>
81
- <span class="btn-inner--text">Linkedin</span>
82
- </li>
83
- </a>
84
- </ul>
85
- </div>
86
-
87
- <div class="row">
88
- <div class="col-8" @click="copyToClipboard">
89
- <label class="ml-5 social social-label" for="linkShareModal"
90
- >Link compartilhável</label
91
- >
92
- <input
93
- v-if="slug"
94
- id="linkShareModal"
95
- :value="`${baseUrl}/${slug}`"
96
- type="text"
97
- class="ml-5 form-control social social-input"
98
- readonly
99
- />
100
- </div>
101
-
102
- <div class="col-4 text-center pt-1">
103
- <base-button
104
- id="btnCopyLinkShare"
105
- size="sm"
106
- type="outline-primary"
107
- class="mt-4"
108
- @click="copyToClipboard"
109
- >
110
- Copiar
111
- </base-button>
112
- </div>
113
- </div>
114
-
115
- <span class="tool tool-close" @click="$emit('close-modal')">
116
- Fechar
117
- <font-awesome-icon
118
- :icon="['fas', 'times']"
119
- class="text-white ml-1"
120
- />
121
- </span>
122
- </template>
123
- </el-dialog>
124
- </template>
125
-
126
- <script>
127
- import { Dialog } from 'element-ui';
128
-
129
- export default {
130
- name: 'shared-modal',
131
- components: {
132
- [Dialog.name]: Dialog
133
- },
134
- props: {
135
- isActive: Boolean,
136
- userData: Object,
137
- baseUrl: String
138
- },
139
- data() {
140
- return {
141
- slug: null
142
- };
143
- },
144
- methods: {
145
- copyToClipboard() {
146
- let text = document.getElementById('linkShareModal');
147
- let btnCopy = document.getElementById('btnCopyLinkShare');
148
- text.select();
149
- document.execCommand('copy');
150
-
151
- btnCopy.innerText = 'Copiado';
152
- btnCopy.classList.remove('btn-outline-primary');
153
- btnCopy.classList.add('btn-primary');
154
-
155
- setTimeout(() => {
156
- btnCopy.innerText = 'Copiar';
157
- btnCopy.classList.remove('btn-primary');
158
- btnCopy.classList.add('btn-outline-primary');
159
- }, 3000);
160
- }
161
- },
162
- watch: {
163
- isActive(newValue) {
164
- !newValue && this.$emit('close-modal');
165
- },
166
- userData(userData) {
167
- if (userData.slug) {
168
- this.slug = userData.slug.slug || null;
169
- }
170
- }
171
- }
172
- };
173
- </script>
174
-
175
- <style lang="scss" scoped>
176
- @import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
177
-
178
- /deep/ .el-dialog__body {
179
- padding: 0;
180
- }
181
-
182
- /deep/ .el-dialog__header {
183
- display: none;
184
- }
185
-
186
- /deep/ .el-dialog {
187
- overflow: hidden;
188
- border-radius: 10px;
189
- padding-bottom: 50px;
190
- max-width: 725px;
191
- min-width: 725px;
192
- }
193
-
194
- .social {
195
- &-label {
196
- color: #8898aa;
197
- text-transform: uppercase;
198
- }
199
-
200
- &-input {
201
- /* width: 300px; */
202
- border: none;
203
- border-radius: 5px;
204
- background: #e9ecef;
205
- color: #32325d;
206
- padding-left: 15px;
207
- outline: 0;
208
- cursor: pointer;
209
- }
210
-
211
- &-link {
212
- color: #606266;
213
- }
214
- }
215
-
216
- .tool {
217
- position: absolute;
218
- top: 1rem;
219
- z-index: 10;
220
- color: $primary;
221
- cursor: pointer;
222
-
223
- &-close {
224
- position: absolute;
225
- width: 88px;
226
- height: 27px;
227
- right: 7px;
228
- top: 7px;
229
- display: flex;
230
- justify-content: center;
231
- align-items: center;
232
-
233
- font-size: 11px;
234
-
235
- font-weight: 500;
236
- background: rgba(0, 0, 0, 0.2);
237
- border-radius: 17.5px;
238
- color: #fff;
239
- }
240
- }
241
-
242
- .btn-whatsapp:hover {
243
- color: white;
244
- }
245
-
246
- .btn-email {
247
- color: white;
248
- background-color: $primary !important;
249
- border-color: $primary !important;
250
- }
251
-
252
- .btn--rounded {
253
- font-size: 1.5rem;
254
- margin: 0;
255
- padding: 0;
256
- line-height: 0;
257
- min-width: 0;
258
- width: 3rem;
259
- height: 3rem;
260
- }
261
- </style>
1
+ <template>
2
+ <el-dialog
3
+ :visible.sync="isActive"
4
+ width="54%"
5
+ custom-class="position-relative"
6
+ @close="$emit('close')"
7
+ >
8
+ <template>
9
+ <h2 class="display-4 mt-5 ml-5">Compartilhar</h2>
10
+ <div class="d-flex justify-content-center align-items-center">
11
+ <ul class="col-12 list-inline mb-4 mt-3 ml-5">
12
+ <li
13
+ class="p list-inline-item ml-2 cursor-pointer"
14
+ @click="$emit('whatsapp-modal')"
15
+ >
16
+ <base-button
17
+ icon
18
+ type="whatsapp"
19
+ class="btn--rounded mr-2"
20
+ >
21
+ <span class="btn-inner--icon"
22
+ ><i class="fab fa-whatsapp"></i
23
+ ></span>
24
+ </base-button>
25
+ <span class="btn-inner--text">Whatsapp</span>
26
+ </li>
27
+ <a
28
+ v-if="slug"
29
+ :href="`https://www.facebook.com/sharer/sharer.php?u=${baseUrl}/${slug}`"
30
+ target="_blank"
31
+ rel="noopener noreferrer"
32
+ class="social social-link"
33
+ >
34
+ <li class="p list-inline-item ml-2 cursor-pointer">
35
+ <base-button
36
+ icon
37
+ class="btn-facebook btn--rounded mr-2"
38
+ >
39
+ <span class="btn-inner--icon"
40
+ ><i class="fab fa-facebook-f"></i
41
+ ></span>
42
+ </base-button>
43
+ <span class="btn-inner--text">Facebook</span>
44
+ </li>
45
+ </a>
46
+ <a
47
+ v-if="slug"
48
+ :href="`https://twitter.com/intent/tweet?text=${baseUrl}/${slug}`"
49
+ target="_blank"
50
+ rel="noopener noreferrer"
51
+ class="social social-link"
52
+ >
53
+ <li class="p list-inline-item ml-2 cursor-pointer">
54
+ <base-button
55
+ icon
56
+ class="btn-twitter btn--rounded mr-2"
57
+ >
58
+ <span class="btn-inner--icon"
59
+ ><i class="fab fa-twitter"></i
60
+ ></span>
61
+ </base-button>
62
+ <span class="btn-inner--text">Twitter</span>
63
+ </li>
64
+ </a>
65
+ <a
66
+ v-if="slug"
67
+ :href="`https://www.linkedin.com/sharing/share-offsite/?url=${baseUrl}/${slug}`"
68
+ target="_blank"
69
+ rel="noopener noreferrer"
70
+ class="social social-link"
71
+ >
72
+ <li class="p list-inline-item ml-2 cursor-pointer">
73
+ <base-button
74
+ icon
75
+ class="btn-linkedin btn--rounded mr-2"
76
+ >
77
+ <span class="btn-inner--icon"
78
+ ><i class="fab fa-linkedin-in"></i
79
+ ></span>
80
+ </base-button>
81
+ <span class="btn-inner--text">Linkedin</span>
82
+ </li>
83
+ </a>
84
+ </ul>
85
+ </div>
86
+
87
+ <div class="row">
88
+ <div class="col-8" @click="copyToClipboard">
89
+ <label class="ml-5 social social-label" for="linkShareModal"
90
+ >Link compartilhável</label
91
+ >
92
+ <input
93
+ v-if="slug"
94
+ id="linkShareModal"
95
+ :value="`${baseUrl}/${slug}`"
96
+ type="text"
97
+ class="ml-5 form-control social social-input"
98
+ readonly
99
+ />
100
+ </div>
101
+
102
+ <div class="col-4 text-center pt-1">
103
+ <base-button
104
+ id="btnCopyLinkShare"
105
+ size="sm"
106
+ type="outline-primary"
107
+ class="mt-4"
108
+ @click="copyToClipboard"
109
+ >
110
+ Copiar
111
+ </base-button>
112
+ </div>
113
+ </div>
114
+
115
+ <span class="tool tool-close" @click="$emit('close-modal')">
116
+ Fechar
117
+ <font-awesome-icon
118
+ :icon="['fas', 'times']"
119
+ class="text-white ml-1"
120
+ />
121
+ </span>
122
+ </template>
123
+ </el-dialog>
124
+ </template>
125
+
126
+ <script>
127
+ import { Dialog } from 'element-ui';
128
+
129
+ export default {
130
+ name: 'shared-modal',
131
+ components: {
132
+ [Dialog.name]: Dialog
133
+ },
134
+ props: {
135
+ isActive: Boolean,
136
+ userData: Object,
137
+ baseUrl: String
138
+ },
139
+ data() {
140
+ return {
141
+ slug: null
142
+ };
143
+ },
144
+ methods: {
145
+ copyToClipboard() {
146
+ let text = document.getElementById('linkShareModal');
147
+ let btnCopy = document.getElementById('btnCopyLinkShare');
148
+ text.select();
149
+ document.execCommand('copy');
150
+
151
+ btnCopy.innerText = 'Copiado';
152
+ btnCopy.classList.remove('btn-outline-primary');
153
+ btnCopy.classList.add('btn-primary');
154
+
155
+ setTimeout(() => {
156
+ btnCopy.innerText = 'Copiar';
157
+ btnCopy.classList.remove('btn-primary');
158
+ btnCopy.classList.add('btn-outline-primary');
159
+ }, 3000);
160
+ }
161
+ },
162
+ watch: {
163
+ isActive(newValue) {
164
+ !newValue && this.$emit('close-modal');
165
+ },
166
+ userData(userData) {
167
+ if (userData.slug) {
168
+ this.slug = userData.slug.slug || null;
169
+ }
170
+ }
171
+ }
172
+ };
173
+ </script>
174
+
175
+ <style lang="scss" scoped>
176
+ @import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
177
+
178
+ /deep/ .el-dialog__body {
179
+ padding: 0;
180
+ }
181
+
182
+ /deep/ .el-dialog__header {
183
+ display: none;
184
+ }
185
+
186
+ /deep/ .el-dialog {
187
+ overflow: hidden;
188
+ border-radius: 10px;
189
+ padding-bottom: 50px;
190
+ max-width: 725px;
191
+ min-width: 725px;
192
+ }
193
+
194
+ .social {
195
+ &-label {
196
+ color: #8898aa;
197
+ text-transform: uppercase;
198
+ }
199
+
200
+ &-input {
201
+ /* width: 300px; */
202
+ border: none;
203
+ border-radius: 5px;
204
+ background: #e9ecef;
205
+ color: #32325d;
206
+ padding-left: 15px;
207
+ outline: 0;
208
+ cursor: pointer;
209
+ }
210
+
211
+ &-link {
212
+ color: #606266;
213
+ }
214
+ }
215
+
216
+ .tool {
217
+ position: absolute;
218
+ top: 1rem;
219
+ z-index: 10;
220
+ color: $primary;
221
+ cursor: pointer;
222
+
223
+ &-close {
224
+ position: absolute;
225
+ width: 88px;
226
+ height: 27px;
227
+ right: 7px;
228
+ top: 7px;
229
+ display: flex;
230
+ justify-content: center;
231
+ align-items: center;
232
+
233
+ font-size: 11px;
234
+
235
+ font-weight: 500;
236
+ background: rgba(0, 0, 0, 0.2);
237
+ border-radius: 17.5px;
238
+ color: #fff;
239
+ }
240
+ }
241
+
242
+ .btn-whatsapp:hover {
243
+ color: white;
244
+ }
245
+
246
+ .btn-email {
247
+ color: white;
248
+ background-color: $primary !important;
249
+ border-color: $primary !important;
250
+ }
251
+
252
+ .btn--rounded {
253
+ font-size: 1.5rem;
254
+ margin: 0;
255
+ padding: 0;
256
+ line-height: 0;
257
+ min-width: 0;
258
+ width: 3rem;
259
+ height: 3rem;
260
+ }
261
+ </style>