@ozdao/martyrs 0.2.570 → 0.2.572

package/src/modules/auth/views/components/pages/Profile.vue

@@ -5,7 +5,7 @@
 	>
 		<div 
 			v-if="users.state.current?.status === 'removed'"
-			class="flex-center flex pd-medium radius-big bg-light uppercase t-semi w-100 h-100"
+			class="flex-center flex pd-medium radius-big bg-light uppercase fw-semi w-100 h-100"
 		>
 			Sorry, user has been removed.
 		</div>
@@ -46,7 +46,7 @@
 							class="w-100"
 						>
 							<button 
-								class="w-100 bg-black br-solid br-1px br-white-transp-20 t-white button-small button"
+								class="w-100 bg-black br-1px br-white-transp-20 t-white button-small button"
 							>
 								Report
 							</button>
@@ -97,7 +97,7 @@
 				
 				<p 
 					v-if="users.state.current.username"
-					class="mn-b-thin t-main t-semi"
+					class="mn-b-thin t-main fw-semi"
 				>
 					@{{ users.state.current.username ? users.state.current.username : 'Not specified' }}
 				</p>
@@ -111,7 +111,7 @@
 				<div class="mn-b-medium flex-center flex-nowrap flex">
 					<div 
 					  v-for="(role,index) in users.state.current.roles" 
-					  class="pd-thin radius-small t-semi bg-white" 
+					  class="pd-thin radius-small fw-semi bg-white" 
 					  :class="{'mn-r-thin': index !== users.state.current.roles.length - 1}"
 					 >
 						{{role.icon}}
@@ -120,7 +120,7 @@
 				</div>			
 
 				<p 
-					class="t-semi mn-b-small"
+					class="fw-semi mn-b-small"
 				>
 					<!-- 👍 3 212 likes ·  -->
 					<!-- 💬 342 comments ·  -->

package/src/modules/auth/views/components/pages/ProfileBlogposts.vue

@@ -7,7 +7,7 @@
     		@click="$router.push({
     			name: 'Create BlogPost'
     		})" 
-    		class="radius-100 t-white t-semi i-big hover-scale-1 cursor-pointer t-white bg-second">
+    		class="radius-extra t-white fw-semi i-big hover:scale-[1.05] cursor-pointer t-white bg-second">
     			+
     	</button>
 		</header>

package/src/modules/auth/views/components/pages/ProfileEditAccount.vue

@@ -4,9 +4,9 @@
 
     <div class="bg-white mn-b-thin ">
       <h3 class="mn-b-small">Settings</h3>
-      <Checkbox 
+      <Checkbox
         :label="'Darkmode'"
-        :radio="core.state.theme.darkmode"
+        :radio="core.state.theme.mode === 'dark'"
         @update:radio="event => core.actions.toggleTheme()"
         class="w-100 bg-light t-black pd-medium radius-small"
       />

package/src/modules/auth/views/components/pages/ResetPassword.vue

@@ -8,7 +8,7 @@
 		<!-- Select -->
 		<div 
 			v-if="availableTabs.length > 1" 
-			class="mn-b-small p-small uppercase t-semi bg-light radius-small o-hidden"
+			class="mn-b-small p-small uppercase fw-semi bg-light radius-small o-hidden"
 		>
 			<Tab 
 				v-model:selected="tabAuth"

package/src/modules/auth/views/components/pages/SignIn.vue

@@ -6,17 +6,17 @@
 		<h3 class="mn-b-medium">
 			{{ t('auth.signIn.title') }}
 			<br>
-			<span class="t-semi">{{ t('auth.signIn.subtitle') }}</span>
+			<span class="fw-semi">{{ t('auth.signIn.subtitle') }}</span>
 		</h3>
 
 		<p class="mn-b-big">
-			<router-link :to="{name: 'Sign Up', query: { returnUrl: route.query?.returnUrl}}" class="underline t-second">{{ t('auth.signIn.signup') }}</router-link>
+			<router-link :to="{name: 'Sign Up', query: { returnUrl: route.query?.returnUrl}}" class="underline t-grey">{{ t('auth.signIn.signup') }}</router-link>
 		</p>
 		
 		<!-- Select -->
 		<div 
 			v-if="availableTabs.length > 1" 
-			class="mn-b-small p-small uppercase t-semi bg-light radius-small o-hidden"
+			class="mn-b-small p-small uppercase fw-semi bg-light radius-small o-hidden"
 		>
 			<Tab 
 				v-model:selected="tabAuth"

