@ozdao/martyrs 0.2.582 → 0.2.584

package/src/modules/organizations/components/pages/OrganizationEdit.vue

@@ -1,17 +1,37 @@
 <template>
 <div class="for-transition pd-thin">
   
-  <h3 class="mn-b-small">Type of group</h3>
-  <p class="mn-b-thin">Public groups are open to everyone, whereas in exclusive groups only members can post. If you wish to make a group private, select 'hidden'.</p>
-  
-  <SelectMulti
-    v-model="organization.state.current.types"
-    :options="['public','exclusive','hidden']"
-    :multiple="false"
-    :taggable="false"
-    placeholder="Type to search or add type of organization"
-    class="mn-b-semi bg-light pd-medium radius-small" 
-  />
+  <h3 class="mn-b-small">Access & Privacy</h3>
+
+  <div class="d-grid cols-1 tablet:cols-3 gap-regular mn-b-semi">
+    <button
+      v-for="option in typeOptions"
+      :key="option.value"
+      @click="organization.state.current.types = [option.value]"
+      :class="[
+        'd-flex items-start gap-regular pd-regular radius-semi br-1px t-left transition-timing-2',
+        isTypeSelected(option.value)
+          ? 'br-main bg-main-transp-10'
+          : 'br-light dark:br-dark-thin hover:br-grey bg-white dark:bg-dark'
+      ]"
+    >
+      <div :class="[
+        'pd-thin radius-[50%]',
+        isTypeSelected(option.value)
+          ? 'bg-main t-white'
+          : 'bg-light dark:bg-dark-thin t-grey'
+      ]">
+        <component :is="option.icon" class="i-medium" />
+      </div>
+      <div>
+        <div class="fw-semi t-black dark:t-white d-flex items-center gap-thin">
+          {{ option.label }}
+          <span v-if="isTypeSelected(option.value)" class="w-[0.5rem] h-[0.5rem] radius-[50%] bg-main"></span>
+        </div>
+        <p class="p-small t-grey dark:t-grey-thin mn-t-micro">{{ option.desc }}</p>
+      </div>
+    </button>
+  </div>
 
 
   <h3 class="mn-b-small">Profile</h3>
@@ -115,6 +135,7 @@
 
   import { useRoute, useRouter } from 'vue-router';
 
+  import { IconGroups, IconLock, IconShow } from '@martyrs/src/modules/icons/icons.client.js'
   import Breadcrumbs from '@martyrs/src/components/Breadcrumbs/Breadcrumbs.vue'
   import BlockTags    from '@martyrs/src/components/FieldTags/BlockTags.vue'
   import Tab from '@martyrs/src/components/Tab/Tab.vue';
@@ -134,6 +155,16 @@
 
   organization.actions.reset();
 
+  const typeOptions = [
+    { value: 'public', label: 'Public', icon: IconGroups, desc: 'Visible to everyone. Anyone can join.' },
+    { value: 'exclusive', label: 'Exclusive', icon: IconLock, desc: 'Visible, but membership requires approval.' },
+    { value: 'hidden', label: 'Hidden', icon: IconShow, desc: 'Invite only. Hidden from search.' }
+  ];
+
+  function isTypeSelected(type) {
+    return organization.state.current.types?.includes(type);
+  }
+
   onMounted(async()=>{
     if (route.params._id) {
       await organization.actions.read({ _id: route.params._id });

package/src/modules/pages/views/components/pages/PageEdit.vue

@@ -15,14 +15,14 @@
         v-if="route.params.url"
         :submit="() => onDelete()" 
         :callback="() => deletePageCallback()" 
-        class="t-nowrap bg-second w-max"
+        class="ws-nowrap bg-second w-max"
       >
         Delete
       </Button>
 
        <Button 
         :submit="() => onSubmit()" 
-        class="mn-l-auto t-nowrap t-white bg-black w-max"
+        class="mn-l-auto ws-nowrap t-white bg-black w-max"
       >
         Save
       </Button>

package/src/modules/pages/views/components/partials/SidebarPages.vue

@@ -25,7 +25,7 @@
       </div>
       <Button 
         :submit="() => onSubmit()" 
-        class="mn-l-auto t-nowrap t-white bg-black w-max"
+        class="mn-l-auto ws-nowrap t-white bg-black w-max"
       >
         Save
       </Button>

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

@@ -151,7 +151,7 @@
               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 ease"
+              class=" flex-child-default bg-light flex ws-nowrap pd-medium radius-medium cursor-pointer hover:bg-light ease"
             >
               {{ category.name }}
             </div>

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

@@ -81,7 +81,7 @@
             { value: 'discount', label: 'Discount (%)' },
             { value: 'special_price', label: 'Special Price' },
           ]"
-          class="pos-relative t-nowrap bg-white gap-small flex flex-column pd-thin radius-thin"
+          class="pos-relative ws-nowrap bg-white gap-small flex flex-column pd-thin radius-thin"
         />
       </Field>
 

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

@@ -61,7 +61,7 @@
       >
         <div v-if="isVariantAvailable" class="gap-micro flex flex-center flex-nowrap">
           <IconShopcartAdd class="i-medium"/>
-          <span class="t-nowrap">{{ t('addtoorder') }}</span>
+          <span class="ws-nowrap">{{ t('addtoorder') }}</span>
         </div>
         <template v-else>
           <span v-if="!selectedVariant && productVariants.length > 1">Select variant</span>

package/src/modules/spots/components/pages/Spots.vue

@@ -24,7 +24,7 @@
               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 ease"
+              class="flex-child-default bg-light flex ws-nowrap pd-medium radius-medium cursor-pointer hover:bg-light ease"
             >
               {{ category.name }}
             </div>

package/src/modules/wallet/views/components/blocks/CryptoDeposit.vue

@@ -10,7 +10,7 @@
     <Select 
       :options="depositOptions"
       v-model:select="state.chosenNetwork"
-      class="bg-light t-nowrap pd-r-thin pd-l-thin pd-t-nano pd-b-nano radius-thin"
+      class="bg-light ws-nowrap pd-r-thin pd-l-thin pd-t-nano pd-b-nano radius-thin"
     />
   </Field>
 

package/src/modules/wallet/views/components/pages/Wallet.vue

@@ -16,7 +16,7 @@
           <h2>{{state.tokenBalance}} {{ t('wallet.token') }}</h2>
         </div>
 
-        <button @click="openGetMorePopup" class="t-nowrap w-max bg-main fw-medium button">Get More</button>
+        <button @click="openGetMorePopup" class="ws-nowrap w-max bg-main fw-medium button">Get More</button>
 
 
         <Button