@burh/nuxt-core 1.0.271 → 1.0.273

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

@@ -1,169 +1,169 @@
-<template>
-	<div class="recruitment__card">
-		<div>
-			<div class="recruitment__card__header">
-				<div class="recruitment__card__header__status">
-					<skeleton-animate class="skeleton-mb" :width="100" :height="20" />
-				</div>
-			</div>
-
-			<div class="recruitment__card__content">
-				<span class="recruitment__card__content__date">
-					<skeleton-animate class="skeleton-mb" :width="150" :height="10" />
-				</span>
-				<h2 class="recruitment__card__content__title">
-					<skeleton-animate class="skeleton-mb" :width="250" :height="20" />
-				</h2>
-				<span class="recruitment__card__content__id">
-					<skeleton-animate class="skeleton-mb" :width="110" :height="15" />
-				</span>
-
-				<div class="recruitment__card__info">
-					<p class="recruitment__card__info__text">
-						<skeleton-animate class="skeleton-mb" :width="120" :height="15" />
-					</p>
-					<p class="recruitment__card__info__text">
-						<skeleton-animate class="skeleton-mb" :width="120" :height="15" />
-					</p>
-					<p class="recruitment__card__info__text">
-						<skeleton-animate :width="120" :height="15" />
-					</p>
-				</div>
-			</div>
-
-			<div class="recruitment__card__footer">
-				<p class="recruitment__card__footer__title">EQUIPE RESPONSÁVEL</p>
-				<div class="recruitment__card__footer__images">
-					<skeleton-animate class="skeleton-mt" :width="32" :height="32" img />
-				</div>
-			</div>
-		</div>
-	</div>
-</template>
-
-<script>
-import SkeletonAnimate from './SkeletonAnimate.vue';
-export default {
-	name: 'recruitment-card-skeleton',
-	components: {
-		SkeletonAnimate
-	}
-};
-</script>
-
-<style lang="scss" scoped>
-@-webkit-keyframes placeholderSkeleton {
-    0% {
-        background-position: -468px 0;
-    }
-    100% {
-        background-position: 468px 0;
-    }
-}
-
-@-webkit-keyframes skeletonAnimate {
-    from {
-        background-position: top left;
-    }
-    to {
-        background-position: top right;
-    }
-}
-
-.skeleton-mb {
-    margin-bottom: 10px;
-}
-
-.skeleton-mt {
-    margin-top: 10px;
-}
-
-.skeleton--animate {
-    -webkit-animation-duration: 1s;
-    -webkit-animation-fill-mode: forwards;
-    -webkit-animation-iteration-count: infinite;
-    -webkit-animation-name: placeholderSkeleton;
-    -webkit-animation-timing-function: linear;
-    background: #e0e3e6;
-    background-image: -webkit-gradient(
-        linear,
-        left center,
-        right center,
-        from(#e0e3e6),
-        color-stop(0.2, #edeef1),
-        color-stop(0.4, #e0e3e6),
-        to(#e0e3e6)
-    );
-    background-image: -webkit-linear-gradient(
-        left,
-        #e0e3e6 0%,
-        #edeef1 20%,
-        #e0e3e6 40%,
-        #e0e3e6 100%
-    );
-    background-repeat: no-repeat;
-    background-size: 800px 104px;
-}
-
-.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;
-
-    &__header {
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        padding: 5px 0;
-    }
-
-    &__content {
-        &__date {
-            font-size: 0.875rem;
-            font-weight: 400;
-            color: #AEB6BE;
-        }
-        &__title {
-            font-size: 1.275rem;
-            color: #1D364B;
-            margin-bottom: 0;
-        }
-        &__id {
-            font-size: 0.875rem;
-            font-weight: 600;
-            color: #525F7F;
-        }
-    }
-
-    &__info {
-        padding: 20px 0;
-        &__text {
-            margin-bottom: 0;
-            font-size: 1rem;
-            font-weight: 500;
-        }
-    }
-
-    &__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;
-        }
-    }
-}
-</style>
+<template>
+	<div class="recruitment__card">
+		<div>
+			<div class="recruitment__card__header">
+				<div class="recruitment__card__header__status">
+					<skeleton-animate class="skeleton-mb" :width="100" :height="20" />
+				</div>
+			</div>
+
+			<div class="recruitment__card__content">
+				<span class="recruitment__card__content__date">
+					<skeleton-animate class="skeleton-mb" :width="150" :height="10" />
+				</span>
+				<h2 class="recruitment__card__content__title">
+					<skeleton-animate class="skeleton-mb" :width="250" :height="20" />
+				</h2>
+				<span class="recruitment__card__content__id">
+					<skeleton-animate class="skeleton-mb" :width="110" :height="15" />
+				</span>
+
+				<div class="recruitment__card__info">
+					<p class="recruitment__card__info__text">
+						<skeleton-animate class="skeleton-mb" :width="120" :height="15" />
+					</p>
+					<p class="recruitment__card__info__text">
+						<skeleton-animate class="skeleton-mb" :width="120" :height="15" />
+					</p>
+					<p class="recruitment__card__info__text">
+						<skeleton-animate :width="120" :height="15" />
+					</p>
+				</div>
+			</div>
+
+			<div class="recruitment__card__footer">
+				<p class="recruitment__card__footer__title">EQUIPE RESPONSÁVEL</p>
+				<div class="recruitment__card__footer__images">
+					<skeleton-animate class="skeleton-mt" :width="32" :height="32" img />
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+import SkeletonAnimate from './SkeletonAnimate.vue';
+export default {
+	name: 'recruitment-card-skeleton',
+	components: {
+		SkeletonAnimate
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+@-webkit-keyframes placeholderSkeleton {
+    0% {
+        background-position: -468px 0;
+    }
+    100% {
+        background-position: 468px 0;
+    }
+}
+
+@-webkit-keyframes skeletonAnimate {
+    from {
+        background-position: top left;
+    }
+    to {
+        background-position: top right;
+    }
+}
+
+.skeleton-mb {
+    margin-bottom: 10px;
+}
+
+.skeleton-mt {
+    margin-top: 10px;
+}
+
+.skeleton--animate {
+    -webkit-animation-duration: 1s;
+    -webkit-animation-fill-mode: forwards;
+    -webkit-animation-iteration-count: infinite;
+    -webkit-animation-name: placeholderSkeleton;
+    -webkit-animation-timing-function: linear;
+    background: #e0e3e6;
+    background-image: -webkit-gradient(
+        linear,
+        left center,
+        right center,
+        from(#e0e3e6),
+        color-stop(0.2, #edeef1),
+        color-stop(0.4, #e0e3e6),
+        to(#e0e3e6)
+    );
+    background-image: -webkit-linear-gradient(
+        left,
+        #e0e3e6 0%,
+        #edeef1 20%,
+        #e0e3e6 40%,
+        #e0e3e6 100%
+    );
+    background-repeat: no-repeat;
+    background-size: 800px 104px;
+}
+
+.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;
+
+    &__header {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding: 5px 0;
+    }
+
+    &__content {
+        &__date {
+            font-size: 0.875rem;
+            font-weight: 400;
+            color: #AEB6BE;
+        }
+        &__title {
+            font-size: 1.275rem;
+            color: #1D364B;
+            margin-bottom: 0;
+        }
+        &__id {
+            font-size: 0.875rem;
+            font-weight: 600;
+            color: #525F7F;
+        }
+    }
+
+    &__info {
+        padding: 20px 0;
+        &__text {
+            margin-bottom: 0;
+            font-size: 1rem;
+            font-weight: 500;
+        }
+    }
+
+    &__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;
+        }
+    }
+}
+</style>

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

@@ -1,96 +1,96 @@
-<template>
-	<div
-		class="skeleton skeleton--animate"
-		:class="[
-			{ 'rounded': rounded },
-			{ 'img': img }
-		]"
-		:style="`--skeleton-w: ${width}px; --skeleton-h: ${height}px;`"
-	></div>
-</template>
-
-<script>
-export default {
-	name: 'skeleton-animate',
-	props: {
-		width: {
-			type: Number,
-			default: 200
-		},
-		height: {
-			type: Number,
-			default: 15
-		},
-		rounded: {
-			type: Boolean,
-			default: false
-		},
-		img: {
-			type: Boolean,
-			default: false
-		}
-	}
-};
-</script>
-
-<style lang="scss" scoped>
-@-webkit-keyframes placeholderSkeleton {
-    0% {
-        background-position: -468px 0;
-    }
-    100% {
-        background-position: 468px 0;
-    }
-}
-
-@-webkit-keyframes skeletonAnimate {
-    from {
-        background-position: top left;
-    }
-    to {
-        background-position: top right;
-    }
-}
-
-.skeleton {
-    width: var(--skeleton-w);
-    height: var(--skeleton-h);
-    border-radius: 2px;
-    &.rounded {
-        border-radius: 4px;
-    }
-    &.img {
-        border-radius: 1000px;
-    }
-}
-
-$skeletonBaseColor: #e0e3e6;
-$skeletonBaseLineColor: #edeef1;
-
-.skeleton--animate {
-    -webkit-animation-duration: 1s;
-    -webkit-animation-fill-mode: forwards;
-    -webkit-animation-iteration-count: infinite;
-    -webkit-animation-name: placeholderSkeleton;
-    -webkit-animation-timing-function: linear;
-    background: $skeletonBaseColor;
-    background-image: -webkit-gradient(
-        linear,
-        left center,
-        right center,
-        from($skeletonBaseColor),
-        color-stop(0.2, $skeletonBaseLineColor),
-        color-stop(0.4, $skeletonBaseColor),
-        to($skeletonBaseColor)
-    );
-    background-image: -webkit-linear-gradient(
-        left,
-        $skeletonBaseColor 0%,
-        $skeletonBaseLineColor 20%,
-        $skeletonBaseColor 40%,
-        $skeletonBaseColor 100%
-    );
-    background-repeat: no-repeat;
-    background-size: 800px 104px;
-}
-</style>
+<template>
+	<div
+		class="skeleton skeleton--animate"
+		:class="[
+			{ 'rounded': rounded },
+			{ 'img': img }
+		]"
+		:style="`--skeleton-w: ${width}px; --skeleton-h: ${height}px;`"
+	></div>
+</template>
+
+<script>
+export default {
+	name: 'skeleton-animate',
+	props: {
+		width: {
+			type: Number,
+			default: 200
+		},
+		height: {
+			type: Number,
+			default: 15
+		},
+		rounded: {
+			type: Boolean,
+			default: false
+		},
+		img: {
+			type: Boolean,
+			default: false
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+@-webkit-keyframes placeholderSkeleton {
+    0% {
+        background-position: -468px 0;
+    }
+    100% {
+        background-position: 468px 0;
+    }
+}
+
+@-webkit-keyframes skeletonAnimate {
+    from {
+        background-position: top left;
+    }
+    to {
+        background-position: top right;
+    }
+}
+
+.skeleton {
+    width: var(--skeleton-w);
+    height: var(--skeleton-h);
+    border-radius: 2px;
+    &.rounded {
+        border-radius: 4px;
+    }
+    &.img {
+        border-radius: 1000px;
+    }
+}
+
+$skeletonBaseColor: #e0e3e6;
+$skeletonBaseLineColor: #edeef1;
+
+.skeleton--animate {
+    -webkit-animation-duration: 1s;
+    -webkit-animation-fill-mode: forwards;
+    -webkit-animation-iteration-count: infinite;
+    -webkit-animation-name: placeholderSkeleton;
+    -webkit-animation-timing-function: linear;
+    background: $skeletonBaseColor;
+    background-image: -webkit-gradient(
+        linear,
+        left center,
+        right center,
+        from($skeletonBaseColor),
+        color-stop(0.2, $skeletonBaseLineColor),
+        color-stop(0.4, $skeletonBaseColor),
+        to($skeletonBaseColor)
+    );
+    background-image: -webkit-linear-gradient(
+        left,
+        $skeletonBaseColor 0%,
+        $skeletonBaseLineColor 20%,
+        $skeletonBaseColor 40%,
+        $skeletonBaseColor 100%
+    );
+    background-repeat: no-repeat;
+    background-size: 800px 104px;
+}
+</style>