package/src/modules/auth/views/components/pages/SignUp.vue

@@ -7,7 +7,7 @@
 		<!-- Select -->
 		<div 
 			v-if="availableTabs.length > 1" 
-			class="mn-b-small p-small uppercase t-semi bg-light radius-small o-hidden"
+			class="mn-b-small p-small uppercase fw-semi bg-light radius-small o-hidden"
 		>
 			<Tab 
 				v-model:selected="tabAuth"

package/src/modules/auth/views/components/pages/UserDashboard.vue

@@ -3,21 +3,21 @@
 		<h2 class="mn-b-small">Overview</h2>
 		<div class="mn-b-medium cols-3 mobile:cols-1 gap-thin">
 			<Block class="pos-relative">
-				<span class="t-green t-semi pos-absolute pos-t-medium pos-r-medium">+12.5%</span>
+				<span class="t-green fw-semi pos-absolute pos-t-small pos-r-small">+12.5%</span>
 				<div class="mn-b-medium radius-small w-max bg-main"><IconGroups class="i-medium mn-small"/></div>
 				<p class="h3 mn-b-thin">{{ stats.organizations || 0 }}</p>
 				<p>My Groups</p>
 			</Block>
 
 			<Block class="pos-relative">
-				<span class="t-green t-semi pos-absolute pos-t-medium pos-r-medium">+14.8%</span>
+				<span class="t-green fw-semi pos-absolute pos-t-small pos-r-small">+14.8%</span>
 				<div class="mn-b-medium radius-small w-max bg-main"><IconOrders class="i-medium mn-small"/></div>
 				<p class="h3 mn-b-thin">{{ stats.orders || 0 }}</p>
 				<p>My Orders</p>
 			</Block>
 
 			<Block class="pos-relative">
-				<span class="t-green t-semi pos-absolute pos-t-medium pos-r-medium">+25.1%</span>
+				<span class="t-green fw-semi pos-absolute pos-t-small pos-r-small">+25.1%</span>
 				<div class="mn-b-medium radius-small w-max bg-main"><IconEvents class="i-medium mn-small"/></div>
 				<p class="h3 mn-b-thin">{{ stats.events || 0 }}</p>
 				<p>My Events</p>

package/src/modules/auth/views/components/sections/FeaturedUsers.vue

@@ -71,7 +71,7 @@
     <p class="w-m-33r mn-r-auto mn-l-auto t-center mn-b-small p-medium">
       Together, we're shaping the future of the globals music community.
     </p>
-    <router-link :to="{ name: 'Sign In' }" class="bg-black w-max mn-r-auto mn-l-auto t-medium t-white button">
+    <router-link :to="{ name: 'Sign In' }" class="bg-black w-max mn-r-auto mn-l-auto fw-medium t-white button">
       Join Now
     </router-link>
   </div>

package/src/modules/auth/views/components/sections/ProfileCompletion.vue

@@ -5,7 +5,7 @@
         {{text}}
       </h4>
 
-      <h4 class="mn-l-thin uppercase radius-big t-semi t-medium t-white bg-black w-max pd-thin">
+      <h4 class="mn-l-thin uppercase radius-big fw-semi fw-medium t-white bg-black w-max pd-thin">
         {{ percentage || completionPercentage }}%
       </h4>
 
@@ -15,7 +15,7 @@
           name: 'User Edit Profile',
           params: { _id: user }
         }"
-        class="mn-l-auto uppercase radius-big t-semi t-medium t-white bg-black w-max pd-thin"
+        class="mn-l-auto uppercase radius-big fw-semi fw-medium t-white bg-black w-max pd-thin"
       >
         {{text_cta}}
       </router-link>

package/src/modules/auth/views/components/sections/ProfileEditCredentials.vue

@@ -16,14 +16,14 @@
           <Button 
             v-if="!isVerificationSent"
             :submit="() => sendVerification('email', 'add')" 
-            class="mn-b-thin t-white bg-second  flex-1"
+            class="mn-b-thin t-white bg-second  flex-child-1"
           >
             Add Email
           </Button>
           <Button 
             v-if="!isVerificationSent"
             :submit="() => cancelAdding('email')" 
-            class="mn-b-thin bg-red t-white flex-1"
+            class="mn-b-thin bg-red t-white flex-child-1"
           >
             Cancel
           </Button>
