-
Notifications
You must be signed in to change notification settings - Fork 7
/
Copy pathindex.html
295 lines (244 loc) · 17 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
<!DOCTYPE html>
<html lang="fa">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="module" src="./assets/componentsMod.js"></script>
<title>صحت سنجی شماره تلفن های ایرانی | کدآقا</title>
<link rel="stylesheet" href="assets/out.css">
<meta name="description"
content="مجموعه رجکس های بهینه برای توسعه دهندگان بک‌اند و فرانت‌اند برای تشخیص صحت شماره تلفن ایرانی بر اساس اوپراتور.">
<meta property="og:description"
content="مجموعه رجکس های بهینه برای توسعه دهندگان بک‌اند و فرانت‌اند برای تشخیص صحت شماره تلفن ایرانی بر اساس اوپراتور">
</head>
<body dir="rtl" class="w-screen flex justify-center items-center flex-col">
<header>
<nav>
<h1 class="tracking-wide lg:text-lg sm:text-base text-sm">تشخیص شماره تلفن ایرانی</h1>
<div class="flex justify-center items-center gap-2">
<a title="کانال تلگرام کد آقا" class="text-base text-teal-700 hover:text-teal-950 transition-colors"
href="https://t.me/codeaghajcs" target="_blank"><img src="./assets/images/icons8_telegram_app.svg"
class="size-6" alt="تلگرام کدآقا"></a>
<a title="ریپازیتوری پروژه" class="text-base text-teal-700 hover:text-teal-950 transition-colors"
href="https://github.com/AmirMahdyJebreily/iranian-phonenumber-validation" target="_blank"><img
src="./assets/images/github-mark.png" class="size-6" alt="ریپازیتوری پروژه"></a>
</div>
</nav>
<section id="hero">
<div
class="bg-gray-100/60 backdrop-blur-lg flex items-center justify-start flex-col relative sm:top-14 top-7 sm:px-5 px-2 py-6 rounded-3xl lg:w-[50rem] sm:w-10/12 w-11/12">
<img src="./assets/images/perspective_matte-468-128x128.png" class="size-24">
<h2 class="font-bold text-4xl pb-2 text-center tracking-tighter">صحت سنجی شماره تلفن ایرانی با رجکس</h2>
<p class="text-center py-2 text-lg px-3">مجموعۀ <abbr title="Regular Expression">RegEx</abbr> های بهینۀ
تشخیص شماره تلفن ایرانی <b>و اوپراتور آن</b>، برای
همۀ توسعه دهندگان ایرانی
</p>
<div class="flex items-center justify-center py-4">
<label class="input-container">
<div class="flex items-center justify-center sm:tracking-[0.36rem] tracking-[0.2rem]">
<input dir="ltr" type="text" id="phonenumber" data-pattern="09XX XXX XXXX"
placeholder="09XX XXX XXXX" class="outline-0 ring-0">
</div>
<div class="text-gray-800 text-base">
<p id="lable" class="tracking-normal text-sm">تستش کن!</p>
</div>
</label>
</div>
<div
class="flex items-center justify-center py-2 text-sm flex-wrap lg:text-base gap-2 lg:gap-4 divide-x">
<a class="text-teal-700 hover:text-teal-950 transition-colors" href="#regex-list">فهرست رجکس ها</a>
<a class="text-teal-700 hover:text-teal-950 transition-colors" href="#custome-regex">شخصی‌سازی</a>
<a class="text-teal-700 hover:text-teal-950 transition-colors" href="#why-regex">چرا رجکس</a>
</div>
</div>
<div class="w-full relative flex items-stretch flex-col top-4 z-20 justify-stretch">
<!--<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="#e5e7eb" fill-opacity="1" d="M0,160L48,165.3C96,171,192,181,288,192C384,203,480,213,576,208C672,203,768,181,864,181.3C960,181,1056,203,1152,202.7C1248,203,1344,181,1392,170.7L1440,160L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>-->
<svg class="absolute bottom-1 -z-10" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
<path fill="#c026d3" fill-opacity="0.1"
d="M0,96L48,112C96,128,192,160,288,165.3C384,171,480,149,576,154.7C672,160,768,192,864,192C960,192,1056,160,1152,149.3C1248,139,1344,149,1392,154.7L1440,160L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z">
</path>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
<path fill="#f3f4f6" fill-opacity="1"
d="M0,96L48,112C96,128,192,160,288,165.3C384,171,480,149,576,154.7C672,160,768,192,864,192C960,192,1056,160,1152,149.3C1248,139,1344,149,1392,154.7L1440,160L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z">
</path>
</svg>
</div>
</section>
</header>
<mian
class="w-full max-w-[52rem] relative lg:-top-20 z-40 px-4 flex justify-center items-center text-right flex-col">
<article>
<h2 class="text-lg font-semibold p-2" id="regex-list">فهرست RegEx ها</h2>
<p class="text-sm font-light p-1 pb-4">
مجموعه زیر مجموعه ای از RegEx های بهینه سازی شده و جامع بر اساس اوپراتور های تلفن همراه است که شما
میتوانید
برای Validation یا صحت‌سنجی شماره تلفن های ورودی سیستم خود از آنها استفاده کنید. برای اطلاع از فرمت های
قابل
پشتیبانی <a class="text-teal-700 font-medium hover:text-teal-950 transition-colors" target="_blank"
title="جدول فرمت های قابل تشخیص"
href="https://github.com/AmirMahdyJebreily/iranian-phonenumber-validation?tab=readme-ov-file#%D9%86%D9%85%D9%88%D9%86%DB%80-%D9%81%D8%B1%D9%85%D8%AA-%D9%87%D8%A7%DB%8C-%D9%82%D8%A7%D8%A8%D9%84-%D8%AA%D8%B4%D8%AE%DB%8C%D8%B5">این
جدول</a> را ببینید و جهت اطلاع از پیش شماره های قابل تشخیص اوپراتور ها <a
class="text-teal-700 font-medium hover:text-teal-950 transition-colors" target="_blank"
title="پیش شماره های قابل تشخیص"
href="https://github.com/AmirMahdyJebreily/iranian-phonenumber-validation/blob/main/ValidPreNumbers.md">این
صفحه</a> را مشاهده کنید.
</p>
<h3 class="operator-title" id="regex-noProvider">همه اوپراتور ها</h3>
<div class="operator-container">
<div class="code-container">
<span>کامل: </span>
<code class="regex after:scale-0" reg-provider="noProvider"
reg-type="full">بارگذاری رجکس ها...</code>
</div>
<p class="mt-2"> RegEx زیر، مختصر و مفید ترین رجکس این مجموعه است و اگر جایی میخواهید فقط <b>قالب</b>
شماره
تلفن ایرانی را چک کنید، از این RegEx استفاده کنید : </p>
<div class="code-container">
<span>بهینه: </span>
<code class="regex after:scale-0" reg-provider="noProvider"
reg-type="optimal">بارگذاری رجکس ها...</code>
</div>
</div>
<h3 class="operator-title" id="regex-mtn-irancel">ایرانسل</h3>
<div class="operator-container">
<div class="code-container">
<span>کامل: </span>
<code class="regex after:scale-0" reg-provider="mtnIrancel"
reg-type="full">بارگذاری رجکس ها...</code>
</div>
<div class="code-container">
<span>بهینه: </span>
<code class="regex after:scale-0" reg-provider="mtnIrancel"
reg-type="optimal">بارگذاری رجکس ها...</code>
</div>
</div>
<h3 class="operator-title" id="regex-irMci">همراه‌اول</h3>
<div class="operator-container">
<div class="code-container">
<span>کامل: </span>
<code class="regex after:scale-0" reg-provider="irMci" reg-type="full">بارگذاری رجکس ها...</code>
</div>
<div class="code-container">
<span>بهینه: </span>
<code class="regex after:scale-0" reg-provider="irMci" reg-type="optimal">بارگذاری رجکس ها...</code>
</div>
</div>
<h3 class="operator-title" id="regex-rightel">رایتل</h3>
<div class="operator-container">
<div class="code-container">
<span>کامل: </span>
<code class="regex after:scale-0" reg-provider="rightel" reg-type="full">بارگذاری رجکس ها...</code>
</div>
<div class="code-container">
<span>بهینه: </span>
<code class="regex after:scale-0" reg-provider="rightel"
reg-type="optimal">بارگذاری رجکس ها...</code>
</div>
</div>
<a class="flex items-center justify-center gap-2 mb-6 text-teal-700 hover:text-teal-950 transition-colors"
href="https://github.com/AmirMahdyJebreily/iranian-phonenumber-validation/blob/main/README.md"
target="_blank">مشاهده بقیه اوپراتور ها <i-arow class="size-4"></i-arow> </a>
</article>
<hr class="my-10" />
<article>
<h2 class="text-lg font-semibold p-2" id="custome-regex">اوپراتور ها را شخصی سازی کنید!</h2>
<p class="text-sm font-light p-1 pb-4">با توجه به اینکه ممکن است نخواهید تمام امکانات تشخیص اوپراتور این
رجکس ها را در پروژه های خود استفاده کنید، ابزار زیر به شما کمک میکند تا رجکس های خود را شخصی سازی
کنید:<a
class="inline-flex justify-center items-center gap-2 text-teal-900 px-2 rounded-lg cursor-pointer hover:bg-teal-700 hover:text-white"
href="./customization.html">
<span>شخصی سازی رجکس ها</span>
<i-edit class="size-4"></i-edit>
</a>
</p>
<p class="w-full">این بخش بزودی به همین صفحه منتقل می‌شود...</p>
</article>
<hr class="my-10" />
<article>
<h2 class="text-lg font-semibold p-2" id="why-regex">چرا رجکس؟</h2>
<div class="flex items-center justify-center flex-wrap gap-4 pt-1">
<div class="benef-card ">
<div class="benef-card-header">
<i-fast class="card-icon"></i-fast>
<p>سریع و بهینه</p>
</div>
<p>سریع و بهینه در همه نرم‌افزار ها.</p>
</div>
<div class="benef-card">
<div class="benef-card-header">
<i-perf class="card-icon"></i-perf>
<p>ساده و قابل فهم</p>
</div>
<p>ساختاری ساده و قابل درک برای همه.</p>
</div>
<div class="benef-card ">
<div class="benef-card-header">
<i-effi class="card-icon"></i-effi>
<p>کاربردی</p>
</div>
<p>کاربرد های متنوع و عالی در همه‌جا.</p>
</div>
<div class="benef-card">
<div class="benef-card-header">
<i-tick class="card-icon"></i-tick>
<p>روش درست</p>
</div>
<p>روش اصولی بررسی <code>string</code> ها.</p>
</div>
<div class="benef-card">
<div class="benef-card-header">
<i-code class="card-icon"></i-code>
<p>کد تمیز تر</p>
</div>
<p>رجکس ها، تمیز تر از <code>if</code> و <code>else</code> ها</p>
</div>
<div class="benef-card">
<div class="benef-card-header">
<i-webs class="card-icon"></i-webs>
<p>سازگار با همه</p>
</div>
<p>قابل استفاده در همه پلتفرم ها</p>
</div>
</div>
</article>
<hr class="my-10" />
<p>اگر ایرادی دیدید، خوشحال می‌شوم آن را <a
class="text-teal-700 font-medium hover:text-teal-950 transition-colors" target="_blank"
title="ثبت issue در گیت هاب"
href="https://github.com/AmirMahdyJebreily/iranian-phonenumber-validation/issues/new">در گیت هاب گزارش
دهید</a>📝</p>
<br>
<p>همچنین خوشحال می‌شوم <a
class="text-teal-700 font-medium hover:text-teal-950 transition-colors" target="_blank"
title="در کانال تلگرام کدآقا عضو شوید"
href="https://t.me/codeaghajcs">در کانال تلگرام من عضو شوید</a>!</p>
<a href="https://www.coffeebede.com/codeagha"><img class="mt-6 lg:w-72 sm:w-64" src="https://coffeebede.ir/DashboardTemplateV2/app-assets/images/banner/default-yellow.svg" /></a>
</mian>
<div class="flex justify-center items-center flex-col gap-2 fixed z-50 bottom-3 left-4">
<a href="https://github.com/AmirMahdyJebreily/iranian-phonenumber-validation/stargazers"
class="flex justify-between items-center py-0.5 px-2 w-full hover:bg-rose-400 bg-gray-50 rounded-xl shadow-md gap-2">
<span id="stars" class="pt-1"></span>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="size-5">
<path stroke-linecap="round" stroke-linejoin="round"
d="M11.48 3.499a.562.562 0 0 1 1.04 0l2.125 5.111a.563.563 0 0 0 .475.345l5.518.442c.499.04.701.663.321.988l-4.204 3.602a.563.563 0 0 0-.182.557l1.285 5.385a.562.562 0 0 1-.84.61l-4.725-2.885a.562.562 0 0 0-.586 0L6.982 20.54a.562.562 0 0 1-.84-.61l1.285-5.386a.562.562 0 0 0-.182-.557l-4.204-3.602a.562.562 0 0 1 .321-.988l5.518-.442a.563.563 0 0 0 .475-.345L11.48 3.5Z" />
</svg>
</a>
<a href="https://github.com/AmirMahdyJebreily/iranian-phonenumber-validation/forks"
class="flex justify-between items-center py-0.5 px-2 w-full hover:bg-teal-400 bg-gray-50 rounded-xl shadow-md gap-2">
<span id="forks" class="pt-1"></span>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="size-5 -rotate-90">
<path stroke-linecap="round" stroke-linejoin="round"
d="M7.217 10.907a2.25 2.25 0 1 0 0 2.186m0-2.186c.18.324.283.696.283 1.093s-.103.77-.283 1.093m0-2.186 9.566-5.314m-9.566 7.5 9.566 5.314m0 0a2.25 2.25 0 1 0 3.935 2.186 2.25 2.25 0 0 0-3.935-2.186Zm0-12.814a2.25 2.25 0 1 0 3.933-2.185 2.25 2.25 0 0 0-3.933 2.185Z" />
</svg>
</a>
</div>
<footer class="bg-white shadow w-full text-gray-700 text-center py-3 px-3 font-bold md:text-lg text-base mt-12">
© <a class="text-teal-700 hover:text-teal-950 transition-colors"
href="https://github.com/AmirMahdyJebreily/">کدآقا</a> 2024, با ❤️
</footer>
<script type="module" src="assets/index.js"></script>
</body>
</html>