changes of boursemes

src/views/base/rules/index.vue

@@ -16,33 +16,30 @@
             <img :src="logoFull" class="mb-20 h-15vh mt-5" />
           </div>-->
           <div class="overflow-y-auto h-60vh pb-20 border-primary">
-            <div
-              class="mt-5 text-5 border-solid border-2 border-primary text-primary rounded-[12px] p-4"
-            >
+            <div class="rules-panel mt-5 border-solid border-2 border-primary text-primary rounded-[12px] p-4">
               <div class="font-bold text-sm text-primary">
                 {{ rulesTitle }}
               </div>
               <div class="w-full h-1px my-3 bg-secondary"></div>
               <div
-                v-for="(rule, index) in rulesItems"
-                :key="`rule-${index}`"
-                class="mt-5 text-xs leading-5"
+                v-for="(block, blockIndex) in rulesBlocks"
+                :key="`block-${blockIndex}`"
+                class="rules-block"
               >
-                {{ rule }}
-              </div>
-              <template v-if="supplementaryRulesTitle">
-                <div class="w-full h-1px my-3 bg-secondary"></div>
-                <div class="font-bold text-sm text-primary">
-                  {{ supplementaryRulesTitle }}
-                </div>
                 <div
-                  v-for="(rule, index) in supplementaryRulesItems"
-                  :key="`supplementary-${index}`"
-                  class="mt-5 text-xs leading-5"
+                  v-if="block.title"
+                  class="font-bold text-sm text-primary mt-4 mb-2"
+                >
+                  {{ block.title }}
+                </div>
+                <p
+                  v-for="(rule, index) in block.items"
+                  :key="`rule-${blockIndex}-${index}`"
+                  class="rules-paragraph"
                 >
                   {{ rule }}
-                </div>
-              </template>
+                </p>
+              </div>
             </div>
 
           </div>
@@ -89,12 +86,10 @@ import BaseDatePicker from '@/components/BasicPacks/BaseDatePicker'
 import {useConfigStore} from "../../../store/configStore";
 import {getReferralShareText, getReferralShareTitle, isBoursecuProject} from "@/utils/config";
 import {
-  getRulesItems,
+  getRulesBlocks,
   getRulesTitle,
-  getSupplementaryRulesItems,
-  getSupplementaryRulesTitle,
 } from './rulesContent'
-const config=useConfigStore()
+const config = useConfigStore()
 const userFormState = ref<User>({
   fname: '',
   lname: '',
@@ -107,12 +102,10 @@ const userFormState = ref<User>({
 })
 const formRef = ref<FormInstance>()
 const userStore = useUserStore()
-const nameProject= useConfigStore().config.name_fa
+const nameProject = computed(() => config.config?.name_fa || config.config?.name || 'بورس مس')
 const isBoursecu = computed(() => isBoursecuProject())
-const rulesTitle = computed(() => getRulesTitle(nameProject, isBoursecu.value))
-const rulesItems = computed(() => getRulesItems(nameProject, isBoursecu.value))
-const supplementaryRulesTitle = computed(() => getSupplementaryRulesTitle(isBoursecu.value))
-const supplementaryRulesItems = computed(() => getSupplementaryRulesItems(nameProject, isBoursecu.value))
+const rulesTitle = computed(() => getRulesTitle(nameProject.value, isBoursecu.value))
+const rulesBlocks = computed(() => getRulesBlocks(nameProject.value, isBoursecu.value))
 // const editPassVisible = ref<boolean>(false)
 const editPassVisible = ref<boolean>(false)
 
@@ -131,11 +124,11 @@ function copyCode() {
 function shareCode() {
   const val = getReferralShareText({
     userName: userStore.userInfo?.name,
-    projectName: nameProject,
+    projectName: nameProject.value,
     referralId: userStore.userInfo?.referral_id,
   })
   navigator.share({
-    title: getReferralShareTitle(nameProject),
+    title: getReferralShareTitle(nameProject.value),
     text: val
   })
 }
@@ -176,16 +169,25 @@ function ok() {
 </script>
 
 <style scoped>
-/*.fade-enter-active,
-.fade-leave-active {
-  transition: opacity 0.2s ease;
+.rules-panel {
+  font-size: 0.875rem;
+  line-height: 1.75rem;
 }
 
-.fade-enter-from,
-.fade-leave-to {
-  opacity: 0;
-}*/
-/*.trans{
-  transition:  height 1s;
-}*/
+.rules-block + .rules-block {
+  margin-top: 0.5rem;
+}
+
+.rules-paragraph {
+  margin: 0 0 1rem;
+  text-align: justify;
+  line-height: 1.9;
+  word-break: normal;
+  overflow-wrap: break-word;
+  white-space: normal;
+}
+
+.rules-paragraph:last-child {
+  margin-bottom: 0;
+}
 </style>