@@ -58,14 +58,14 @@
           <Button 
             v-if="!isVerificationSent"
             :submit="() => sendVerification('phone', 'add')" 
-            class="mn-b-thin t-white bg-second flex-1"
+            class="mn-b-thin t-white bg-second flex-child-1"
           >
             Add Phone
           </Button>
           <Button 
             v-if="!isVerificationSent"
             :submit="() => cancelAdding('phone')" 
-            class="mn-b-thin  t-white bg-second t-white flex-1"
+            class="mn-b-thin  t-white bg-second t-white flex-child-1"
           >
             Cancel
           </Button>
@@ -160,19 +160,19 @@
       <div class="flex gap-2">
         <Button 
           :submit="verifyCode" 
-          class="mn-b-thin bg-main flex-1"
+          class="mn-b-thin bg-main flex-child-1"
         >
           Verify
         </Button>
         <Button 
           :submit="resendCode" 
-          class="mn-b-thin bg-light flex-1"
+          class="mn-b-thin bg-light flex-child-1"
         >
           Resend Code
         </Button>
         <Button 
           :submit="cancelEdit" 
-          class="mn-b-thin bg-red t-white flex-1"
+          class="mn-b-thin bg-red t-white flex-child-1"
         >
           Cancel
         </Button>

package/src/modules/auth/views/components/sections/SliderFeatures.vue

@@ -12,7 +12,7 @@ const features = computed(() => tm('auth.features'))
 
 <template>
   <Slider :showDots="true" :slideCount="features.length" class="auth_slider h-100">
-    <div class="grid o-hidden h-100 carousel__slide" style="  grid-template-rows: 1fr auto;" v-for="(feature, index) in features" :key="index">
+    <div class="d-grid o-hidden h-100 carousel__slide" style="  grid-template-rows: 1fr auto;" v-for="(feature, index) in features" :key="index">
       <div class="h-100 background-div" :style="`background-image: url(/features/${index}.png);`"></div>
       <div class="h-100 pd-big">
         <h5 class="t-center w-100 mn-b-regular">{{ feature.title }}</h5>

package/src/modules/backoffice/components/admin/Backcalls.vue

@@ -1,7 +1,7 @@
 <template>
    <!-- Toolbar -->
   <section class="br-bot-dark bg-white pd-big">
-    <header class="flex-nojustify flex-bottom flex-nowrap flex">
+    <header class="flex-justify-start flex-bottom flex-nowrap flex">
       <h1 class="mn-r-small">Запросы обратного звонка</h1>
     </header>
   </section>

package/src/modules/backoffice/components/admin/FastOrders.vue

@@ -1,7 +1,7 @@
 <template>
    <!-- Toolbar -->
   <section class="br-bot-dark bg-white pd-big">
-    <header class="flex-nojustify flex-bottom flex-nowrap flex">
+    <header class="flex-justify-start flex-bottom flex-nowrap flex">
       <h1 class="mn-r-small">Быстрые заказы</h1>
     </header>
   </section>

package/src/modules/backoffice/components/admin/ProductEdit.vue

@@ -13,12 +13,12 @@
 	<!-- ---------------------------------------------------------------- -->
 	<div v-if="route.params._id" class="flex-nowrap flex product-tab-header">
     <button @click="changeTab('info')" :class="{'product-tab-active':data.currentTab === 'info'}" 
-    class="br-right-dark product-tab section-panel section">
+    class="br-r-1px br-dark product-tab section-panel section">
       Информация о товаре
     </button>
 
     <button @click="changeTab('images')" :class="{'product-tab-active':data.currentTab === 'images'}" 
-    class="br-right-dark product-tab section-panel section">
+    class="br-r-1px br-dark product-tab section-panel section">
       Изображения
     </button>
     <button @click="changeTab('modifications')" :class="{'product-tab-active':data.currentTab === 'modifications'}" 

package/src/modules/backoffice/components/admin/UserEdit.vue

@@ -14,7 +14,7 @@
     <h5 class="w-100 mn-b-small">Данные для входа  <TestButton></TestButton>
 
     </h5>
-    <div class="cols-2 mn-b-medium ">
+    <div class="cols-2 mobile:cols-1 mn-b-medium ">
        <!-- <p class="w-100">Время создания: {{DateToFormattedString(order.createdAt)}}</p> -->
       <div class="col flex block">
         <p class="mn-b-small w-100">

