@ozdao/martyrs 0.2.571 → 0.2.572

package/src/modules/products/components/pages/ProductEdit.vue

@@ -2,7 +2,7 @@
   <div v-if="isPageLoaded" class="w-100 bg-white pd-thin gap-thin">
     
     <Block v-if="!MOBILE_APP" class="flex-nowrap mn-b-thin gap-thin flex-v-center flex">
-      <h2 class="t-truncate mn-r-auto">
+      <h2 class="truncate mn-r-auto">
         {{ route.params.product ? products.state.current.name : 'Create Product' }}
       </h2>
 
@@ -88,16 +88,16 @@
           classSearch="bg-white radius-small"
           classSelected="bg-white pd-small radius-small"
           classDropdown="bg-white pd-small radius-medium bs-small"
-          classItem="pd-small radius-small hover-bg-light cursor-pointer"
+          classItem="pd-small radius-small hover:bg-light cursor-pointer"
           classFeed="h-max-30r gap-thin flex-column flex o-scroll"
         >
           <!-- Слот для выбранных категорий -->
           <template #selected="{ item, clear }">
             <div class="flex-nowrap flex-v-center flex gap-thin">
-              <span class="t-medium">{{ item?.name || item }}</span>
+              <span class="fw-medium">{{ item?.name || item }}</span>
               <button 
                 @click.stop="clear"
-                class="i-small pd-micro bg-red radius-extra flex-center flex aspect-1x1 hover-scale-1"
+                class="i-small pd-micro bg-red radius-extra flex-center flex aspect-1x1 hover:scale-[1.05]"
               >
                 <IconCross class="i-micro fill-white" />
               </button>
@@ -113,7 +113,7 @@
                 class="i-medium radius-small object-fit-cover mn-r-thin"
               />
               <div class="w-100">
-                <p class="t-medium">{{ item.name }}</p>
+                <p class="fw-medium">{{ item.name }}</p>
                 <p v-if="item.description" class="t-small t-transp">{{ item.description }}</p>
               </div>
             </div>
@@ -250,7 +250,7 @@
           placeholder="Product description"
           class="w-100 bg-white radius-small pd-medium"
         />
-        <div class="radius-small pd-small flex-center flex aspect-1x1 bg-red cursor-pointer hover-scale-1">
+        <div class="radius-small pd-small flex-center flex aspect-1x1 bg-red cursor-pointer hover:scale-[1.05]">
           <IconDelete 
             @click="() => products.state.current.translations.splice(index, 1)" 
             class="i-medium"

package/src/modules/products/components/pages/Products.vue

@@ -10,14 +10,14 @@
         @click="$router.push({
           name: route.params?._id ? 'Organization_ProductAdd' : 'ProductAdd'
         })" 
-        class="radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second">
+        class="radius-extra i-big hover:scale-[1.05] cursor-pointer t-white bg-second">
           +
       </button>
     </header>
 
-    <div class="cols-2-1_3 br-1px br-solid br-light z-index-3 pos-relative">
+    <div class="cols-[1fr_3fr] mobile:cols-1 br-1px br-light z-index-3 pos-relative">
 
-      <div class="o-y-scroll br-r br-solid br-light pd-medium z-index-2 desktop-only h-100 pos-relative">
+      <div class="o-y-scroll br-r-1px br-light pd-medium z-index-2 desktop-only h-100 pos-relative">
         <div class="w-100 o-y-scroll h-100">
           <!-- Категории -->
           <div class="mn-b-medium" v-if="currentCategories.length > 0">
@@ -29,7 +29,7 @@
                 v-for="category in currentCategories"
                 :key="category._id"
                 @click="selectCategory(category)"
-                class="cursor-pointer hover-t-underline mn-b-regular transition-all"
+                class="cursor-pointer hover:underline mn-b-regular ease"
               >
                 {{ category.name }}
                 <br>
@@ -49,7 +49,7 @@
               <div class="cursor-pointer w-100 flex-v-center flex-nowrap flex">
                 <h4 class="w-100">{{ filter.name }}</h4>
                 <div class="h-2r w-2r flex-child-auto aspect-1x1 flex-center flex bg-light radius-extra">
