@burh/nuxt-core 1.0.410 → 1.0.411

package/components/burh-ds/Modals/UniversalShareModal.vue

@@ -1,8 +1,7 @@
 <template>
-	<el-dialog
-		:visible.sync="isActive"
-		width="54%"
-		custom-class="position-relative"
+	<modal
+		:show.sync="isActive"
+		:size="'lg'"
 		@close="$emit('close')"
 	>
 		<template>
@@ -121,17 +120,13 @@
 				/>
 			</span>
 		</template>
-	</el-dialog>
+	</modal>
 </template>
 
 <script>
-import { Dialog } from 'element-ui';
-
 export default {
 	name: 'shared-modal',
-	components: {
-		[Dialog.name]: Dialog
-	},
+	components: {},
 	props: {
 		isActive: Boolean,
 		shareUrl: String,
@@ -176,20 +171,8 @@ export default {
 <style lang="scss" scoped>
 @import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
 
-/deep/ .el-dialog__body {
-    padding: 0;
-}
-
-/deep/ .el-dialog__header {
-    display: none;
-}
-
-/deep/ .el-dialog {
-    overflow: hidden;
-    border-radius: 10px;
-    padding-bottom: 50px;
-    max-width: 725px;
-    min-width: 725px;
+/deep/ .modal-body {
+	margin-bottom: 2rem;
 }
 
 .social {
@@ -214,32 +197,6 @@ export default {
     }
 }
 
-.tool {
-    position: absolute;
-    top: 1rem;
-    z-index: 10;
-    color: $primary;
-    cursor: pointer;
-
-    &-close {
-        position: absolute;
-        width: 88px;
-        height: 27px;
-        right: 7px;
-        top: 7px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-
-        font-size: 11px;
-
-        font-weight: 500;
-        background: rgba(0, 0, 0, 0.2);
-        border-radius: 17.5px;
-        color: #fff;
-    }
-}
-
 .btn-whatsapp:hover {
     color: white;
 }

package/components/burh-ds/Modals/UniversalWhatsappModal.vue

@@ -1,8 +1,7 @@
 <template>
-	<el-dialog
-		:visible.sync="isActive"
-		width="54%"
-		custom-class="position-relative"
+	<modal
+		:show.sync="isActive"
+		:size="'lg'"
 		@close="$emit('close')"
 	>
 		<template>
@@ -50,17 +49,13 @@
 				/>
 			</span>
 		</template>
-	</el-dialog>
+	</modal>
 </template>
 
 <script>
-import { Dialog } from 'element-ui';
-
 export default {
 	name: 'whatsapp-modal',
-	components: {
-		[Dialog.name]: Dialog
-	},
+	components: {},
 	data() {
 		return {
 			phoneNumber: ''
@@ -98,47 +93,4 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
-
-/deep/ .el-dialog__body {
-    padding: 0;
-}
-
-/deep/ .el-dialog__header {
-    display: none;
-}
-
-/deep/ .el-dialog {
-    overflow: hidden;
-    border-radius: 10px;
-    padding-bottom: 50px;
-    max-width: 725px;
-    min-width: 725px;
-}
-
-.tool {
-    position: absolute;
-    top: 1rem;
-    z-index: 10;
-    color: $primary;
-    cursor: pointer;
-
-    &-close {
-        position: absolute;
-        width: 88px;
-        height: 27px;
-        right: 7px;
-        top: 7px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-
-        font-size: 11px;
-
-        font-weight: 500;
-        background: rgba(0, 0, 0, 0.2);
-        border-radius: 17.5px;
-        color: #fff;
-    }
-}
 </style>

package/components/burh-ds/Modals/WhatsappModal.vue

@@ -1,143 +1,95 @@
 <template>
-    <el-dialog
-        :visible.sync="isActive"
-        width="54%"
-        custom-class="position-relative"
-        @close="$emit('close')"
-    >
-        <template>
-            <div class="row mt-5">
-                <!-- <base-input class="col-12" label="Email" type="text" /> -->
-                <div class="col-12 px-3 mb-4">
-                    <p class="lead mt-0 ml-5">
-                        Insira aqui o número do telefone.
-                    </p>
-                    <base-input
-                        class="mb-1 ml-5 mr-5"
-                        v-model="phoneNumber"
-                        placeholder="Ex: (15) 3342-6237"
-                        type="text"
-                        name="NumberCellphone"
-                    >
-                    </base-input>
-                </div>
+	<modal
+		:show.sync="isActive"
+		:size="'lg'"
+		@close="$emit('close')"
+	>
+		<template>
+			<div class="row mt-5">
+				<!-- <base-input class="col-12" label="Email" type="text" /> -->
+				<div class="col-12 px-3 mb-4">
+					<p class="lead mt-0 ml-5">
+						Insira aqui o número do telefone.
+					</p>
+					<base-input
+						class="mb-1 ml-5 mr-5"
+						v-model="phoneNumber"
+						placeholder="Ex: (15) 3342-6237"
+						type="text"
+						name="NumberCellphone"
+					>
+					</base-input>
+				</div>
 
-                <div class="col-12 d-flex">
-                    <base-button
-                        size="md"
-                        outline
-                        type="primary"
-                        role="button"
-                        class="ml-5"
-                        @click="$emit('close-modal')"
-                        >voltar
-                    </base-button>
-                    <base-button
-                        size="md"
-                        type="primary"
-                        role="button"
-                        @click="sendMessage()"
-                        class="ml-auto mr-5"
-                        >Enviar
-                    </base-button>
-                </div>
-            </div>
+				<div class="col-12 d-flex">
+					<base-button
+						size="md"
+						outline
+						type="primary"
+						role="button"
+						class="ml-5"
+						@click="$emit('close-modal')"
+					>voltar
+					</base-button>
+					<base-button
+						size="md"
+						type="primary"
+						role="button"
+						@click="sendMessage()"
+						class="ml-auto mr-5"
+					>Enviar
+					</base-button>
+				</div>
+			</div>
 
-            <span class="tool tool-close" @click="$emit('close-modal')">
-                Fechar
-                <font-awesome-icon
-                    :icon="['fas', 'times']"
-                    class="text-white ml-1"
-                />
-            </span>
-        </template>
-    </el-dialog>
+			<span class="tool tool-close" @click="$emit('close-modal')">
+				Fechar
+				<font-awesome-icon
+					:icon="['fas', 'times']"
+					class="text-white ml-1"
+				/>
+			</span>
+		</template>
+	</modal>
 </template>
 
 <script>
-import { Dialog } from 'element-ui';
-
 export default {
-    name: 'whatsapp-modal',
-    components: {
-        [Dialog.name]: Dialog
-    },
-    data() {
-        return {
-            phoneNumber: ''
-        };
-    },
-    props: {
-        isActive: Boolean,
-        userData: Object,
-        baseUrl: String
-    },
-    methods: {
-        sendMessage() {
-            let phoneNumber = this.phoneNumber
-                .replace('(', '')
-                .replace(')', '')
-                .replace(' ', '')
-                .replace('-', '');
-            window.open(
-                'https://api.whatsapp.com/send?phone=' +
+	name: 'whatsapp-modal',
+	components: {},
+	data() {
+		return {
+			phoneNumber: ''
+		};
+	},
+	props: {
+		isActive: Boolean,
+		userData: Object,
+		baseUrl: String
+	},
+	methods: {
+		sendMessage() {
+			let phoneNumber = this.phoneNumber
+				.replace('(', '')
+				.replace(')', '')
+				.replace(' ', '')
+				.replace('-', '');
+			window.open(
+				'https://api.whatsapp.com/send?phone=' +
                     '+55' +
                     phoneNumber +
                     '&text=' +
                     `${this.baseUrl}/${this.userData.slug.slug}`
-            );
-        }
-    },
-    watch: {
-        isActive(newValue) {
-            !newValue && this.$emit('close-modal');
-        }
-    }
+			);
+		}
+	},
+	watch: {
+		isActive(newValue) {
+			!newValue && this.$emit('close-modal');
+		}
+	}
 };
 </script>
 
 <style lang="scss" scoped>
-@import '@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss';
-
-/deep/ .el-dialog__body {
-    padding: 0;
-}
-
-/deep/ .el-dialog__header {
-    display: none;
-}
-
-/deep/ .el-dialog {
-    overflow: hidden;
-    border-radius: 10px;
-    padding-bottom: 50px;
-    max-width: 725px;
-    min-width: 725px;
-}
-
-.tool {
-    position: absolute;
-    top: 1rem;
-    z-index: 10;
-    color: $primary;
-    cursor: pointer;
-
-    &-close {
-        position: absolute;
-        width: 88px;
-        height: 27px;
-        right: 7px;
-        top: 7px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-
-        font-size: 11px;
-
-        font-weight: 500;
-        background: rgba(0, 0, 0, 0.2);
-        border-radius: 17.5px;
-        color: #fff;
-    }
-}
 </style>

package/components/burh-ds/Skeleton/BaseCardUniversity.vue

@@ -1,79 +1,79 @@
-<template>
-	<div class="recruitment__user__card">
-		<div
-			class="recruitment__user__card__header"
-		>
-			<skeleton-animate class="user__cover" />
-		</div>
-
-		<div class="recruitment__user__card__content">
-			<skeleton-animate class="user__avatar" :width="120" :height="120" img />
-
-			<skeleton-animate class="user__title" :width="160" :height="20" />
-		</div>
-
-		<div class="recruitment__user__card__footer">
-			<skeleton-animate class="user__footer" :width="200" :height="20" />
-		</div>
-	</div>
-</template>
-
-<script>
-import SkeletonAnimate from './SkeletonAnimate.vue';
-
-export default {
-	name: 'base-card-university',
-	components: {
-		SkeletonAnimate
-	}
-};
-</script>
-
-<style lang="scss" scoped>
-
-.recruitment__user__card {
-    background: #fff;
-    box-shadow: 0 3px 20px rgba(0, 0, 0, 0.08);
-    border-radius: 4px;
-    overflow: hidden;
-    cursor: pointer;
-    transition: transform 0.25s;
-
-    &__header {
-        width: 100%;
-        height: 70px;
-        overflow: hidden;
-        position: relative;
-        .user__cover {
-            width: 100%!important;
-            height: 100%!important;
-        }
-    }
-    &__content {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: center;
-        .user__avatar {
-            margin-top: -20px;
-            border: 4px solid #fff;
-            z-index: 10;
-        }
-        .user__title {
-            margin-top: 40px;
-        }
-    }
-    &__footer {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        padding-bottom: 20px;
-        .user__footer {
-            margin-top: 40px;
-            margin-bottom: 20px;
-        }
-    }
-}
-
-</style>
-
+<template>
+	<div class="recruitment__user__card">
+		<div
+			class="recruitment__user__card__header"
+		>
+			<skeleton-animate class="user__cover" />
+		</div>
+
+		<div class="recruitment__user__card__content">
+			<skeleton-animate class="user__avatar" :width="120" :height="120" img />
+
+			<skeleton-animate class="user__title" :width="160" :height="20" />
+		</div>
+
+		<div class="recruitment__user__card__footer">
+			<skeleton-animate class="user__footer" :width="200" :height="20" />
+		</div>
+	</div>
+</template>
+
+<script>
+import SkeletonAnimate from './SkeletonAnimate.vue';
+
+export default {
+	name: 'base-card-university',
+	components: {
+		SkeletonAnimate
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+
+.recruitment__user__card {
+    background: #fff;
+    box-shadow: 0 3px 20px rgba(0, 0, 0, 0.08);
+    border-radius: 4px;
+    overflow: hidden;
+    cursor: pointer;
+    transition: transform 0.25s;
+
+    &__header {
+        width: 100%;
+        height: 70px;
+        overflow: hidden;
+        position: relative;
+        .user__cover {
+            width: 100%!important;
+            height: 100%!important;
+        }
+    }
+    &__content {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        .user__avatar {
+            margin-top: -20px;
+            border: 4px solid #fff;
+            z-index: 10;
+        }
+        .user__title {
+            margin-top: 40px;
+        }
+    }
+    &__footer {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding-bottom: 20px;
+        .user__footer {
+            margin-top: 40px;
+            margin-bottom: 20px;
+        }
+    }
+}
+
+</style>
+