second commit

2025-10-01 17:44:17 +03:30 · 2025-10-01 17:44:17 +03:30 · 29b7178dcb
parent eafef2a1d9
commit 29b7178dcb
315 changed files with 35708 additions and 0 deletions
--- a/.env.montzar
+++ b/.env.montzar
@ -0,0 +1,5 @@
+VITE_PROJECT_BASE = montzar
+VITE_PROJECT_BASEURL = https://montpar.ir/server/
+VITE_PROJECT_BASEURL_WS = wss://montpar.ir
+VITE_PROJECT_TITLE = Mont Zar | پنل مشتریان
+VITE_PROJECT_LOGO = /logo_desktop.svg
--- a/.env.pargar
+++ b/.env.pargar
@ -0,0 +1,5 @@
+VITE_PROJECT_BASE = pargar
+VITE_PROJECT_BASEURL = https://liman.gold/server
+VITE_PROJECT_BASEURL_WS = wss://liman.gold
+VITE_PROJECT_TITLE = پرگار | پنل مشتریان
+VITE_PROJECT_LOGO = /logo_desktop.svg
--- a/.eslintrc-auto-import.json
+++ b/.eslintrc-auto-import.json
@ -0,0 +1,67 @@
+{
+  "globals": {
+    "Component": true,
+    "ComponentPublicInstance": true,
+    "ComputedRef": true,
+    "EffectScope": true,
+    "ExtractDefaultPropTypes": true,
+    "ExtractPropTypes": true,
+    "ExtractPublicPropTypes": true,
+    "InjectionKey": true,
+    "PropType": true,
+    "Ref": true,
+    "VNode": true,
+    "WritableComputedRef": true,
+    "computed": true,
+    "createApp": true,
+    "customRef": true,
+    "defineAsyncComponent": true,
+    "defineComponent": true,
+    "effectScope": true,
+    "getCurrentInstance": true,
+    "getCurrentScope": true,
+    "h": true,
+    "inject": true,
+    "isProxy": true,
+    "isReactive": true,
+    "isReadonly": true,
+    "isRef": true,
+    "markRaw": true,
+    "nextTick": true,
+    "onActivated": true,
+    "onBeforeMount": true,
+    "onBeforeUnmount": true,
+    "onBeforeUpdate": true,
+    "onDeactivated": true,
+    "onErrorCaptured": true,
+    "onMounted": true,
+    "onRenderTracked": true,
+    "onRenderTriggered": true,
+    "onScopeDispose": true,
+    "onServerPrefetch": true,
+    "onUnmounted": true,
+    "onUpdated": true,
+    "provide": true,
+    "reactive": true,
+    "readonly": true,
+    "ref": true,
+    "resolveComponent": true,
+    "shallowReactive": true,
+    "shallowReadonly": true,
+    "shallowRef": true,
+    "toRaw": true,
+    "toRef": true,
+    "toRefs": true,
+    "toValue": true,
+    "triggerRef": true,
+    "unref": true,
+    "useAttrs": true,
+    "useCssModule": true,
+    "useCssVars": true,
+    "useSlots": true,
+    "watch": true,
+    "watchEffect": true,
+    "watchPostEffect": true,
+    "watchSyncEffect": true
+  }
+}
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@ -0,0 +1,15 @@
+/* eslint-env node */
+require('@rushstack/eslint-patch/modern-module-resolution')
+
+module.exports = {
+  root: true,
+  'extends': [
+    'plugin:vue/vue3-essential',
+    'eslint:recommended',
+    '@vue/eslint-config-typescript',
+    '@vue/eslint-config-prettier/skip-formatting'
+  ],
+  parserOptions: {
+    ecmaVersion: 'latest'
+  }
+}
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
--- a/.prettierrc.json
+++ b/.prettierrc.json
@ -0,0 +1,8 @@
+{
+  "$schema": "https://json.schemastore.org/prettierrc",
+  "semi": false,
+  "tabWidth": 2,
+  "singleQuote": true,
+  "printWidth": 100,
+  "trailingComma": "none"
+}
--- a/.prettierrc1.json
+++ b/.prettierrc1.json
--- a/.vscode/extensions.json
+++ b/.vscode/extensions.json
@ -0,0 +1,3 @@
+{
+  "recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
+}
--- a/auto-imports.d.ts
+++ b/auto-imports.d.ts
@ -0,0 +1,182 @@
+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// noinspection JSUnusedGlobalSymbols
+// Generated by unplugin-auto-import
+export {}
+declare global {
+  const EffectScope: typeof import('vue')['EffectScope']
+  const computed: typeof import('vue')['computed']
+  const createApp: typeof import('vue')['createApp']
+  const customRef: typeof import('vue')['customRef']
+  const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
+  const defineComponent: typeof import('vue')['defineComponent']
+  const effectScope: typeof import('vue')['effectScope']
+  const getCurrentInstance: typeof import('vue')['getCurrentInstance']
+  const getCurrentScope: typeof import('vue')['getCurrentScope']
+  const h: typeof import('vue')['h']
+  const inject: typeof import('vue')['inject']
+  const isProxy: typeof import('vue')['isProxy']
+  const isReactive: typeof import('vue')['isReactive']
+  const isReadonly: typeof import('vue')['isReadonly']
+  const isRef: typeof import('vue')['isRef']
+  const markRaw: typeof import('vue')['markRaw']
+  const nextTick: typeof import('vue')['nextTick']
+  const onActivated: typeof import('vue')['onActivated']
+  const onBeforeMount: typeof import('vue')['onBeforeMount']
+  const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
+  const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
+  const onDeactivated: typeof import('vue')['onDeactivated']
+  const onErrorCaptured: typeof import('vue')['onErrorCaptured']
+  const onMounted: typeof import('vue')['onMounted']
+  const onRenderTracked: typeof import('vue')['onRenderTracked']
+  const onRenderTriggered: typeof import('vue')['onRenderTriggered']
+  const onScopeDispose: typeof import('vue')['onScopeDispose']
+  const onServerPrefetch: typeof import('vue')['onServerPrefetch']
+  const onUnmounted: typeof import('vue')['onUnmounted']
+  const onUpdated: typeof import('vue')['onUpdated']
+  const provide: typeof import('vue')['provide']
+  const reactive: typeof import('vue')['reactive']
+  const readonly: typeof import('vue')['readonly']
+  const ref: typeof import('vue')['ref']
+  const resolveComponent: typeof import('vue')['resolveComponent']
+  const shallowReactive: typeof import('vue')['shallowReactive']
+  const shallowReadonly: typeof import('vue')['shallowReadonly']
+  const shallowRef: typeof import('vue')['shallowRef']
+  const toRaw: typeof import('vue')['toRaw']
+  const toRef: typeof import('vue')['toRef']
+  const toRefs: typeof import('vue')['toRefs']
+  const toValue: typeof import('vue')['toValue']
+  const triggerRef: typeof import('vue')['triggerRef']
+  const unref: typeof import('vue')['unref']
+  const useAttrs: typeof import('vue')['useAttrs']
+  const useCssModule: typeof import('vue')['useCssModule']
+  const useCssVars: typeof import('vue')['useCssVars']
+  const useSlots: typeof import('vue')['useSlots']
+  const watch: typeof import('vue')['watch']
+  const watchEffect: typeof import('vue')['watchEffect']
+  const watchPostEffect: typeof import('vue')['watchPostEffect']
+  const watchSyncEffect: typeof import('vue')['watchSyncEffect']
+}
+// for type re-export
+declare global {
+  // @ts-ignore
+  export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
+  import('vue')
+}
+// for vue template auto import
+import { UnwrapRef } from 'vue'
+declare module 'vue' {
+  interface GlobalComponents {}
+  interface ComponentCustomProperties {
+    readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']>
+    readonly computed: UnwrapRef<typeof import('vue')['computed']>
+    readonly createApp: UnwrapRef<typeof import('vue')['createApp']>
+    readonly customRef: UnwrapRef<typeof import('vue')['customRef']>
+    readonly defineAsyncComponent: UnwrapRef<typeof import('vue')['defineAsyncComponent']>
+    readonly defineComponent: UnwrapRef<typeof import('vue')['defineComponent']>
+    readonly effectScope: UnwrapRef<typeof import('vue')['effectScope']>
+    readonly getCurrentInstance: UnwrapRef<typeof import('vue')['getCurrentInstance']>
+    readonly getCurrentScope: UnwrapRef<typeof import('vue')['getCurrentScope']>
+    readonly h: UnwrapRef<typeof import('vue')['h']>
+    readonly inject: UnwrapRef<typeof import('vue')['inject']>
+    readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
+    readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
+    readonly isReadonly: UnwrapRef<typeof import('vue')['isReadonly']>
+    readonly isRef: UnwrapRef<typeof import('vue')['isRef']>
+    readonly markRaw: UnwrapRef<typeof import('vue')['markRaw']>
+    readonly nextTick: UnwrapRef<typeof import('vue')['nextTick']>
+    readonly onActivated: UnwrapRef<typeof import('vue')['onActivated']>
+    readonly onBeforeMount: UnwrapRef<typeof import('vue')['onBeforeMount']>
+    readonly onBeforeUnmount: UnwrapRef<typeof import('vue')['onBeforeUnmount']>
+    readonly onBeforeUpdate: UnwrapRef<typeof import('vue')['onBeforeUpdate']>
+    readonly onDeactivated: UnwrapRef<typeof import('vue')['onDeactivated']>
+    readonly onErrorCaptured: UnwrapRef<typeof import('vue')['onErrorCaptured']>
+    readonly onMounted: UnwrapRef<typeof import('vue')['onMounted']>
+    readonly onRenderTracked: UnwrapRef<typeof import('vue')['onRenderTracked']>
+    readonly onRenderTriggered: UnwrapRef<typeof import('vue')['onRenderTriggered']>
+    readonly onScopeDispose: UnwrapRef<typeof import('vue')['onScopeDispose']>
+    readonly onServerPrefetch: UnwrapRef<typeof import('vue')['onServerPrefetch']>
+    readonly onUnmounted: UnwrapRef<typeof import('vue')['onUnmounted']>
+    readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
+    readonly provide: UnwrapRef<typeof import('vue')['provide']>
+    readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
+    readonly readonly: UnwrapRef<typeof import('vue')['readonly']>
+    readonly ref: UnwrapRef<typeof import('vue')['ref']>
+    readonly resolveComponent: UnwrapRef<typeof import('vue')['resolveComponent']>
+    readonly shallowReactive: UnwrapRef<typeof import('vue')['shallowReactive']>
+    readonly shallowReadonly: UnwrapRef<typeof import('vue')['shallowReadonly']>
+    readonly shallowRef: UnwrapRef<typeof import('vue')['shallowRef']>
+    readonly toRaw: UnwrapRef<typeof import('vue')['toRaw']>
+    readonly toRef: UnwrapRef<typeof import('vue')['toRef']>
+    readonly toRefs: UnwrapRef<typeof import('vue')['toRefs']>
+    readonly toValue: UnwrapRef<typeof import('vue')['toValue']>
+    readonly triggerRef: UnwrapRef<typeof import('vue')['triggerRef']>
+    readonly unref: UnwrapRef<typeof import('vue')['unref']>
+    readonly useAttrs: UnwrapRef<typeof import('vue')['useAttrs']>
+    readonly useCssModule: UnwrapRef<typeof import('vue')['useCssModule']>
+    readonly useCssVars: UnwrapRef<typeof import('vue')['useCssVars']>
+    readonly useSlots: UnwrapRef<typeof import('vue')['useSlots']>
+    readonly watch: UnwrapRef<typeof import('vue')['watch']>
+    readonly watchEffect: UnwrapRef<typeof import('vue')['watchEffect']>
+    readonly watchPostEffect: UnwrapRef<typeof import('vue')['watchPostEffect']>
+    readonly watchSyncEffect: UnwrapRef<typeof import('vue')['watchSyncEffect']>
+  }
+}
+declare module '@vue/runtime-core' {
+  interface GlobalComponents {}
+  interface ComponentCustomProperties {
+    readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']>
+    readonly computed: UnwrapRef<typeof import('vue')['computed']>
+    readonly createApp: UnwrapRef<typeof import('vue')['createApp']>
+    readonly customRef: UnwrapRef<typeof import('vue')['customRef']>
+    readonly defineAsyncComponent: UnwrapRef<typeof import('vue')['defineAsyncComponent']>
+    readonly defineComponent: UnwrapRef<typeof import('vue')['defineComponent']>
+    readonly effectScope: UnwrapRef<typeof import('vue')['effectScope']>
+    readonly getCurrentInstance: UnwrapRef<typeof import('vue')['getCurrentInstance']>
+    readonly getCurrentScope: UnwrapRef<typeof import('vue')['getCurrentScope']>
+    readonly h: UnwrapRef<typeof import('vue')['h']>
+    readonly inject: UnwrapRef<typeof import('vue')['inject']>
+    readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
+    readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
+    readonly isReadonly: UnwrapRef<typeof import('vue')['isReadonly']>
+    readonly isRef: UnwrapRef<typeof import('vue')['isRef']>
+    readonly markRaw: UnwrapRef<typeof import('vue')['markRaw']>
+    readonly nextTick: UnwrapRef<typeof import('vue')['nextTick']>
+    readonly onActivated: UnwrapRef<typeof import('vue')['onActivated']>
+    readonly onBeforeMount: UnwrapRef<typeof import('vue')['onBeforeMount']>
+    readonly onBeforeUnmount: UnwrapRef<typeof import('vue')['onBeforeUnmount']>
+    readonly onBeforeUpdate: UnwrapRef<typeof import('vue')['onBeforeUpdate']>
+    readonly onDeactivated: UnwrapRef<typeof import('vue')['onDeactivated']>
+    readonly onErrorCaptured: UnwrapRef<typeof import('vue')['onErrorCaptured']>
+    readonly onMounted: UnwrapRef<typeof import('vue')['onMounted']>
+    readonly onRenderTracked: UnwrapRef<typeof import('vue')['onRenderTracked']>
+    readonly onRenderTriggered: UnwrapRef<typeof import('vue')['onRenderTriggered']>
+    readonly onScopeDispose: UnwrapRef<typeof import('vue')['onScopeDispose']>
+    readonly onServerPrefetch: UnwrapRef<typeof import('vue')['onServerPrefetch']>
+    readonly onUnmounted: UnwrapRef<typeof import('vue')['onUnmounted']>
+    readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
+    readonly provide: UnwrapRef<typeof import('vue')['provide']>
+    readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
+    readonly readonly: UnwrapRef<typeof import('vue')['readonly']>
+    readonly ref: UnwrapRef<typeof import('vue')['ref']>
+    readonly resolveComponent: UnwrapRef<typeof import('vue')['resolveComponent']>
+    readonly shallowReactive: UnwrapRef<typeof import('vue')['shallowReactive']>
+    readonly shallowReadonly: UnwrapRef<typeof import('vue')['shallowReadonly']>
+    readonly shallowRef: UnwrapRef<typeof import('vue')['shallowRef']>
+    readonly toRaw: UnwrapRef<typeof import('vue')['toRaw']>
+    readonly toRef: UnwrapRef<typeof import('vue')['toRef']>
+    readonly toRefs: UnwrapRef<typeof import('vue')['toRefs']>
+    readonly toValue: UnwrapRef<typeof import('vue')['toValue']>
+    readonly triggerRef: UnwrapRef<typeof import('vue')['triggerRef']>
+    readonly unref: UnwrapRef<typeof import('vue')['unref']>
+    readonly useAttrs: UnwrapRef<typeof import('vue')['useAttrs']>
+    readonly useCssModule: UnwrapRef<typeof import('vue')['useCssModule']>
+    readonly useCssVars: UnwrapRef<typeof import('vue')['useCssVars']>
+    readonly useSlots: UnwrapRef<typeof import('vue')['useSlots']>
+    readonly watch: UnwrapRef<typeof import('vue')['watch']>
+    readonly watchEffect: UnwrapRef<typeof import('vue')['watchEffect']>
+    readonly watchPostEffect: UnwrapRef<typeof import('vue')['watchPostEffect']>
+    readonly watchSyncEffect: UnwrapRef<typeof import('vue')['watchSyncEffect']>
+  }
+}
--- a/components.d.ts
+++ b/components.d.ts
@ -0,0 +1,59 @@
+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// Generated by unplugin-vue-components
+// Read more: https://github.com/vuejs/core/pull/3399
+export {}
+
+declare module 'vue' {
+  export interface GlobalComponents {
+    AAffix: typeof import('ant-design-vue/es')['Affix']
+    AAlert: typeof import('ant-design-vue/es')['Alert']
+    AButton: typeof import('ant-design-vue/es')['Button']
+    ACard: typeof import('ant-design-vue/es')['Card']
+    AConfigProvider: typeof import('ant-design-vue/es')['ConfigProvider']
+    ADrawer: typeof import('ant-design-vue/es')['Drawer']
+    ADropdown: typeof import('ant-design-vue/es')['Dropdown']
+    AFloatButton: typeof import('ant-design-vue/es')['FloatButton']
+    AForm: typeof import('ant-design-vue/es')['Form']
+    AFormItem: typeof import('ant-design-vue/es')['FormItem']
+    AInput: typeof import('ant-design-vue/es')['Input']
+    AInputPassword: typeof import('ant-design-vue/es')['InputPassword']
+    AModal: typeof import('ant-design-vue/es')['Modal']
+    ARadio: typeof import('ant-design-vue/es')['Radio']
+    ARadioGroup: typeof import('ant-design-vue/es')['RadioGroup']
+    ASpin: typeof import('ant-design-vue/es')['Spin']
+    ASwitch: typeof import('ant-design-vue/es')['Switch']
+    BaseDatePicker: typeof import('./src/components/BasicPacks/BaseDatePicker/src/BaseDatePicker.vue')['default']
+    BaseSwitch: typeof import('./src/components/BasicPacks/BaseSwitch/src/BaseSwitch.vue')['default']
+    BaseTable: typeof import('./src/components/BasicPacks/BaseTable/src/BaseTable.vue')['default']
+    BasicActionSheet: typeof import('./src/components/BasicPacks/BasicActionSheet.vue')['default']
+    BasicButton: typeof import('./src/components/BasicPacks/BasicButton.vue')['default']
+    BasicDraggableFileUpload: typeof import('./src/components/BasicPacks/BasicUploads/BasicDraggableFileUpload.vue')['default']
+    BasicIcon: typeof import('./src/components/BasicPacks/BasicIcon.vue')['default']
+    BasicInfoItem: typeof import('./src/components/BasicPacks/BasicInfoItem.vue')['default']
+    BasicInput: typeof import('./src/components/BasicPacks/BasicInput.vue')['default']
+    BasicModal: typeof import('./src/components/BasicPacks/BasicModal.vue')['default']
+    BasicPriceInput: typeof import('./src/components/BasicPacks/BasicPriceInput/src/BasicPriceInput.vue')['default']
+    BasicSelect: typeof import('./src/components/BasicPacks/BasicSelect.vue')['default']
+    BasicTags: typeof import('./src/components/BasicPacks/BasicTags/index.vue')['default']
+    BasicTextArea: typeof import('./src/components/BasicPacks/BasicTextArea.vue')['default']
+    BasicToggleTwoItem: typeof import('./src/components/BasicPacks/BasicToggleTwoItem.vue')['default']
+    BulkIcon: typeof import('./src/components/BulkIcon.vue')['default']
+    CustomTag: typeof import('./src/components/CustomTag.vue')['default']
+    DialogVantOneButton: typeof import('./src/components/DialogVantOneButton.vue')['default']
+    Icon: typeof import('./src/components/Icon.vue')['default']
+    IconButton: typeof import('./src/components/IconButton.vue')['default']
+    InfoItem: typeof import('./src/components/InfoItem.vue')['default']
+    InstallPWA: typeof import('./src/components/InstallPWA.vue')['default']
+    Menu: typeof import('./src/components/Menu.vue')['default']
+    MobileNavbar: typeof import('./src/components/MobileNavbar.vue')['default']
+    Navbar: typeof import('./src/components/Navbar.vue')['default']
+    ProductCard: typeof import('./src/components/ProductCard.vue')['default']
+    ProfileDrawer: typeof import('./src/components/ProfileDrawer.vue')['default']
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
+    Setting: typeof import('./src/components/Setting.vue')['default']
+    UserSetting: typeof import('./src/components/UserSetting.vue')['default']
+  }
+}
--- a/dev-dist/registerSW.js
+++ b/dev-dist/registerSW.js
@ -0,0 +1 @@
+if('serviceWorker' in navigator) navigator.serviceWorker.register('/dev-sw.js?dev-sw', { scope: '/', type: 'classic' })
--- a/index.html
+++ b/index.html
@ -0,0 +1,16 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml"/>
+    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
+    <meta http-equiv="Pragma" content="no-cache">
+    <meta http-equiv="Expires" content="0">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title> پنل مشتریان</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -0,0 +1,54 @@
+{
+  "name": "abshode",
+  "private": true,
+  "version": "1.0.6",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vue-tsc && vite build",
+    "preview": "vite preview",
+    "build-only": "vite build",
+    "type-check": "vue-tsc --noEmit -p tsconfig.app.json --composite false",
+    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
+    "format": "prettier --write src/"
+  },
+  "dependencies": {
+    "@rushstack/eslint-patch": "^1.7.2",
+    "@types/node": "^20.11.17",
+    "@vitejs/plugin-vue-jsx": "^4.1.2",
+    "@vue/eslint-config-prettier": "^9.0.0",
+    "@vue/eslint-config-typescript": "^12.0.0",
+    "@vueuse/core": "^10.9.0",
+    "ant-design-vue": "^4.1.2",
+    "axios": "^1.6.8",
+    "dayjalali": "^1.0.1",
+    "echarts": "^5.5.0",
+    "jalaliday": "^2.3.0",
+    "lodash": "^4.17.21",
+    "moment": "^2.30.1",
+    "moment-jalaali": "^0.10.0",
+    "pinia": "^2.1.7",
+    "vant": "^4.9.4",
+    "vite-plugin-pwa": "^1.0.0",
+    "vue": "^3.4.19",
+    "vue-content-loader": "^2.0.1",
+    "vue-echarts": "^6.6.9",
+    "vue-router": "^4.2.5",
+    "vue3-otp-input": "^0.4.1"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^5.0.3",
+    "@vue/tsconfig": "^0.5.1",
+    "eslint": "^8.56.0",
+    "eslint-plugin-vue": "^9.21.1",
+    "less": "^4.2.0",
+    "less-loader": "^12.2.0",
+    "prettier": "3.2.5",
+    "typescript": "^5.2.2",
+    "unocss": "^66.1.2",
+    "unplugin-auto-import": "^0.17.5",
+    "unplugin-vue-components": "^0.26.0",
+    "vite": "^6.3.5",
+    "vue-tsc": "^2.2.10"
+  }
+}
--- a/public/fav_pargar.png
+++ b/public/fav_pargar.png
--- a/public/logo_desktop.svg
+++ b/public/logo_desktop.svg
@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200" viewBox="0 0 200 200">
+  <defs>
+    <style>
+      .cls-1 {
+        font-size: 347.222px;
+        text-anchor: end;
+        font-family: "Copperplate Gothic Bold";
+      }
+    </style>
+  </defs>
+  <text id="MZ" class="cls-1" transform="translate(196.036 139.04) scale(0.336)"><tspan x="0">MZ</tspan></text>
+</svg>
--- a/public/pwa-icon-192_pargar.png
+++ b/public/pwa-icon-192_pargar.png
--- a/public/pwa-icon-36_pargar.png
+++ b/public/pwa-icon-36_pargar.png
--- a/public/pwa-icon-512_pargar.png
+++ b/public/pwa-icon-512_pargar.png
--- a/src/App.vue
+++ b/src/App.vue
@ -0,0 +1,435 @@
+<template>
+  <AConfigProvider
+    direction="rtl"
+    :theme="{
+      token: {
+        fontFamily: 'ModamSemiPro',
+        colorPrimary: colors.primary,
+        colorLink: colors.primary,
+        colorLinkActive: colors.primary,
+        colorLinkHover: colors['primary']
+      }
+    }"
+  >
+    <div class="">
+      <AAffix :offset-top="0">
+        <div class="">
+          <div class="container mx-auto">
+            <Navbar v-if="router.currentRoute.value.meta.showNavbar" />
+          </div>
+        </div>
+      </AAffix>
+        <RouterView v-slot="{ Component }">
+          <KeepAlive :include="keepAliveList">
+            <Component
+              class="mx-auto px-4"
+              :is="Component"
+            />
+
+          </KeepAlive>
+        </RouterView>
+      <div  v-if="router.currentRoute.value.meta.showMenu"  class="py-8 absolute bottom-1px" style="justify-self: center">
+        <div class="container mx-auto">
+          <div class="menuBorder w-22rem">
+<!--            <Menu/>-->
+          </div>
+        </div>
+      </div>
+
+    </div>
+  </AConfigProvider>
+  <BasicModal width="390px" v-model:visible="openConfirm" custom-footer :loading="loading" :closable="false"
+              :maskClosable="false">
+    <div class="flex text-white flex-col items-center ">
+      <div>سفارش شما ثبت شد و در حال بررسی می باشد.</div>
+      <div>لطفا تا زمان تعیین وضعیت سفارش منتظر بمانید.</div>
+      <div class="typewriter p-4 mt-8">
+        <div class="slide"><i></i></div>
+        <div class="paper"></div>
+        <div class="keyboard"></div>
+      </div>
+      <BasicButton @click="$router.push('orders')" size="large" class="w-full buttonLogin">رفتن به لیست سفارشات</BasicButton> </div>
+  </BasicModal>
+  <BasicModal width="390px"
+              v-model:visible="openResult"
+              custom-footer
+              :loading="loading"
+              :closable="false"
+              :maskClosable="false">
+    <div v-if="orderResult?.sts === 4" class="flex flex-col items-center">
+      <div class="text-red-600 ">متاسفانه سفارش شما رد شد.</div>
+      <div class="text-white text-center">شما میتوانید در لیست محصولات، سفارش جدیدی ثبت کنید.</div>
+      <BasicIcon icon="vuesax-linear:clipboard-close" color="red" :size="80" class="my-5" />
+      <BasicButton @click="$router.push('products');openResult = false" class="w-full text-primary buttonLogin border-primary">رفتن
+        به لیست محصولات
+      </BasicButton>
+    </div>
+    <div v-if="orderResult?.sts === 2" class="flex flex-col items-center">
+      <div class="text-green-600">سفارش شما تایید شد.</div>
+      <div class="text-white text-center">شما میتوانید در لیست سفارشات، سفارش خود را پیگیری کنید.</div>
+      <BasicIcon icon="vuesax-linear:clipboard-tick" color="green" :size="80" class="my-5" />
+      <BasicButton @click="$router.push('orders');openResult = false" class="w-full text-primary border-primary">رفتن به
+        لیست سفارشات
+      </BasicButton>
+    </div>
+    <div v-if="orderResult?.sts === 6" class="flex flex-col items-center">
+      <div class="text-yellow-600">سفارش شما نتیجه ای در پی نداشت</div>
+      <div class="text-white">شما میتوانید در لیست محصولات، سفارش جدیدی ثبت کنید</div>
+      <BasicIcon icon="vuesax-linear:clipboard-text" color="orange" :size="80" class="my-5" />
+      <BasicButton @click="$router.push('products');openResult = false" class="w-full text-primary border-primary">رفتن
+        به لیست محصولات
+      </BasicButton>
+    </div>
+    <div v-if="orderResult?.sts === 3" class="flex flex-col items-center">
+      <div class="text-yellow-600">سفارش شما رد و قیمت پیشنهادی جدیدی برای شما ثبت شد</div>
+      <div class=" mt-5 bg-yellow-50 w-full p-2 rounded-lg">
+        <div class="flex gap-3 justify-between w-full">
+          <div class="font-bold">مقدار:</div>
+          <div>{{ orderResult.amount }} {{ orderResult.product?.unit === 'گرم' ? 'گرم' : 'عدد' }}</div>
+        </div>
+      </div>
+      <div class=" mt-5 bg-blue-50 w-full p-2 rounded-lg">
+        <div class="flex gap-3 justify-between w-full">
+          <div class="font-bold">قیمت کل پیشنهادی:</div>
+          <div>{{ usePrice((stsOfferInfo?.offer * orderResult.amount) ?? 0) }}</div>
+        </div>
+        <div class="flex gap-3 justify-between w-full">
+          <div class="font-bold">قیمت هر {{ orderResult.product?.unit === 'گرم' ? 'گرم' : 'عدد' }} پیشنهادی:</div>
+          <div>{{ usePrice(stsOfferInfo?.offer ?? 0) }}</div>
+        </div>
+        <div v-if="orderResult.product?.unit === 'گرم'" class="flex gap-3 justify-between w-full">
+          <div class="font-bold">قیمت هر {{ orderResult.product?.unit === 'گرم' ? 'مثقال' : 'عدد' }} پیشنهادی:</div>
+          <div>{{ usePrice((stsOfferInfo?.offer_mesghal_price) ?? 0) }}</div>
+        </div>
+      </div>
+      <div class=" mt-5 bg-red-50 w-full p-2 rounded-lg">
+        <div class="flex gap-3 justify-between w-full">
+          <div class="font-bold">قیمت کل قبلی:</div>
+          <div>{{ usePrice(orderResult?.total_price ?? 0) }}</div>
+        </div>
+        <div class="flex gap-3 justify-between w-full">
+          <div class="font-bold">قیمت قبلی هر {{ orderResult.product?.unit === 'گرم' ? 'گرم' : 'عدد' }}:</div>
+          <div>{{ usePrice(orderResult?.price ?? 0) }}</div>
+        </div>
+        <div v-if="orderResult.product?.unit === 'گرم'" class="flex gap-3 justify-between w-full">
+          <div class="font-bold">قیمت قبلی هر {{ orderResult.product?.unit === 'گرم' ? 'مثقال' : 'عدد' }}:</div>
+          <div>{{ usePrice(parseInt(((orderResult?.price ?? 0) * 4.331802).toFixed(0)) ?? 0) }}</div>
+        </div>
+      </div>
+      <div class="grid grid-cols-2 gap-2 w-full mt-5">
+        <BasicButton class="bg-green-600 text-white border-solid" @click="confirmOrder()">تایید</BasicButton>
+        <BasicButton class="bg-red-600 text-white border-solid" @click="rejectOrder()">رد</BasicButton>
+      </div> </div>
+  </BasicModal>
+
+  <BasicModal width="20rem"
+              class="updateModal"
+              v-model:visible="versionDialog"
+              custom-footer
+              :loading="loading"
+              :closable="false"
+              :maskClosable="false">
+    <div class="flex flex-col items-center">
+      <BasicIcon class="home_appear_fade_in_up text-center" color="orange"
+                 icon="vuesax-linear:info-circle"
+                 size="50" />
+      <div class="home_appear_fade_in_up mt-2 text-white">نسخه جدید در دسترس است</div>
+      <BasicButton class="mt-2 w-full buttonLogin" @click="update">به روز رسانی</BasicButton>
+    </div>
+    <!--    </div>-->
+  </BasicModal>
+</template>
+
+<script setup lang="ts">
+import { colors } from './themeConfig.ts'
+import Navbar from '@/components/Navbar.vue'
+import Menu from '@/components/Menu.vue'
+import router from '@/router'
+import avatar from '@/assets/img/avatar.svg'
+import UserSetting from '@/components/UserSetting.vue'
+import { openResult, openConfirm, rejectOrder, confirmOrder, orderResult, stsOfferInfo } from '@/utils/order'
+import { loading } from '@/utils'
+import BasicModal from '@/components/BasicPacks/BasicModal.vue'
+import BasicButton from '@/components/BasicPacks/BasicButton.vue'
+import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
+import { usePrice } from './composable/usePrice'
+import { update } from 'lodash'
+import pkg from '../package.json'
+import { useRegisterSW } from 'virtual:pwa-register/vue'
+import { onMounted, ref, watch } from 'vue'
+import InstallPWA from '@/components/InstallPWA.vue'
+import { useUserStore } from '@/store/user'
+import { usePWAStore } from '@/store/usePWAStore'
+const versionDialog = ref<boolean>(false)
+const keepAliveList = ['product-list']
+const {updateServiceWorker} = useRegisterSW()
+const projectBase = import.meta.env.VITE_PROJECT_BASE
+const logo = import.meta.env.VITE_PROJECT_LOGO
+const userStore = useUserStore()
+function checkVersion() {
+  const version = localStorage.getItem('version')
+  // if (true) {
+  if (version != pkg.version) {
+    versionDialog.value = true
+  }
+}
+onMounted(() => {
+  checkVersion()
+  document.body.classList.add(import.meta.env.VITE_PROJECT_BASE)
+  document.querySelector("link[rel~='icon']")?.setAttribute('href', `/fav_${projectBase}.png`)
+  document.title = import.meta.env.VITE_PROJECT_TITLE
+
+  const pwaStore = usePWAStore()
+
+  window.addEventListener('beforeinstallprompt', (e: any) => {
+    console.log('✅ beforeinstallprompt fired')
+    e.preventDefault()
+    pwaStore.setPrompt(e)
+  })
+/*  setTimeout(() => {
+    showSplash.value = false
+  }, 2000)*/
+})
+
+function update() {
+  localStorage.setItem('version', pkg.version)
+  updateServiceWorker()
+  window.location.reload()
+}
+</script>
+
+<style>
+/* From Uiverse.io by Nawsome */
+.typewriter {
+  --blue: #5C86FF;
+  --blue-dark: #275EFE;
+  --key: #fff;
+  --paper: #EEF0FD;
+  --text: #D3D4EC;
+  --tool: #FBC56C;
+  --duration: 3s;
+  position: relative;
+  -webkit-animation: bounce05 var(--duration) linear infinite;
+  animation: bounce05 var(--duration) linear infinite;
+}
+
+.typewriter .slide {
+  width: 92px;
+  height: 20px;
+  border-radius: 3px;
+  margin-left: 14px;
+  transform: translateX(14px);
+  background: linear-gradient(var(--blue), var(--blue-dark));
+  -webkit-animation: slide05 var(--duration) ease infinite;
+  animation: slide05 var(--duration) ease infinite;
+}
+
+.typewriter .slide:before, .typewriter .slide:after,
+.typewriter .slide i:before {
+  content: "";
+  position: absolute;
+  background: var(--tool);
+}
+
+.typewriter .slide:before {
+  width: 2px;
+  height: 8px;
+  top: 6px;
+  left: 100%;
+}
+
+.typewriter .slide:after {
+  left: 94px;
+  top: 3px;
+  height: 14px;
+  width: 6px;
+  border-radius: 3px;
+}
+
+.typewriter .slide i {
+  display: block;
+  position: absolute;
+  right: 100%;
+  width: 6px;
+  height: 4px;
+  top: 4px;
+  background: var(--tool);
+}
+
+.typewriter .slide i:before {
+  right: 100%;
+  top: -2px;
+  width: 4px;
+  border-radius: 2px;
+  height: 14px;
+}
+
+.typewriter .paper {
+  position: absolute;
+  left: 24px;
+  top: -26px;
+  width: 40px;
+  height: 46px;
+  border-radius: 5px;
+  background: var(--paper);
+  transform: translateY(46px);
+  -webkit-animation: paper05 var(--duration) linear infinite;
+  animation: paper05 var(--duration) linear infinite;
+}
+
+.typewriter .paper:before {
+  content: "";
+  position: absolute;
+  left: 6px;
+  right: 6px;
+  top: 7px;
+  border-radius: 2px;
+  height: 4px;
+  transform: scaleY(0.8);
+  background: var(--text);
+  box-shadow: 0 12px 0 var(--text), 0 24px 0 var(--text), 0 36px 0 var(--text);
+}
+
+.typewriter .keyboard {
+  width: 120px;
+  height: 56px;
+  margin-top: -10px;
+  z-index: 1;
+  position: relative;
+}
+
+.typewriter .keyboard:before, .typewriter .keyboard:after {
+  content: "";
+  position: absolute;
+}
+
+.typewriter .keyboard:before {
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  border-radius: 7px;
+  background: linear-gradient(135deg, var(--blue), var(--blue-dark));
+  transform: perspective(10px) rotateX(2deg);
+  transform-origin: 50% 100%;
+}
+
+.typewriter .keyboard:after {
+  left: 2px;
+  top: 25px;
+  width: 11px;
+  height: 4px;
+  border-radius: 2px;
+  box-shadow: 15px 0 0 var(--key), 30px 0 0 var(--key), 45px 0 0 var(--key), 60px 0 0 var(--key), 75px 0 0 var(--key), 90px 0 0 var(--key), 22px 10px 0 var(--key), 37px 10px 0 var(--key), 52px 10px 0 var(--key), 60px 10px 0 var(--key), 68px 10px 0 var(--key), 83px 10px 0 var(--key);
+  -webkit-animation: keyboard05 var(--duration) linear infinite;
+  animation: keyboard05 var(--duration) linear infinite;
+}
+
+@keyframes bounce05 {
+  85%, 92%, 100% {
+    transform: translateY(0);
+  }
+
+  89% {
+    transform: translateY(-4px);
+  }
+
+  95% {
+    transform: translateY(2px);
+  }
+}
+
+@keyframes slide05 {
+  5% {
+    transform: translateX(14px);
+  }
+
+  15%, 30% {
+    transform: translateX(6px);
+  }
+
+  40%, 55% {
+    transform: translateX(0);
+  }
+
+  65%, 70% {
+    transform: translateX(-4px);
+  }
+
+  80%, 89% {
+    transform: translateX(-12px);
+  }
+
+  100% {
+    transform: translateX(14px);
+  }
+}
+
+@keyframes paper05 {
+  5% {
+    transform: translateY(46px);
+  }
+
+  20%, 30% {
+    transform: translateY(34px);
+  }
+
+  40%, 55% {
+    transform: translateY(22px);
+  }
+
+  65%, 70% {
+    transform: translateY(10px);
+  }
+
+  80%, 85% {
+    transform: translateY(0);
+  }
+
+  92%, 100% {
+    transform: translateY(46px);
+  }
+}
+
+@keyframes keyboard05 {
+  5%, 12%, 21%, 30%, 39%, 48%, 57%, 66%, 75%, 84% {
+    box-shadow: 15px 0 0 var(--key), 30px 0 0 var(--key), 45px 0 0 var(--key), 60px 0 0 var(--key), 75px 0 0 var(--key), 90px 0 0 var(--key), 22px 10px 0 var(--key), 37px 10px 0 var(--key), 52px 10px 0 var(--key), 60px 10px 0 var(--key), 68px 10px 0 var(--key), 83px 10px 0 var(--key);
+  }
+
+  9% {
+    box-shadow: 15px 2px 0 var(--key), 30px 0 0 var(--key), 45px 0 0 var(--key), 60px 0 0 var(--key), 75px 0 0 var(--key), 90px 0 0 var(--key), 22px 10px 0 var(--key), 37px 10px 0 var(--key), 52px 10px 0 var(--key), 60px 10px 0 var(--key), 68px 10px 0 var(--key), 83px 10px 0 var(--key);
+  }
+
+  18% {
+    box-shadow: 15px 0 0 var(--key), 30px 0 0 var(--key), 45px 0 0 var(--key), 60px 2px 0 var(--key), 75px 0 0 var(--key), 90px 0 0 var(--key), 22px 10px 0 var(--key), 37px 10px 0 var(--key), 52px 10px 0 var(--key), 60px 10px 0 var(--key), 68px 10px 0 var(--key), 83px 10px 0 var(--key);
+  }
+
+  27% {
+    box-shadow: 15px 0 0 var(--key), 30px 0 0 var(--key), 45px 0 0 var(--key), 60px 0 0 var(--key), 75px 0 0 var(--key), 90px 0 0 var(--key), 22px 12px 0 var(--key), 37px 10px 0 var(--key), 52px 10px 0 var(--key), 60px 10px 0 var(--key), 68px 10px 0 var(--key), 83px 10px 0 var(--key);
+  }
+
+  36% {
+    box-shadow: 15px 0 0 var(--key), 30px 0 0 var(--key), 45px 0 0 var(--key), 60px 0 0 var(--key), 75px 0 0 var(--key), 90px 0 0 var(--key), 22px 10px 0 var(--key), 37px 10px 0 var(--key), 52px 12px 0 var(--key), 60px 12px 0 var(--key), 68px 12px 0 var(--key), 83px 10px 0 var(--key);
+  }
+
+  45% {
+    box-shadow: 15px 0 0 var(--key), 30px 0 0 var(--key), 45px 0 0 var(--key), 60px 0 0 var(--key), 75px 0 0 var(--key), 90px 2px 0 var(--key), 22px 10px 0 var(--key), 37px 10px 0 var(--key), 52px 10px 0 var(--key), 60px 10px 0 var(--key), 68px 10px 0 var(--key), 83px 10px 0 var(--key);
+  }
+
+  54% {
+    box-shadow: 15px 0 0 var(--key), 30px 2px 0 var(--key), 45px 0 0 var(--key), 60px 0 0 var(--key), 75px 0 0 var(--key), 90px 0 0 var(--key), 22px 10px 0 var(--key), 37px 10px 0 var(--key), 52px 10px 0 var(--key), 60px 10px 0 var(--key), 68px 10px 0 var(--key), 83px 10px 0 var(--key);
+  }
+
+  63% {
+    box-shadow: 15px 0 0 var(--key), 30px 0 0 var(--key), 45px 0 0 var(--key), 60px 0 0 var(--key), 75px 0 0 var(--key), 90px 0 0 var(--key), 22px 10px 0 var(--key), 37px 10px 0 var(--key), 52px 10px 0 var(--key), 60px 10px 0 var(--key), 68px 10px 0 var(--key), 83px 12px 0 var(--key);
+  }
+
+  72% {
+    box-shadow: 15px 0 0 var(--key), 30px 0 0 var(--key), 45px 2px 0 var(--key), 60px 0 0 var(--key), 75px 0 0 var(--key), 90px 0 0 var(--key), 22px 10px 0 var(--key), 37px 10px 0 var(--key), 52px 10px 0 var(--key), 60px 10px 0 var(--key), 68px 10px 0 var(--key), 83px 10px 0 var(--key);
+  }
+
+  81% {
+    box-shadow: 15px 0 0 var(--key), 30px 0 0 var(--key), 45px 0 0 var(--key), 60px 0 0 var(--key), 75px 0 0 var(--key), 90px 0 0 var(--key), 22px 10px 0 var(--key), 37px 12px 0 var(--key), 52px 10px 0 var(--key), 60px 10px 0 var(--key), 68px 10px 0 var(--key), 83px 10px 0 var(--key);
+  }
+}
+</style>
--- a/src/api/auth.ts
+++ b/src/api/auth.ts
@ -0,0 +1,17 @@
+import axios from '@/composable/useAxios'
+import type { Login } from '@/model/login'
+import type { User } from '@/model/user'
+
+export const loginWithPass = async (payload: Login) => {
+  return await axios.post('/auth/login', payload)
+}
+
+export const loginWithSMS = async (payload:Login) => {
+  return await axios.post<any>('/auth/login',  payload)
+}
+
+export const registerCustomer = async (obj: User) => await axios.post<User>(`/auth/register`, obj)
+
+export async function verifyToken(id: any,token:string){
+  return await axios.post<any>('/auth/verify',{provider: "customer",token,id})
+}
--- a/src/api/credit.ts
+++ b/src/api/credit.ts
@ -0,0 +1,20 @@
+import axios from '@/composable/useAxios'
+import type { Package } from '@/model/package'
+import type { Credit } from '@/model/credit'
+import { useUserStore } from '@/store/user'
+
+const store = useUserStore()
+// export const getCreditList = async () => await axios.get<Credit[]>(`customer/product/credit`)
+export const getMyCredit = async () => await axios.get<Credit[]>(`customer/credit/${store.user?.id}`)
+
+export const createCredit = async (obj?: Credit[]): Promise<any> => {
+  return await axios.post<Credit[]>(`/customer/credit`, obj)
+}
+
+export const updateCredit = async (id:number,obj?: Credit[]): Promise<any> => {
+  return await axios.put<Credit[]>(`/customer/credit/${id}`, obj)
+}
+
+export const getOneCredit = async (id:number): Promise<any> => {
+  return await axios.get<Credit[]>(`/customer/credit/${id}`)
+}
--- a/src/api/message.ts
+++ b/src/api/message.ts
@ -0,0 +1,7 @@
+import axios from '@/composable/useAxios'
+import type { TableInput, TableOutput } from '@/model/table'
+import type { Order } from '@/model/order'
+
+export const getMessages = async (tbl: TableInput): Promise<TableOutput<Message>> => {
+  return await axios.get<TableOutput<Message>>(`/customer/messageNotification/getCustomerMessages`, tbl)
+}
--- a/src/api/order.ts
+++ b/src/api/order.ts
@ -0,0 +1,25 @@
+import axios from '@/composable/useAxios'
+import type { Check, Order } from '@/model/order'
+import type { TableInput, TableOutput } from '@/model/table'
+import type { Transaction } from '@/model/transaction'
+
+
+export const createOrder = async (payload: Order) => {
+  return await axios.post('customer/order', payload)
+}
+
+export const orderTable = async (tbl: TableInput): Promise<TableOutput<Order>> => {
+  return await axios.post<TableOutput<Order>>(`/customer/order/table`, tbl)
+}
+
+export const checkOrder = async () => {
+  return await axios.get<Check>(`/customer/order/check`)
+}
+
+export const confirmOrderApi = async (id?: number) => {
+  return await axios.get(`/customer/order/verify/${id}`)
+}
+
+export const rejectOrderApi = async (id?: number) => {
+  return await axios.get(`/customer/order/cancel/${id}`)
+}
--- a/src/api/package.ts
+++ b/src/api/package.ts
@ -0,0 +1,27 @@
+import axios from '@/composable/useAxios'
+import type {TableInput, TableOutput} from "@/model/table.ts";
+import type {Package} from "@/model/package.ts";
+import type {CustomerSetting} from "@/model/login.ts";
+
+
+export const getPackages = async (tbl: TableInput): Promise<TableOutput<Package>> => {
+  return await axios.post<TableOutput<Package>>(`/customer/package/table`, tbl)
+}
+
+export const createPackage = async (obj: Package): Promise<any> => {
+  return await axios.post<Package>(`/customer/agent/customer_setting`, obj)
+}
+
+export const updatePackage = async (id?: number,obj?: Package): Promise<any> => {
+  return await axios.put<Package>(`/customer/agent/customer_setting/${id}`, obj)
+}
+
+export const getPackageList = async () => await axios.get<Package[]>(`/customer/package/list`)
+
+export const getOnePackage = async (id?: number) => await axios.get<Package>(`/customer/agent/customer_setting/${id}`)
+
+export const getBasePackage = async (id?: number) => await axios.get<Package>(`/customer/package/${id}`)
+
+export const getCustomerSetting = async () => await axios.get<CustomerSetting[]>(`/customer/agent/customer_setting`)
+
+export const getGroupType = async () => await axios.get<CustomerSetting[]>(`/site/customer_cat`)
--- a/src/api/product.ts
+++ b/src/api/product.ts
@ -0,0 +1,14 @@
+import axios from '@/composable/useAxios'
+import type { TableInput, TableOutput } from '@/model/table'
+import type { Product } from '@/model/product'
+import type { Credit } from '@/model/credit'
+
+export const productTable = async (tbl: TableInput): Promise<TableOutput<Product>> => {
+  return await axios.post<TableOutput<Product>>(`/customer/product/table`, tbl)
+}
+
+export const getProductsList = async (): Promise<Product[]> => {
+  return await axios.get<Product[]>(`/customer/product/list`)
+}
+
+export const getProductCreditList = async () => await axios.get<Credit[]>(`/customer/product/credit`)
--- a/src/api/transaction.ts
+++ b/src/api/transaction.ts
@ -0,0 +1,24 @@
+import type {TableInput, TableOutput, TableOutputAccounting} from '@/model/table'
+import type { Product } from '@/model/product'
+import axios from '@/composable/useAxios'
+import type { Transaction } from '@/model/transaction'
+import type { Accounting, Accounting_ } from '@/model/accounting'
+
+export const transactionTable = async (tbl: TableInput): Promise<TableOutput<Transaction>> => {
+  return await axios.post<TableOutput<Transaction>>(`/customer/transaction/table/me`, tbl)
+}
+
+export const accountingTable = async () => {
+  return await axios.get<TableOutputAccounting<Accounting>>(`/customer/fin_tahesab/table`)
+}
+
+export const accountingDetail = async (factor_code?:number) => {
+  return await axios.get<TableOutputAccounting<Accounting>>(`/customer/fin_tahesab/detail/${factor_code}`)
+}
+export const accountingDetailList = async (offset?:number) => {
+  return await axios.get<TableOutputAccounting<Accounting>>(`/customer/fin_tahesab/my_detail/${offset}`)
+}
+
+export const dateAccountingTable = async (startDate: string, endDate: string) => {
+  return await axios.post<TableOutputAccounting<Accounting_>>(`/customer/fin_tahesab/table`, {startDate, endDate})
+}
--- a/src/api/transfer.ts
+++ b/src/api/transfer.ts
@ -0,0 +1,24 @@
+import type { Order } from '@/model/order'
+import axios from '@/composable/useAxios'
+import type { Transfer ,Withdraw } from '@/model/transfer'
+import type { TableInput, TableOutput } from '@/model/table'
+
+export const createTransfer = async (payload: Transfer) => {
+  return await axios.post('customer/havaleh', payload)
+}
+export const createWithdraw = async (payload: Withdraw) => {
+  return await axios.post('customer/fin', payload)
+}
+
+export const updateTransfer = async (id: number, payload: Transfer) => {
+  return await axios.put(`customer/havaleh/${id}`, payload)
+}
+
+
+export const transferTable = async (tbl: TableInput): Promise<TableOutput<Transfer>> => {
+  return await axios.post<TableOutput<Transfer>>(`/customer/havaleh/table`, tbl)
+}
+
+export const withdrawTable = async (tbl: TableInput): Promise<TableOutput<Transfer>> => {
+  return await axios.post<TableOutput<Transfer>>(`/customer/fin/table`, tbl)
+}
--- a/src/api/user.ts
+++ b/src/api/user.ts
@ -0,0 +1,35 @@
+import axios from '@/composable/useAxios'
+import type { User } from '@/model/user'
+import type { TableInput, TableOutput } from '@/model/table'
+import type { Order } from '@/model/order'
+
+
+export const getUsers = async (tbl: TableInput): Promise<TableOutput<User>> => {
+  return await axios.post<TableOutput<User>>(`/customer/customer/table`, tbl)
+}
+
+export const getMe = async () => {
+  return await axios.get('/customer/me')
+}
+
+export const updateMe = async (payload: User) => {
+  return await axios.post<User>('/customer/me/update', payload)
+}
+
+export const createUser = async (payload: User) => {
+  return await axios.post('/customer/customer', payload)
+}
+
+export const updateUser = async (id: number, payload: User) => {
+  return await axios.put(`/customer/customer/${id}`, payload)
+}
+
+export const getUserById = async (id: number) => {
+  return await axios.get(`/customer/customer/${id}`)
+}
+
+export const getUserTable = async () => {
+  return await axios.post('/customer/customer/table')
+}
+
+export const getUsersList = async () => await axios.get<User[]>(`/customer/customer/list`)
--- a/src/api/wallet.ts
+++ b/src/api/wallet.ts
@ -0,0 +1,14 @@
+import type { TableInput, TableOutput } from '@/model/table'
+import axios from '@/composable/useAxios'
+import type { Wallet } from '@/model/wallet'
+
+export const walletTable = async (tbl: TableInput): Promise<TableOutput<Wallet>> => {
+  return await axios.post<TableOutput<Wallet>>(`/customer/wallet/table`, tbl)
+}
+
+// export const walletList = async (): Promise<Wallet[]> => {
+//   return await axios.get<Wallet[]>(`/customer/wallet/list`)
+// }
+export const walletList = async (): Promise<[]> => {
+  return await axios.get<[]>(`/customer/fin_tahesab/mandeh`)
+}
--- a/src/assets/css/ant.less
+++ b/src/assets/css/ant.less
@ -0,0 +1,4 @@
+.ant-modal-content {
+  padding: 16px !important;
+}
+
--- a/src/assets/css/fonts.less
+++ b/src/assets/css/fonts.less
@ -0,0 +1,55 @@
+@import (less) './var.less';
+
+@font-face {
+  font-family: @prefixCls-font-family;
+  //src: url('../fonts/iranSans/woff2/IRANSansWeb(FaNum).woff2') format('woff2');
+
+  src: url('../fonts/Modam SemiPro/02 - Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-Regular.woff2') format('woff2');
+  font-weight: normal;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: @prefixCls-font-family;
+  //src: url('../fonts/iranSans/woff2/IRANSansWeb(FaNum)_Light.woff2') format('woff2');
+
+  src: url('../fonts/Modam SemiPro/02 - Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-Light.woff2') format('woff2');
+  font-weight: 100;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: @prefixCls-font-family;
+  //src: url('../fonts/iranSans/woff2/IRANSansWeb(FaNum)_UltraLight.woff2') format('woff2');
+
+  src: url('../fonts/Modam SemiPro/02 - Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-LightCondensed.woff2') format('woff2');
+  font-weight: 300;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: @prefixCls-font-family;
+  src: url('../fonts/iranSans/woff2/IRANSansWeb(FaNum)_Medium.woff2') format('woff2');
+
+  src: url('../fonts/Modam SemiPro/02 - Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-RegularCondensed.woff2') format('woff2');
+  font-weight: 500;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: @prefixCls-font-family;
+  //src: url('../fonts/iranSans/woff2/IRANSansWeb(FaNum)_Bold.woff2') format('woff');
+
+  src: url('../fonts/Modam SemiPro/02 - Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-Bold.woff2') format('woff2');
+  font-weight: 700;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: @prefixCls-font-family;
+  //src: url('../fonts/iranSans/woff2/IRANSansWeb(FaNum)_Black.woff2') format('woff');
+
+  src: url('../fonts/Modam SemiPro/02 - Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-Black.woff2') format('woff2');
+  font-weight: 900;
+  font-style: normal;
+}
--- a/src/assets/css/main.less
+++ b/src/assets/css/main.less
@ -0,0 +1,58 @@
+@import (less) './var.less';
+@import (less) './fonts.less';
+@import (less) './ant.less';
+@import (less) './scroll.less';
+@import (less) 'pargar.less';
+
+html {
+  scroll-behavior: smooth;
+}
+
+body {
+  font-family: @prefixCls-font-family !important;
+  background-color: @prefixCls-background-color-mobile;
+  direction: rtl !important;
+  height: unset !important;
+}
+
+@media (min-width: 768px) {
+  body {
+    background-color: @prefixCls-background-color;
+  }
+}
+
+pre, .ant-btn, span, label, input, div {
+  font-family: @prefixCls-font-family !important;
+}
+
+.en-font {
+  font-family: Arial !important;
+  direction: rtl !important;
+}
+
+.ant-form .ant-form-item .ant-form-item-label, .ant-form .ant-form-item .ant-form-item-control {
+  flex: 0 0 100%;
+  max-width: 100%;
+}
+
+.ant-form-item .ant-form-item-label {
+  margin: 0;
+  padding: 0 0 8px;
+  white-space: initial;
+  text-align: start;
+}
+
+.ant-modal .ant-modal-footer {
+  margin-top: 0;
+}
+
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.3s ease;
+}
+
+.fade-enter-from,
+.fade-leave-to {
+  opacity: 0;
+}
+
--- a/src/assets/css/pargar.less
+++ b/src/assets/css/pargar.less
@ -0,0 +1,761 @@
+body.pargar {
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  background: #FFD86DFF;
+  color: rgba(47, 47, 47, 0.8);
+  overflow: hidden;
+}
+@media (min-width: 425px) {
+  body.pargar {
+    max-width: 425px !important;
+    justify-self: center;
+  }
+}
+html {
+  background: #000000;
+}
+body.pargar .icon {
+  fill: rgba(226, 177, 43, 1);
+  stroke: rgba(226, 177, 43, 1);
+}
+body.pargar .bottom-rectangle {
+  background: white;
+  position: fixed;
+  bottom: 0;
+  max-width: 425px;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  padding: 1rem;
+}
+body.pargar .bottom-yellow-rectangle {
+  background: #FFD86DFF;
+  max-width: 425px;
+  width: 100%;
+  justify-self: center;
+  z-index: 1;
+  position: fixed;
+  top: 48rem;
+  bottom: 0;
+  right: 0;
+  left: 0;
+  box-shadow: 0px -4px 43px -14px rgba(255, 196, 32, 1);
+}
+
+body.pargar .middle-white-rectangle {
+  background: #ffffff;
+  z-index: -1;
+  max-width: 425px;
+  width: 100%;
+  justify-self: center;
+  position: fixed;
+  top: 13rem;
+  bottom: 0;
+  right: 0;
+  left: 0;
+}
+body.pargar .pargar-logo {
+  background: #ffffff;
+  justify-self: center;
+  margin-top: 4rem;
+  z-index: 1;
+}
+
+body.pargar .continueButton {
+  font-size: 20px;
+  padding-left: 2rem;
+  padding-right: 2rem;
+  background: rgba(255, 216, 109, 1);
+  box-shadow: 0px 0px 18.1px -3px rgba(0, 0, 0, 0.25);
+  border-top-left-radius: 50px;
+  border-bottom-left-radius: 50px;
+  border-top-right-radius: 50px;
+  border-bottom-right-radius: 50px;
+}
+body.pargar .card{
+  color: #ffffff;
+  border-radius: 15px;
+  border: 1px solid #FFBF65;
+  box-shadow: 0px 4px 4px 1px rgba(0, 0, 0, 0.55);
+  background: linear-gradient(
+          rgba(217, 217, 217, 0.07),
+          rgba(217, 217, 217, 0.07)
+  ), #1A1A1A;
+}
+@media (min-width: 769px) {
+  .ant-menu-light {
+    background: #191919;
+    border-radius: 20px;
+  }
+}
+body.pargar .menuBorder{
+  position: relative;
+  border: 1px solid #FFBF65;
+  border-radius: 20px;
+  z-index: 3;
+}
+body.pargar .navbar{
+  border: 1px solid rgba(47, 47, 47, 1);
+  border-radius: 50px;
+  background: none;
+  width: 12rem;
+  margin-top: 4.5rem;
+  z-index: 4;
+}
+
+body.pargar .input-1{
+  border: 1px solid rgba(85, 85, 85, 0.5);
+  border-radius: 50px;
+  z-index: 5;
+  height: 3rem;
+  padding: 1rem;
+  align-items: center;
+  background: linear-gradient(180deg, rgba(153, 130, 65, 0.02) 0%, rgba(179, 151, 76, 0.03) 25%, rgba(204, 173, 87, 0.05) 50%, rgba(242, 205, 104, 0.07) 87.5%, rgba(255, 216, 109, 0.1) 100%);
+}
+
+body.pargar .input-2{
+  border: 1px solid rgba(85, 85, 85, 0.5);
+  border-top-left-radius: 50px;
+  border-bottom-left-radius: 50px;
+  border-top-right-radius: 10px;
+  border-bottom-right-radius: 10px;
+  z-index: 5;
+  height: 3rem;
+  padding: 1rem;
+  align-items: center;
+  background: linear-gradient(180deg, rgba(153, 130, 65, 0.02) 0%, rgba(179, 151, 76, 0.03) 25%, rgba(204, 173, 87, 0.05) 50%, rgba(242, 205, 104, 0.07) 87.5%, rgba(255, 216, 109, 0.1) 100%);
+}
+
+body.pargar .line-2 {
+  width: 12px;
+  height: 40px;
+  background-color: rgba(255, 196, 32, 1);
+  box-shadow: 2px 0px 8px rgba(149, 109, 0, 0.6);
+  position: absolute;
+  top: 50%;
+  right: 0;
+  transform: translate(50%, -50%);
+  border-radius: 2rem 0 0 2rem;
+}
+
+body.pargar .input-3 {
+  border: 1px solid rgba(85, 85, 85, 0.5);
+  border-radius: 50px;
+  z-index: 5;
+  width: 100%;
+  height: 3rem;
+  padding: 1rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: linear-gradient(
+          180deg,
+          rgba(153, 130, 65, 0.02) 0%,
+          rgba(179, 151, 76, 0.03) 25%,
+          rgba(204, 173, 87, 0.05) 50%,
+          rgba(242, 205, 104, 0.07) 87.5%,
+          rgba(255, 216, 109, 0.1) 100%
+  );
+  position: relative;
+}
+.line-3 {
+  width: 70px;
+  height: 6px;
+  background-color: rgba(255, 196, 32, 1);
+  box-shadow: 0px 2px 8px rgba(149, 109, 0, 0.6);
+  position: absolute;
+  top: 2px;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  border-radius: 0 0 999px 999px;
+}
+
+.dot-line {
+  display: flex;
+  align-items: center;
+}
+.dot {
+  width: 4px;
+  height: 4px;
+  background-color: rgba(255, 196, 32, 1);
+  border-radius: 50%;
+}
+.line-1 {
+  width: 60px;
+  height: 1px;
+  background-color: rgba(255, 196, 32, 1);
+}
+.line-2 {
+  width: 60px;
+  flex-grow: 1;
+  justify-self: center;
+  height: 5px;
+  background-color: rgba(255, 196, 32, 1);
+}
+body.pargar .orderCard{
+  color: #ffffff;
+  border-radius: 15px;
+  margin-top: 1rem;
+  border: 1px solid #FFBF65;
+  width: 350px;
+  box-shadow: 0px 4px 4px 1px rgba(0, 0, 0, 0.55);
+  background: linear-gradient(
+          rgba(207, 207, 207, 0.07),
+          rgba(207, 207, 207, 0.07)
+  ), #1A1A1A;
+}
+
+body.pargar .ant-input{
+  border: none;
+  box-shadow: 0px 4px 20px -4px rgba(0, 0, 0, 0.25);
+}
+body.pargar .ant-input-focused{
+  border: none;
+}
+
+body.pargar .ant-input-group-addon{
+  border: 1px solid #FFBF65;
+  font-size: 16px;
+  color: #ffffff;
+}
+body.pargar .ant-form-item .ant-form-item-label >label {
+  color: #7F7F7F ;
+}
+body.pargar .BuySell_submitButton{
+  background: linear-gradient(
+          to right,
+          rgb(151, 113, 60),
+          rgb(253, 189, 100)
+  );
+  border: none;
+  color: #ffffff ;
+  font-size: 21px;
+  height: 47px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  border-top-left-radius: 12px;
+  border-top-right-radius: 12px;
+  border-bottom-right-radius: 12px;
+  border-bottom-left-radius: 3px;
+}
+body.pargar .BuySell_cancelButton{
+  border: 1px solid #FFBF65 !important;
+  background: none !important;
+  color: #ffffff ;
+  font-size: 16px;
+  height: 47px;
+
+  border-top-left-radius: 12px;
+  border-top-right-radius: 12px;
+  border-bottom-right-radius: 3px;
+  border-bottom-left-radius: 12px;
+}
+//body.pargar .ant-btn-default{
+//  color: #ffffff;
+//  background: linear-gradient(
+//          rgb(189, 143, 78),
+//          rgb(115, 89, 52)
+//  ), #1A1A1A;
+//  border: none;
+//}
+body.pargar .ant-btn-default:not(:disabled):hover{
+  background: none;
+  border: none;
+  background: #FFD86DFF;
+  color: rgba(47, 47, 47, 0.8);
+}
+body.pargar .property-segmented {
+  border: 1px solid #FFBF65;
+  font-size: 16px;
+  background: linear-gradient(
+          rgba(207, 207, 207, 0.07),
+          rgba(207, 207, 207, 0.07)
+  ), #1A1A1A;
+  width: 20rem;
+  height: 46px;
+  border-radius: 12px;
+  align-items: center;
+  color: #FFBF65;
+}
+body.pargar .tarazCard {
+  position: relative;
+  color: #ffffff;
+  border-radius: 15px;
+  width: 350px;
+  justify-self: center;
+  border: 1px solid #FFBF65;
+  align-content: center;
+  box-shadow: 0px 4px 4px 1px rgba(0, 0, 0, 0.55);
+  background: linear-gradient(
+          rgba(207, 207, 207, 0.07),
+          rgba(207, 207, 207, 0.07)
+  ), #1A1A1A;
+}
+body.pargar .priceCard{
+  color: #ffffff;
+  border-radius: 15px;
+  margin-top: 1rem;
+  border: 1px solid #FFBF65;
+  height: 21vh;
+  box-shadow: 0px 4px 4px 1px rgba(0, 0, 0, 0.55);
+  background: linear-gradient(
+          rgba(207, 207, 207, 0.07),
+          rgba(207, 207, 207, 0.07)
+  ), #1A1A1A;
+}
+body.pargar .buyCard{
+  color: #ffffff;
+  width: 160px;
+  height: 2.5rem;
+  font-size: 18px;
+  font-weight: bold;
+  border-radius: 8px;
+  border: 1px solid #FFBF65;
+  background: none;
+  align-content: center;
+}
+body.pargar .ant-input-affix-wrapper .anticon.ant-input-password-icon{
+  //color: #ffffff;
+}
+body.pargar .buyDifferent{
+  color: #ffffff;
+  width: 160px;
+  font-size: 18px;
+  border-radius: 8px;
+  border: 1px solid #FFBF65;
+  background: none;
+  align-content: center;
+}
+body.pargar .taraz-title {
+  position: absolute;
+  left: 50%;
+  top: -20px;
+  transform: translateX(-50%);
+  z-index: 1;
+  width: 115px;
+  height: 42px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 6px 12px;
+  border-radius: 12px;
+  background: #1A1A1A;
+  border: 1px solid #FFBF65;
+  color: #ffffff;
+  font-size: 20px;
+  box-shadow: 0 2px 4px rgba(255, 191, 101, 0.5);
+}
+body.pargar .accountDetail-datePicker{
+  border: 1px solid #FFBF65;
+  border-top-right-radius: 12px;
+  border-top-left-radius: 12px;
+  border-bottom-left-radius: 12px;
+  border-bottom-right-radius: 5px;
+  font-size: 15px;
+  width: 20rem;
+  justify-self: center;
+
+}
+body.pargar .accountDetail-datePicker .ant-picker{
+  background: none;
+  border: none;
+}
+body.pargar .ant-picker-dropdown .ant-picker-cell-in-view.ant-picker-cell-selected .ant-picker-cell-inner, :where(.css-dev-only-do-not-override-12oxb1q).ant-picker-dropdown .ant-picker-cell-in-view.ant-picker-cell-range-start .ant-picker-cell-inner, :where(.css-dev-only-do-not-override-12oxb1q).ant-picker-dropdown .ant-picker-cell-in-view.ant-picker-cell-range-end .ant-picker-cell-inner {
+  color: white;
+  background: #191919;
+}
+
+body.pargar .ant-picker-dropdown .ant-picker-cell-in-view.ant-picker-cell-today .ant-picker-cell-inner::before{
+  border: 1px solid #191919;
+}
+body.pargar .ant-picker-dropdown .ant-picker-today-btn{
+  color: #191919;
+}
+body.pargar .ant-picker-clear{
+  color: white;
+  background: #191919;
+}
+body.pargar .accountDetail-datePicker .ant-picker .ant-picker-input >input{
+  justify-items: center;
+  font-size: 20px;
+  font-weight: 200;
+  color: rgba(255, 255, 255, 0.2);
+}
+body.pargar .submitDate{
+  border: none;
+  color: #ffffff ;
+  font-size: 15px;
+
+  border-top-left-radius: 8px;
+  border-top-right-radius: 2px;
+  border-bottom-right-radius: 8px;
+  border-bottom-left-radius:  2px;
+}
+body.pargar .getPDF{
+  border: none;
+  color: #ffffff ;
+  font-size: 15px;
+  //height: 47px;
+
+  border-top-left-radius: 8px;
+  border-top-right-radius: 8px;
+  border-bottom-right-radius: 2px;
+  border-bottom-left-radius: 8px;
+}
+body.pargar .accountingCard{
+  color: white;
+  background: none;
+  border: 1px solid #FFBF65;
+  border-radius: 12px;
+}
+body.pargar .orderSearchBox .ant-input{
+  background: none ;
+  border: none;
+  color: #FFFFFF99 ;
+}
+body.pargar .orderSearchBox input::placeholder {
+  color: white;
+}
+body.pargar .orderSearchBox .ant-input-affix-wrapper{
+  background: none;
+  border: 1px solid #FFBF65;
+  border-radius: 12px;
+  height: 46px;
+  width: 20rem;
+}
+body.pargar .searchIcon{
+  stroke: #FFBF65 ;
+}
+body.pargar .backUserSetting1 {
+  background: #FFBF65;
+  border: #FFBF65;
+}
+body.pargar .backUserSetting2 {
+  background-color: #000000;
+  border-color: #e5e7eb ;
+}
+body.pargar .users-title {
+  background: linear-gradient(
+          rgba(217, 217, 217, 0.07),
+          rgba(217, 217, 217, 0.07)
+  ), #1A1A1A;
+  border: 1px solid #FFBF65;
+  border-radius: 12px;
+  width: 20rem;
+  height: 46px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 20px;
+}
+.float-btn-wrapper {
+  position: fixed;
+  width: 100%;
+  max-width: 425px;
+  bottom: 0;
+  top: 0;
+}
+.float-btn {
+  position: absolute;
+  right: 2rem;
+  bottom: 9rem;
+  pointer-events: auto;
+}
+
+.custom-float-btn {
+  position: absolute !important;
+  right: 24px;
+  bottom: 130px;
+}
+body.pargar .ant-float-btn-body {
+  background: #FFBF65;
+  border-radius: 15px;
+  height: 50px;
+  width: 50px;
+}
+body.pargar .ant-float-btn-default .ant-float-btn-body:hover{
+  background-color: #FFBF65;
+}
+
+body.pargar .packageDrawer{
+  background: rgba(18, 18, 18, 0.13);
+  backdrop-filter: blur(8px);
+  border-top-left-radius: 15px;
+  border-top-right-radius: 15px;
+  border: 1px solid #FFBF65;
+  max-width: 425px;
+  justify-self: anchor-center;
+}
+body.pargar .user_submitButton{
+  background: linear-gradient(
+          to right,
+          rgb(151, 113, 60),
+          rgb(253, 189, 100)
+  );
+  border-radius: 12px;
+  color: white;
+  height: 41px;
+  font-weight: 700;
+  font-size: 20px;
+}
+body.pargar .van-action-sheet__header{
+  color: white;
+}
+body.pargar .ant-form-item .ant-form-item-label > label{
+  color: white;
+}
+body.pargar .ant-input-affix-wrapper{
+  background: #191919;
+  border: 1px solid #FFBF65;
+}
+body.pargar .userCard{
+  width: 350px;
+  background: rgba(217, 217, 217, 0.07);
+  border: 1px solid #FFBF65;
+  border-radius: 15px;
+  box-shadow: 0px 0px 7px 4px rgba(0, 0, 0, 0.55);
+  align-self: center;
+}
+body.pargar .iconUserSetting {
+  stroke: #FFBF65 ;
+  fill: #FFBF65 ;
+}
+body.pargar .userSettingDrawer {
+  backdrop-filter: blur(3px);
+  border-top-left-radius: 15px;
+  border-bottom-left-radius: 15px;
+  border: 1px solid #FFBF65;
+  margin-left: auto;
+}
+
+body.pargar .birthDate.ant-picker{
+  background: #191919 !important;
+  border: 2px solid #FFBF65;
+}
+body.pargar .submitButton-userSetting {
+  font-size: 21px;
+
+  border: none;
+  background: linear-gradient(
+          to right,
+          rgb(151, 113, 60),
+          rgb(253, 189, 100)
+  );
+  color: #ffffff ;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  border-top-left-radius: 8px;
+  border-top-right-radius: 8px;
+  border-bottom-right-radius: 8px;
+  border-bottom-left-radius: 8px;
+}
+body.pargar .cancelButton-userSetting {
+  background: none;
+  border: 1px solid #FFBF65;
+  color: #ffffff ;
+  font-size: 16px;
+
+  border-top-left-radius: 8px;
+  border-top-right-radius: 8px;
+  border-bottom-right-radius: 8px;
+  border-bottom-left-radius: 8px;
+}
+body.pargar .package_submitButton{
+  background: linear-gradient(
+          to right,
+          rgb(151, 113, 60),
+          rgb(253, 189, 100)
+  );
+  border-radius: 12px;
+  color: white;
+  height: 41px;
+  font-weight: 700;
+  font-size: 25px;
+}
+body.pargar .mobile-navbar {
+  border: 1px solid #FFBF65;
+  font-size: 16px;
+  background: linear-gradient(
+          rgba(207, 207, 207, 0.07),
+          rgba(207, 207, 207, 0.07)
+  ), #1A1A1A;
+  width: 20rem;
+  height: 46px;
+  border-radius: 12px;
+  align-items: center;
+  color: #ffffff;
+}
+body.pargar .ant-modal-content{
+  background: rgba(18, 18, 18, 0.13);
+  backdrop-filter: blur(8px);
+  border-top-left-radius: 15px;
+  border-top-right-radius: 15px;
+  border-bottom-left-radius: 15px;
+  border-bottom-right-radius: 15px;
+  border: 1px solid #FFBF65;
+}
+body.pargar .ant-modal-close-x{
+  color: white;
+}
+body.pargar .userSettingDropDown{
+  color: white;
+  background: rgba(18, 18, 18, 0.71);
+  backdrop-filter: blur(8px);
+  border-radius: 45px;
+  border: 1px solid #FFBF65;
+}
+body.pargar .ant-modal-confirm .ant-modal-confirm-body .ant-modal-confirm-title {
+  color: #ffffff;
+}
+body.pargar .customInput .ant-input{
+  border: none;
+}
+body.pargar .ant-input:hover{
+  border: none;
+}
+body.pargar .ant-radio-wrapper{
+  color: #ffffff;
+}
+body.pargar .ant-radio-wrapper .ant-radio-checked .ant-radio-inner {
+    background:#E3C27BFF;
+    border-color:#E3C27BFF;
+}
+body.pargar .ant-select-selector, .ant-tooltip-open, .ant-select-selection-item, .ant-select-item .ant-select-item-option {
+  color: white;
+}
+body.pargar .ant-select:not(.ant-select-customize-input) .ant-select-selector {
+  position: relative;
+  background-color: #191919;
+}
+body.pargar .ant-select:not(.ant-select-customize-input) .ant-select-selector {
+  background-color: #191919;
+}
+body.pargar .ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer):hover .ant-select-selector {
+  border-color: #E3C27BFF;
+}
+body.pargar .buttonLogin {
+  background-color: #E3C27BFF ;
+  color: #ffffff ;
+}
+body.pargar .updateModal .ant-modal-content {
+  background: rgb(18, 18, 18);
+  border-radius: 20px;
+  border: 1px solid #FFBF65;
+}
+body.pargar .ant-input::placeholder {
+  color: #ffffff !important;
+}
+body.pargar .ant-input-lg {
+  font-size: 14px;
+}
+body.pargar .hide-scrollbar {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+body.pargar .hide-scrollbar::-webkit-scrollbar {
+  display: none;
+}
+body.pargar .mobileInput {
+  font-size: 18px;
+  padding: 1rem;
+  margin-top: 2rem;
+  border-top-left-radius: 146px;
+  border-bottom-left-radius: 146px;
+  border-top-right-radius: 146px;
+  border-bottom-right-radius: 146px;
+}
+body.pargar .continueButton3 {
+  font-size: 20px;
+  margin-top: 4px;
+  border: none;
+  background: linear-gradient(
+          to right,
+          rgb(153, 114, 60) 10%,
+          rgb(255, 191, 101) 90%
+  );
+
+  border-top-left-radius: 12px;
+  border-bottom-left-radius: 12px;
+  border-top-right-radius: 12px;
+  border-bottom-right-radius: 12px;
+}
+body.pargar .getSmsCodeButton {
+  //font-size: 15px;
+  border: none;
+  background: linear-gradient(
+          to right,
+          rgb(153, 114, 60) 10%,
+          rgb(255, 191, 101) 90%
+  );
+
+  border-top-left-radius: 10px;
+  border-bottom-left-radius: 10px;
+  border-top-right-radius: 10px;
+  border-bottom-right-radius: 3px;
+}
+body.pargar .getAgainSmsCodeButton {
+  font-size: 15px;
+  color: white;
+  align-self: center;
+  background: none;
+  border: 1px solid #FFBF65;
+
+  border-top-left-radius: 30px;
+  border-bottom-left-radius: 30px;
+  border-top-right-radius: 30px;
+  border-bottom-right-radius: 30px;
+}
+body.pargar .getAgainSmsCodeButton.ant-btn-dashed:not(:disabled):hover {
+  color: #FFBF65;
+  border: 1px solid #FFBF65;
+}
+body.pargar input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active{
+  box-shadow: none;
+}
+body.pargar .ant-input-affix-wrapper:not(.ant-input-affix-wrapper-disabled):hover{
+  border: 1px solid #FFBF65;
+  color: black;
+}
+body.pargar .input-internal-autofill-selected {
+  background: none;
+}
+body.pargar .van-dialog {
+  background: black;
+  backdrop-filter: blur(8px);
+  border: 1px solid #FFBF65;
+}
+body.pargar .main-body {
+  position: absolute;
+  inset: 0;
+  pointer-events: none;
+  z-index: 0;
+  max-width: 425px;
+  width: 100%;
+  margin: 0 auto;
+}
+.vector {
+  max-width: 100%;
+  height: auto;
+}
+body.pargar .loginInput.ant-input-affix-wrapper{
+  border: 1px solid #FFBF65;
+  background: linear-gradient(
+          rgba(217, 217, 217, 0.07),
+          rgba(217, 217, 217, 0.07)
+  ), #1A1A1A;
+  border-radius: 12px;
+}
+body.pargar .loginInput .ant-input{
+  border-radius: 12px;
+  font-size: 18px;
+  background: linear-gradient(
+          rgba(217, 217, 217, 0.07),
+          rgba(217, 217, 217, 0.07)
+  ), #1A1A1A;
+}
+
--- a/src/assets/css/scroll.less
+++ b/src/assets/css/scroll.less
@ -0,0 +1,145 @@
+//ok Code
+/*html {
+  overflow: scroll;
+  overflow-x: hidden;
+}*/
+
+.scroll-none{
+  &::-webkit-scrollbar {
+    width: 0; /* Remove scrollbar space */
+    background: transparent; /* Optional: just make scrollbar invisible */
+  }
+  /* Optional: show position indicator in red */
+  &::-webkit-scrollbar-thumb {
+    //background: #FF0000;
+  }
+}
+
+
+//scroll style
+
+::-webkit-scrollbar {
+  background-color: initial;
+  //background-color: red;
+}
+
+::-webkit-scrollbar {
+  width: 0.25rem !important;
+  height: 0.25rem !important;
+}
+
+::-webkit-scrollbar-thumb {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(203 213 225/var(--tw-bg-opacity))!important;
+  //background-color: #E2E8F0 !important;
+  //background-color:red;
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 0.25rem !important;
+}
+
+/*.scrollbar-track\:\!bg-slate-100::-webkit-scrollbar-track {
+  --tw-bg-opacity: 1!important;
+//  background-color: rgb(241 245 249/var(--tw-bg-opacity))!important;
+ // background-color: green
+}*/
+
+::-webkit-scrollbar-track {
+  border-radius: 0.25rem!important;
+}
+
+
+
+
+
+
+
+
+/*
+.beauty-scroll{
+  scrollbar-color: red green;
+  scrollbar-width: thin;
+  -ms-overflow-style:none;
+  position: relative;
+  &::-webkit-scrollbar{
+    width: 3px;
+    height: 1px;
+  }
+  &::-webkit-scrollbar-thumb {
+    border-radius: 3px;
+    background: burlywood;
+  }
+  &::-webkit-scrollbar-track {
+    -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0);
+    border-radius: 3px;
+    background: aqua;
+  }
+}
+*/
+
+/*&::-webkit-scrollbar{
+  width: 3px;
+  height: 1px;
+}
+&::-webkit-scrollbar-thumb {
+  border-radius: 3px;
+  background: burlywood;
+}
+&::-webkit-scrollbar-track {
+  -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0);
+  border-radius: 3px;
+  background: aqua;
+}*/
+
+/* custom scrollbar */
+/*::-webkit-scrollbar {
+  width: 17px;
+}
+
+::-webkit-scrollbar-track {
+  background-color: transparent;
+}
+
+::-webkit-scrollbar-thumb {
+  background-color: #d6dee1;
+  border-radius: 20px;
+  border: 6px solid transparent;
+  background-clip: content-box;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background-color: #a8bbbf;
+}*/
+
+
+
+//ok Code
+/*
+html {
+  overflow: scroll;
+  overflow-x: hidden;
+}
+::-webkit-scrollbar {
+  width: 0;  !* Remove scrollbar space *!
+  background: transparent;  !* Optional: just make scrollbar invisible *!
+}
+!* Optional: show position indicator in red *!
+::-webkit-scrollbar-thumb {
+  //background: #FF0000;
+}
+*/
+
+
+//ok code
+/*html {
+  overflow: scroll;
+}
+::-webkit-scrollbar {
+  width: 0px;
+  background: transparent; !* make scrollbar transparent *!
+}*/
+
+
+
+
--- a/src/assets/css/var.less
+++ b/src/assets/css/var.less
@ -0,0 +1,15 @@
+@prefixCls: 'ab';
+@border-radius-base: 8px;
+@primary-color: #1d4ed8;
+// Border color
+@border-color-base: @gray-100; // base border outline a component
+// Form
+@form-item-label-font-size: 14px;
+//variables
+@prefixCls-font-family: 'ModamSemiPro';
+@prefixCls-background-color-mobile: #fafafa;
+@prefixCls-background-color: #fff;
+@gray-50: #f6f7f9;
+@gray-100: #e8eaee;
+
+
--- a/src/assets/fonts/Modam
+++ b/src/assets/fonts/Modam
--- a/src/assets/fonts/Modam
+++ b/src/assets/fonts/Modam
--- a/src/assets/fonts/Modam
+++ b/src/assets/fonts/Modam
--- a/Base/Modam-Regular.ttf
+++ b/Base/Modam-Regular.ttf
--- a/Condensed/Modam-BlackCondensed.ttf
+++ b/Condensed/Modam-BlackCondensed.ttf
--- a/Condensed/Modam-BoldCondensed.ttf
+++ b/Condensed/Modam-BoldCondensed.ttf
--- a/Condensed/Modam-LightCondensed.ttf
+++ b/Condensed/Modam-LightCondensed.ttf
--- a/Condensed/Modam-RegularCondensed.ttf
+++ b/Condensed/Modam-RegularCondensed.ttf
--- a/Fonts/WebFonts/Modam.html
+++ b/Fonts/WebFonts/Modam.html
@ -0,0 +1,71 @@
+<!doctype html>
+<html lang="fa">
+<head>
+<meta charset="utf-8">
+<title>Modam Family Type face: خانواده فونت مُدام</title>
+
+<meta name="fontiran.com:license" content="کد ۵ رقمی لایسنس">
+
+<link href="style.css" rel="stylesheet">
+</head>
+
+
+<body dir="rtl">
+<div class="wrapper">
+
+	<div class="box100">
+	<h1>شکل‌گیری تایپ‌فیس مُدام</h1>
+		<p>یکی از دغدغه‌های من، طراحی تایپ‌فیس‌هایی برای استفاده در فضای بازی‌های دیجیتال و مدیوم‌هایی در بستر وِب است. در پاییز ۱۳۹۹ که در کلاس‌های آنلاینِ طراحی تایپِ استادم دامون خانجانزاده شرکت کردم، این فکر و دغدغه‌ام را با ایشان در میان گذاشتم و ایشان بسیار استقبال کردند.</p>
+<p>
+از میان مباحث گسترده‌ی تئوری،‌ تجزیه و تحلیل‌های فرمی و بصری، تحلیل کانسپت، اتودهای فرمی و در نهایت اتودهای طراحی حروف،  این تایپ‌فیس ساخته شد که آن را «مُدام» نام نهادم. فرآیند مطالعات، تحقیق و طراحی این تایپ‌فیس و آنچه در این مسیر از جناب ایشان آموختم را به‌صورت مقاله‌ای جداگانه‌ای منتشر خواهم کرد.</p>
+	</div>
+
+	<div class="box300">
+	<h1>آشنایی با مُدام</h1>
+		<p>تایپ‌فیس «مُدام» دارای ساختاری ساده، اندامی استخوانی و فضاهای منفی باز است. این تایپ‌فیس به دلیل روحیه‌ی نمایشی و درجه‌ی بالای تناسبات هندسی آن، برای تیتر و متن‌های کوتاه و نیمه بلند مناسب است.</p>
+		<p>استارتاپ‌ها، طراحان و توسعه‌دهندگان بازی‌، وب و اپلیکیشن می‌توانند مهم‌ترین کاربران این تایپ‌فیس باشند.</p>
+	</div>
+
+	<div class="box400">
+	<h1>تنوع وزن</h1>
+		<p>مُدام دارای ۸ وزن از نازک تا تیره است که می‌تواند تمام نیازهای پروژه‌های طراحی گرافیک و هویت‌سازی را برطرف نماید.</p>
+	</div>
+
+	<div class="box500">
+	<h1>استایل فشرده</h1>
+		<p>از آنجایی که در اکثر بازی‌ها -در کنار خوانایی و خواندنی بودن نوشتار- نیاز به هیجان و انرژی همراه با تصویر در حروف نیز به چشم می‌خورد، همچنین محدودیت‌هایی که در نرم‌افزارها (باکس‌ها و دکمه‌ها) و یا ستون‌های صفحه‌آرایی وجود دارد، استایل فشرده‌ی این تایپ‌فیس نیز طراحی شد. برای فشرده‌سازی، تلاش شده است فرم حروف همچنان حفظ شود و این فشرده‌سازی در آنها اعوجاج ایجاد نکند. همچنین در این تغییر میزان فشردگی، ضخامتِ حروف نیز تا حد امکان ثابت مانده است؛ یعنی مثلاً ضخامتِ حروف در وزن رگولار با وزن رگولارِ فشرده یکسان است و فقط فرم حروف فشرده شده است.</p>
+	</div>
+
+	<div class="box600">
+	<h1>پشتیبانی از زبان عربی و انگلیسی</h1>
+		<p>یکی از امکاناتی که در تایپ‌فیس مُدام در نظر گرفته شده است، استفاده از  Tabular lining است. با فعال‌سازی این ویژگی در نرم‌افزارهای گرافیکی مانند ایلاستریتور و فوتوشاپ، می‌توانید بدون استفاده از جدول‌کشی، اعداد را به صورت زیرِ  هم بنویسید.</p>
+	</div>
+
+	<div class="box700">
+	<h1>اعداد جدول‌کشی‌شده!</h1>
+		<p>یکی از امکاناتی که در تایپ‌فیس مُدام در نظر گرفته شده است، استفاده از  Tabular lining است. با فعال‌سازی این ویژگی در نرم‌افزارهای گرافیکی مانند ایلاستریتور و فوتوشاپ، می‌توانید بدون استفاده از جدول‌کشی، اعداد را به صورت زیرِ  هم بنویسید.</p>
+	</div>
+
+	<div class="box800">
+	<h1>تاریخچه</h1>
+		<p>ایده‌ی اولیه‌ی قلم “پیدا” در سال ۱۳۹۸ شکل گرفت و در سال ۱۳۹۹ طراحی آن به اتمام رسید.</p>
+	</div>
+
+	<div class="box900">
+	<h1>دانلود رایگان فونت مُدام !</h1>
+		<p>دقت کنید که این فونت رایگان نیست. اگر وبسایت یا کانالی را مشاهده کردید که این فونت را با قیمت ارزان‌ترِ، با تخفیف یا رایگان عرضه کرده است آن را معرفی کنید تا پیگیری قانونی توسط فونت ‌ایران انجام شود.</p>
+	</div>
+	
+		<div class="box400">
+		
+		<h1>
+اعداد فارسی: ۱۲۳۴۵۶۷۸۹۰
+<br>
+اعداد عربی: ۱۲۳٤٥٦۷۸۹۰
+<br>
+اعداد انگلیسی: 1234567890
+		</h1>
+	</div>	
+</div>
+</body>
+</html>
--- a/Fonts/WebFonts/fontiran.css
+++ b/Fonts/WebFonts/fontiran.css
@ -0,0 +1,81 @@
+/**
+*
+*	Name:				Modam Fonts
+*	Version:			1.0
+*	Author:			Naser Khadem
+*	Created on:		April 22, 2023
+*	Updated on:		April 22, 2023
+*	Website:			http://fontiran.com
+*	Copyright:			Commercial/Proprietary Software
+--------------------------------------------------------------------------------------
+فونت مُدام یک نرم افزار مالکیتی محسوب می شود. جهت آگاهی از قوانین استفاده از این فونت ها لطفا به وب سایت (فونت ایران دات کام) مراجعه نمایید
+--------------------------------------------------------------------------------------
+Modam fonts are considered a proprietary software. To gain information about the laws regarding the use of these fonts, please visit www.fontiran.com 
+--------------------------------------------------------------------------------------
+This set of fonts are used in this project under the license: (.....)
+------------------------------------------------------------------------------------- fonts/-
+*	
+**/
+
+@font-face {
+	font-family: ModamWeb;
+	font-style: normal;
+	font-weight: 200;
+	src: url('fonts/woff2/ModamWeb-ExtraLight.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamWeb-ExtraLight.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamWeb;
+	font-style: normal;
+	font-weight: 300;
+	src: url('fonts/woff2/ModamWeb-Light.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamWeb-Light.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamWeb;
+	font-style: normal;
+	font-weight: normal;
+	src: url('fonts/woff2/ModamWeb-Regular.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamWeb-Regular.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamWeb;
+	font-style: normal;
+	font-weight: 500;
+	src: url('fonts/woff2/ModamWeb-Medium.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamWeb-Medium.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+@font-face {
+	font-family: ModamWeb;
+	font-style: normal;
+	font-weight: 600;
+	src: url('fonts/woff2/ModamWeb-Semibold.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamWeb-Semibold.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamWeb;
+	font-style: normal;
+	font-weight: bold;
+	src: url('fonts/woff2/ModamWeb-Bold.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamWeb-Bold.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamWeb;
+	font-style: normal;
+	font-weight: 800;
+	src: url('fonts/woff2/ModamWeb-ExtraBold.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamWeb-ExtraBold.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamWeb;
+	font-style: normal;
+	font-weight: 900;
+	src: url('fonts/woff2/ModamWeb-Black.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamWeb-Black.woff') format('woff')  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
--- a/Fonts/WebFonts/fonts/woff/ModamWeb-Black.woff
+++ b/Fonts/WebFonts/fonts/woff/ModamWeb-Black.woff
--- a/Fonts/WebFonts/fonts/woff/ModamWeb-BlackCondensed.woff
+++ b/Fonts/WebFonts/fonts/woff/ModamWeb-BlackCondensed.woff
--- a/Fonts/WebFonts/fonts/woff/ModamWeb-Bold.woff
+++ b/Fonts/WebFonts/fonts/woff/ModamWeb-Bold.woff
--- a/Fonts/WebFonts/fonts/woff/ModamWeb-BoldCondensed.woff
+++ b/Fonts/WebFonts/fonts/woff/ModamWeb-BoldCondensed.woff
--- a/Fonts/WebFonts/fonts/woff/ModamWeb-Light.woff
+++ b/Fonts/WebFonts/fonts/woff/ModamWeb-Light.woff
--- a/Fonts/WebFonts/fonts/woff/ModamWeb-LightCondensed.woff
+++ b/Fonts/WebFonts/fonts/woff/ModamWeb-LightCondensed.woff
--- a/Fonts/WebFonts/fonts/woff/ModamWeb-Regular.woff
+++ b/Fonts/WebFonts/fonts/woff/ModamWeb-Regular.woff
--- a/Fonts/WebFonts/fonts/woff/ModamWeb-RegularCondensed.woff
+++ b/Fonts/WebFonts/fonts/woff/ModamWeb-RegularCondensed.woff
--- a/Fonts/WebFonts/fonts/woff2/ModamWeb-Black.woff2
+++ b/Fonts/WebFonts/fonts/woff2/ModamWeb-Black.woff2
--- a/Fonts/WebFonts/fonts/woff2/ModamWeb-BlackCondensed.woff2
+++ b/Fonts/WebFonts/fonts/woff2/ModamWeb-BlackCondensed.woff2
--- a/Fonts/WebFonts/fonts/woff2/ModamWeb-Bold.woff2
+++ b/Fonts/WebFonts/fonts/woff2/ModamWeb-Bold.woff2
--- a/Fonts/WebFonts/fonts/woff2/ModamWeb-BoldCondensed.woff2
+++ b/Fonts/WebFonts/fonts/woff2/ModamWeb-BoldCondensed.woff2
--- a/Fonts/WebFonts/fonts/woff2/ModamWeb-Light.woff2
+++ b/Fonts/WebFonts/fonts/woff2/ModamWeb-Light.woff2
--- a/Fonts/WebFonts/fonts/woff2/ModamWeb-LightCondensed.woff2
+++ b/Fonts/WebFonts/fonts/woff2/ModamWeb-LightCondensed.woff2
--- a/Fonts/WebFonts/fonts/woff2/ModamWeb-Regular.woff2
+++ b/Fonts/WebFonts/fonts/woff2/ModamWeb-Regular.woff2
--- a/Fonts/WebFonts/fonts/woff2/ModamWeb-RegularCondensed.woff2
+++ b/Fonts/WebFonts/fonts/woff2/ModamWeb-RegularCondensed.woff2
--- a/Fonts/WebFonts/style.css
+++ b/Fonts/WebFonts/style.css
@ -0,0 +1,79 @@
+@import url(fontiran.css); /* لینک فایلی که وظیفه بارگذاری فونت ها را برعهده دارد */
+body {
+	font-family: ModamWeb !important;
+	direction: rtl;
+	background-color: #cdcdcd;
+	margin: 0;
+}
+
+h1, h2, h3, h4, h5, h6{
+	font-family: ModamWeb !important;
+}
+
+.wrapper {
+	max-width: 900px;
+	margin: 20px auto;
+	padding: 30px;
+	background-color: #fff;
+	border-radius: 15px;
+	box-shadow: 0 0 10px #aaa;
+}
+
+.box100 p, .box200 p, .box300 p, .box400 p, .box500 p, .box600 p, .box700 p, .box800 p, .box900 p{
+	font-size: 20px;
+	margin: 0;
+}
+
+.box100, .box100 h1 {
+    margin: 30px 0 0 0;
+	font-weight:100;
+	font-size: 25px;
+}
+
+.box200, .box200 h1 {
+    margin: 10px 0 0 0;
+	font-weight:200;
+	font-size: 25px;
+}
+
+.box300, .box300 h1 {
+    margin: 30px 0 0 0;
+	font-weight:300;
+	font-size: 25px;
+}
+
+.box400, .box400 h1 {
+    margin: 30px 0 0 0;
+	font-weight:400;
+	font-size: 25px;
+}
+
+.box500, .box500 h1 {
+    margin: 30px 0 0 0;
+	font-weight:500;
+	font-size: 25px;
+}
+
+.box600, .box600 h1 {
+    margin: 30px 0 0 0;
+	font-weight:600;
+	font-size: 25px;
+}
+
+.box700, .box700 h1 {
+    margin: 30px 0 0 0;
+	font-weight:700;
+	font-size: 25px;
+}
+
+.box800, .box800 h1 {
+    margin: 30px 0 0 0;
+	font-weight:800;
+	font-size: 25px;
+}
+
+.box900, .box900 h1 {
+    margin: 30px 0 0 0;
+	font-weight:900;
+	font-size: 25px;
+}
--- a/Base/ModamFaNum-Black.ttf
+++ b/Base/ModamFaNum-Black.ttf
--- a/Base/ModamFaNum-Bold.ttf
+++ b/Base/ModamFaNum-Bold.ttf
--- a/Base/ModamFaNum-Light.ttf
+++ b/Base/ModamFaNum-Light.ttf
--- a/Base/ModamFaNum-Regular.ttf
+++ b/Base/ModamFaNum-Regular.ttf
--- a/Condensed/ModamFaNum-BlackCondensed.ttf
+++ b/Condensed/ModamFaNum-BlackCondensed.ttf
--- a/Condensed/ModamFaNum-BoldCondensed.ttf
+++ b/Condensed/ModamFaNum-BoldCondensed.ttf
--- a/Condensed/ModamFaNum-LightCondensed.ttf
+++ b/Condensed/ModamFaNum-LightCondensed.ttf
--- a/Condensed/ModamFaNum-RegularCondensed.ttf
+++ b/Condensed/ModamFaNum-RegularCondensed.ttf
--- a/Farsi_Numerals/WebFonts/Modam.html
+++ b/Farsi_Numerals/WebFonts/Modam.html
@ -0,0 +1,71 @@
+<!doctype html>
+<html lang="fa">
+<head>
+<meta charset="utf-8">
+<title>Modam Family Type face: خانواده فونت مُدام</title>
+
+<meta name="fontiran.com:license" content="کد ۵ رقمی لایسنس">
+
+<link href="style.css" rel="stylesheet">
+</head>
+
+
+<body dir="rtl">
+<div class="wrapper">
+
+	<div class="box100">
+	<h1>شکل‌گیری تایپ‌فیس مُدام</h1>
+		<p>یکی از دغدغه‌های من، طراحی تایپ‌فیس‌هایی برای استفاده در فضای بازی‌های دیجیتال و مدیوم‌هایی در بستر وِب است. در پاییز ۱۳۹۹ که در کلاس‌های آنلاینِ طراحی تایپِ استادم دامون خانجانزاده شرکت کردم، این فکر و دغدغه‌ام را با ایشان در میان گذاشتم و ایشان بسیار استقبال کردند.</p>
+<p>
+از میان مباحث گسترده‌ی تئوری،‌ تجزیه و تحلیل‌های فرمی و بصری، تحلیل کانسپت، اتودهای فرمی و در نهایت اتودهای طراحی حروف،  این تایپ‌فیس ساخته شد که آن را «مُدام» نام نهادم. فرآیند مطالعات، تحقیق و طراحی این تایپ‌فیس و آنچه در این مسیر از جناب ایشان آموختم را به‌صورت مقاله‌ای جداگانه‌ای منتشر خواهم کرد.</p>
+	</div>
+
+	<div class="box300">
+	<h1>آشنایی با مُدام</h1>
+		<p>تایپ‌فیس «مُدام» دارای ساختاری ساده، اندامی استخوانی و فضاهای منفی باز است. این تایپ‌فیس به دلیل روحیه‌ی نمایشی و درجه‌ی بالای تناسبات هندسی آن، برای تیتر و متن‌های کوتاه و نیمه بلند مناسب است.</p>
+		<p>استارتاپ‌ها، طراحان و توسعه‌دهندگان بازی‌، وب و اپلیکیشن می‌توانند مهم‌ترین کاربران این تایپ‌فیس باشند.</p>
+	</div>
+
+	<div class="box400">
+	<h1>تنوع وزن</h1>
+		<p>مُدام دارای ۸ وزن از نازک تا تیره است که می‌تواند تمام نیازهای پروژه‌های طراحی گرافیک و هویت‌سازی را برطرف نماید.</p>
+	</div>
+
+	<div class="box500">
+	<h1>استایل فشرده</h1>
+		<p>از آنجایی که در اکثر بازی‌ها -در کنار خوانایی و خواندنی بودن نوشتار- نیاز به هیجان و انرژی همراه با تصویر در حروف نیز به چشم می‌خورد، همچنین محدودیت‌هایی که در نرم‌افزارها (باکس‌ها و دکمه‌ها) و یا ستون‌های صفحه‌آرایی وجود دارد، استایل فشرده‌ی این تایپ‌فیس نیز طراحی شد. برای فشرده‌سازی، تلاش شده است فرم حروف همچنان حفظ شود و این فشرده‌سازی در آنها اعوجاج ایجاد نکند. همچنین در این تغییر میزان فشردگی، ضخامتِ حروف نیز تا حد امکان ثابت مانده است؛ یعنی مثلاً ضخامتِ حروف در وزن رگولار با وزن رگولارِ فشرده یکسان است و فقط فرم حروف فشرده شده است.</p>
+	</div>
+
+	<div class="box600">
+	<h1>پشتیبانی از زبان عربی و انگلیسی</h1>
+		<p>یکی از امکاناتی که در تایپ‌فیس مُدام در نظر گرفته شده است، استفاده از  Tabular lining است. با فعال‌سازی این ویژگی در نرم‌افزارهای گرافیکی مانند ایلاستریتور و فوتوشاپ، می‌توانید بدون استفاده از جدول‌کشی، اعداد را به صورت زیرِ  هم بنویسید.</p>
+	</div>
+
+	<div class="box700">
+	<h1>اعداد جدول‌کشی‌شده!</h1>
+		<p>یکی از امکاناتی که در تایپ‌فیس مُدام در نظر گرفته شده است، استفاده از  Tabular lining است. با فعال‌سازی این ویژگی در نرم‌افزارهای گرافیکی مانند ایلاستریتور و فوتوشاپ، می‌توانید بدون استفاده از جدول‌کشی، اعداد را به صورت زیرِ  هم بنویسید.</p>
+	</div>
+
+	<div class="box800">
+	<h1>تاریخچه</h1>
+		<p>ایده‌ی اولیه‌ی قلم “پیدا” در سال ۱۳۹۸ شکل گرفت و در سال ۱۳۹۹ طراحی آن به اتمام رسید.</p>
+	</div>
+
+	<div class="box900">
+	<h1>دانلود رایگان فونت مُدام !</h1>
+		<p>دقت کنید که این فونت رایگان نیست. اگر وبسایت یا کانالی را مشاهده کردید که این فونت را با قیمت ارزان‌ترِ، با تخفیف یا رایگان عرضه کرده است آن را معرفی کنید تا پیگیری قانونی توسط فونت ‌ایران انجام شود.</p>
+	</div>
+	
+		<div class="box400">
+		
+		<h1>
+اعداد فارسی: ۱۲۳۴۵۶۷۸۹۰
+<br>
+اعداد عربی: ۱۲۳٤٥٦۷۸۹۰
+<br>
+اعداد انگلیسی: 1234567890
+		</h1>
+	</div>	
+</div>
+</body>
+</html>
--- a/Farsi_Numerals/WebFonts/fontiran.css
+++ b/Farsi_Numerals/WebFonts/fontiran.css
@ -0,0 +1,83 @@
+/**
+*
+*	Name:				Modam Fonts
+*	Version:			1.0
+*	Author:			Naser Khadem
+*	Created on:		April 22, 2023
+*	Updated on:		April 22, 2023
+*	Website:			http://fontiran.com
+*	Copyright:			Commercial/Proprietary Software
+--------------------------------------------------------------------------------------
+فونت کلمه یک نرم افزار مالکیتی محسوب می شود. جهت آگاهی از قوانین استفاده از این فونت ها لطفا به وب سایت (فونت ایران دات کام) مراجعه نمایید
+--------------------------------------------------------------------------------------
+Modam fonts are considered a proprietary software. To gain information about the laws regarding the use of these fonts, please visit www.fontiran.com 
+--------------------------------------------------------------------------------------
+This set of fonts are used in this project under the license: (.....)
+------------------------------------------------------------------------------------- fonts/-
+*	
+**/
+
+@font-face {
+	font-family: ModamFaNumWeb;
+	font-style: normal;
+	font-weight: 200;
+	src: url('fonts/woff2/ModamFaNumWeb-ExtraLight.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamFaNumWeb-ExtraLight.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamFaNumWeb;
+	font-style: normal;
+	font-weight: 300;
+	src: url('fonts/woff2/ModamFaNumWeb-Light.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamFaNumWeb-Light.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamFaNumWeb;
+	font-style: normal;
+	font-weight: normal;
+	src: url('fonts/woff2/ModamFaNumWeb-Regular.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamFaNumWeb-Regular.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamFaNumWeb;
+	font-style: normal;
+	font-weight: 500;
+	src: url('fonts/woff2/ModamFaNumWeb-Medium.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamFaNumWeb-Medium.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamFaNumWeb;
+	font-style: normal;
+	font-weight: 600;
+	src: url('fonts/woff2/ModamFaNumWeb-SemiBold.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamFaNumWeb-SemiBold.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamFaNumWeb;
+	font-style: normal;
+	font-weight: bold;
+	src: url('fonts/woff2/ModamFaNumWeb-Bold.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamFaNumWeb-Bold.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamFaNumWeb;
+	font-style: normal;
+	font-weight: 800;
+	src: url('fonts/woff2/ModamFaNumWeb-ExtraBold.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamFaNumWeb-ExtraBold.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamFaNumWeb;
+	font-style: normal;
+	font-weight: 900;
+	src: url('fonts/woff2/ModamFaNumWeb-Black.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamFaNumWeb-Black.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
--- a/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-Black.woff
+++ b/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-Black.woff
--- a/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-BlackCondensed.woff
+++ b/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-BlackCondensed.woff
--- a/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-Bold.woff
+++ b/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-Bold.woff
--- a/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-BoldCondensed.woff
+++ b/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-BoldCondensed.woff
--- a/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-Light.woff
+++ b/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-Light.woff
--- a/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-LightCondensed.woff
+++ b/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-LightCondensed.woff
--- a/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-Regular.woff
+++ b/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-Regular.woff
--- a/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-RegularCondensed.woff
+++ b/Farsi_Numerals/WebFonts/fonts/woff/ModamFaNumWeb-RegularCondensed.woff
--- a/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-Black.woff2
+++ b/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-Black.woff2
--- a/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-BlackCondensed.woff2
+++ b/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-BlackCondensed.woff2
--- a/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-Bold.woff2
+++ b/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-Bold.woff2
--- a/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-BoldCondensed.woff2
+++ b/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-BoldCondensed.woff2
--- a/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-Light.woff2
+++ b/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-Light.woff2
--- a/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-LightCondensed.woff2
+++ b/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-LightCondensed.woff2
--- a/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-Regular.woff2
+++ b/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-Regular.woff2
--- a/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-RegularCondensed.woff2
+++ b/Farsi_Numerals/WebFonts/fonts/woff2/ModamFaNumWeb-RegularCondensed.woff2
--- a/Farsi_Numerals/WebFonts/style.css
+++ b/Farsi_Numerals/WebFonts/style.css
@ -0,0 +1,67 @@
+@import url(fontiran.css); /* لینک فایلی که وظیفه بارگذاری فونت‌ها را برعهده دارد */
+body {
+	font-family: ModamFaNumWeb !important;
+	direction: rtl;
+	background-color: #cdcdcd;
+	margin: 0;
+}
+
+h1, h2, h3, h4, h5, h6{
+	font-family: ModamFaNumWeb !important;
+}
+
+.wrapper {
+	max-width: 900px;
+	margin: 20px auto;
+	padding: 30px;
+	background-color: #fff;
+	border-radius: 15px;
+	box-shadow: 0 0 10px #aaa;
+}
+
+.box100 p, .box200 p, .box300 p, .box400 p, .box500 p, .box600 p, .box700 p, .box800 p, .box900 p{
+	font-size: 20px;
+	margin: 0;
+}
+
+.box100, .box100 h1, .box200, .box200 h1, .box300, .box300 h1, .box400, .box400 h1, .box500, .box500 h1, .box600, .box600 h1, .box700, .box700 h1, .box800, .box800 h1, .box900, .box900 h1{
+  	margin: 30px 0 0 0;
+	font-size: 25px;
+}
+
+
+.box100, .box100 h1{
+	font-weight:100;
+}
+
+.box200, .box200 h1{
+	font-weight:200;
+}
+
+.box300, .box300 h1{
+	font-weight:300;
+}
+
+.box400, .box400 h1{
+	font-weight:400;
+}
+
+.box500, .box500 h1{
+	font-weight:500;
+}
+
+.box600, .box600 h1{
+	font-weight:600;
+}
+
+.box700, .box700 h1{
+	font-weight:700;
+}
+
+.box800, .box800 h1{
+	font-weight:800;
+}
+
+.box900, .box900 h1{
+	font-weight:900;
+}
--- a/Base/ModamNoEn-Black.ttf
+++ b/Base/ModamNoEn-Black.ttf
--- a/Base/ModamNoEn-Bold.ttf
+++ b/Base/ModamNoEn-Bold.ttf
--- a/Base/ModamNoEn-Light.ttf
+++ b/Base/ModamNoEn-Light.ttf
--- a/Base/ModamNoEn-Regular.ttf
+++ b/Base/ModamNoEn-Regular.ttf
--- a/Condensed/ModamNoEn-BlackCondensed.ttf
+++ b/Condensed/ModamNoEn-BlackCondensed.ttf
--- a/Condensed/ModamNoEn-BoldCondensed.ttf
+++ b/Condensed/ModamNoEn-BoldCondensed.ttf
--- a/Condensed/ModamNoEn-LightCondensed.ttf
+++ b/Condensed/ModamNoEn-LightCondensed.ttf
--- a/Condensed/ModamNoEn-RegularCondensed.ttf
+++ b/Condensed/ModamNoEn-RegularCondensed.ttf
--- a/English/WebFonts/Modam.html
+++ b/English/WebFonts/Modam.html
@ -0,0 +1,71 @@
+<!doctype html>
+<html lang="fa">
+<head>
+<meta charset="utf-8">
+<title>Modam Family Type face: خانواده فونت مُدام</title>
+
+<meta name="fontiran.com:license" content="کد ۵ رقمی لایسنس">
+
+<link href="style.css" rel="stylesheet">
+</head>
+
+
+<body dir="rtl">
+<div class="wrapper">
+
+	<div class="box100">
+	<h1>شکل‌گیری تایپ‌فیس مُدام</h1>
+		<p>یکی از دغدغه‌های من، طراحی تایپ‌فیس‌هایی برای استفاده در فضای بازی‌های دیجیتال و مدیوم‌هایی در بستر وِب است. در پاییز ۱۳۹۹ که در کلاس‌های آنلاینِ طراحی تایپِ استادم دامون خانجانزاده شرکت کردم، این فکر و دغدغه‌ام را با ایشان در میان گذاشتم و ایشان بسیار استقبال کردند.</p>
+<p>
+از میان مباحث گسترده‌ی تئوری،‌ تجزیه و تحلیل‌های فرمی و بصری، تحلیل کانسپت، اتودهای فرمی و در نهایت اتودهای طراحی حروف،  این تایپ‌فیس ساخته شد که آن را «مُدام» نام نهادم. فرآیند مطالعات، تحقیق و طراحی این تایپ‌فیس و آنچه در این مسیر از جناب ایشان آموختم را به‌صورت مقاله‌ای جداگانه‌ای منتشر خواهم کرد.</p>
+	</div>
+
+	<div class="box300">
+	<h1>آشنایی با مُدام</h1>
+		<p>تایپ‌فیس «مُدام» دارای ساختاری ساده، اندامی استخوانی و فضاهای منفی باز است. این تایپ‌فیس به دلیل روحیه‌ی نمایشی و درجه‌ی بالای تناسبات هندسی آن، برای تیتر و متن‌های کوتاه و نیمه بلند مناسب است.</p>
+		<p>استارتاپ‌ها، طراحان و توسعه‌دهندگان بازی‌، وب و اپلیکیشن می‌توانند مهم‌ترین کاربران این تایپ‌فیس باشند.</p>
+	</div>
+
+	<div class="box400">
+	<h1>تنوع وزن</h1>
+		<p>مُدام دارای ۸ وزن از نازک تا تیره است که می‌تواند تمام نیازهای پروژه‌های طراحی گرافیک و هویت‌سازی را برطرف نماید.</p>
+	</div>
+
+	<div class="box500">
+	<h1>استایل فشرده</h1>
+		<p>از آنجایی که در اکثر بازی‌ها -در کنار خوانایی و خواندنی بودن نوشتار- نیاز به هیجان و انرژی همراه با تصویر در حروف نیز به چشم می‌خورد، همچنین محدودیت‌هایی که در نرم‌افزارها (باکس‌ها و دکمه‌ها) و یا ستون‌های صفحه‌آرایی وجود دارد، استایل فشرده‌ی این تایپ‌فیس نیز طراحی شد. برای فشرده‌سازی، تلاش شده است فرم حروف همچنان حفظ شود و این فشرده‌سازی در آنها اعوجاج ایجاد نکند. همچنین در این تغییر میزان فشردگی، ضخامتِ حروف نیز تا حد امکان ثابت مانده است؛ یعنی مثلاً ضخامتِ حروف در وزن رگولار با وزن رگولارِ فشرده یکسان است و فقط فرم حروف فشرده شده است.</p>
+	</div>
+
+	<div class="box600">
+	<h1>پشتیبانی از زبان عربی و انگلیسی</h1>
+		<p>یکی از امکاناتی که در تایپ‌فیس مُدام در نظر گرفته شده است، استفاده از  Tabular lining است. با فعال‌سازی این ویژگی در نرم‌افزارهای گرافیکی مانند ایلاستریتور و فوتوشاپ، می‌توانید بدون استفاده از جدول‌کشی، اعداد را به صورت زیرِ  هم بنویسید.</p>
+	</div>
+
+	<div class="box700">
+	<h1>اعداد جدول‌کشی‌شده!</h1>
+		<p>یکی از امکاناتی که در تایپ‌فیس مُدام در نظر گرفته شده است، استفاده از  Tabular lining است. با فعال‌سازی این ویژگی در نرم‌افزارهای گرافیکی مانند ایلاستریتور و فوتوشاپ، می‌توانید بدون استفاده از جدول‌کشی، اعداد را به صورت زیرِ  هم بنویسید.</p>
+	</div>
+
+	<div class="box800">
+	<h1>تاریخچه</h1>
+		<p>ایده‌ی اولیه‌ی قلم “پیدا” در سال ۱۳۹۸ شکل گرفت و در سال ۱۳۹۹ طراحی آن به اتمام رسید.</p>
+	</div>
+
+	<div class="box900">
+	<h1>دانلود رایگان فونت مُدام !</h1>
+		<p>دقت کنید که این فونت رایگان نیست. اگر وبسایت یا کانالی را مشاهده کردید که این فونت را با قیمت ارزان‌ترِ، با تخفیف یا رایگان عرضه کرده است آن را معرفی کنید تا پیگیری قانونی توسط فونت ‌ایران انجام شود.</p>
+	</div>
+	
+		<div class="box400">
+		
+		<h1>
+اعداد فارسی: ۱۲۳۴۵۶۷۸۹۰
+<br>
+اعداد عربی: ۱۲۳٤٥٦۷۸۹۰
+<br>
+اعداد انگلیسی: 1234567890
+		</h1>
+	</div>	
+</div>
+</body>
+</html>
--- a/English/WebFonts/fontiran.css
+++ b/English/WebFonts/fontiran.css
@ -0,0 +1,83 @@
+/**
+*
+*	Name:				Modam Fonts
+*	Version:			1.0
+*	Author:			Naser Khadem
+*	Created on:		April 22, 2023
+*	Updated on:		April 22, 2023
+*	Website:			http://fontiran.com
+*	Copyright:			Commercial/Proprietary Software
+--------------------------------------------------------------------------------------
+فونت مُدام یک نرم افزار مالکیتی محسوب می شود. جهت آگاهی از قوانین استفاده از این فونت ها لطفا به وب سایت (فونت ایران دات کام) مراجعه نمایید
+--------------------------------------------------------------------------------------
+Modam fonts are considered a proprietary software. To gain information about the laws regarding the use of these fonts, please visit www.fontiran.com 
+--------------------------------------------------------------------------------------
+This set of fonts are used in this project under the license: (.....)
+------------------------------------------------------------------------------------- fonts/-
+*	
+**/
+
+@font-face {
+	font-family: ModamNoEnWeb;
+	font-style: normal;
+	font-weight: 200;
+	src: url('fonts/woff2/ModamNoEnWeb-ExtraLight.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamNoEnWeb-ExtraLight.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamNoEnWeb;
+	font-style: normal;
+	font-weight: 300;
+	src: url('fonts/woff2/ModamNoEnWeb-Light.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamNoEnWeb-Light.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamNoEnWeb;
+	font-style: normal;
+	font-weight: normal;
+	src: url('fonts/woff2/ModamNoEnWeb-Regular.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamNoEnWeb-Regular.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamNoEnWeb;
+	font-style: normal;
+	font-weight: 500;
+	src: url('fonts/woff2/ModamNoEnWeb-Medium.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamNoEnWeb-Medium.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamNoEnWeb;
+	font-style: normal;
+	font-weight: 600;
+	src: url('fonts/woff2/ModamNoEnWeb-SemiBold.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamNoEnWeb-SemiBold.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamNoEnWeb;
+	font-style: normal;
+	font-weight: bold;
+	src: url('fonts/woff2/ModamNoEnWeb-Bold.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamNoEnWeb-Bold.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+
+@font-face {
+	font-family: ModamNoEnWeb;
+	font-style: normal;
+	font-weight: 800;
+	src: url('fonts/woff2/ModamNoEnWeb-ExtraBold.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamNoEnWeb-ExtraBold.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
+
+@font-face {
+	font-family: ModamNoEnWeb;
+	font-style: normal;
+	font-weight: 900;
+	src: url('fonts/woff2/ModamNoEnWeb-Black.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
+		 url('fonts/woff/ModamNoEnWeb-Black.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+}
--- a/Show More
+++ b/Show More
				`@ -0,0 +1 @@`
				`if('serviceWorker' in navigator) navigator.serviceWorker.register('/dev-sw.js?dev-sw', { scope: '/', type: 'classic' })`