-                  <IconChevronBottom :class="{ 'rotate-180 mn-t-micro-negative': isOpen }" fill="rgb(var(--black))" class="i-medium"/>
+                  <IconChevronBottom :class="{ 'rotate-180deg mn-t-micro-negative': isOpen }" fill="rgb(var(--black))" class="i-medium"/>
                 </div>
               </div>
             </template>
@@ -78,7 +78,7 @@
               <div class="cursor-pointer w-100 flex-v-center flex-nowrap flex">
                 <h4 class="w-100">  Price</h4>
                 <div class="h-2r w-2r flex-child-auto aspect-1x1 flex-center flex bg-light radius-extra">
-                  <IconChevronBottom :class="{ 'rotate-180 mn-t-micro-negative': isOpen }" fill="rgb(var(--black))" class="i-medium"/>
+                  <IconChevronBottom :class="{ 'rotate-180deg mn-t-micro-negative': isOpen }" fill="rgb(var(--black))" class="i-medium"/>
                 </div>
               </div>
             </template>
@@ -112,7 +112,7 @@
               <div class="cursor-pointer w-100 flex-v-center flex-nowrap flex">
                 <h4 class="w-100">Availability</h4>
                 <div class="h-2r w-2r flex-child-auto aspect-1x1 flex-center flex bg-light radius-extra">
-                  <IconChevronBottom :class="{ 'rotate-180 mn-t-micro-negative': isOpen }" fill="rgb(var(--black))" class="i-medium"/>
+                  <IconChevronBottom :class="{ 'rotate-180deg mn-t-micro-negative': isOpen }" fill="rgb(var(--black))" class="i-medium"/>
                 </div>
               </div>
             </template>
@@ -122,7 +122,7 @@
                 <div 
                   @click="() => { tempSelectedDates = selectedFilters.availability; showDatePickerPopup = true; }"
                   :class="{ 'bg-light': selectedFilters?.availability }"
-                  class="pd-small field-wrapper radius-small bg-light cursor-pointer hover-bg-light transition-all  flex-v-center flex gap-thin"
+                  class="pd-small field-wrapper radius-small bg-light cursor-pointer hover:bg-light ease  flex-v-center flex gap-thin"
                 >
                   <IconCalendar class="i-medium" />
                   <span class="h-1r">{{ selectedFilters.availability ? `${formatDate(selectedFilters.availability.start, { dayMonth: true, language: 'en' })} - ${formatDate(selectedFilters.availability.end, { dayMonth: true, language: 'en' })}` : 'Select dates'}}</span>
@@ -145,13 +145,13 @@
         
         <slot></slot>
 
-        <div class="mn-b-thin mobile-only w-100 o-y-scroll scroll-hide scroll-snap-type-x-mandatory scroll-pd-regular">
+        <div class="mn-b-thin mobile-only w-100 o-y-scroll scroll-hide scroll-snap-x-mandatory scroll-pd-regular">
           <div class="gap-thin flex-nowrap flex">
             <div
               v-for="category in currentCategories"
               :key="category._id"
               @click="selectCategory(category)"
-              class=" flex-child-default bg-light flex t-nowrap pd-medium radius-medium cursor-pointer hover-bg-light transition-all"
+              class=" flex-child-default bg-light flex t-nowrap pd-medium radius-medium cursor-pointer hover:bg-light ease"
             >
               {{ category.name }}
             </div>
@@ -196,7 +196,7 @@
               class=""
             />
           </div>
-          <div class="cols-4 z-index-1 pos-relative w-100 rows-1 gap-thin">
+          <div class="cols-4 mobile:cols-2 z-index-1 pos-relative w-100 rows-1 gap-thin">
             <router-link
               v-for="product in items"
               :to="route.params._id ? `/organizations/${route.params._id}/products/${product._id}` : `/products/${product._id}`"

package/src/modules/products/components/sections/EditAttributes.vue