package/src/modules/backoffice/components/admin/Users.vue

@@ -9,12 +9,12 @@
 
   <div class="flex-nowrap flex product-tab-header">
     <button @click="changeTab('all')" :class="{'product-tab-active':data.currentTab === 'all'}" 
-    class="br-right-dark product-tab section-panel section">
+    class="br-r-1px br-dark product-tab section-panel section">
       Все
     </button>
 
     <button @click="changeTab('user')" :class="{'product-tab-active':data.currentTab === 'user'}" 
-    class="br-right-dark product-tab section-panel section">
+    class="br-r-1px br-dark product-tab section-panel section">
       Клиенты
     </button>
 

package/src/modules/backoffice/components/pages/Dashboard.vue

@@ -3,28 +3,28 @@
 		<h2 class="mn-b-small">Overview</h2>
 		<div class="mn-b-medium cols-3 mobile:cols-1 gap-thin">
 			<Block class="pos-relative">
-				<span class="t-green t-semi pos-absolute pos-t-medium pos-r-medium">+12.5%</span>
+				<span class="t-green fw-semi pos-absolute pos-t-small pos-r-small">+12.5%</span>
 				<div class="mn-b-medium radius-small w-max bg-main"><IconProfile class="i-medium mn-small"/></div>
 				<p class="h3 mn-b-thin">2,453</p>
 				<p>Active Members</p>
 			</Block>
 
 			<Block class="pos-relative">
-				<span class="t-green t-semi pos-absolute pos-t-medium pos-r-medium">+14.8%</span>
+				<span class="t-green fw-semi pos-absolute pos-t-small pos-r-small">+14.8%</span>
 				<div class="mn-b-medium radius-small w-max bg-main"><IconOrders class="i-medium mn-small"/></div>
 				<p class="h3 mn-b-thin">432</p>
 				<p>New Orders</p>
 			</Block>
 
 			<Block class="pos-relative">
-				<span class="t-green t-semi pos-absolute pos-t-medium pos-r-medium">+25.1%</span>
+				<span class="t-green fw-semi pos-absolute pos-t-small pos-r-small">+25.1%</span>
 				<div class="mn-b-medium radius-small w-max bg-main"><IconProfile class="i-medium mn-small"/></div>
 				<p class="h3 mn-b-thin">$23,232</p>
 				<p>Monthly Revenue</p>
 			</Block>
 		</div>
 
-		<div class="cols-2 gap-thin">
+		<div class="cols-2 mobile:cols-1 gap-thin">
 			<Block 
 				title="Recent Orders"
 				class="pos-relative"

package/src/modules/backoffice/components/partials/Sidebar.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="pos-relative o-y-scroll o-x-hidden h-100">
-    <div class="br-b  h3 h-4r pd-semi br-solid br-black-transp-10">Backoffice</div>
+    <div class="br-b-1px  h3 h-4r pd-semi br-black-transp-10">Backoffice</div>
     <div class="pd-semi">
-      <span class="pd-thin uppercase t-medium t-transp">Menu</span>
+      <span class="pd-thin uppercase fw-medium t-transp">Menu</span>
       <div
         v-for="item in menuItems"
         :key="item.name"
@@ -15,10 +15,10 @@
           :icon="true" 
           :fill="'rgba(var(--black),0.25)'"
         /> 
-        <span class="t-medium">{{ item.title }}</span>
+        <span class="fw-medium">{{ item.title }}</span>
       </div>
       
-      <span class="pd-thin d-block mn-t-medium uppercase t-medium t-transp">General</span>
+      <span class="pd-thin d-block mn-t-medium uppercase fw-medium t-transp">General</span>
       <div
         v-for="item in generalItems"
         :key="item.name"
@@ -31,7 +31,7 @@
           :icon="true" 
           :fill="'rgba(var(--black),0.25)'"
         /> 
-        <span class="t-medium">{{ item.title }}</span>
+        <span class="fw-medium">{{ item.title }}</span>
       </div>
     </div>
   </div>

package/src/modules/chats/components/blocks/ChatMessage.vue

@@ -6,7 +6,7 @@
   >
     <p class="flex-v-center gap-thin flex-nowrap flex w-100 p-small">
       <!-- <img loading="lazy" v-if="message.username === 'Weeder Support'" src="/logo/logo.png" class="i-medium"> -->
