@burh/nuxt-core 1.0.265 → 1.0.266

package/components/burh-ds/Cards/RecruitmentCard.vue

@@ -1,214 +1,214 @@
-<template>
-	<nuxt-link :to="`/recrutamento/vaga/${job.id}`" class="recruitment__card">
-		<article>
-			<header class="recruitment__card__header">
-				<div class="recruitment__card__header__status">
-					<job-status-dropdown
-						:status="job.status"
-						@select="handleChangeJobStatus"
-					/>
-				</div>
-				<div class="recruitment__card__header__actions">
-					<el-tooltip placement="top" content="Anotações">
-						<button
-							class="action__item"
-							@click.stop.prevent="$emit('notes-click')"
-						>
-							<i class="far fa-comment-alt"></i>
-						</button>
-					</el-tooltip>
-
-					<el-tooltip placement="top" content="Compartilhar">
-						<button
-							class="action__item"
-							@click.stop.prevent="$emit('share-click')"
-						>
-							<i class="fas fa-share-alt"></i>
-						</button>
-					</el-tooltip>
-				</div>
-			</header>
-
-			<section class="recruitment__card__content">
-				<span class="recruitment__card__content__date">Publicada {{fromNow(job.published_at)}}</span>
-				<h2 class="recruitment__card__content__title">
-					{{ job.title }}
-					<i v-if="job.handicapped" class="fas fa-wheelchair pcd"></i>
-				</h2>
-				<span class="recruitment__card__content__id">{{ job.id }}</span>
-
-				<div class="recruitment__card__info">
-					<p class="recruitment__card__info__text"><span>{{ job.info.applieds }}</span>Inscritos</p>
-					<p class="recruitment__card__info__text"><span>{{ job.info.positions }}</span>Posição</p>
-					<p class="recruitment__card__info__text"><span>{{ job.info.hireds }}</span>Contratados</p>
-				</div>
-			</section>
-
-			<footer class="recruitment__card__footer">
-				<p class="recruitment__card__footer__title">EQUIPE RESPONSÁVEL</p>
-				<div class="recruitment__card__footer__images">
-					<el-tooltip
-						v-for="user in job.team"
-						:key="user.id"
-						placement="top"
-						:content="user.name"
-					>
-						<img
-							:src="user.avatar"
-							:alt="user.name"
-						>
-					</el-tooltip>
-				</div>
-			</footer>
-		</article>
-	</nuxt-link>
-</template>
-
-<script>
-import moment from 'moment';
-import 'moment/locale/pt-br';
-
-import JobStatusDropdown from '@burh/nuxt-core/components/burh-ds/Dropdown/JobStatusDropdown.vue';
-
-export default {
-	name: 'recruitment-card',
-	components: {
-		JobStatusDropdown
-	},
-	props: {
-		job: {
-			type: Object,
-			default: () => []
-		}
-	},
-	methods: {
-		fromNow(date, format = 'YYYYMMDD') {
-			return moment(date, format).fromNow();
-		},
-		handleChangeJobStatus(id) {
-			this.$emit('select', id);
-		}
-	}
-};
-</script>
-
-<style lang="scss" scoped>
-.recruitment__card {
-    cursor: pointer;
-    background: #fff;
-    box-shadow: 0 3px 20px rgba(0, 0, 0, 0.08);
-    padding: 20px;
-    border-radius: 4px;
-    border: none;
-    text-align: initial;
-    color: #1D364B;
-    transition: transform 0.25s;
-    &:focus {
-        outline: none;
-        transform: translateY(-5px);
-    }
-    &:hover {
-        transform: translateY(-5px);
-    }
-
-    &__header {
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        padding: 5px 0;
-        &__actions {
-            display: flex;
-            align-items: center;
-            .action__item {
-                cursor: pointer;
-                width: 42px;
-                height: 42px;
-                border-radius: 100px;
-                transition: background 0.5s;
-                display: flex;
-                align-items: center;
-                justify-content: center;
-                background: transparent;
-                border: 0;
-                position: relative;
-                &:not(:disabled):hover {
-                    background: rgba(0, 0, 0, 0.08);
-                }
-                &:focus {
-                    outline: none;
-                    background: rgba(0, 0, 0, 0.08);
-                }
-                &:not(:first-child) {
-                    margin-left: 5px;
-                }
-                i {
-                    color: #AEB6BE;
-                }
-            }
-        }
-    }
-
-    &__content {
-        &__date {
-            font-size: 0.875rem;
-            font-weight: 400;
-            color: #AEB6BE;
-        }
-        &__title {
-            font-size: 1.275rem;
-            color: #1D364B;
-            margin-bottom: 0;
-            .pcd {
-                color: #1F8CEB;
-                margin-left: 5px;
-            }
-        }
-        &__id {
-            font-size: 0.875rem;
-            font-weight: 600;
-            color: #525F7F;
-        }
-    }
-
-    &__info {
-        padding: 20px 0;
-        &__text {
-            margin-bottom: 0;
-            font-size: 1rem;
-            font-weight: 500;
-            span {
-                margin-right: 5px;
-                color: #1F8CEB;
-            }
-        }
-    }
-
-    &__footer {
-        border-top: 1px solid #E9E9E9;
-        padding-top: 10px;
-        &__title {
-            color: #525F7F;
-            font-size: 0.875rem;
-            font-weight: 600;
-            margin-bottom: 0;
-        }
-        &__images {
-            display: flex;
-            align-items: center;
-            user-select: none;
-            img {
-                $size: 32px;
-                display: block;
-                width: $size;
-                height: $size;
-                object-fit: cover;
-                border-radius: 100px;
-                border: 2px solid #fff;
-                &:not(:first-child) {
-                    margin-left: -10px;
-                }
-            }
-        }
-    }
-}
-</style>
+<template>
+	<nuxt-link :to="`/recrutamento/vaga/${job.id}`" class="recruitment__card">
+		<article>
+			<header class="recruitment__card__header">
+				<div class="recruitment__card__header__status">
+					<job-status-dropdown
+						:status="job.status"
+						@select="handleChangeJobStatus"
+					/>
+				</div>
+				<div class="recruitment__card__header__actions">
+					<el-tooltip placement="top" content="Anotações">
+						<button
+							class="action__item"
+							@click.stop.prevent="$emit('notes-click')"
+						>
+							<i class="far fa-comment-alt"></i>
+						</button>
+					</el-tooltip>
+
+					<el-tooltip placement="top" content="Compartilhar">
+						<button
+							class="action__item"
+							@click.stop.prevent="$emit('share-click')"
+						>
+							<i class="fas fa-share-alt"></i>
+						</button>
+					</el-tooltip>
+				</div>
+			</header>
+
+			<section class="recruitment__card__content">
+				<span class="recruitment__card__content__date">Publicada {{fromNow(job.published_at)}}</span>
+				<h2 class="recruitment__card__content__title">
+					{{ job.title }}
+					<i v-if="job.handicapped" class="fas fa-wheelchair pcd"></i>
+				</h2>
+				<span class="recruitment__card__content__id">{{ job.id }}</span>
+
+				<div class="recruitment__card__info">
+					<p class="recruitment__card__info__text"><span>{{ job.info.applieds }}</span>Inscritos</p>
+					<p class="recruitment__card__info__text"><span>{{ job.info.positions }}</span>Posição</p>
+					<p class="recruitment__card__info__text"><span>{{ job.info.hireds }}</span>Contratados</p>
+				</div>
+			</section>
+
+			<footer class="recruitment__card__footer">
+				<p class="recruitment__card__footer__title">EQUIPE RESPONSÁVEL</p>
+				<div class="recruitment__card__footer__images">
+					<el-tooltip
+						v-for="user in job.team"
+						:key="user.id"
+						placement="top"
+						:content="user.name"
+					>
+						<img
+							:src="user.avatar"
+							:alt="user.name"
+						>
+					</el-tooltip>
+				</div>
+			</footer>
+		</article>
+	</nuxt-link>
+</template>
+
+<script>
+import moment from 'moment';
+import 'moment/locale/pt-br';
+
+import JobStatusDropdown from '@burh/nuxt-core/components/burh-ds/Dropdown/JobStatusDropdown.vue';
+
+export default {
+	name: 'recruitment-card',
+	components: {
+		JobStatusDropdown
+	},
+	props: {
+		job: {
+			type: Object,
+			default: () => []
+		}
+	},
+	methods: {
+		fromNow(date, format = 'YYYYMMDD') {
+			return moment(date, format).fromNow();
+		},
+		handleChangeJobStatus(id) {
+			this.$emit('select', id);
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+.recruitment__card {
+    cursor: pointer;
+    background: #fff;
+    box-shadow: 0 3px 20px rgba(0, 0, 0, 0.08);
+    padding: 20px;
+    border-radius: 4px;
+    border: none;
+    text-align: initial;
+    color: #1D364B;
+    transition: transform 0.25s;
+    &:focus {
+        outline: none;
+        transform: translateY(-5px);
+    }
+    &:hover {
+        transform: translateY(-5px);
+    }
+
+    &__header {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding: 5px 0;
+        &__actions {
+            display: flex;
+            align-items: center;
+            .action__item {
+                cursor: pointer;
+                width: 42px;
+                height: 42px;
+                border-radius: 100px;
+                transition: background 0.5s;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                background: transparent;
+                border: 0;
+                position: relative;
+                &:not(:disabled):hover {
+                    background: rgba(0, 0, 0, 0.08);
+                }
+                &:focus {
+                    outline: none;
+                    background: rgba(0, 0, 0, 0.08);
+                }
+                &:not(:first-child) {
+                    margin-left: 5px;
+                }
+                i {
+                    color: #AEB6BE;
+                }
+            }
+        }
+    }
+
+    &__content {
+        &__date {
+            font-size: 0.875rem;
+            font-weight: 400;
+            color: #AEB6BE;
+        }
+        &__title {
+            font-size: 1.275rem;
+            color: #1D364B;
+            margin-bottom: 0;
+            .pcd {
+                color: #1F8CEB;
+                margin-left: 5px;
+            }
+        }
+        &__id {
+            font-size: 0.875rem;
+            font-weight: 600;
+            color: #525F7F;
+        }
+    }
+
+    &__info {
+        padding: 20px 0;
+        &__text {
+            margin-bottom: 0;
+            font-size: 1rem;
+            font-weight: 500;
+            span {
+                margin-right: 5px;
+                color: #1F8CEB;
+            }
+        }
+    }
+
+    &__footer {
+        border-top: 1px solid #E9E9E9;
+        padding-top: 10px;
+        &__title {
+            color: #525F7F;
+            font-size: 0.875rem;
+            font-weight: 600;
+            margin-bottom: 0;
+        }
+        &__images {
+            display: flex;
+            align-items: center;
+            user-select: none;
+            img {
+                $size: 32px;
+                display: block;
+                width: $size;
+                height: $size;
+                object-fit: cover;
+                border-radius: 100px;
+                border: 2px solid #fff;
+                &:not(:first-child) {
+                    margin-left: -10px;
+                }
+            }
+        }
+    }
+}
+</style>

package/components/burh-ds/Carousel/ImageCarousel.vue

@@ -1,106 +1,106 @@
-<template>
-	<vue-slick-carousel v-bind="settings" :arrows="true" :dots="true">
-		<div
-			v-for="(item, index) in carouselItems"
-			:key="index"
-			class="carousel__image"
-		>
-			<img :src="item.img" :alt="item.title" draggable="false">
-		</div>
-	</vue-slick-carousel>
-</template>
-
-<script>
-import VueSlickCarousel from 'vue-slick-carousel';
-import 'vue-slick-carousel/dist/vue-slick-carousel.css';
-import 'vue-slick-carousel/dist/vue-slick-carousel-theme.css';
-
-export default {
-	name: 'ImageCarousel',
-	components: {
-		VueSlickCarousel
-	},
-	props: {
-		carouselItems: {
-			type: Array,
-			default: () => {
-				return [];
-			}
-		},
-		dots: {
-			type: Boolean,
-			default: true
-		},
-		infinite: {
-			type: Boolean,
-			default: true
-		},
-		autoplay: {
-			type: Boolean,
-			default: true
-		},
-		slides: {
-			type: Number,
-			default: 3
-		},
-		speed: {
-			type: Number,
-			default: 500
-		},
-		breakpoints: {
-			type: Array,
-			default: () => {
-				return [
-					{
-						breakpoint: 800,
-						settings: {
-							slidesToShow: 2,
-							slidesToScroll: 2
-						}
-					},
-					{
-						breakpoint: 600,
-						settings: {
-							slidesToShow: 1,
-							slidesToScroll: 1
-						}
-					}
-				];
-			}
-		}
-	},
-	data() {
-		return {
-			settings: {}
-		};
-	},
-	mounted() {
-		const settings = {
-			dots: this.dots,
-			infinite: this.infinite,
-			autoplay: this.autoplay,
-			slidesToShow: this.slides,
-			slidesToScroll: this.slides,
-			speed: this.speed,
-			responsive: this.breakpoints
-		};
-
-		this.settings = settings;
-	}
-};
-</script>
-
-<style lang="scss">
-    .carousel__image {
-        padding: 20px 0;
-        display: flex!important;
-        align-items: center;
-        justify-content: center;
-        user-select: none;
-        img {
-            display: block;
-            width: 150px;
-            padding: 10px;
-        }
-    }
-</style>
+<template>
+	<vue-slick-carousel v-bind="settings" :arrows="true" :dots="true">
+		<div
+			v-for="(item, index) in carouselItems"
+			:key="index"
+			class="carousel__image"
+		>
+			<img :src="item.img" :alt="item.title" draggable="false">
+		</div>
+	</vue-slick-carousel>
+</template>
+
+<script>
+import VueSlickCarousel from 'vue-slick-carousel';
+import 'vue-slick-carousel/dist/vue-slick-carousel.css';
+import 'vue-slick-carousel/dist/vue-slick-carousel-theme.css';
+
+export default {
+	name: 'ImageCarousel',
+	components: {
+		VueSlickCarousel
+	},
+	props: {
+		carouselItems: {
+			type: Array,
+			default: () => {
+				return [];
+			}
+		},
+		dots: {
+			type: Boolean,
+			default: true
+		},
+		infinite: {
+			type: Boolean,
+			default: true
+		},
+		autoplay: {
+			type: Boolean,
+			default: true
+		},
+		slides: {
+			type: Number,
+			default: 3
+		},
+		speed: {
+			type: Number,
+			default: 500
+		},
+		breakpoints: {
+			type: Array,
+			default: () => {
+				return [
+					{
+						breakpoint: 800,
+						settings: {
+							slidesToShow: 2,
+							slidesToScroll: 2
+						}
+					},
+					{
+						breakpoint: 600,
+						settings: {
+							slidesToShow: 1,
+							slidesToScroll: 1
+						}
+					}
+				];
+			}
+		}
+	},
+	data() {
+		return {
+			settings: {}
+		};
+	},
+	mounted() {
+		const settings = {
+			dots: this.dots,
+			infinite: this.infinite,
+			autoplay: this.autoplay,
+			slidesToShow: this.slides,
+			slidesToScroll: this.slides,
+			speed: this.speed,
+			responsive: this.breakpoints
+		};
+
+		this.settings = settings;
+	}
+};
+</script>
+
+<style lang="scss">
+    .carousel__image {
+        padding: 20px 0;
+        display: flex!important;
+        align-items: center;
+        justify-content: center;
+        user-select: none;
+        img {
+            display: block;
+            width: 150px;
+            padding: 10px;
+        }
+    }
+</style>