@@ -14,17 +14,17 @@
         class="bg-white radius-small pd-small flex-nowrap flex-v-center flex gap-thin"
       >
         <div class="w-100">
-          <p class="p-regular mn-b-thin t-medium d-block">{{ attribute.name || 'Unnamed parameter' }}</p>
-          <p class="t-medium t-transp">{{ attribute.value || 'No value' }}</p>
+          <p class="p-regular mn-b-thin fw-medium d-block">{{ attribute.name || 'Unnamed parameter' }}</p>
+          <p class="fw-medium t-transp">{{ attribute.value || 'No value' }}</p>
         </div>
         
         <div class="flex gap-thin">
-          <div @click="() => openAttributePopup(index)" class="radius-small pd-small flex-center flex aspect-1x1 bg-light cursor-pointer hover-scale-1">
+          <div @click="() => openAttributePopup(index)" class="radius-small pd-small flex-center flex aspect-1x1 bg-light cursor-pointer hover:scale-[1.05]">
             <IconEdit
               class="i-medium"
             />
           </div>
-          <div @click="() => attributes.splice(index, 1)" class="radius-small pd-small flex-center flex aspect-1x1 bg-red cursor-pointer hover-scale-1">
+          <div @click="() => attributes.splice(index, 1)" class="radius-small pd-small flex-center flex aspect-1x1 bg-red cursor-pointer hover:scale-[1.05]">
             <IconDelete
               class="i-medium"
             />

package/src/modules/products/components/sections/EditCategories.vue

@@ -28,7 +28,7 @@
           v-for="category in suggestedCategories" 
           :key="category._id"
           @click="addCategory(category)"
-          class="cursor-pointer hover-scale-1 bg-main t-black radius-extra pd-thin"
+          class="cursor-pointer hover:scale-[1.05] bg-main t-black radius-extra pd-thin"
         >
           {{ getCategoryPath(category) }}
         </span>

package/src/modules/products/components/sections/EditDiscounts.vue

@@ -14,8 +14,8 @@
         class="bg-white radius-small pd-small flex-nowrap flex-v-center flex gap-thin"
       >
         <div class="w-100">
-          <p class="p-regular mn-b-thin t-medium d-block">{{ discount.name || 'Unnamed discount' }}</p>
-          <p class="t-medium t-transp">
+          <p class="p-regular mn-b-thin fw-medium d-block">{{ discount.name || 'Unnamed discount' }}</p>
+          <p class="fw-medium t-transp">
             <template v-if="discount.type === 'special_price'">
               Special price: {{ formatPrice(discount.value) }}
             </template>
@@ -29,12 +29,12 @@
         </div>
         
         <div class="flex gap-thin">
-          <div @click="() => openDiscountPopup(index)" class="radius-small pd-small flex-center flex aspect-1x1 bg-light cursor-pointer hover-scale-1">
+          <div @click="() => openDiscountPopup(index)" class="radius-small pd-small flex-center flex aspect-1x1 bg-light cursor-pointer hover:scale-[1.05]">
             <IconEdit
               class="i-medium"
             />
           </div>
-          <div @click="() => discounts.splice(index, 1)" class="radius-small pd-small flex-center flex aspect-1x1 bg-red cursor-pointer hover-scale-1">
+          <div @click="() => discounts.splice(index, 1)" class="radius-small pd-small flex-center flex aspect-1x1 bg-red cursor-pointer hover:scale-[1.05]">
             <IconDelete
               class="i-medium"
             />
@@ -93,7 +93,7 @@
         class="w-100 bg-light radius-small pd-small"
       />
 
-      <div class="t-medium mn-t-micro mn-b-micro">Date Range</div>
+      <div class="fw-medium mn-t-micro mn-b-micro">Date Range</div>
       <div class="cols-2 mobile:cols-1 gap-thin">
         <Field
           v-model:field="currentDiscount.date.start"
@@ -110,7 +110,7 @@
         />
       </div>
 
-      <div class="t-medium mn-t-micro mn-b-micro">Time Range</div>
+      <div class="fw-medium mn-t-micro mn-b-micro">Time Range</div>
       <div class="cols-2 mobile:cols-1 gap-thin">
         <Field
           v-model:field="currentDiscount.time.start"

