@bagelink/vue 1.15.13 → 1.15.26

package/src/components/Image.vue

@@ -139,13 +139,15 @@ watch(() => [props.src, props.pathKey, props.modelValue], loadImage, { immediate
 </template>
 
 <style scoped>
+
 .img-web-kit {
-	max-width: 100%;
-	vertical-align: middle;
-	border: 0;
-	width: 100%;
+max-width: 100%;
+vertical-align: middle;
+border: 0;
+width: 100%;
 }
 .error-image {
-	background-color: var(--bgl-skeleton-bg);
+background-color: var(--bgl-skeleton-bg);
 }
+
 </style>

package/src/components/JSONSchema.vue

@@ -456,46 +456,47 @@ watch(() => props.modelValue, (newValue) => {
 </template>
 
 <style>
+
 .JSONSchema{
-	--bgl-input-height: 38px;
-	--bgl-accent-color: var(--bgl-purple);
-	container-type: inline-size;
-	container-name: json-schema;
+--bgl-input-height: 38px;
+--bgl-accent-color: var(--bgl-purple);
+container-type: inline-size;
+container-name: json-schema;
 }
 .jsonCheckbox{
-		--bgl-input-height: 44px;
+	--bgl-input-height: 44px;
 }
 .jsonFormat {
-	gap: 0.25rem !important;
-	display: grid !important;
-	grid-template-columns: repeat(auto-fit, minmax(50px, 1fr)) !important;
+gap: 0.25rem !important;
+display: grid !important;
+grid-template-columns: repeat(auto-fit, minmax(50px, 1fr)) !important;
 }
 .jsonFormat .bgl_btn-flex{
-	flex-direction: column;
+flex-direction: column;
 }
 .jsonFormat .bgl_btn{
-	height: auto !important;
-	font-size: 9px !important;
-	line-height: 0.75 !important;
-	border-radius: 0.5rem !important;
-	padding: 0.5rem !important;
-	background: var(--bgl-purple);
+height: auto !important;
+font-size: 9px !important;
+line-height: 0.75 !important;
+border-radius: 0.5rem !important;
+padding: 0.5rem !important;
+background: var(--bgl-purple);
 }
 .jsonFormat .bgl_icon-font{
-	font-size: 1.6rem !important;
+font-size: 1.6rem !important;
 }
 .arrayJsonSchema .txt-18{
-	font-size: 14px !important;
+font-size: 14px !important;
 }
 
 @container json-schema (max-width: 400px) {
-	.JSONSchema .grid-wrap-3 {
-		grid-template-columns: 1fr !important;
-	}
+.JSONSchema .grid-wrap-3 {
+	grid-template-columns: 1fr !important;
+}
 
-	.JSONSchema .grid-span-3 {
-		grid-column: 1 !important;
-	}
+.JSONSchema .grid-span-3 {
+	grid-column: 1 !important;
+}
 }
 
 /* transtion animations */
@@ -503,54 +504,55 @@ watch(() => props.modelValue, (newValue) => {
 /* Schema transition animations */
 .schema-transition-enter-active,
 .schema-transition-leave-active {
-	transition: all 0.4s ease;
-	position: relative;
+transition: all 0.4s ease;
+position: relative;
 }
 
 .schema-transition-enter-from {
-	opacity: 0;
-	transform: translateX(30px);
+opacity: 0;
+transform: translateX(30px);
 }
 
 .schema-transition-leave-to {
-	opacity: 0;
-	transform: translateX(-30px);
+opacity: 0;
+transform: translateX(-30px);
 }
 
 .schema-transition-leave-active {
-	position: absolute;
-	width: 100%;
-	z-index: 0;
+position: absolute;
+width: 100%;
+z-index: 0;
 }
 
 .schema-transition-enter-active {
-	z-index: 1;
+z-index: 1;
 }
 
 /* Number section transition for number/integer switch */
 .number-section-enter-active,
 .number-section-leave-active {
-	transition: all 0.25s ease;
-	position: relative;
+transition: all 0.25s ease;
+position: relative;
 }
 
 .number-section-enter-from {
-	opacity: 0;
-	transform: translateX(20px);
+opacity: 0;
+transform: translateX(20px);
 }
 
 .number-section-leave-to {
-	opacity: 0;
-	transform: translateX(-20px);
+opacity: 0;
+transform: translateX(-20px);
 }
 
 .number-section-leave-active {
-	position: absolute;
-	width: 100%;
-	z-index: 0;
+position: absolute;
+width: 100%;
+z-index: 0;
 }
 
 .number-section-enter-active {
-	z-index: 1;
+z-index: 1;
 }
+
 </style>

package/src/components/JsonBuilder.vue

@@ -214,19 +214,21 @@ watch(() => props.modelValue, () => {
 </template>
 
 <style scoped>
+
 .json-builder {
-	/* Add any custom styles here */
-	--bgl-input-height: 27px;
-	--bgl-input-font-size: 12px;
+/* Add any custom styles here */
+--bgl-input-height: 27px;
+--bgl-input-font-size: 12px;
 }
 .grid-json-builder-row{
-	grid-template-columns: 2fr 1fr 2fr auto;
-	grid-template-columns: 2fr 90px 2fr auto;
+grid-template-columns: 2fr 1fr 2fr auto;
+grid-template-columns: 2fr 90px 2fr auto;
 
-	gap: 0.5rem;
+gap: 0.5rem;
 }
 .grid-json-builder-row-basic{
-	grid-template-columns: 1fr 1fr auto;
-	gap: 0.5rem;
+grid-template-columns: 1fr 1fr auto;
+gap: 0.5rem;
 }
+
 </style>

package/src/components/ListItem.vue

@@ -100,77 +100,79 @@ const bind = computed(() => {
 </template>
 
 <style>
+
 button.list-item {
-	cursor: pointer;
-	display: flex;
-	gap: 0.5rem;
-	border: none;
-	background-color: unset;
-	width: 100%;
+cursor: pointer;
+display: flex;
+gap: 0.5rem;
+border: none;
+background-color: unset;
+width: 100%;
 
 }
 
 .list-item:disabled {
-	opacity: 0.5;
-	pointer-events: none;
+opacity: 0.5;
+pointer-events: none;
 }
 
 .list-item {
-	min-height: -webkit-fit-content;
-	min-height: -moz-fit-content;
-	min-height: fit-content;
-	margin: 0rem 0;
-	cursor: pointer;
-	transition: var(--bgl-transition);
-	color: var(--bgl-text-color);
-	text-decoration: none;
-	position: relative;
+min-height: -webkit-fit-content;
+min-height: -moz-fit-content;
+min-height: fit-content;
+margin: 0rem 0;
+cursor: pointer;
+transition: var(--bgl-transition);
+color: var(--bgl-text-color);
+text-decoration: none;
+position: relative;
 }
 
 .list-item>* {
-	margin-bottom: 0;
+margin-bottom: 0;
 }
 
 .list-item::after {
-	content: '';
-	position: absolute;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	border-bottom: 1px solid var(--bgl-border-color);
+content: '';
+position: absolute;
+left: 0;
+right: 0;
+bottom: 0;
+border-bottom: 1px solid var(--bgl-border-color);
 }
 
 .list-item:last-child::after {
-	content: '';
-	position: absolute;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	border-bottom: none;
+content: '';
+position: absolute;
+left: 0;
+right: 0;
+bottom: 0;
+border-bottom: none;
 }
 
 .list-item:hover,
 .list-item.router-link-exact-active {
-	background-color: var(--bgl-primary-tint);
+background-color: var(--bgl-primary-tint);
 }
 
 .notClickable:hover {
-	background-color: unset;
-	cursor: default;
+background-color: unset;
+cursor: default;
 }
 
 .list-item:active {
-	-webkit-filter: var(--bgl-hover-filter);
-	filter: var(--bgl-hover-filter);
+-webkit-filter: var(--bgl-hover-filter);
+filter: var(--bgl-hover-filter);
 }
 
 .no-border-list.list-item::after {
-	border-bottom: none;
+border-bottom: none;
 }
 
 @media screen and (max-width: 910px) {
-	.list-item {
-		padding: 0.5rem;
-	}
+.list-item {
+	padding: 0.5rem;
 }
+}
+
 </style>

package/src/components/ListView.vue

@@ -13,7 +13,9 @@
 </template>
 
 <style>
+
 .list-wrap {
-	grid-template-rows: auto 1fr;
+grid-template-rows: auto 1fr;
 }
+
 </style>

package/src/components/MapEmbed/Index.vue

@@ -119,6 +119,7 @@ onUnmounted(() => {
 </template>
 
 <style>
+
 .leaflet-map {
   height: 100%;
   border-radius: var(--bgl-input-border-radius);
@@ -178,7 +179,7 @@ onUnmounted(() => {
   padding-bottom: 2px;
 }
 .leaflet-bar a:last-child {
-	border-bottom: none !important;
+border-bottom: none !important;
 }
 
 .leaflet-bar a:hover {
@@ -190,6 +191,7 @@ onUnmounted(() => {
 }
 
 .leaflet-marker-icon {
-	cursor: pointer;
+cursor: pointer;
 }
+
 </style>

package/src/components/Menu.vue

@@ -13,25 +13,25 @@ defineProps<{ items: NavLink[] }>()
 				<Dropdown v-if="item.children" :value="resolveI18n(item.label)" iconEnd="keyboard_arrow_down">
 					<template #trigger="{ show }">
 						<Btn thin flat :class="item.class" @click="show()">
-							<Icon :name="item.icon" size="0.8" style="margin-bottom: -0.1rem" />
+							<Icon :name="item.icon" size="0.8" style="margin-bottom: -0.1rem" class=" line-height-0" />
 							<p class="-ms-025">
 								{{ resolveI18n(item.label) }}
 							</p>
-							<Icon name="keyboard_arrow_down" size="0.8" style="margin-bottom: -0.1rem" />
+							<Icon name="keyboard_arrow_down" size="0.8" style="margin-bottom: -0.1rem" class=" line-height-0" />
 						</Btn>
 					</template>
 					<Btn
 						v-for="subItem in item.children" :key="subItem.label" thin flat :to="subItem.to"
 						:class="subItem.class" class="block m_px-025" @click="subItem.action?.()"
 					>
-						<Icon :name="subItem.icon" size="0.8" style="margin-bottom: -0.1rem" />
+						<Icon :name="subItem.icon" size="0.8" style="margin-bottom: -0.1rem" class=" line-height-0" />
 						<p class="-ms-025">
 							{{ subItem.label }}
 						</p>
 					</Btn>
 				</Dropdown>
 				<Btn v-else thin flat :to="item.to" :class="item.class" class="m_px-025" @click="item.action?.()">
-					<Icon :name="item.icon" size="0.9" style="margin-bottom: -0.1rem" />
+					<Icon :name="item.icon" size="0.9" style="margin-bottom: -0.1rem" class=" line-height-0" />
 					<p class="-ms-025">
 						{{ item.label }}
 					</p>
@@ -43,24 +43,28 @@ defineProps<{ items: NavLink[] }>()
 </template>
 
 <style scoped>
+
 /* .bgl_btn.router-link-active {
-	background-color: var(--bgl-gray-40);
+background-color: var(--bgl-gray-40);
 } */
 
 .bglTopMenu .router-link-active {
-    background: var(--bgl-primary) !important;
-    color: var(--bgl-white) !important;
+background: var(--bgl-primary) !important;
+color: var(--bgl-white) !important;
 }
+
 </style>
 
 <style>
+
 @media (max-width: 910px) {
-	.bglTopMenu::-webkit-scrollbar {
-		height: 0px;
-	}
+.bglTopMenu::-webkit-scrollbar {
+	height: 0px;
+}
 
-	.bglTopMenu {
-		mask: linear-gradient(to right, transparent, black 10px, black calc(100% - 10px), transparent);
-	}
+.bglTopMenu {
+	mask: linear-gradient(to right, transparent, black 10px, black calc(100% - 10px), transparent);
+}
 }
+
 </style>