-      <strong class="mn-r-auto"><span class="t-semi">{{ message.username }}</span> <span class="t-transp">{{formatDate(message.createdAt)}}</span></strong>
+      <strong class="mn-r-auto"><span class="fw-semi">{{ message.username }}</span> <span class="t-transp">{{formatDate(message.createdAt)}}</span></strong>
       <IconCheckmark v-if="isMessageRead" class="i-small t-main" />
     </p>
     <p>{{ message.text }}</p>

package/src/modules/chats/components/sections/ChatWindow.vue

@@ -1,10 +1,10 @@
 <template>
   <div class="bg-white radius-semi bg-white o-hidden pos-relative">
     <div ref="allMessages" class="chat-messages o-scroll h-max-20r">
-      <div class="pos-relative h-min-20r flex-justify-end flex flex-column br-b br-solid br-black-transp-10">
+      <div class="pos-relative h-min-20r flex-justify-end flex flex-column br-b-1px br-black-transp-10">
         <transition name="scaleIn" mode="out-in">
           <div v-if="messages.length < 1" class="flex-center pd-small t-center w-100 h-100 flex-column flex pos-absolute">
-            <PlaceholderChat class="radius-100 mn-b-thin"/>
+            <PlaceholderChat class="radius-extra mn-b-thin"/>
             <h4 class='mn-b-thin'>Here you can view your chat history</h4>
             <p>Feel free to ask if you have any questions.</p>
           </div>

package/src/modules/community/components/blocks/Activity.vue

@@ -1,16 +1,16 @@
 <template>
-  <section class="w-100 cols-4 t-left flex-nowrap flex">
-    <div v-if="likes" class="w-100 br-2px br-solid br-white-transp-10 radius-small pd-small flex-v-center flex-nowrap flex">
+  <section class="w-100 cols-4 mobile:cols-2 t-left flex-nowrap flex">
+    <div v-if="likes" class="w-100 br-2px br-white-transp-10 radius-small pd-small flex-v-center flex-nowrap flex">
       <p class="h4 i-medium mn-r-small">👍</p>
-      <span class="t-semi uppercase">{{ likes }}<br>likes</span>
+      <span class="fw-semi uppercase">{{ likes }}<br>likes</span>
     </div>
-    <div v-if="comments" class="w-100 br-2px br-solid br-white-transp-10 radius-small pd-small flex-v-center flex-nowrap flex">
+    <div v-if="comments" class="w-100 br-2px br-white-transp-10 radius-small pd-small flex-v-center flex-nowrap flex">
       <p class="h4 i-medium mn-r-small">💬</p>
-      <span class="t-semi uppercase">{{ comments }}<br>comments</span>
+      <span class="fw-semi uppercase">{{ comments }}<br>comments</span>
     </div>
-    <div v-if="subscriptions" class="w-100 br-2px br-solid br-white-transp-10 radius-small pd-small flex-v-center flex-nowrap flex">
+    <div v-if="subscriptions" class="w-100 br-2px br-white-transp-10 radius-small pd-small flex-v-center flex-nowrap flex">
        <p class="h4 i-medium mn-r-small">👍</p>
-      <span class="t-semi uppercase">{{ subscriptions }}<br>subscriptions</span>
+      <span class="fw-semi uppercase">{{ subscriptions }}<br>subscriptions</span>
     </div>
   </section>
 </template>

package/src/modules/community/components/blocks/CardBlogpost.vue

@@ -35,7 +35,7 @@
 
 				<div 
 					v-if="blogpost.status === 'draft'" 
-					class="pd-micro t-white uppercase t-semi p-small flex-center flex pd-r-small pd-l-small mn-l-thin w-min bg-second radius-extra"
+					class="pd-micro t-white uppercase fw-semi p-small flex-center flex pd-r-small pd-l-small mn-l-thin w-min bg-second radius-extra"
 				>
 					{{blogpost.status}}
 				</div>

package/src/modules/community/components/blocks/FooterBlogpost.vue

@@ -1,11 +1,11 @@
 <template>
-  <footer class="t-semi br-top-dark flex-nowrap flex-nojustify flex">
+  <footer class="fw-semi br-top-dark flex-nowrap flex-justify-start flex">
     <router-link :to="`/community/posts/${blogpost.url}`" 