package/src/modules/products/components/sections/EditRecommended.vue

@@ -61,7 +61,7 @@
           :name="product.name"
           :showThumbnail="true"
           @click="store.core.actions.add(recommended, product); closeRecommendedPopup();"
-          class="bg-white pd-thin radius-medium w-100 mn-b-thin cursor-pointer hover-scale-1"
+          class="bg-white pd-thin radius-medium w-100 mn-b-thin cursor-pointer hover:scale-[1.05]"
         />
       </Feed>
     </div>

package/src/modules/products/components/sections/EditVariants.vue

@@ -46,11 +46,11 @@
           
           <div class="w-100">
             <div class="flex-nowrap mn-b-nano flex-v-center flex">
-              <p class="p-regular t-medium d-block">{{ variant.name || 'Unnamed variant' }}</p>
+              <p class="p-regular fw-medium d-block">{{ variant.name || 'Unnamed variant' }}</p>
               <p v-if="variant.status" class="t-small pd-thin mn-l-thin radius-thin bg-light">{{ variant.status }}</p>
             </div>
 
-            <p class="t-medium t-transp">{{ returnCurrency() }}{{ variant.price }} per {{ variant.quantity }}{{ variant.unit }}</p>
+            <p class="fw-medium t-transp">{{ returnCurrency() }}{{ variant.price }} per {{ variant.quantity }}{{ variant.unit }}</p>
             <p v-if="variant.ingredients?.length" class="t-small t-transp">{{ variant.ingredients.length }} ingredients</p>
            
           </div>
@@ -59,7 +59,7 @@
             <Button
               :showSuccess="false"
               :showLoader="true"
-              class="radius-small pd-small flex-center flex aspect-1x1 bg-light cursor-pointer hover-scale-1"
+              class="radius-small pd-small flex-center flex aspect-1x1 bg-light cursor-pointer hover:scale-[1.05]"
               :submit="() => copyVariant(variant)"
             >
               <IconDuplicate class="i-medium" />
@@ -67,7 +67,7 @@
             <Button
               :showSuccess="false"
               :showLoader="false"
-              class="radius-small pd-small flex-center flex aspect-1x1 bg-light cursor-pointer hover-scale-1"
+              class="radius-small pd-small flex-center flex aspect-1x1 bg-light cursor-pointer hover:scale-[1.05]"
               :submit="() => openVariantPopup(variant)"
             >
               <IconEdit class="i-medium" />
@@ -75,7 +75,7 @@
             <Button
               :showSuccess="false"
               :showLoader="true"
-              class="radius-small pd-small flex-center flex aspect-1x1 bg-red cursor-pointer hover-scale-1"
+              class="radius-small pd-small flex-center flex aspect-1x1 bg-red cursor-pointer hover:scale-[1.05]"
               :submit="() => deleteVariant(variant)"
             >
                <IconDelete class="i-medium" />
@@ -140,7 +140,7 @@
       </div>
       
       <!-- Attributes Section -->
-      <div class="t-medium mn-t-small mn-b-small">Attributes</div>
+      <div class="fw-medium mn-t-small mn-b-small">Attributes</div>
       <div 
         class="gap-micro flex-nowrap flex mn-b-small" 
         v-for="(attr, attrIndex) in currentVariant.attributes" 
@@ -156,7 +156,7 @@
           placeholder="Attribute Value"
           class="w-100 bg-light radius-small pd-small"
         />
-        <div class="radius-small h-100 flex-center flex-child-default flex aspect-1x1 bg-red cursor-pointer hover-scale-1">
+        <div class="radius-small h-100 flex-center flex-child-default flex aspect-1x1 bg-red cursor-pointer hover:scale-[1.05]">
           <IconDelete 
             @click="() => currentVariant.attributes.splice(attrIndex, 1)" 
             class="i-medium"
@@ -205,7 +205,7 @@
       </div>
 
       <!-- Images Section -->
