@ozdao/martyrs 0.2.547 → 0.2.548

package/src/modules/chats/routes/chats.routes.js

@@ -3,10 +3,11 @@ import controllerFactory from '../controllers/chats.controller.js';
 export default (function (app, db, wss) {
   const controller = controllerFactory(db);
   const { verifySignUp, verifyUser } = middlewareFactory(db);
-  
-  
+
+
   // WebSocket-обработчик для модуля "chat"
-  wss.registerModule('chat', async (ws, msg) => {
+  if (wss) {
+    wss.registerModule('chat', async (ws, msg) => {
     console.log('[CHAT WebSocket] Received message type:', msg.type, 'from ws.id:', ws.id);
     
     if (msg.type === 'joinChat') {
@@ -83,7 +84,8 @@ export default (function (app, db, wss) {
         }
       );
     }
-  });
+    });
+  }
   // REST API: получить историю сообщений
   app.get('/messages/:chatId', async (req, res) => {
     const { chatId } = req.params;

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

@@ -44,7 +44,7 @@
 			
 			<p 
 				v-if="firstText && firstText.content && type !== 'blogpostPage' && !hideDescription" 
-				class='mn-b-medium t-transp p-semi'
+				class='mn-b-medium t-transp p-medium'
 			>
 				{{firstText.content.slice(0,120)}}...
 			</p>

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

@@ -22,14 +22,14 @@
 			         	t-center
 			         	flex-column 
 			         	flex 
-			         	gap-medium 
+			         	gap-regular 
 			        "
 			      />
 		    	</h2>
 				</header>
 
 				<div  v-if="!route.params.url && route.name !=='Create BlogPost'"  class="w-100 pos-relative">
-					<ul class="align-self-start pos-sticky pos-t-0 w-100 bg-light radius-medium mobile:radius-zero mn-b-thin pd-medium p-medium gap-thin flex-row flex-nowrap flex z-index-2 o-scroll t-nowrap scroll-hide">
+					<ul class="align-self-start pos-sticky pos-t-0 w-100 bg-light radius-medium mobile:radius-zero mn-b-thin pd-medium p-regular gap-thin flex-row flex-nowrap flex z-index-2 o-scroll t-nowrap scroll-hide">
 						<li  	
 							:class="{'t-black bg-white': route.params.category === 'featured' }" 					
 							@click="() => { blog.state.sort.param = 'createdAt'; router.push({name: 'Blog', params: { category: 'featured' } })}" 

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

@@ -11,7 +11,7 @@
         :date="comment.createdAt"
       />
       <div class="pd-t-zero">
-        <p class="p-medium">{{ comment.content }}</p>
+        <p class="p-regular">{{ comment.content }}</p>
       </div>
       <div class="mn-t-thin flex-v-center flex-nowrap flex gap-small">
         <button 

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

@@ -9,7 +9,7 @@
           <textarea 
             v-model="commentContent" 
             placeholder="Enter your comment" 
-            class="p-semi w-100"
+            class="p-medium w-100"
             style="resize: none;"
           ></textarea>
           <button type="submit" class="mn-l-auto bg-main pd-r-regular pd-l-regular pd-thin button">

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

@@ -33,7 +33,7 @@
         </template>
         <template v-else>
           <h4 class="h4">{{ modelValue.title }}</h4>
-          <p class="p-medium">{{ modelValue.subtitle }}</p>
+          <p class="p-regular">{{ modelValue.subtitle }}</p>
         </template>
       </div>
     </div>

package/src/modules/constructor/components/sections/Constructor.vue

@@ -37,12 +37,12 @@
         <transition name="fade">
           <div 
             v-if="showControls === index" 
-            class="pos-absolute z-index-4 i-semi" 
+            class="pos-absolute z-index-4 i-medium" 
             style="right: calc(100% + 0.5rem); top: calc(50% - 1.125rem);"
           >
             <button 
               @click="showMenu = !showMenu" 
-              class="mn-b-small cursor-pointer w-100 i-semi bg-white radius-thin"
+              class="mn-b-small cursor-pointer w-100 i-medium bg-white radius-thin"
             >
               {{ block.content ? '⋯' : '+' }}
             </button>

package/src/modules/constructor/components/sections/Viewer.vue

@@ -47,7 +47,7 @@ function getBlockProps(block, index) {
     if (!prevTextarea) {
       return { innerHTML: block.content, class: props.notitle ? "h3" : "h2" };
     }
-    return { innerHTML: block.content, class: "p-semi" };
+    return { innerHTML: block.content, class: "p-medium" };
   } else if (block.type === 'H2') {
     return { innerHTML: block.content, class: props.notitle ? "h3" : "h2" };
   } else if (block.type === 'Caption') {

package/src/modules/events/components/blocks/CardEvent.vue

@@ -65,7 +65,7 @@
 						url: event.url
 					}
 				})" 
-				class="z-index-2 pos-absolute pos-t-regular pos-r-regular i-regular t-transp"
+				class="z-index-2 pos-absolute pos-t-regular pos-r-regular i-medium t-transp"
 			/>
 
     	<div
@@ -116,9 +116,9 @@
        	<span
        		v-if="event.date?.start"
           :key="index"
-          class="d-inline-flex p-semi t-medium mn-nano pd-thin radius-small bg-white"
+          class="d-inline-flex p-medium t-medium mn-nano pd-thin radius-small bg-white"
           :class="{
-		    		'p-medium': type === 'short'
+		    		'p-regular': type === 'short'
 	    		}"
         >
           {{ formattedDate }}
@@ -134,7 +134,7 @@
         	v-if="type !== 'short'"
           v-for="(chip, index) in event.tags"
           :key="index"
-          class="d-inline-flex mn-nano pd-thin radius-small p-semi t-medium bg-main"
+          class="d-inline-flex mn-nano pd-thin radius-small p-medium t-medium bg-main"
         >
           {{ chip }}
         </span>

package/src/modules/events/components/pages/Event.vue

@@ -28,7 +28,7 @@
             {{event?.name}}
           </h1>
 
-          <div class="flex flex-wrap gap-micro t-medium p-semi mn-b-semi justify-start align-center">
+          <div class="flex flex-wrap gap-micro t-medium p-medium mn-b-semi justify-start align-center">
             <span v-if="event.date?.start" class="mn-r-nano d-inline-block w-max pd-b-micro pd-t-micro pd-r-thin pd-l-thin radius-small t-medium bg-white">
               <IconDate :fill="'rgb(var(--black))'" class="w-1r h-auto"/>
               {{formatDate(event.date.start)}}
@@ -44,7 +44,7 @@
             </span>
           </div>
 
-          <p class="z-index-1  p-semi mn-b-semi">
+          <p class="z-index-1  p-medium mn-b-semi">
             {{event?.description}}
           </p>
 
@@ -70,7 +70,7 @@
               />
             </div>
             <div v-if="event?.ticketsTypes?.length > 0" v-for="ticketType in event.ticketsTypes" class="pd-medium w-100 radius-medium bg-white mn-b-small">
-              <div class="flex-nowrap mn-b-small p-semi flex">
+              <div class="flex-nowrap mn-b-small p-medium flex">
                   <span class="mn-r-auto">{{ticketType.name}}</span>
                   <span class="t-medium">{{ticketType.price}} {{returnCurrency()}}</span>
               </div>

package/src/modules/events/components/pages/Events.vue

@@ -1,6 +1,6 @@
 <template>
   <section class="bg-white"> 
-    <div class="gap-medium pos-t-0 pos-sticky z-index-3 radius-medium ">
+    <div class="gap-regular pos-t-0 pos-sticky z-index-3 radius-medium ">
       <DatePicker
         @update:date="handleDatePickerChange"
         :locale="$i18n.locale"
@@ -14,7 +14,7 @@
 
    <section class="pd-medium mobile:pd-thin radius-tr-medium radius-tl-medium bg-white"> 
 
-    <div class="gap-medium radius-medium mn-b-semi">
+    <div class="gap-regular radius-medium mn-b-semi">
       <h2
         class="mn-b-small"
       >
@@ -43,7 +43,7 @@
       @date-selected="handleDateSelection" 
     />
 
-    <div class="gap-medium radius-medium mn-b-semi">
+    <div class="gap-regular radius-medium mn-b-semi">
 
       <h3
         class="mn-b-small"
@@ -91,7 +91,7 @@
 
     </div>
     
-    <div class="gap-medium radius-medium">
+    <div class="gap-regular radius-medium">
 
       <h3
         class="mn-b-small"

package/src/modules/events/components/sections/SelectDate.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="gap-medium radius-medium mn-b-semi">
+  <div class="gap-regular radius-medium mn-b-semi">
     <h3 class="mn-b-small">
       {{ title }}
     </h3>
@@ -11,7 +11,7 @@
         class="bg-light radius-medium pd-medium cursor-pointer"
         @click="handleDateSelect(date)"
       >
-        <p class="mn-b-small p-semi t-medium">{{ date.label }}</p>
+        <p class="mn-b-small p-medium t-medium">{{ date.label }}</p>
         <div class="p-regular t-transp">{{ date.range }}</div>
       </div>
     </div>

package/src/modules/globals/globals.server.js

@@ -1,10 +1,23 @@
 import globalsabac from '@martyrs/src/modules/globals/controllers/classes/abac/abac.js';
-import WebSocketManager from '@martyrs/src/modules/globals/controllers/classes/globals.websocket.js';
 
 import initGlobalsPolicies from './controllers/policies/globals.policies.js';
 
 const { getInstance } = globalsabac;
 
+// Ленивая загрузка WebSocketManager через асинхронную фабрику
+let _WebSocketManagerClass = null;
+
+async function createWebSocketManager(...args) {
+  if (!_WebSocketManagerClass) {
+    const module = await import('@martyrs/src/modules/globals/controllers/classes/globals.websocket.js');
+    _WebSocketManagerClass = module.default;
+  }
+  return new _WebSocketManagerClass(...args);
+}
+
+// Для обратной совместимости экспортируем как WebSocketManager
+const WebSocketManager = createWebSocketManager;
+
 function initializeGlobals(app, db, origins, publicPath) {
   // Определяем модель Log только здесь
   db.log =

package/src/modules/globals/views/classes/globals.app.js

@@ -195,8 +195,10 @@ export function createUniversalApp({
         // 1. Критические модули
         await initCriticalModules();
         
-        // 2. WebSocket (отложим после гидратации)
-        if (typeof window !== 'undefined') {
+        // 2. WebSocket (отложим после гидратации, только если включен)
+        const useWebsocket = config.globals?.websocket !== false; // по умолчанию false
+
+        if (useWebsocket && typeof window !== 'undefined') {
           // Откладываем инициализацию WebSocket после гидратации
           requestIdleCallback(() => {
             globalWebSocket.initialize({
@@ -206,8 +208,10 @@ export function createUniversalApp({
               pingInterval: 30000,
             });
           });
-          
-          // 3. Предзагрузка важных модулей в фоне
+        }
+
+        // 3. Предзагрузка важных модулей в фоне
+        if (typeof window !== 'undefined') {
           requestIdleCallback(() => {
             moduleRegistry.preloadModules(context);
           });

package/src/modules/globals/views/components/blocks/CardHeader.vue

@@ -8,12 +8,12 @@
 		>
 
 			<div
-				class="w-100 gap-thin p-medium t-nowrap flex-nowrap flex-v-center flex"
+				class="w-100 gap-thin p-regular t-nowrap flex-nowrap flex-v-center flex"
 			>
 				<img loading="lazy" 
 					v-if="owner.target?.profile?.photo?.length > 0 && type !== 'short'" 
 					:src="(FILE_SERVER_URL || '') + owner.target.profile.photo" 
-					class="radius-medium bg-white flex-child-default object-fit-cover i-semi" 
+					class="radius-medium bg-white flex-child-default object-fit-cover i-medium" 
 
 					@click.stop="$router.push({
 						name: owner.type === 'user' ? 'User Profile' : 'Organization', 
@@ -25,7 +25,7 @@
 				<component
 					v-if="!owner.target?.profile?.photo && type !== 'short'"
 					:is="owner.type === 'user' ? PlaceholderUserpic : PlaceholderOrganizationPic"
-					class="radius-medium flex-child-default cursor-pointer i-semi"
+					class="radius-medium flex-child-default cursor-pointer i-medium"
 
 					@click.stop="$router.push({
 						name: owner.type === 'user' ? 'User Profile' : 'Organization', 
@@ -92,7 +92,7 @@
 				<!-- Report -->
 				<Dropdown 
 					v-if="type !== 'short' && user && (user !== creator.target?._id || (actions && actions.length > 0))"
-					:label="{ component: IconEllipsis, class: 't-transp i-regular' }"
+					:label="{ component: IconEllipsis, class: 't-transp i-medium' }"
 					:align="'right'"
 					class="cursor-pointer z-index-2"
 				>

package/src/modules/globals/views/components/blocks/PopupDateSelector.vue

@@ -35,7 +35,7 @@
       class="h-3r w-100 bg-main button"
     >
       <div class="gap-thin flex flex-center flex-nowrap">
-        <IconShopcartAdd class="i-semi icon-button-main" />
+        <IconShopcartAdd class="i-medium icon-button-main" />
         <span>{{t('addtoorder')}}</span>
       </div>
     </Button>

package/src/modules/globals/views/components/elements/PhotoStack.vue

@@ -14,14 +14,14 @@ defineProps({
 </script>
 
 <template>
-  <div v-if="number" class="w-4r pos-relative i-semi">
+  <div v-if="number" class="w-4r pos-relative i-medium">
     <span 
       :style="{ 
         position: 'absolute', 
         top: '0px', 
         right: '0px' 
       }"
-      class="br-solid br-2px br-white z-index-1 radius-big i-semi bg-second flex flex-center t-white p-small t-semi"
+      class="br-solid br-2px br-white z-index-1 radius-big i-medium bg-second flex flex-center t-white p-small t-semi"
     >
       {{number}}
     </span>
@@ -38,7 +38,7 @@ defineProps({
           right: (index * 20 + 20) + '%', 
           zIndex: 1 - index 
         }"
-        class="br-solid br-2px br-white i-semi bg-light radius-big"
+        class="br-solid br-2px br-white i-medium bg-light radius-big"
       />
 
       <PlaceholderUserpic
@@ -49,7 +49,7 @@ defineProps({
           right: (index * 20 + 20) + '%', 
           zIndex: 1 - index 
         }"
-        class="br-solid br-2px br-white i-semi bg-light radius-big"
+        class="br-solid br-2px br-white i-medium bg-light radius-big"
       />
     </template>
   </div>

package/src/modules/globals/views/components/partials/CitySelection.vue

@@ -6,7 +6,7 @@
     <!-- Select city -->
     <div class="mn-b-semi">
       <!-- Description -->
-      <p class="mn-b-small t-transp p-medium">{{t('description')}}</p> 
+      <p class="mn-b-small t-transp p-regular">{{t('description')}}</p> 
       <!-- Input -->
       <div class="flex-nowrap flex mn-b-small pd-small radius-small bg-light">
         <span class="d-block mn-r-auto">{{t('cities[0]')}}</span>
@@ -33,7 +33,7 @@
     </div>
     <!-- Description -->
     <p class="mn-b-small t-transp">{{t('helpus')}}</p> 
-    <div class="pd-small p-semi radius-small bg-light">
+    <div class="pd-small p-medium radius-small bg-light">
       <a class="">hello@nms.network</a>
     </div>
   </div>

package/src/modules/globals/views/components/partials/Footer.centered.vue

@@ -179,7 +179,7 @@ const iconComponents = {
         
         <!-- Contact Block -->
         <div class="flex flex-column mobile:flex-h-center w-max-15r mobile:mn-auto">
-          <p class="p-semi t-medium mn-b-semi">{{ t('description') }}</p>
+          <p class="p-medium t-medium mn-b-semi">{{ t('description') }}</p>
           
           <div class="mn-b-semi mobile:flex-v-center flex flex-column gap-small">
             <a 
@@ -187,7 +187,7 @@ const iconComponents = {
               class="flex mn-b-micro gap-micro flex-v-center transition-opacity hover-opacity-70"
               :class="theme === 'light' ? 't-black' : 't-white'"
             >
-              <IconPhone class="i-regular" :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" />
+              <IconPhone class="i-medium" :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" />
               <span class="t-small">{{ t('phoneNumber') }}</span>
             </a>
             
@@ -196,12 +196,12 @@ const iconComponents = {
               class="flex mn-b-micro gap-micro flex-v-center transition-opacity hover-opacity-70"
               :class="theme === 'light' ? 't-black' : 't-white'"
             >
-              <IconEmail class="i-regular" :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" />
+              <IconEmail class="i-medium" :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" />
               <span class="t-small">{{ t('emailAddress') }}</span>
             </a>
             
             <div class="flex mn-b-micro gap-micro flex-v-center">
-              <IconTime class="i-regular" :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" />
+              <IconTime class="i-medium" :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" />
               <span class="t-small">{{ t('hours_text') }}</span>
             </div>
           </div>
@@ -242,7 +242,7 @@ const iconComponents = {
 
         <!-- Navigation Columns -->
         <div class="cols-2 gap-big">
-          <div v-for="(column, colIndex) in tm('navigationColumns')" :key="colIndex" class="flex flex-column gap-medium">
+          <div v-for="(column, colIndex) in tm('navigationColumns')" :key="colIndex" class="flex flex-column gap-regular">
             <div v-for="(section, sectionIndex) in column.sections" :key="sectionIndex" class="">
               <h4 class="h5 t-medium mn-b-regular">{{ section.title }}</h4>
               <nav>
@@ -293,7 +293,7 @@ const iconComponents = {
             >
               <component
                 :is="iconComponents[social.name]"
-                class="i-semi"
+                class="i-medium"
                 :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'"
               />
             </a>

package/src/modules/globals/views/components/partials/Footer.vue

@@ -78,7 +78,7 @@ const iconComponents = {
         
         <!-- Contact Block -->
         <div class="col w-max-15r">
-          <p class="p-semi t-medium mn-b-semi">{{ t('footer.description') }}</p>
+          <p class="p-medium t-medium mn-b-semi">{{ t('footer.description') }}</p>
           
           <div class="mn-b-semi flex flex-column gap-small">
             <a 
@@ -86,7 +86,7 @@ const iconComponents = {
               class="flex mn-b-micro gap-micro flex-v-center transition-opacity hover-opacity-70"
               :class="theme === 'light' ? 't-black' : 't-white'"
             >
-              <IconPhone class="i-regular" :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" />
+              <IconPhone class="i-medium" :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" />
               <span class="t-small">{{ t('footer.phoneNumber') }}</span>
             </a>
             
@@ -95,12 +95,12 @@ const iconComponents = {
               class="flex mn-b-micro gap-micro flex-v-center transition-opacity hover-opacity-70"
               :class="theme === 'light' ? 't-black' : 't-white'"
             >
-              <IconEmail class="i-regular" :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" />
+              <IconEmail class="i-medium" :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" />
               <span class="t-small">{{ t('footer.emailAddress') }}</span>
             </a>
             
             <div class="flex mn-b-micro gap-micro flex-v-center">
-              <IconTime class="i-regular" :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" />
+              <IconTime class="i-medium" :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" />
               <span class="t-small">{{ t('footer.hours_text') }}</span>
             </div>
           </div>
@@ -141,7 +141,7 @@ const iconComponents = {
 
         <!-- Navigation Columns -->
         <div class="cols-2 gap-big">
-          <div v-for="(column, colIndex) in tm('footer.navigationColumns')" :key="colIndex" class="flex flex-column gap-medium">
+          <div v-for="(column, colIndex) in tm('footer.navigationColumns')" :key="colIndex" class="flex flex-column gap-regular">
             <div v-for="(section, sectionIndex) in column.sections" :key="sectionIndex" class="">
               <h4 class="h5 t-medium mn-b-regular">{{ section.title }}</h4>
               <nav>
@@ -192,7 +192,7 @@ const iconComponents = {
             >
               <component
                 :is="iconComponents[social.name]"
-                class="i-semi"
+                class="i-medium"
                 :fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'"
               />
             </a>

package/src/modules/globals/views/components/partials/Header.vue

@@ -150,7 +150,7 @@
 			:showLoader="false"
 		>
 			<IconSearch 
-				class="i-semi"
+				class="i-medium"
 				:fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" 
 			/>
 		</Button>
@@ -164,7 +164,7 @@
 			class="pd-zero mn-r-micro"
 			> 
 			<IconShopcart 
-				class="i-semi"
+				class="i-medium"
 				:fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" 
 			/>
 			<!-- <div class="w-max p-small pos-absolute pos-t-100 pos-r-0">Product Added to Shopcart</div> -->
@@ -190,7 +190,7 @@
 			:showLoader="false"
 		>
 			<IconProfile 
-				class="i-semi"
+				class="i-medium"
 				:fill="theme === 'light' ? 'rgb(var(--black))' : 'rgb(var(--white))'" 
 			/>
 		</Button>

package/src/modules/globals/views/components/partials/LocationSelection.vue

@@ -3,7 +3,7 @@
 		<p class="h1 mn-b-medium">🌍</p>
 		
 		<h3 class="mn-b-semi">{{t('title')}}</h3>
-		<p class="mn-b-small t-transp p-medium">{{t('description')}}</p> 
+		<p class="mn-b-small t-transp p-regular">{{t('description')}}</p> 
 		
 		<Address
 			:key="$i18n.locale"

package/src/modules/globals/views/components/partials/Navigation.vue

@@ -128,7 +128,7 @@ const processRoute = (routeFn) => {
             />
             <span 
               v-if="!item.iconComponent " 
-              class="p-medium"
+              class="p-regular"
             >
               {{ item.icon }}
             </span>

package/src/modules/globals/views/components/sections/SectionPageTitle.vue

@@ -11,7 +11,7 @@
           v-if="action.to"
           :key="action.to"
           :to="action.to"
-          :class="action.class || 'radius-extra pd-small pd-r-medium pd-l-medium p-medium uppercase t-medium hover-scale-1 transition-ease cursor-pointer t-white bg-second flex-center flex'"
+          :class="action.class || 'radius-extra pd-small pd-r-medium pd-l-medium p-regular uppercase t-medium hover-scale-1 transition-ease cursor-pointer t-white bg-second flex-center flex'"
         >
           {{ action.label }}
         </router-link>
@@ -31,7 +31,7 @@
       :selected="tabs_current"
       @update:selected="updateTabsCurrent"
       :tabs="tabs"
-      class="mn-t-small pd-thin bg-light radius-small w-max t-nowrap o-scroll p-medium"
+      class="mn-t-small pd-thin bg-light radius-small w-max t-nowrap o-scroll p-regular"
     />
   </div>
 </template>

package/src/modules/globals/views/components/sections/Walkthrough.vue

@@ -28,7 +28,7 @@
 	        </p>
 
 
-	        <button @click="nextSlide" class="bg-main p-big w-max button">
+	        <button @click="nextSlide" class="bg-main p-semi w-max button">
 	          Get Started
 	        </button>
 	      </div>
@@ -49,10 +49,10 @@
 	        </p>
 
 	        <div class="flex flex-column flex-center gap-small">
-	          <button @click="requestNotificationPermission" class="bg-main p-big w-max button">
+	          <button @click="requestNotificationPermission" class="bg-main p-semi w-max button">
 						 	 Enable Notifications
 						 </button>
-	          <button @click="nextSlide" class="bg-light p-big w-max button">
+	          <button @click="nextSlide" class="bg-light p-semi w-max button">
 	            Maybe Later
 	          </button>
 	        </div>
@@ -74,10 +74,10 @@
           </p>
 
           <div class="flex flex-column flex-center gap-small">
-            <button @click="requestLocationPermission" class="bg-main p-big w-max button">
+            <button @click="requestLocationPermission" class="bg-main p-semi w-max button">
               Enable Location
             </button>
-            <button @click="nextSlide" class="bg-light p-big w-max button">
+            <button @click="nextSlide" class="bg-light p-semi w-max button">
               Skip for Now
             </button>
           </div>
@@ -98,10 +98,10 @@
           </p>
 
           <div class="flex flex-column flex-center gap-small">
-            <button @click="requestTrackingPermission" class="bg-main p-big w-max button">
+            <button @click="requestTrackingPermission" class="bg-main p-semi w-max button">
               Allow Tracking
             </button>
-            <button @click="nextSlide" class="bg-light p-big w-max button">
+            <button @click="nextSlide" class="bg-light p-semi w-max button">
               Ask App Not to Track
             </button>
           </div>
@@ -119,11 +119,11 @@
 	      	<h3 class="h3 mn-b-medium">Ready to Rent?</h3>
 	      	<p class="p-regular t-transp mn-b-big">Join thousands of creators who trust 3SR for their professional video equipment needs. Choose how you'd like to get started.</p>
 	    
-	      	<button @click="openFirstRoute('Sign Up')" class="bg-main p-big w-100 button mn-b-thin">Create Account</button> 
-	      	<button @click="openFirstRoute('Sign In')" class="bg-light t-black p-big w-100 button mn-b-semi">Sign In</button>
+	      	<button @click="openFirstRoute('Sign Up')" class="bg-main p-semi w-100 button mn-b-thin">Create Account</button> 
+	      	<button @click="openFirstRoute('Sign In')" class="bg-light t-black p-semi w-100 button mn-b-semi">Sign In</button>
 
 		      <p class="p-small mn-b-medium t-transp">Or explore as a guest:</p> 
-	      	<button @click="setFirstUseFalse()" class="bg-light p-big w-max button">Continue as Guest</button>
+	      	<button @click="setFirstUseFalse()" class="bg-light p-semi w-max button">Continue as Guest</button>
       	</div>
 	    </div>