change text of boursemes"

src/App.vue

@@ -123,7 +123,7 @@ import img_bottomGradiant from '@/views/login/assets/img/gr_bottom_white.svg'
 import {DotLottieVue} from '@lottiefiles/dotlottie-vue'
 import BasicButton from '@/components/BasicPacks/BasicButton.vue'
 import {useConfigStore} from "@/store/configStore";
-import {getProjectFontFamily, getProjectLoginLogo, getProjectSplashBackground, isBoursecuProject} from "@/utils/config";
+import {getProjectFontFamily, getProjectLoginLogo, getProjectSplashBackground, getProjectBrandRed, isBoursecuProject} from "@/utils/config";
 import {ConfigProvider as AConfigProvider} from 'ant-design-vue'
 import BasicIcon from "@/components/BasicPacks/BasicIcon.vue";
 
@@ -142,13 +142,22 @@ const popVisible = ref(false)
 const antTheme = computed(() => {
   if (!config.config?.color) return null
 
+  const brandRed = getProjectBrandRed()
+
   return {
     token: {
-      colorPrimary: "#ff0000",
+      colorPrimary: config.config.color,
       colorLink: config.config.color,
       colorLinkActive: config.config.color,
       colorLinkHover: config.config.color,
       fontFamily: getProjectFontFamily(),
+      ...(brandRed ? {
+        colorError: brandRed,
+        colorErrorHover: brandRed,
+        colorErrorActive: brandRed,
+        colorErrorBg: '#f8ecec',
+        colorErrorBorder: '#f0d8d8',
+      } : {}),
     },
   }
 })

src/assets/css/boursecu-theme.less

@@ -0,0 +1,54 @@
+html.project-boursecu {
+  .text-red,
+  .text-red-600,
+  .text-red-700,
+  [class*='text-red-'] {
+    color: var(--App-brand-red) !important;
+  }
+
+  .text-red-700 {
+    color: var(--App-brand-red-700) !important;
+  }
+
+  .bg-red,
+  .bg-red-50 {
+    background-color: var(--App-brand-red-50) !important;
+  }
+
+  .bg-red-100 {
+    background-color: var(--App-brand-red-100) !important;
+  }
+
+  .bg-red-600 {
+    background-color: var(--App-brand-red) !important;
+  }
+
+  .border-red,
+  .border-red-600,
+  [class*='border-red-'] {
+    border-color: var(--App-brand-red) !important;
+  }
+
+  [style*='color: red'],
+  [style*='color:red'] {
+    color: var(--App-brand-red) !important;
+  }
+
+  [style*='background-color: red'],
+  [style*='background-color:red'] {
+    background-color: var(--App-brand-red) !important;
+  }
+
+  .ant-tag-red,
+  .ant-tag-error {
+    color: var(--App-brand-red) !important;
+    background: var(--App-brand-red-50) !important;
+    border-color: var(--App-brand-red-100) !important;
+  }
+
+  .ant-btn-dangerous,
+  .ant-btn-dangerous:not(:disabled):hover {
+    border-color: var(--App-brand-red) !important;
+    color: var(--App-brand-red) !important;
+  }
+}

src/assets/css/main.less

@@ -1,6 +1,7 @@
 @import (less) './var.less';
 @import (less) './fonts.less';
 @import (less) './ant.less';
+@import (less) './boursecu-theme.less';
 
 html {
   scroll-behavior: smooth;

src/components/BasicPacks/BasicIcon.vue

@@ -11,6 +11,7 @@
 <script lang="ts" setup>
 import icons from '@/components/BasicPacks/tools/icons/icons.json'
 import {usePrefix} from "@/utils/usePrefix";
+import {resolveProjectColor} from "@/utils/config";
 import {computed, onMounted, ref, withDefaults, defineProps} from "vue";
 
 interface Props {
@@ -28,7 +29,7 @@ const tempIcon = ref<string>()
 const refIcon = ref<HTMLDivElement>()
 tempIcon.value = icons[`${props.icon}`] as string
 const color = computed(() => {
-  return props.color
+  return resolveProjectColor(props.color)
 })
 
 onMounted(() => {

src/main.ts

@@ -15,7 +15,7 @@ import VueLazyLoad from 'vue3-lazyload'
 import { getMe } from '@/api/me'
 import type { NavigationGuardNext, RouteLocationNormalized } from 'vue-router'
 import { useAuthStore } from '@/store/useAuthStore'
-import {applyProjectFont, getConfigApp} from "@/utils/config";
+import {applyProjectTheme, getConfigApp} from "@/utils/config";
 
 
 const app = createApp(App)
@@ -192,7 +192,7 @@ app.mount('#app')
 // }
 
 nextTick(() => {
-  applyProjectFont()
+  applyProjectTheme()
 
   const color = window.__APP_CONFIG__?.user?.color
   const secondary_color = window.__APP_CONFIG__?.user?.secondary_color

src/utils/config.ts

@@ -13,6 +13,25 @@ export function isBoursecuProject() {
   return getConfigApp('name') === 'boursecu'
 }
 
+export const BOURSECU_BRAND_RED = '#bc3c3b'
+export const BOURSECU_BRAND_NAV = '#133050'
+
+export function getProjectBrandRed() {
+  return isBoursecuProject() ? BOURSECU_BRAND_RED : null
+}
+
+export function resolveProjectColor(color?: string | null) {
+  if (!color || !isBoursecuProject()) {
+    return color
+  }
+
+  if (color === 'red' || color.startsWith('red-')) {
+    return BOURSECU_BRAND_RED
+  }
+
+  return color
+}
+
 export function getProjectLoginLogo(avatar?: string | null) {
   if (isBoursecuProject()) {
     return boursecuLogo
@@ -26,13 +45,13 @@ export function getProjectLoginTaglineLines() {
   }
 
   return [
-    'بورس مس',
-    'مرجع هوشمند معاملات و سرمایه‌گذاری در صنعت مس',
+    'بورس مس مرجع هوشمند معاملات',
+    ' و سرمایه‌گذاری در صنعت مس',
   ]
 }
 
 export function getProjectSplashBackground() {
-  return isBoursecuProject() ? '#133050' : '#ffffff'
+  return isBoursecuProject() ? BOURSECU_BRAND_NAV : '#ffffff'
 }
 
 export function getProjectFontFamily() {
@@ -46,6 +65,20 @@ export function applyProjectFont() {
   }
 }
 
+export function applyProjectTheme() {
+  applyProjectFont()
+
+  if (!isBoursecuProject()) {
+    return
+  }
+
+  document.documentElement.classList.add('project-boursecu')
+  document.documentElement.style.setProperty('--App-brand-red', BOURSECU_BRAND_RED)
+  document.documentElement.style.setProperty('--App-brand-red-50', '#f8ecec')
+  document.documentElement.style.setProperty('--App-brand-red-100', '#f0d8d8')
+  document.documentElement.style.setProperty('--App-brand-red-700', '#963130')
+}
+
 export function getReferralShareTitle(projectName?: string | null) {
   return projectName ?? getConfigApp('name_fa') ?? getConfigApp('name') ?? 'طلا'
 }

src/views/base/index.vue

@@ -283,8 +283,10 @@ function setRoute(val: string) {
       }
     }
 
-    /* boursecu: دایرهٔ داخلی با رنگ برند */
+    /* boursecu: هر دو دایره با رنگ برند */
     .circle_in.is-boursecu-nav-logo {
+      background-color: #133050 !important;
+
       .circle_into {
         background: #133050 !important;
         border-color: #fff;