-      <div class="t-medium mn-t-small mn-b-small">Images</div>
+      <div class="fw-medium mn-t-small mn-b-small">Images</div>
       <EditImages
         :images="currentVariant.images || []"
         :uploadPath="'variants'"

package/src/modules/products/components/sections/FilterProducts.vue

@@ -6,7 +6,7 @@
         :status="true"
       >
         <template #header>
-          <p class="cursor-pointer mn-r-auto t-medium p-medium">{{ t('categoriesTitle') }}</p>
+          <p class="cursor-pointer mn-r-auto fw-medium p-medium">{{ t('categoriesTitle') }}</p>
           <!-- SVG Icon -->
         </template>
         <template #content>
@@ -30,7 +30,7 @@
         :status="false"
       >
         <template #header>
-          <p class="cursor-pointer  mn-r-auto t-medium p-medium">{{ t('filters.price.title') }}</p>
+          <p class="cursor-pointer  mn-r-auto fw-medium p-medium">{{ t('filters.price.title') }}</p>
           <!-- SVG Icon -->
         </template>
         <template #content>
@@ -54,7 +54,7 @@
         :status="false"
       >
         <template #header>
-          <p class="cursor-pointer  mn-r-auto t-medium p-medium">Delivery</p>
+          <p class="cursor-pointer  mn-r-auto fw-medium p-medium">Delivery</p>
         </template>
         <template #content>
           <Checkbox 

package/src/modules/products/components/sections/ProductConfigurator.vue

@@ -22,7 +22,7 @@
     <!-- Показываем цену, если нет вариантов или не выбран ни один вариант -->
     <div class="flex-nowrap flex gap-thin">
       <div class="">
-        <p class="t-medium mn-b-thin">Price</p>
+        <p class="fw-medium mn-b-thin">Price</p>
         <Price 
           :product="selectedVariant || productVariants[0]"
           :variants="productVariants" 
@@ -35,7 +35,7 @@
       <!-- Quantity Selection -->
       <div class="w-100">
         <div class="flex flex-nowrap flex-v-center mn-b-thin">
-          <p class="t-medium">Quantity</p>
+          <p class="fw-medium">Quantity</p>
           <span v-if="selectedVariant" class="t-small t-transp mn-l-thin">
             (Max: {{ maxQuantity }})
           </span>

package/src/modules/products/components/sections/ProductInformationSection.vue

@@ -32,11 +32,11 @@
 		</div>
 		<!-- Delivery -->
 		<div v-if="data.currentTab === 'delivery'" class="product-description">
-			<div class="cols-2">
+			<div class="cols-2 mobile:cols-1">
 				<!-- Left col -->
 				<div class="mn-r-medium col">
 					<img loading="lazy" class="mn-b-medium" src="@/assets/icons/shopping-bag.svg">
-					<p class="mn-b-small t-demi">Если вы в Москве</p>
+					<p class="mn-b-small fw-demi">Если вы в Москве</p>
 					<p class="mn-b-small">
 						Доставляем по Москве курьером в примеркой! У нас свои вежливые и пунктуальные курьеры.
 					</p>
@@ -45,14 +45,14 @@
 							<li>Не ограничиваем время на примерку</li>
 							<li>Если ничего не подойдёт, вы платите только за доставку</li>
 						</ul>
-					<p class="mn-b-small t-demi">Тарифы</p>
-					<p class="mn-b-thin">В пределах МКАД — <span class="mn-b-small t-demi">350 ₽</span></p>
-					<p class="mn-b-small">За пределы МКАД — <span class="mn-b-small t-demi">550 ₽</span></p>
+					<p class="mn-b-small fw-demi">Тарифы</p>
+					<p class="mn-b-thin">В пределах МКАД — <span class="mn-b-small fw-demi">350 ₽</span></p>
+					<p class="mn-b-small">За пределы МКАД — <span class="mn-b-small fw-demi">550 ₽</span></p>
 				</div>
 				<!-- Right col -->
 				<div class="col">
 					<img loading="lazy" class="mn-b-medium" src="@/assets/icons/globe.svg">