-    class="font-second cursor-pointer hover-bg-white pd-l-thin pd-r-thin radius-big">
+    class="font-second cursor-pointer hover:bg-white pd-l-thin pd-r-thin radius-big">
       👁️ {{blogpost.views}}
     </router-link>
     
-    <div class="hover-bg-white pd-l-thin pd-r-thin radius-big cursor-pointer">
+    <div class="hover:bg-white pd-l-thin pd-r-thin radius-big cursor-pointer">
       <div class="cursor-pointer" @click="addReaction('like')" v-if="!isReacted">
         👍 {{reactionsCount }}
       </div>
@@ -14,7 +14,7 @@
       </div>
     </div>
     <router-link :to="`/community/posts/${blogpost.url}#comments`" 
-    class="font-second cursor-pointer hover-bg-white pd-l-thin pd-r-thin radius-big">
+    class="font-second cursor-pointer hover:bg-white pd-l-thin pd-r-thin radius-big">
       💬 {{ blogpost.numberOfComments }}
     </router-link>
   </footer>

package/src/modules/community/components/layouts/Community.vue

@@ -12,7 +12,7 @@
 			        v-model:select="blog.state.filter.period" 
 			        placeholder="all time"
 			        class="
-			        	t-semi
+			        	fw-semi
 			        	pos-relative 
 			        	w-max
 			        	bg-main t-black
@@ -33,7 +33,7 @@
 						<li  	
 							:class="{'t-black bg-white': route.params.category === 'featured' }" 					
 							@click="() => { blog.state.sort.param = 'createdAt'; router.push({name: 'Blog', params: { category: 'featured' } })}" 
-							class="cursor-pointer flex-v-center flex t-medium  pd-thin radius-small"
+							class="cursor-pointer flex-v-center flex fw-medium  pd-thin radius-small"
 						>
 							<IconFeatured class="i-medium mn-r-thin t-transp"/>
 							Featured
@@ -41,7 +41,7 @@
 						<li  	
 							:class="{'t-black bg-white': route.params.category === 'popular' }"					 				
 							@click="() => { blog.state.sort.param = 'views'; router.push({name: 'Blog', params: { category: 'popular' } }) }" 
-							class="cursor-pointer t-medium flex-v-center flex  pd-thin radius-small"
+							class="cursor-pointer fw-medium flex-v-center flex  pd-thin radius-small"
 						>	
 							<IconPopular class="i-medium mn-r-thin t-transp"/>
 							Popular
@@ -49,7 +49,7 @@
 						<li  	
 							:class="{'t-black bg-white': route.params.category === 'new'}" 					
 							@click="() => { blog.state.sort.param = 'createdAt'; router.push({name: 'Blog', params: { category: 'new' } })}" 
-							class="cursor-pointer t-medium flex-v-center flex  pd-thin radius-small"
+							class="cursor-pointer fw-medium flex-v-center flex  pd-thin radius-small"
 						>
 							<IconRecent class="i-medium mn-r-thin t-transp"/>
 							Recent
@@ -58,7 +58,7 @@
 							v-if="auth.state.user._id"
 							:class="{'t-black bg-white': route.params.category === 'following'}" 		
 							@click="() => { blog.state.sort.param = 'createdAt'; router.push({name: 'Blog', params: { category: 'following' } })}" 
-							class="cursor-pointer t-medium flex-v-center flex pd-thin radius-small"
+							class="cursor-pointer fw-medium flex-v-center flex pd-thin radius-small"
 						>
 							<IconFollowing class="i-medium mn-r-thin t-transp"/>
 							Following
@@ -69,7 +69,7 @@
 							:to="{
 								name: 'Create BlogPost'
 							}" 
-							class="button t-medium bg-main w-max mn-l-auto"
+							class="button fw-medium bg-main w-max mn-l-auto"
 						>
 							Create Post
 						</router-link>
@@ -87,7 +87,7 @@
 			<div style="flex: 1 1 auto" class="desktop-only pos-sticky pos-b-thin scroll-hide  h-100  w-40 h-100 pos-relative ">
 				<div class="radius-medium bg-light mn-b-thin pd-small">
 					<div class="gap-thin flex-nowrap flex">
-						<p class="t-medium mn-b-small">Latest Comments</p>
+						<p class="fw-medium mn-b-small">Latest Comments</p>
 					</div>
 
 					<div class="flex flex-column gap-thin">
@@ -107,12 +107,12 @@
 
 	      <div class="radius-medium bg-light pd-small">
 					<div class="gap-thin flex-v-center flex-nowrap flex  mn-b-small">
