Server : Apache System : Linux server1.cgrithy.com 3.10.0-1160.95.1.el7.x86_64 #1 SMP Mon Jul 24 13:59:37 UTC 2023 x86_64 User : nobody ( 99) PHP Version : 8.1.23 Disable Function : NONE Directory : /home/dnlcambodia/www/dnl_dashboard/ |
<!DOCTYPE html> <html lang="ar" dir="rtl"> <meta http-equiv="content-type" content="text/html;charset=utf-8" /><!-- /Added by HTTrack --> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="apple-touch-icon" sizes="76x76" href="../assets/img/apple-icon.png"> <link rel="icon" type="image/png" href="../assets/img/favicon.png"> <title> DNL-Admin </title> <link rel="canonical" href="https://www.creative-tim.com/product/material-dashboard" /> <meta name="keywords" content="creative tim, html dashboard, html css dashboard, web dashboard, bootstrap 5 dashboard, bootstrap 5, css3 dashboard, bootstrap 5 admin, Material Dashboard bootstrap 5 dashboard, frontend, responsive bootstrap 5 dashboard, free dashboard, free admin dashboard, free bootstrap 5 admin dashboard"> <meta name="description" content="Material Dashboard 2 is a beautiful Bootstrap 5 admin dashboard with a large number of components, designed to look beautiful and organized. If you are looking for a tool to manage and visualize data about your business, this dashboard is the thing for you."> <meta name="twitter:card" content="product"> <meta name="twitter:site" content="@creativetim"> <meta name="twitter:title" content="DNL-Admin"> <meta name="twitter:description" content="Material Dashboard 2 is a beautiful Bootstrap 5 admin dashboard with a large number of components, designed to look beautiful and organized. If you are looking for a tool to manage and visualize data about your business, this dashboard is the thing for you."> <meta name="twitter:creator" content="@creativetim"> <meta name="twitter:image" content="../../../s3.amazonaws.com/creativetim_bucket/products/450/original/material-dashboard.jpg"> <meta property="fb:app_id" content="655968634437471"> <meta property="og:title" content="DNL-Admin" /> <meta property="og:type" content="article" /> <meta property="og:url" content="dashboard-2.html" /> <meta property="og:image" content="../../../s3.amazonaws.com/creativetim_bucket/products/450/original/material-dashboard.jpg" /> <meta property="og:description" content="Material Dashboard 2 is a beautiful Bootstrap 5 admin dashboard with a large number of components, designed to look beautiful and organized. If you are looking for a tool to manage and visualize data about your business, this dashboard is the thing for you." /> <meta property="og:site_name" content="Creative Tim" /> <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900|Roboto+Slab:400,700" /> <link href="../assets/css/nucleo-icons.css" rel="stylesheet" /> <link href="../assets/css/nucleo-svg.css" rel="stylesheet" /> <script src="../../../kit.fontawesome.com/42d5adcbca.js" crossorigin="anonymous"></script> <link href="https://fonts.googleapis.com/icon?family=Material+Icons+Round" rel="stylesheet"> <link id="pagestyle" href="../assets/css/material-dashboard.mine63c.css?v=3.1.0" rel="stylesheet" /> <style> .async-hide { opacity: 0 !important } </style> <script> (function(i, s, o, g, r, a, m) { i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function() { (i[r].q = i[r].q || []).push(arguments) }, i[r].l = 1 * new Date(); a = s.createElement(o), m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m) })(window, document, 'script', '../../../www.google-analytics.com/analytics.js', 'ga'); ga('create', 'UA-46172202-22', 'auto', { allowLinker: true }); ga('set', 'anonymizeIp', true); ga('require', 'GTM-K9BGS8K'); ga('require', 'displayfeatures'); ga('require', 'linker'); ga('linker:autoLink', ["2checkout.com", "avangate.com"]); </script> <script> (function(w, d, s, l, i) { w[l] = w[l] || []; w[l].push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' }); var f = d.getElementsByTagName(s)[0], j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src = '../../../www.googletagmanager.com/gtm5445.html?id=' + i + dl; f.parentNode.insertBefore(j, f); })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6'); </script> <script defer data-site="demos.creative-tim.com" src="../../../api.nepcha.com/js/nepcha-analytics.js"></script> </head> <body class="g-sidenav-show rtl bg-gray-200"> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> <aside class="sidenav navbar navbar-vertical navbar-expand-xs border-0 border-radius-xl my-3 fixed-end me-3 rotate-caret bg-gradient-dark" id="sidenav-main"> <div class="sidenav-header"> <i class="fas fa-times p-3 cursor-pointer text-white opacity-5 position-absolute start-0 top-0 d-none d-xl-none" aria-hidden="true" id="iconSidenav"></i> <a class="navbar-brand m-0" href="dashboard.html" target="_blank"> <img src="../assets/img/logo-ct.png" class="navbar-brand-img h-100" alt="main_logo"> <span class="me-1 font-weight-bold text-white">Material Dashboard 2</span> </a> </div> <hr class="horizontal light mt-0 mb-2"> <div class="collapse navbar-collapse px-0 w-auto " id="sidenav-collapse-main"> <ul class="navbar-nav"> <li class="nav-item"> <a class="nav-link " href="dashboard-2.html"> <div class="text-white text-center ms-2 d-flex align-items-center justify-content-center"> <i class="material-icons-round opacity-10">dashboard</i> </div> <span class="nav-link-text me-1">لوحة القيادة</span> </a> </li> <li class="nav-item"> <a class="nav-link " href="tables.html"> <div class="text-white text-center ms-2 d-flex align-items-center justify-content-center"> <i class="material-icons-round opacity-10">table_view</i> </div> <span class="nav-link-text me-1">الجداول</span> </a> </li> <li class="nav-item"> <a class="nav-link " href="billing.html"> <div class="text-white text-center ms-2 d-flex align-items-center justify-content-center"> <i class="material-icons-round opacity-10">receipt_long</i> </div> <span class="nav-link-text me-1">الفواتير</span> </a> </li> <li class="nav-item"> <a class="nav-link " href="virtual-reality.html"> <div class="text-white text-center ms-2 d-flex align-items-center justify-content-center"> <i class="material-icons-round opacity-10">view_in_ar</i> </div> <span class="nav-link-text me-1">الواقع الافتراضي</span> </a> </li> <li class="nav-item"> <a class="nav-link active" href="rtl.html"> <div class="text-white text-center ms-2 d-flex align-items-center justify-content-center"> <i class="material-icons-round opacity-10">format_textdirection_r_to_l</i> </div> <span class="nav-link-text me-1">RTL</span> </a> </li> <li class="nav-item"> <a class="nav-link " href="notifications.html"> <div class="text-white text-center ms-2 d-flex align-items-center justify-content-center"> <i class="material-icons opacity-10">notifications</i> </div> <span class="nav-link-text me-1">إشعارات</span> </a> </li> <li class="nav-item"> <a class="nav-link " href="profile.html"> <div class="text-white text-center ms-2 d-flex align-items-center justify-content-center"> <i class="material-icons-round opacity-10">person</i> </div> <span class="nav-link-text me-1">حساب تعريفي</span> </a> </li> <li class="nav-item"> <a class="nav-link " href="sign-in.html"> <div class="text-white text-center ms-2 d-flex align-items-center justify-content-center"> <i class="material-icons-round opacity-10">login</i> </div> <span class="nav-link-text me-1">تسجيل الدخول</span> </a> </li> <li class="nav-item"> <a class="nav-link " href="sign-up.html"> <div class="text-white text-center ms-2 d-flex align-items-center justify-content-center"> <i class="material-icons-round opacity-10">assignment</i> </div> <span class="nav-link-text me-1">اشتراك</span> </a> </li> </ul> </div> <div class="sidenav-footer position-absolute w-100 bottom-0 "> <div class="mx-3"> <a class="btn btn-outline-primary mt-4 w-100" href="https://www.creative-tim.com/learning-lab/bootstrap/overview/material-dashboard?ref=sidebarfree" type="button">Documentation</a> <a class="btn bg-gradient-primary w-100" href="https://www.creative-tim.com/product/material-dashboard-pro?ref=sidebarfree" type="button">Upgrade to pro</a> </div> </div> </aside> <main class="main-content position-relative max-height-vh-100 h-100 border-radius-lg overflow-x-hidden"> <nav class="navbar navbar-main navbar-expand-lg px-0 mx-4 shadow-none border-radius-xl" id="navbarBlur" data-scroll="true"> <div class="container-fluid py-1 px-3"> <nav aria-label="breadcrumb"> <ol class="breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 "> <li class="breadcrumb-item text-sm ps-2"><a class="opacity-5 text-dark" href="javascript:;">لوحات القيادة</a></li> <li class="breadcrumb-item text-sm text-dark active" aria-current="page">RTL</li> </ol> <h6 class="font-weight-bolder mb-0">RTL</h6> </nav> <div class="collapse navbar-collapse mt-sm-0 mt-2 px-0" id="navbar"> <div class="ms-md-auto pe-md-3 d-flex align-items-center"> <div class="input-group input-group-outline"> <label class="form-label">أكتب هنا...</label> <input type="text" class="form-control"> </div> </div> <ul class="navbar-nav me-auto ms-0 justify-content-end"> <li class="nav-item d-flex align-items-center"> <a class="btn btn-outline-primary btn-sm mb-0 ms-3" target="_blank" href="https://www.creative-tim.com/builder?ref=navbar-material-dashboard">منشئ مضمنة</a> </li> <li class="mt-2"> <a class="github-button" href="https://github.com/creativetimofficial/material-dashboard" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star creativetimofficial/material-dashboard on GitHub">Star</a> </li> <li class="nav-item d-xl-none pe-3 d-flex align-items-center"> <a href="javascript:;" class="nav-link text-body p-0" id="iconNavbarSidenav"> <div class="sidenav-toggler-inner"> <i class="sidenav-toggler-line"></i> <i class="sidenav-toggler-line"></i> <i class="sidenav-toggler-line"></i> </div> </a> </li> <li class="nav-item px-3 d-flex align-items-center"> <a href="javascript:;" class="nav-link text-body p-0"> <i class="fa fa-cog fixed-plugin-button-nav cursor-pointer"></i> </a> </li> <li class="nav-item dropdown ps-2 d-flex align-items-center"> <a href="javascript:;" class="nav-link text-body p-0" id="dropdownMenuButton" data-bs-toggle="dropdown" aria-expanded="false"> <i class="fa fa-bell cursor-pointer"></i> </a> <ul class="dropdown-menu px-2 py-3 me-sm-n4" aria-labelledby="dropdownMenuButton"> <li class="mb-2"> <a class="dropdown-item border-radius-md" href="javascript:;"> <div class="d-flex py-1"> <div class="my-auto"> <img src="../assets/img/team-2.jpg" class="avatar avatar-sm ms-3 "> </div> <div class="d-flex flex-column justify-content-center"> <h6 class="text-sm font-weight-normal mb-1"> <span class="font-weight-bold">New message</span> from Laur </h6> <p class="text-xs text-secondary mb-0"> <i class="fa fa-clock me-1"></i> 13 minutes ago </p> </div> </div> </a> </li> <li class="mb-2"> <a class="dropdown-item border-radius-md" href="javascript:;"> <div class="d-flex py-1"> <div class="my-auto"> <img src="https://demos.creative-tim.com/material-dashboard/assets/img/small-logos/logo-spotify.svg" class="avatar avatar-sm bg-gradient-dark ms-3 "> </div> <div class="d-flex flex-column justify-content-center"> <h6 class="text-sm font-weight-normal mb-1"> <span class="font-weight-bold">New album</span> by Travis Scott </h6> <p class="text-xs text-secondary mb-0"> <i class="fa fa-clock me-1"></i> 1 day </p> </div> </div> </a> </li> <li> <a class="dropdown-item border-radius-md" href="javascript:;"> <div class="d-flex py-1"> <div class="avatar avatar-sm bg-gradient-secondary ms-3 my-auto"> <svg width="12px" height="12px" viewBox="0 0 43 36" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <title>credit-card</title> <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g transform="translate(-2169.000000, -745.000000)" fill="#FFFFFF" fill-rule="nonzero"> <g transform="translate(1716.000000, 291.000000)"> <g transform="translate(453.000000, 454.000000)"> <path class="color-background" d="M43,10.7482083 L43,3.58333333 C43,1.60354167 41.3964583,0 39.4166667,0 L3.58333333,0 C1.60354167,0 0,1.60354167 0,3.58333333 L0,10.7482083 L43,10.7482083 Z" opacity="0.593633743"></path> <path class="color-background" d="M0,16.125 L0,32.25 C0,34.2297917 1.60354167,35.8333333 3.58333333,35.8333333 L39.4166667,35.8333333 C41.3964583,35.8333333 43,34.2297917 43,32.25 L43,16.125 L0,16.125 Z M19.7083333,26.875 L7.16666667,26.875 L7.16666667,23.2916667 L19.7083333,23.2916667 L19.7083333,26.875 Z M35.8333333,26.875 L28.6666667,26.875 L28.6666667,23.2916667 L35.8333333,23.2916667 L35.8333333,26.875 Z"></path> </g> </g> </g> </g> </svg> </div> <div class="d-flex flex-column justify-content-center"> <h6 class="text-sm font-weight-normal mb-1"> Payment successfully completed </h6> <p class="text-xs text-secondary mb-0"> <i class="fa fa-clock me-1"></i> 2 days </p> </div> </div> </a> </li> </ul> </li> <li class="nav-item d-flex align-items-center"> <a href="sign-in.html" class="nav-link text-body font-weight-bold px-0"> <i class="fa fa-user me-sm-1"></i> <span class="d-sm-inline d-none">يسجل دخول</span> </a> </li> </ul> </div> </div> </nav> <div class="container-fluid py-4"> <div class="row"> <div class="col-lg-3 col-sm-6 mb-lg-0 mb-4"> <div class="card"> <div class="card-header p-3 pt-2"> <div class="icon icon-lg icon-shape bg-gradient-dark shadow-dark text-center border-radius-xl mt-n4 position-absolute"> <i class="material-icons opacity-10">weekend</i> </div> <div class="text-start pt-1"> <p class="text-sm mb-0 text-capitalize">أموال اليوم</p> <h4 class="mb-0">$53k</h4> </div> </div> <hr class="dark horizontal my-0"> <div class="card-footer p-3"> <p class="mb-0 text-start"><span class="text-success text-sm font-weight-bolder ms-1">+55% </span>من الأسبوع الماضي</p> </div> </div> </div> <div class="col-lg-3 col-sm-6 mb-lg-0 mb-4"> <div class="card"> <div class="card-header p-3 pt-2"> <div class="icon icon-lg icon-shape bg-gradient-primary shadow-primary text-center border-radius-xl mt-n4 position-absolute"> <i class="material-icons opacity-10">leaderboard</i> </div> <div class="text-start pt-1"> <p class="text-sm mb-0 text-capitalize">مستخدمو اليوم</p> <h4 class="mb-0">2,300</h4> </div> </div> <hr class="dark horizontal my-0"> <div class="card-footer p-3"> <p class="mb-0 text-start"><span class="text-success text-sm font-weight-bolder ms-1">+33% </span>من الأسبوع الماضي</p> </div> </div> </div> <div class="col-lg-3 col-sm-6 mb-lg-0 mb-4"> <div class="card"> <div class="card-header p-3 pt-2"> <div class="icon icon-lg icon-shape bg-gradient-success shadow-success text-center border-radius-xl mt-n4 position-absolute"> <i class="material-icons opacity-10">store</i> </div> <div class="text-start pt-1"> <p class="text-sm mb-0 text-capitalize">عملاء جدد</p> <h4 class="mb-0"> <span class="text-danger text-sm font-weight-bolder ms-1">-2%</span> +3,462 </h4> </div> </div> <hr class="dark horizontal my-0"> <div class="card-footer p-3"> <p class="mb-0 text-start"><span class="text-success text-sm font-weight-bolder ms-1">+5% </span>من الشهر الماضي</p> </div> </div> </div> <div class="col-lg-3 col-sm-6"> <div class="card"> <div class="card-header p-3 pt-2"> <div class="icon icon-lg icon-shape bg-gradient-info shadow-info text-center border-radius-xl mt-n4 position-absolute"> <i class="material-icons opacity-10">person_add</i> </div> <div class="text-start pt-1"> <p class="text-sm mb-0 text-capitalize">مبيعات</p> <h4 class="mb-0">$103,430</h4> </div> </div> <hr class="dark horizontal my-0"> <div class="card-footer p-3"> <p class="mb-0 text-start"><span class="text-success text-sm font-weight-bolder ms-1">+7% </span>مقارنة بيوم أمس</p> </div> </div> </div> </div> <div class="row mt-4"> <div class="col-lg-4 col-md-6 mt-4 mb-4"> <div class="card z-index-2 "> <div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2 bg-transparent"> <div class="bg-gradient-primary shadow-primary border-radius-lg py-3 pe-1"> <div class="chart"> <canvas id="chart-bars" class="chart-canvas" height="170"></canvas> </div> </div> </div> <div class="card-body"> <h6 class="mb-0 ">مشاهدات الموقع</h6> <p class="text-sm ">آخر أداء للحملة</p> <hr class="dark horizontal"> <div class="d-flex "> <i class="material-icons text-sm my-auto ms-1">schedule</i> <p class="mb-0 text-sm"> الحملة أرسلت قبل يومين </p> </div> </div> </div> </div> <div class="col-lg-4 col-md-6 mt-4 mb-4"> <div class="card z-index-2 "> <div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2 bg-transparent"> <div class="bg-gradient-success shadow-success border-radius-lg py-3 pe-1"> <div class="chart"> <canvas id="chart-line" class="chart-canvas" height="170"></canvas> </div> </div> </div> <div class="card-body"> <h6 class="mb-0 "> المبيعات اليومية </h6> <p class="text-sm "> (<span class="font-weight-bolder">+15%</span>) زيادة في مبيعات اليوم. </p> <hr class="dark horizontal"> <div class="d-flex "> <i class="material-icons text-sm my-auto ms-1">schedule</i> <p class="mb-0 text-sm"> تم التحديث منذ 4 دقائق </p> </div> </div> </div> </div> <div class="col-lg-4 mt-4 mb-3"> <div class="card z-index-2 "> <div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2 bg-transparent"> <div class="bg-gradient-dark shadow-dark border-radius-lg py-3 pe-1"> <div class="chart"> <canvas id="chart-line-tasks" class="chart-canvas" height="170"></canvas> </div> </div> </div> <div class="card-body"> <h6 class="mb-0 ">المهام المكتملة</h6> <p class="text-sm ">آخر أداء للحملة</p> <hr class="dark horizontal"> <div class="d-flex "> <i class="material-icons text-sm my-auto me-1">schedule</i> <p class="mb-0 text-sm">تم تحديثه للتو</p> </div> </div> </div> </div> </div> <div class="row my-4"> <div class="col-lg-8 col-md-6 mb-md-0 mb-4"> <div class="card"> <div class="card-header pb-0"> <div class="row mb-3"> <div class="col-6"> <h6>المشاريع</h6> <p class="text-sm"> <i class="fa fa-check text-info" aria-hidden="true"></i> <span class="font-weight-bold ms-1">30 انتهى</span> هذا الشهر </p> </div> <div class="col-6 my-auto text-start"> <div class="dropdown float-start ps-4"> <a class="cursor-pointer" id="dropdownTable" data-bs-toggle="dropdown" aria-expanded="false"> <i class="fa fa-ellipsis-v text-secondary"></i> </a> <ul class="dropdown-menu dropdown-menu-end px-2 py-3 me-n4" aria-labelledby="dropdownTable"> <li><a class="dropdown-item border-radius-md" href="javascript:;">عمل</a></li> <li><a class="dropdown-item border-radius-md" href="javascript:;">عمل آخر</a></li> <li><a class="dropdown-item border-radius-md" href="javascript:;">شيء آخر هنا</a></li> </ul> </div> </div> </div> </div> <div class="card-body p-0 pb-2"> <div class="table-responsive"> <table class="table align-items-center mb-0"> <thead> <tr> <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">المشروع</th> <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2">أعضاء</th> <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">ميزانية</th> <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">إكمال</th> </tr> </thead> <tbody> <tr> <td> <div class="d-flex px-2 py-1"> <div> <img src="https://demos.creative-tim.com/material-dashboard/assets/img/small-logos/logo-xd.svg" class="avatar avatar-sm ms-3"> </div> <div class="d-flex flex-column justify-content-center"> <h6 class="mb-0 text-sm">Material XD الإصدار</h6> </div> </div> </td> <td> <div class="avatar-group mt-2"> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Ryan Tompson"> <img alt="Image placeholder" src="../assets/img/team-1.jpg"> </a> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Romina Hadid"> <img alt="Image placeholder" src="../assets/img/team-2.jpg"> </a> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Alexander Smith"> <img alt="Image placeholder" src="../assets/img/team-3.jpg"> </a> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Jessica Doe"> <img alt="Image placeholder" src="../assets/img/team-4.jpg"> </a> </div> </td> <td class="align-middle text-center text-sm"> <span class="text-xs font-weight-bold"> $14,000 </span> </td> <td class="align-middle"> <div class="progress-wrapper w-75 mx-auto"> <div class="progress-info"> <div class="progress-percentage"> <span class="text-xs font-weight-bold">60%</span> </div> </div> <div class="progress"> <div class="progress-bar bg-gradient-info w-60" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"></div> </div> </div> </td> </tr> <tr> <td> <div class="d-flex px-2 py-1"> <div> <img src="https://demos.creative-tim.com/material-dashboard/assets/img/small-logos/logo-atlassian.svg" class="avatar avatar-sm ms-3"> </div> <div class="d-flex flex-column justify-content-center"> <h6 class="mb-0 text-sm">أضف مسار التقدم إلى التطبيق الداخلي</h6> </div> </div> </td> <td> <div class="avatar-group mt-2"> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Romina Hadid"> <img alt="Image placeholder" src="../assets/img/team-2.jpg"> </a> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Jessica Doe"> <img alt="Image placeholder" src="../assets/img/team-4.jpg"> </a> </div> </td> <td class="align-middle text-center text-sm"> <span class="text-xs font-weight-bold"> $3,000 </span> </td> <td class="align-middle"> <div class="progress-wrapper w-75 mx-auto"> <div class="progress-info"> <div class="progress-percentage"> <span class="text-xs font-weight-bold">10%</span> </div> </div> <div class="progress"> <div class="progress-bar bg-gradient-info w-10" role="progressbar" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"></div> </div> </div> </td> </tr> <tr> <td> <div class="d-flex px-2 py-1"> <div> <img src="https://demos.creative-tim.com/material-dashboard/assets/img/small-logos/logo-slack.svg" class="avatar avatar-sm ms-3"> </div> <div class="d-flex flex-column justify-content-center"> <h6 class="mb-0 text-sm">إصلاح أخطاء النظام الأساسي</h6> </div> </div> </td> <td> <div class="avatar-group mt-2"> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Romina Hadid"> <img alt="Image placeholder" src="../assets/img/team-3.jpg"> </a> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Jessica Doe"> <img alt="Image placeholder" src="../assets/img/team-1.jpg"> </a> </div> </td> <td class="align-middle text-center text-sm"> <span class="text-xs font-weight-bold"> غير مضبوط </span> </td> <td class="align-middle"> <div class="progress-wrapper w-75 mx-auto"> <div class="progress-info"> <div class="progress-percentage"> <span class="text-xs font-weight-bold">100%</span> </div> </div> <div class="progress"> <div class="progress-bar bg-gradient-success w-100" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div> </div> </div> </td> </tr> <tr> <td> <div class="d-flex px-2 py-1"> <div> <img src="https://demos.creative-tim.com/material-dashboard/assets/img/small-logos/logo-spotify.svg" class="avatar avatar-sm ms-3"> </div> <div class="d-flex flex-column justify-content-center"> <h6 class="mb-0 text-sm">إطلاق تطبيق الهاتف المحمول الخاص بنا</h6> </div> </div> </td> <td> <div class="avatar-group mt-2"> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Ryan Tompson"> <img alt="Image placeholder" src="../assets/img/team-4.jpg"> </a> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Romina Hadid"> <img alt="Image placeholder" src="../assets/img/team-3.jpg"> </a> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Alexander Smith"> <img alt="Image placeholder" src="../assets/img/team-4.jpg"> </a> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Jessica Doe"> <img alt="Image placeholder" src="../assets/img/team-1.jpg"> </a> </div> </td> <td class="align-middle text-center text-sm"> <span class="text-xs font-weight-bold"> $20,500 </span> </td> <td class="align-middle"> <div class="progress-wrapper w-75 mx-auto"> <div class="progress-info"> <div class="progress-percentage"> <span class="text-xs font-weight-bold">100%</span> </div> </div> <div class="progress"> <div class="progress-bar bg-gradient-success w-100" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div> </div> </div> </td> </tr> <tr> <td> <div class="d-flex px-2 py-1"> <div> <img src="https://demos.creative-tim.com/material-dashboard/assets/img/small-logos/logo-jira.svg" class="avatar avatar-sm ms-3"> </div> <div class="d-flex flex-column justify-content-center"> <h6 class="mb-0 text-sm">أضف صفحة التسعير الجديدة</h6> </div> </div> </td> <td> <div class="avatar-group mt-2"> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Ryan Tompson"> <img alt="Image placeholder" src="../assets/img/team-4.jpg"> </a> </div> </td> <td class="align-middle text-center text-sm"> <span class="text-xs font-weight-bold"> $500 </span> </td> <td class="align-middle"> <div class="progress-wrapper w-75 mx-auto"> <div class="progress-info"> <div class="progress-percentage"> <span class="text-xs font-weight-bold">25%</span> </div> </div> <div class="progress"> <div class="progress-bar bg-gradient-info w-25" role="progressbar" aria-valuenow="25" aria-valuemin="0" aria-valuemax="25"></div> </div> </div> </td> </tr> <tr> <td> <div class="d-flex px-2 py-1"> <div> <img src="https://demos.creative-tim.com/material-dashboard/assets/img/small-logos/logo-invision.svg" class="avatar avatar-sm ms-3"> </div> <div class="d-flex flex-column justify-content-center"> <h6 class="mb-0 text-sm">إعادة تصميم متجر جديد على الإنترنت</h6> </div> </div> </td> <td> <div class="avatar-group mt-2"> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Ryan Tompson"> <img alt="Image placeholder" src="../assets/img/team-1.jpg"> </a> <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Jessica Doe"> <img alt="Image placeholder" src="../assets/img/team-4.jpg"> </a> </div> </td> <td class="align-middle text-center text-sm"> <span class="text-xs font-weight-bold"> $2,000 </span> </td> <td class="align-middle"> <div class="progress-wrapper w-75 mx-auto"> <div class="progress-info"> <div class="progress-percentage"> <span class="text-xs font-weight-bold">40%</span> </div> </div> <div class="progress"> <div class="progress-bar bg-gradient-info w-40" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="40"></div> </div> </div> </td> </tr> </tbody> </table> </div> </div> </div> </div> <div class="col-lg-4 col-md-6"> <div class="card h-100"> <div class="card-header pb-0"> <h6>نظرة عامة على الطلبات</h6> <p class="text-sm"> <i class="fa fa-arrow-up text-success" aria-hidden="true"></i> <span class="font-weight-bold">24%</span> هذا الشهر </p> </div> <div class="card-body p-3"> <div class="timeline timeline-one-side"> <div class="timeline-block mb-3"> <span class="timeline-step"> <i class="material-icons text-success text-gradient">notifications</i> </span> <div class="timeline-content"> <h6 class="text-dark text-sm font-weight-bold mb-0">$2400, تغييرات في التصميم</h6> <p class="text-secondary font-weight-bold text-xs mt-1 mb-0">22 DEC 7:20 PM</p> </div> </div> <div class="timeline-block mb-3"> <span class="timeline-step"> <i class="material-icons text-danger text-gradient">code</i> </span> <div class="timeline-content"> <h6 class="text-dark text-sm font-weight-bold mb-0">طلب جديد #1832412</h6> <p class="text-secondary font-weight-bold text-xs mt-1 mb-0">21 DEC 11 PM</p> </div> </div> <div class="timeline-block mb-3"> <span class="timeline-step"> <i class="material-icons text-info text-gradient">shopping_cart</i> </span> <div class="timeline-content"> <h6 class="text-dark text-sm font-weight-bold mb-0">مدفوعات الخادم لشهر أبريل</h6> <p class="text-secondary font-weight-bold text-xs mt-1 mb-0">21 DEC 9:34 PM</p> </div> </div> <div class="timeline-block mb-3"> <span class="timeline-step"> <i class="material-icons text-warning text-gradient">credit_card</i> </span> <div class="timeline-content"> <h6 class="text-dark text-sm font-weight-bold mb-0">تمت إضافة بطاقة جديدة للطلب #4395133</h6> <p class="text-secondary font-weight-bold text-xs mt-1 mb-0">20 DEC 2:20 AM</p> </div> </div> <div class="timeline-block mb-3"> <span class="timeline-step"> <i class="material-icons text-primary text-gradient">key</i> </span> <div class="timeline-content"> <h6 class="text-dark text-sm font-weight-bold mb-0">فتح الحزم من أجل التطوير</h6> <p class="text-secondary font-weight-bold text-xs mt-1 mb-0">18 DEC 4:54 AM</p> </div> </div> <div class="timeline-block"> <span class="timeline-step"> <i class="material-icons text-dark text-gradient">payments</i> </span> <div class="timeline-content"> <h6 class="text-dark text-sm font-weight-bold mb-0">طلب جديد #9583120</h6> <p class="text-secondary font-weight-bold text-xs mt-1 mb-0">17 DEC</p> </div> </div> </div> </div> </div> </div> </div> <footer class="footer py-4 "> <div class="container-fluid"> <div class="row align-items-center justify-content-lg-between"> <div class="col-lg-6 mb-lg-0 mb-4"> <div class="copyright text-center text-sm text-muted text-lg-end"> © <script> document.write(new Date().getFullYear()) </script>, made with <i class="fa fa-heart"></i> by <a href="https://www.creative-tim.com/" class="font-weight-bold" target="_blank">Creative Tim</a> for a better web. </div> </div> <div class="col-lg-6"> <ul class="nav nav-footer justify-content-center justify-content-lg-end"> <li class="nav-item"> <a href="https://www.creative-tim.com/" class="nav-link text-muted" target="_blank">Creative Tim</a> </li> <li class="nav-item"> <a href="https://www.creative-tim.com/presentation" class="nav-link text-muted" target="_blank">About Us</a> </li> <li class="nav-item"> <a href="https://www.creative-tim.com/blog" class="nav-link text-muted" target="_blank">Blog</a> </li> <li class="nav-item"> <a href="https://www.creative-tim.com/license" class="nav-link pe-0 text-muted" target="_blank">License</a> </li> </ul> </div> </div> </div> </footer> </div> </main> <div class="fixed-plugin"> <a class="fixed-plugin-button text-dark position-fixed px-3 py-2"> <i class="material-icons py-2">settings</i> </a> <div class="card shadow-lg"> <div class="card-header pb-0 pt-3"> <div class="float-end"> <h5 class="mt-3 mb-0">Material UI Configurator</h5> <p>See our dashboard options.</p> </div> <div class="float-start mt-4"> <button class="btn btn-link text-dark p-0 fixed-plugin-close-button"> <i class="material-icons">clear</i> </button> </div> </div> <hr class="horizontal dark my-1"> <div class="card-body pt-sm-3 pt-0"> <div> <h6 class="mb-0">Sidebar Colors</h6> </div> <a href="javascript:void(0)" class="switch-trigger background-color"> <div class="badge-colors my-2 text-end"> <span class="badge filter bg-gradient-primary active" data-color="primary" onclick="sidebarColor(this)"></span> <span class="badge filter bg-gradient-dark" data-color="dark" onclick="sidebarColor(this)"></span> <span class="badge filter bg-gradient-info" data-color="info" onclick="sidebarColor(this)"></span> <span class="badge filter bg-gradient-success" data-color="success" onclick="sidebarColor(this)"></span> <span class="badge filter bg-gradient-warning" data-color="warning" onclick="sidebarColor(this)"></span> <span class="badge filter bg-gradient-danger" data-color="danger" onclick="sidebarColor(this)"></span> </div> </a> <div class="mt-3"> <h6 class="mb-0">Sidenav Type</h6> <p class="text-sm">Choose between 2 different sidenav types.</p> </div> <div class="d-flex"> <button class="btn bg-gradient-dark px-3 mb-2 active" data-class="bg-gradient-dark" onclick="sidebarType(this)">Dark</button> <button class="btn bg-gradient-dark px-3 mb-2 ms-2" data-class="bg-transparent" onclick="sidebarType(this)">Transparent</button> <button class="btn bg-gradient-dark px-3 mb-2 me-2" data-class="bg-white" onclick="sidebarType(this)">White</button> </div> <p class="text-sm d-xl-none d-block mt-2">You can change the sidenav type just on desktop view.</p> <div class="mt-3 d-flex"> <h6 class="mb-0">Navbar Fixed</h6> <div class="form-check form-switch me-auto my-auto"> <input class="form-check-input mt-1 float-end me-auto" type="checkbox" id="navbarFixed" onclick="navbarFixed(this)"> </div> </div> <hr class="horizontal dark my-3"> <div class="mt-2 d-flex"> <h6 class="mb-0">Light / Dark</h6> <div class="form-check form-switch me-auto my-auto"> <input class="form-check-input mt-1 float-end me-auto" type="checkbox" id="dark-version" onclick="darkMode(this)"> </div> </div> <hr class="horizontal dark my-sm-4"> <a class="btn bg-gradient-info w-100" href="https://www.creative-tim.com/product/material-dashboard-pro">Free Download</a> <a class="btn btn-outline-dark w-100" href="https://www.creative-tim.com/learning-lab/bootstrap/overview/material-dashboard">View documentation</a> <div class="w-100 text-center"> <a class="github-button" href="https://github.com/creativetimofficial/material-dashboard" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star creativetimofficial/material-dashboard on GitHub">Star</a> <h6 class="mt-3">Thank you for sharing!</h6> <a href="https://twitter.com/intent/tweet?text=Check%20Material%20UI%20Dashboard%20made%20by%20%40CreativeTim%20%23webdesign%20%23dashboard%20%23bootstrap5&url=https%3A%2F%2Fwww.creative-tim.com%2Fproduct%2Fsoft-ui-dashboard" class="btn btn-dark mb-0 me-2" target="_blank"> <i class="fab fa-twitter me-1" aria-hidden="true"></i> Tweet </a> <a href="https://www.facebook.com/sharer/sharer.php?u=https://www.creative-tim.com/product/material-dashboard" class="btn btn-dark mb-0 me-2" target="_blank"> <i class="fab fa-facebook-square me-1" aria-hidden="true"></i> Share </a> </div> </div> </div> </div> <script src="../assets/js/core/popper.min.js"></script> <script src="../assets/js/core/bootstrap.min.js"></script> <script src="../assets/js/plugins/perfect-scrollbar.min.js"></script> <script src="../assets/js/plugins/smooth-scrollbar.min.js"></script> <script src="../assets/js/plugins/chartjs.min.js"></script> <script> var ctx = document.getElementById("chart-bars").getContext("2d"); new Chart(ctx, { type: "bar", data: { labels: ["M", "T", "W", "T", "F", "S", "S"], datasets: [{ label: "Sales", tension: 0.4, borderWidth: 0, borderRadius: 4, borderSkipped: false, backgroundColor: "rgba(255, 255, 255, .8)", data: [50, 20, 10, 22, 50, 10, 40], maxBarThickness: 6 }, ], }, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false, } }, interaction: { intersect: false, mode: 'index', }, scales: { y: { grid: { drawBorder: false, display: true, drawOnChartArea: true, drawTicks: false, borderDash: [5, 5], color: 'rgba(255, 255, 255, .2)' }, ticks: { suggestedMin: 0, suggestedMax: 500, beginAtZero: true, padding: 10, font: { size: 14, weight: 300, family: "Roboto", style: 'normal', lineHeight: 2 }, color: "#fff" }, }, x: { grid: { drawBorder: false, display: true, drawOnChartArea: true, drawTicks: false, borderDash: [5, 5], color: 'rgba(255, 255, 255, .2)' }, ticks: { display: true, color: '#f8f9fa', padding: 10, font: { size: 14, weight: 300, family: "Roboto", style: 'normal', lineHeight: 2 }, } }, }, }, }); var ctx2 = document.getElementById("chart-line").getContext("2d"); new Chart(ctx2, { type: "line", data: { labels: ["Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], datasets: [{ label: "Mobile apps", tension: 0, borderWidth: 0, pointRadius: 5, pointBackgroundColor: "rgba(255, 255, 255, .8)", pointBorderColor: "transparent", borderColor: "rgba(255, 255, 255, .8)", borderColor: "rgba(255, 255, 255, .8)", borderWidth: 4, backgroundColor: "transparent", fill: true, data: [50, 40, 300, 320, 500, 350, 200, 230, 500], maxBarThickness: 6 }], }, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false, } }, interaction: { intersect: false, mode: 'index', }, scales: { y: { grid: { drawBorder: false, display: true, drawOnChartArea: true, drawTicks: false, borderDash: [5, 5], color: 'rgba(255, 255, 255, .2)' }, ticks: { display: true, color: '#f8f9fa', padding: 10, font: { size: 14, weight: 300, family: "Roboto", style: 'normal', lineHeight: 2 }, } }, x: { grid: { drawBorder: false, display: false, drawOnChartArea: false, drawTicks: false, borderDash: [5, 5] }, ticks: { display: true, color: '#f8f9fa', padding: 10, font: { size: 14, weight: 300, family: "Roboto", style: 'normal', lineHeight: 2 }, } }, }, }, }); var ctx3 = document.getElementById("chart-line-tasks").getContext("2d"); new Chart(ctx3, { type: "line", data: { labels: ["Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], datasets: [{ label: "Mobile apps", tension: 0, borderWidth: 0, pointRadius: 5, pointBackgroundColor: "rgba(255, 255, 255, .8)", pointBorderColor: "transparent", borderColor: "rgba(255, 255, 255, .8)", borderWidth: 4, backgroundColor: "transparent", fill: true, data: [50, 40, 300, 220, 500, 250, 400, 230, 500], maxBarThickness: 6 }], }, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false, } }, interaction: { intersect: false, mode: 'index', }, scales: { y: { grid: { drawBorder: false, display: true, drawOnChartArea: true, drawTicks: false, borderDash: [5, 5], color: 'rgba(255, 255, 255, .2)' }, ticks: { display: true, padding: 10, color: '#f8f9fa', font: { size: 14, weight: 300, family: "Roboto", style: 'normal', lineHeight: 2 }, } }, x: { grid: { drawBorder: false, display: false, drawOnChartArea: false, drawTicks: false, borderDash: [5, 5] }, ticks: { display: true, color: '#f8f9fa', padding: 10, font: { size: 14, weight: 300, family: "Roboto", style: 'normal', lineHeight: 2 }, } }, }, }, }); </script> <script> var win = navigator.platform.indexOf('Win') > -1; if (win && document.querySelector('#sidenav-scrollbar')) { var options = { damping: '0.5' } Scrollbar.init(document.querySelector('#sidenav-scrollbar'), options); } </script> <script async defer src="../../../buttons.github.io/buttons.js"></script> <script src="../assets/js/material-dashboard.mine63c.js?v=3.1.0"></script> <script defer src="https://static.cloudflareinsights.com/beacon.min.js/v84a3a4012de94ce1a686ba8c167c359c1696973893317" integrity="sha512-euoFGowhlaLqXsPWQ48qSkBSCFs3DPRyiwVu3FjR96cMPx+Fr+gpWRhIafcHwqwCqWS42RZhIudOvEI+Ckf6MA==" data-cf-beacon='{"rayId":"829f96d97bc23fc5","b":1,"version":"2023.10.0","token":"1b7cbb72744b40c580f8633c6b62637e"}' crossorigin="anonymous"></script> </body> <!-- Mirrored from demos.creative-tim.com/material-dashboard/pages/rtl.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 22 Nov 2023 07:51:55 GMT --> </html>