-					<p class="mn-b-small t-demi">Доставка в любую точку мира</p>
+					<p class="mn-b-small fw-demi">Доставка в любую точку мира</p>
 					<p class="mn-b-small">В другие города отправляем почтой России или компанией СДЭК по 100% предоплате на карту.</p>
 					<p class="mn-b-small">Наши менеджеры на связи с вами ежедневно с 10 до 21 часов и готовы ответить на любые вопросы, а так же сделать дополнительные замеры, фото или видео вещей.</p>  
 					<p class="mn-b-small">Стоимость доставки рассчитывается индивидуально🌷</p>
@@ -62,10 +62,10 @@
 		</div>
 		<!-- Payment -->
 		<div v-if="data.currentTab === 'payment'" class="product-description">
-			<div class="cols-2">
+			<div class="cols-2 mobile:cols-1">
 				<!-- Left col -->
 				<div class="mn-r-medium col">
-					<p class="mn-b-small t-demi">Если вы в Москве</p>
+					<p class="mn-b-small fw-demi">Если вы в Москве</p>
 					<ul style="list-style: decimal; line-height: 1.5;" class="mn-b-medium">
 						<li class="mn-b-thin">Положите выбранные товары в корзину и оформите заказ.</li>
 						<li class="mn-b-thin">Наши менеджеры свяжутся с вами в рабочее время для уточнения деталей</li>
@@ -73,11 +73,11 @@
 						<li class="mn-b-thin">Ожидайте курьера в назначенную дату. Вы можете примерить все что заказали, выбрать и оплатить только то, что вам подошло + за доставку курьеру</li>
 						<li class="mn-b-thin">Оплатить можно как наличными, так и по карте, у наших курьеров всегда с собой терминал</li>
 					</ul>
-					<!-- <p>В <a  @click="store.commit('toggleShopAdress')"  class="t-demi underline">шоуруме в Москве</a> оплатить товары вы сможете как наличными, так и по карте.</p> -->
+					<!-- <p>В <a  @click="store.commit('toggleShopAdress')"  class="fw-demi underline">шоуруме в Москве</a> оплатить товары вы сможете как наличными, так и по карте.</p> -->
 				</div>
 				<!-- Right col -->
 				<div class="col">
-					<p class="mn-b-small t-demi">Если вы не Москве</p>
+					<p class="mn-b-small fw-demi">Если вы не Москве</p>
 					<ul style="list-style: decimal; line-height: 1.5;" class="mn-b-medium">
 						<li class="mn-b-thin">Положите выбранные товары в корзину и оформите заказ.</li>
 						<li class="mn-b-thin">Наши менеджеры свяжутся с вами в рабочее время для уточнения деталей</li>

package/src/modules/products/components/sections/ProductsRecommended.vue