-						<p class="text-box-trim-end t-medium">Popular Communities</p>
+						<p class="text-box-trim-end fw-medium">Popular Communities</p>
 						
 						<router-link
 							v-if="auth.state.user._id"
 							to="/organizations/create"
-							class="t-medium cursor-pointer hover-scale-1 radius-extra flex-center flex i-medium bg-main"
+							class="fw-medium cursor-pointer hover:scale-[1.05] radius-extra flex-center flex i-medium bg-main"
 						>
 							+
 						</router-link>
@@ -154,7 +154,7 @@
 				      	:showFeatured="false"
 				      	:showFollowers="false"
 								@updateMembership="handleMembershipUpdate"
-								class="pd-small w-100 pd-0 bg-white radius-regular o-hidden"
+								class="pd-small w-100 bg-white radius-regular o-hidden"
 					    />
 				    </Feed>
 					</transition>

package/src/modules/community/components/pages/CreateBlogPost.vue

@@ -109,7 +109,7 @@
       </section>
 
       <h5 v-if="selectedOrganization" class="mn-b-thin">Options:</h5>
-      <div v-if="selectedOrganization" class="mn-b-medium br-grey-transp-25 br-2px br-solid pd-small radius-big">
+      <div v-if="selectedOrganization" class="mn-b-medium br-grey-transp-25 br-2px pd-small radius-big">
         <Checkbox 
           :label="'Hide Author'"
           :radio="post.creator.hidden"

package/src/modules/community/components/pages/Posts.vue

@@ -10,7 +10,7 @@
         @click="$router.push({
           name: route.params?._id ? 'Organization_PostAdd' : 'CreateBlogPost'
         })" 
-        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>
@@ -48,7 +48,7 @@
             :key="item._id" 
             :blogpost="item" 
             :user="auth.state.user._id" 
-            class="h-max-40r bg-light radius-medium cursor-pointer hover-scale-1 transition-all"
+            class="h-max-40r bg-light radius-medium cursor-pointer hover:scale-[1.05] ease"
             @click="$router.push({ 
               name: route.params._id ? 'Organization_BlogPost' : 'BlogPost', 
               params: { 

package/src/modules/community/components/sections/Comment.vue

@@ -17,13 +17,13 @@
         <button 
           v-if="totalReplies > 0" 
           @click="toggleChildren"
-          class="t-second cursor-pointer t-medium font-second"
+          class="t-grey cursor-pointer fw-medium font-second"
         >
           {{ isExpanded ? 'Hide' : totalReplies + (totalReplies === 1 ? ' reply' : ' replies') }} 
         </button>
         <button 
           v-if="owner" 
-          class="font-second cursor-pointer t-transp t-medium" 
+          class="font-second cursor-pointer t-transp fw-medium" 
           @click="showReplyForm = true"
         > 
           Reply

package/src/modules/constructor/components/elements/Audio.vue

@@ -20,7 +20,7 @@
         :placeholder="'Upload video'" 
         class="
           w-100
-          br-solid
+         
           br-1px
           br-black-transp-10
           pd-medium

package/src/modules/constructor/components/elements/Caption.vue

@@ -7,7 +7,7 @@
     @focus="emit('focus', textarea)"
     ref="textarea" 
     tabindex="-1"
-    class="br-l br-solid br-main pd-l-small text-area mn-b-small">    
+    class="br-l-1px br-main pd-l-small text-area mn-b-small">    
   </textarea>
 </div>
 </template>

package/src/modules/constructor/components/elements/Embed.vue

@@ -18,7 +18,7 @@
         :placeholder="'Paste your embed code here'" 
         class="
           w-100
-          br-solid
+         
           br-1px
           br-black-transp-10
           pd-medium

package/src/modules/constructor/components/elements/Textarea.vue

@@ -9,7 +9,7 @@
       tabindex="0"
       class="editable-div mn-b-thin"
       :class="{
-        't-main t-semi': prop.type === 'Link',
+        't-main fw-semi': prop.type === 'Link',
         'h3': prop.type === 'H2'
       }"
     />

package/src/modules/constructor/components/elements/Video.vue

@@ -20,7 +20,7 @@
         :placeholder="'Enter embed code'" 
         class="
           w-100
-          br-solid
+         
           br-1px
           br-black-transp-10
           pd-medium