📨
Mail Management Page
organizes incoming, sent, and archived messages, providing an efficient way to manage communications.
View Mode

HTML
<div class="page-head">
<h1 class="page-title">الإعدادات</h1>
<p class="page-desc">ضبط إعدادات المنصة.</p>
</div>
<div class="js-simplebar mb-4 mb-lg-5">
<ul class="nav">
<li class="nav-item"><a class="nav-link" href="setting-01.html">اعدادات عامة</a></li>
<li class="nav-item"><a class="nav-link" href="setting-02.html">المدفوعات</a></li>
<li class="nav-item"><a class="nav-link" href="setting-03.html">بياناتي البنكية</a></li>
<li class="nav-item"><a class="nav-link" href="setting-04.html">ادارة المناطق</a></li>
<li class="nav-item"><a class="nav-link" href="setting-05.html">بوابة SMS</a></li>
<li class="nav-item"><a class="nav-link" href="setting-06.html">نموذج التسجيل</a></li>
<li class="nav-item"><a class="nav-link active" aria-current="page" href="setting-07.html">ادارة البريد</a></li>
<li class="nav-item"><a class="nav-link" href="setting-08.html">قوالب الرسائل</a></li>
</ul>
</div>
<div class="row g-4">
<div class="col-xl-3 col-xxl-4">
<h6 class="mb-0">شعار البريد</h6>
<p class="text-body-xs mb-0"><span class="d-block"><span>تحميل الشعارات بصيغة </span><span class="text-english">SVG </span><span>لأفضل دقة وجودة.</span></span><span class="d-block"> <span>الحجم المناسب : </span><span class="text-english">130x45</span></span></p>
</div>
<div class="col-xl-9 col-xxl-8">
<div class="row g-4">
<div class="col-sm-8 col-md-6 col-lg-8 col-xxl-6">
<label class="form-label">أيقونة البريد <span class="text-danger">*</span></label>
<label class="photo-uploader">
<input class="d-none" type="file"/><span class="photo-uploader__upload-area"> <span class="tticon-upload photo-uploader__icon"> </span><span class="photo-uploader__content"> <span class="photo-uploader__text"><span>أعلى حد: </span><span class="text-english">1 MB</span></span><span class="photo-uploader__text"> <span>الملفات المقبولة: </span><span class="text-english">SVG, PNG</span></span></span></span><span class="ration ration-1x1 photo-uploader__preview" style="background-image: url('./images/photo-placeholder-square.svg')"></span>
</label>
</div>
</div>
</div>
</div>
<hr class="my-4 my-lg-5"/>
<div class="row g-4">
<div class="col-xl-3 col-xxl-4">
<h6 class="mb-0">البروتوكول</h6>
<p class="text-body-xs mb-0">الخادم المسؤول عن إرسال أو استقبال البريد.</p>
</div>
<div class="col-xl-9 col-xxl-8">
<div class="row g-4">
<div class="col-sm-6">
<div class="form-radio-group">
<div class="form-check">
<input class="form-check-input" type="radio" name="name_01" id="id_01"/>
<label class="form-check-label" for="id_01">الافتراضي</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="name_01" id="id_02" checked="checked"/>
<label class="form-check-label text-english" for="id_02">SMTP</label>
</div>
</div>
</div>
</div>
</div>
</div>
<hr class="my-4 my-lg-5"/>
<div class="row g-4">
<div class="col-xl-3 col-xxl-4">
<h6 class="mb-0">البروتوكول</h6>
<p class="text-body-xs mb-0">الخادم المسؤول عن إرسال أو استقبال البريد.</p>
</div>
<div class="col-xl-9 col-xxl-8">
<div class="row g-4">
<div class="col-sm-6">
<label class="form-label">عنوان البريد المُرسل منه <span class="text-danger">*</span></label>
<input class="form-control text-english" type="text" placeholder="مثال: “شركة التقنية الحديثة”"/>
</div>
<div class="col-sm-6">
<label class="form-label">اسم المرسل <span class="text-danger">*</span></label>
<input class="form-control" type="text" placeholder="مثال: “[email protected]”"/>
</div>
<div class="col-sm-6">
<label class="form-label">SMTP host <span class="text-danger">*</span></label>
<input class="form-control text-english" type="text" placeholder="مثال: “smtp.gmail.com”"/>
</div>
<div class="col-sm-6">
<label class="form-label">SMTP Port <span class="text-danger">*</span></label>
<input class="form-control text-english" type="text" placeholder="مثال: “587”"/>
</div>
<div class="col-sm-6">
<label class="form-label">SMTP Port <span class="text-danger">*</span></label>
<input class="form-control text-english" type="text" placeholder="مثال: “[email protected]”"/>
</div>
<div class="col-sm-6">
<label class="form-label">SMTP Password <span class="text-danger">*</span></label>
<input class="form-control text-english" type="password" placeholder="**************"/>
</div>
<div class="col-12">
<div class="alert alert-warning">تنبيه:بعد الحفظ يتم اخفاء المعلومات الحسساسة لا يمكنك الوصول اليها.</div>
</div>
<div class="col-12">
<button class="btn btn-dark">ارسل لتجربة الاعداد</button>
</div>
</div>
</div>
</div>
<hr class="my-4 my-lg-5"/>
<div class="d-flex align-items-center justify-content-between">
<button class="btn btn-primary">حفظ التغييرات</button>
<button class="btn btn-white">إلغاء</button>
</div>