@@ -153,12 +153,12 @@ const addSelectedToCart = async () => {
         />
       </CardProduct>
 
-      <div class="flex-center flex flex-column pd-small radius-small br-solid br-1px br-light">
+      <div class="flex-center flex flex-column pd-small radius-small br-1px br-light">
         <div class="mn-b-thin i-extra pd-small bg-light radius-extra">
           <IconProducts class="i-big"/>
         </div>
         <p class="mn-b-small">Total price:</p>
-        <p class="mn-b-medium h3 t-medium">${{ totalPrice }}</p>
+        <p class="mn-b-medium h3 fw-medium">${{ totalPrice }}</p>
         <Button 
           :disabled="selectedProducts.length < 1"
           class="bg-main gap-micro"

package/src/modules/products/components/sections/SectionProduct.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class="cols-2-1_2 pd-small w-100 gap-thin">
+	<div class="cols-[1fr_2fr] mobile:cols-1 pd-small w-100 gap-thin">
 		
 		<div class="pd-small  bg-light radius-medium flex-nowrap flex-column flex pos-relative">
 			<div class="w-100 bg-light radius-semi o-hidden">
@@ -46,7 +46,7 @@
 			<!-- Price -->
 			<Price v-if="product.listing !== 'rent'" :product="product" size="big" class="mn-b-semi" />
 			<!-- Variants -->
-			<!-- <div v-if="product.variants.length > 0" class="flex-nojustify  flex">
+			<!-- <div v-if="product.variants.length > 0" class="flex-justify-start  flex">
 				<SelectElement v-if="sizes2.length > 0" :elements="sizes2" :selected="product.selectedSize" class="mn-r-medium" />
 			</div> -->
 			<!-- Description -->
@@ -76,21 +76,21 @@
 
 					<div 
 						v-else
-						class="cols-2 w-100 bg-light radius-medium pd-medium gap-small"
+						class="cols-2 mobile:cols-1 w-100 bg-light radius-medium pd-medium gap-small"
 					>
 						<div 
 							v-if="product.attributes.length > 0" 
 							v-for="attributes in product.attributes" 
 							class="w-100 pd-small radius-small bg-white product-attributes"
 						>
-							<p class="t-demi">{{ attributes.name }}</p>
+							<p class="fw-demi">{{ attributes.name }}</p>
 							<p>{{ attributes.value }}</p>
 						</div>
 					</div>
 				</transition>
 			</div>
 
-			<div v-if="product.listing === 'rent'" class="mn-t-small max-w-33rem mobile-w-100 t-white gap-small cols-2">
+			<div v-if="product.listing === 'rent'" class="mn-t-small max-w-33rem mobile-w-100 t-white gap-small cols-2 mobile:cols-1">
 				<Button
 					:submit="() => { addToCart(product) } " 
 					:text="{
@@ -104,7 +104,7 @@
 			</div>
 
 			<!-- Actions -->
-			<div v-else class="mn-t-small max-w-33rem mobile-w-100 t-white gap-small cols-2">
+			<div v-else class="mn-t-small max-w-33rem mobile-w-100 t-white gap-small cols-2 mobile:cols-1">
 				<Button
 					v-if="product.quantity > 0"
 					:submit="a => addToCart(product)" 
@@ -117,7 +117,7 @@
 				> 
 						{{ t('addtoorder') }}
 				</Button>
-				<div v-else class="flex-center flex uppercase radius-medium t-black w-max pd-small t-medium bg-grey h-3r w-100 mn-r-smallbutton">
+				<div v-else class="flex-center flex uppercase radius-medium t-black w-max pd-small fw-medium bg-grey h-3r w-100 mn-r-smallbutton">
 					Out of Stock
 				</div>
 			</div>

package/src/modules/products/experiments/product-recommendation/components/HeroRecommendation.vue

@@ -112,7 +112,7 @@
 					class="
 						uppercase 
 						pd-thin
-						t-medium
+						fw-medium
 						flex-center
 						flex-column
 						flex-nowrap
@@ -121,8 +121,8 @@
 						bg-blur-thin
 						radius-semi
 						cursor-pointer
-						transition-elastic
-						hover-easeInOut-1 
+						ease-elastic
+						hover:translate-y-[-10px] hover:scale-[1.1] 
 					"
 				>
 					<img loading="lazy" 

package/src/modules/rents/views/components/blocks/CardRent.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="order-card">
-    <div class="order-status flex-v-center flex-nojustify flex">
+    <div class="order-status flex-v-center flex-justify-start flex">
       <span>{{ rent.status }}</span>
       <span class="mn-l-auto">{{ totalDays }} days</span>
     </div>

package/src/modules/rents/views/components/pages/Gant/DateLabel.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="flex flex-v-center gap-thin">
     <IconCalendar class="i-small" />
-    <span class="t-medium">{{ dateText }}</span>
+    <span class="fw-medium">{{ dateText }}</span>
   </div>
 </template>
 

package/src/modules/rents/views/components/pages/Gant/GanttBar.vue

@@ -1,11 +1,11 @@
 <template>
   <div 
-    class="gantt-bar pos-absolute radius-small cursor-pointer shadow-small transition-ease-out hover-scale-0"
+    class="gantt-bar pos-absolute radius-small cursor-pointer shadow-small ease-out hover:scale-[1.015]"
     :class="barClass"
     :style="barStyle"
     @click="$emit('click')"
   >
-    <div class="pd-micro t-micro t-white t-truncate">
+    <div class="pd-micro t-micro t-white truncate">
       {{ bar.item.productDetails.name || 'Task' }}
     </div>
   </div>

package/src/modules/rents/views/components/pages/Gant/GanttChart.vue

@@ -11,15 +11,15 @@
     />
     
     <div 
-      class="gantt-container scroller o-scroll bg-white radius-small br-solid br-1px br-black-transp-10"
+      class="gantt-container scroller o-scroll bg-white radius-small br-1px br-black-transp-10"
       ref="container"
       @scroll="handleScroll"
     >
       <div class="gantt-content">
         <!-- Header -->
-        <div class="gantt-header pos-sticky top-0 z-index-2 bg-white br-b br-solid br-black-transp-10">
+        <div class="gantt-header pos-sticky top-0 z-index-2 bg-white br-b-1px br-black-transp-10">
           <div class="flex">
-            <div class="gantt-product-col pos-sticky left-0 z-index-3 bg-light pd-small br-r br-solid br-black-transp-10">
+            <div class="gantt-product-col pos-sticky left-0 z-index-3 bg-light pd-small br-r-1px br-black-transp-10">
               Product
             </div>
             
@@ -27,7 +27,7 @@
               <div
                 v-for="(cell, i) in visibleCells"
                 :key="cell.key"
-                class="gantt-cell br-r br-solid br-black-transp-10 t-center pd-small"
+                class="gantt-cell br-r-1px br-black-transp-10 t-center pd-small"
                 :class="getCellClass(cell)"
                 :style="{ width: cellWidth + 'px' }"
               >
@@ -42,12 +42,12 @@
           <div 
             v-for="(group, i) in groups" 
             :key="group.key" 
-            class="gantt-row flex br-b br-solid br-black-transp-10"
+            class="gantt-row flex br-b-1px br-black-transp-10"
             :class="i % 2 === 0 ? 'bg-light-transp' : ''"
             :style="{ height: rowHeight + 'px' }"
           >
-            <div class="gantt-product-col pos-sticky left-0 z-index-1 bg-white pd-small br-r br-solid br-black-transp-10">
-              <div class="t-medium mn-b-micro">{{ group.title }}</div>
+            <div class="gantt-product-col pos-sticky left-0 z-index-1 bg-white pd-small br-r-1px br-black-transp-10">
+              <div class="fw-medium mn-b-micro">{{ group.title }}</div>
               <div class="t-micro" :class="statusClass(group)">{{ group.status }}</div>
             </div>
             
@@ -57,7 +57,7 @@
                 <div
                   v-for="cell in visibleCells"
                   :key="cell.key + '-bg'"
-                  class="gantt-cell h-100 br-r br-solid br-black-transp-10"
+                  class="gantt-cell h-100 br-r-1px br-black-transp-10"
                   :class="getCellClass(cell)"
                   :style="{ width: cellWidth + 'px' }"
                 />

package/src/modules/rents/views/components/pages/Gant/GanttHeaderCell.vue

@@ -13,7 +13,7 @@
       <!-- <div v-if="isFirst || cell.date.getDate() === 1" class="t-micro">
         {{ dayjs(cell.date).format('MMM YYYY') }}
       </div> -->
-      <div class="t-medium">{{ cell.date.getDate() }}</div>
+      <div class="fw-medium">{{ cell.date.getDate() }}</div>
       <div class="t-micro t-transp">{{ dayjs(cell.date).format('ddd') }}</div>
     </template>
     

package/src/modules/rents/views/components/pages/Rents.vue

@@ -4,7 +4,7 @@
       <h2 class="mn-r-medium">Rents</h2>
       <button 
         @click="$router.push({ name: 'Organization_Create Rent', params: {_id: route.params._id}})" 
-        class="radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second"
+        class="radius-extra i-big hover:scale-[1.05] cursor-pointer t-white bg-second"
       >
         +
       </button>