Merge branch 'main' of github.com:inikoo/aiku

Author: dandiAW

resources/js/Components/CMS/Webpage/CTA3/CTA3Iris.vue

@@ -34,7 +34,7 @@ const openGallery = ref(false)
 
 		<div
 			class="absolute inset-x-0 bottom-0 rounded-bl-lg rounded-br-lg bg-white bg-opacity-75 p-6 backdrop-blur backdrop-filter sm:flex sm:items-center sm:justify-between lg:inset-x-auto lg:inset-y-0 lg:w-96 lg:flex-col lg:items-start lg:rounded-br-none lg:rounded-tl-lg">
-			<div class="text-gray-600 pr-3 overflow-y-auto mb-4">
+			<div class="text-center lg:text-left text-gray-600 pr-3 overflow-y-auto mb-4">
 					<div v-html="fieldValue.text" />
 			</div>
 			<a

resources/js/Components/CMS/Webpage/CTA3/CTA3Workshop.vue

@@ -56,7 +56,7 @@ const onUpload = (e) => {
 
 		<div
 			class="absolute inset-x-0 bottom-0 rounded-bl-lg rounded-br-lg bg-white bg-opacity-75 p-6 backdrop-blur backdrop-filter sm:flex sm:items-center sm:justify-between lg:inset-x-auto lg:inset-y-0 lg:w-96 lg:flex-col lg:items-start lg:rounded-br-none lg:rounded-tl-lg">
-			<div class="text-gray-600 pr-3 overflow-y-auto mb-4">
+			<div class="text-center lg:text-left text-gray-600 pr-3 overflow-y-auto mb-4">
 				<Editor
 					v-if="modelValue?.text"
 					v-model="modelValue.text"

resources/js/Components/CMS/Website/Footers/footerTheme1/Footer1Iris.vue

@@ -24,7 +24,7 @@ const props = defineProps<{
     <div id="app" class="md:mx-0 pb-12 lg:pb-24 pt-4 md:pt-8 md:px-16 text-white" :style="getStyles(modelValue?.container?.properties)">
         <div
             class="w-full flex flex-col md:flex-row gap-4 md:gap-8 pt-2 pb-4 md:pb-6 mb-4 md:mb-10 border-0 border-b border-solid border-gray-700">
-            <div class="flex-1 flex items-center justify-center md:justify-start ">
+            <div class="overflow-hidden flex-1 flex items-center justify-center md:justify-start ">
                 <img v-if="modelValue?.logo?.source && !isObject(modelValue.logo?.source)" width="260px" height="70px" :src="modelValue.logo.source"
                     :alt="modelValue.logo.alt" class="h-auto max-h-20 w-auto min-w-16" />
                 <Image

resources/js/Components/CMS/Website/Headers/Header2/Header2Iris.vue

@@ -40,13 +40,17 @@ const isLoggedIn = inject("isPreviewLoggedIn", false)
 		<div class="flex flex-col justify-between items-center py-4 px-6">
 			<div class="w-full grid grid-cols-3 items-center gap-6">
 				<!-- Logo -->
-				<a href="/">
-					<div :style="getStyles(fieldValue?.logo?.properties)">
-						<Image
-							:alt="fieldValue?.logo?.alt"
-							:src="fieldValue?.logo?.image?.source"/>
-					</div>
-				</a>
+				<component
+					:is="fieldValue?.logo?.url ? 'a' : 'div'"
+					:href="fieldValue?.logo?.url || '#'"
+				>
+					<Image
+						:alt="fieldValue?.logo?.alt"
+						:src="fieldValue?.logo?.image?.source"
+						:style="getStyles(fieldValue?.logo?.properties)"
+						class="hover-dashed"
+					/>
+				</component>
 
 				<!-- Search Bar -->
 				<div class="relative justify-self-center w-full max-w-md">

resources/js/Components/CMS/Website/Headers/Header2/Header2Workshop.vue

@@ -191,12 +191,15 @@ const editable = ref(true)
 			<div class="w-full grid grid-cols-3 items-center gap-6">
 				<!-- Logo -->
 				<div
-					:style="getStyles(modelValue.logo.properties)"
-					@click="() => emits('setPanelActive', 'logo')">
+					@click="() => emits('setPanelActive', 'logo')"
+					class="w-fit"
+				>
 					<Image
 						:alt="modelValue?.logo?.alt"
 						:src="modelValue?.logo?.image?.source"
-						class="hover-dashed"></Image>
+						:style="getStyles(modelValue.logo.properties)"
+						class="hover-dashed">
+					</Image>
 				</div>
 
 				<!-- Search Bar -->
@@ -249,13 +252,13 @@ const editable = ref(true)
 				<MobileMenu :header="modelValue" :menu="modelValue" />
 
 				<!-- Logo for Mobile -->
+				<Image v-if="modelValue?.logo?.source?.original" :src="modelValue?.logo?.source" class="h-10 mx-2"></Image>
 				<img
-					v-if="!modelValue.logo"
+					v-else-if="!modelValue.logo"
 					src="https://d19ayerf5ehaab.cloudfront.net/assets/store-18687/18687-logo-1642004490.png"
 					alt="Ancient Wisdom Logo"
 					class="h-10 mx-2" />
 
-				<Image v-else :src="modelValue?.logo?.source" class="h-10 mx-2"></Image>
 
 				<!-- Profile Icon with Dropdown Menu -->
 				<div @click="toggle" class="flex items-center cursor-pointer text-white">

resources/js/Components/CMS/Website/TopBars/Template/Topbar1Fulfilment/Topbar1FulfilmentWorkshop.vue

@@ -105,7 +105,7 @@ const layout = inject('layout', {})
 
         <a v-if="checkVisible(model?.profile?.visible || null, isLoggedIn)"
                 id="profile_button"
-                   class="space-x-1.5 whitespace-nowrap flex flex-nowrap items-center "
+                   class="space-x-1.5 whitespace-nowrap flex flex-nowrap items-center hover-dashed"
                 :style="getStyles(model?.profile.container?.properties)"
                  @click="()=> emits('setPanelActive', 'profile')"
             >

resources/js/Pages/Grp/Web/PreviewWebpageWorkshop.vue

@@ -106,6 +106,11 @@ onMounted(() => {
 
 <style lang="scss">
 .hover-dashed {
-    @apply hover:bg-gray-200/30 border border-transparent hover:border-white/80 border-dashed cursor-pointer;
+    @apply relative;
+
+    &::after {
+        content: "";
+        @apply absolute inset-0 hover:bg-gray-200/30 border border-transparent hover:border-white/80 border-dashed cursor-pointer;
+    }
 }
 </style>

resources/js/Pages/Grp/Web/PreviewWorkshop.vue

@@ -166,6 +166,11 @@ console.log(route().current())
 
 
 .hover-dashed {
-    @apply hover:bg-gray-200/30 border border-transparent hover:border-white/80 border-dashed cursor-pointer;
+    @apply relative;
+
+    &::after {
+        content: "";
+        @apply absolute inset-0 hover:bg-gray-200/30 border border-transparent hover:border-white/80 border-dashed cursor-pointer;
+    }
 }
 </style>