summaryrefslogtreecommitdiffstats
path: root/site/content/docs/5.3/examples/dashboard-rtl
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2023-06-24 12:44:40 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2023-06-24 12:44:49 +0000
commitdb46bfc03f3a22752ef6bd91ae577d893872a216 (patch)
tree89d924513bc95e6bac4dc8e26f0da84caa477b7b /site/content/docs/5.3/examples/dashboard-rtl
parentReleasing debian version 5.2.3+dfsg-8. (diff)
downloadbootstrap-html-db46bfc03f3a22752ef6bd91ae577d893872a216.tar.xz
bootstrap-html-db46bfc03f3a22752ef6bd91ae577d893872a216.zip
Merging upstream version 5.3.0+dfsg.
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'site/content/docs/5.3/examples/dashboard-rtl')
-rw-r--r--site/content/docs/5.3/examples/dashboard-rtl/dashboard.js49
-rw-r--r--site/content/docs/5.3/examples/dashboard-rtl/index.html333
2 files changed, 382 insertions, 0 deletions
diff --git a/site/content/docs/5.3/examples/dashboard-rtl/dashboard.js b/site/content/docs/5.3/examples/dashboard-rtl/dashboard.js
new file mode 100644
index 0000000..bdb3029
--- /dev/null
+++ b/site/content/docs/5.3/examples/dashboard-rtl/dashboard.js
@@ -0,0 +1,49 @@
+/* globals Chart:false */
+
+(() => {
+ 'use strict'
+
+ // Graphs
+ const ctx = document.getElementById('myChart')
+ // eslint-disable-next-line no-unused-vars
+ const myChart = new Chart(ctx, {
+ type: 'line',
+ data: {
+ labels: [
+ 'الأحد',
+ 'الإثنين',
+ 'الثلاثاء',
+ 'الأربعاء',
+ 'الخميس',
+ 'الجمعة',
+ 'السبت'
+ ],
+ datasets: [{
+ data: [
+ 15339,
+ 21345,
+ 18483,
+ 24003,
+ 23489,
+ 24092,
+ 12034
+ ],
+ lineTension: 0,
+ backgroundColor: 'transparent',
+ borderColor: '#007bff',
+ borderWidth: 4,
+ pointBackgroundColor: '#007bff'
+ }]
+ },
+ options: {
+ plugins: {
+ legend: {
+ display: false
+ },
+ tooltip: {
+ boxPadding: 3
+ }
+ }
+ }
+ })
+})()
diff --git a/site/content/docs/5.3/examples/dashboard-rtl/index.html b/site/content/docs/5.3/examples/dashboard-rtl/index.html
new file mode 100644
index 0000000..252b775
--- /dev/null
+++ b/site/content/docs/5.3/examples/dashboard-rtl/index.html
@@ -0,0 +1,333 @@
+---
+layout: examples
+title: قالب لوحة القيادة
+direction: rtl
+extra_css:
+ - "https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css"
+ - "../dashboard/dashboard.rtl.css"
+extra_js:
+ - src: "https://cdn.jsdelivr.net/npm/chart.js@4.2.1/dist/chart.umd.min.js"
+ integrity: "sha384-gdQErvCNWvHQZj6XZM0dNsAoY4v+j5P1XDpNkcM3HJG1Yx04ecqIHk7+4VBOCHOG"
+ - src: "dashboard.js"
+---
+
+<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
+ <symbol id="calendar3" viewBox="0 0 16 16">
+ <path d="M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z"/>
+ <path d="M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"/>
+ </symbol>
+ <symbol id="cart" viewBox="0 0 16 16">
+ <path d="M0 1.5A.5.5 0 0 1 .5 1H2a.5.5 0 0 1 .485.379L2.89 3H14.5a.5.5 0 0 1 .49.598l-1 5a.5.5 0 0 1-.465.401l-9.397.472L4.415 11H13a.5.5 0 0 1 0 1H4a.5.5 0 0 1-.491-.408L2.01 3.607 1.61 2H.5a.5.5 0 0 1-.5-.5zM3.102 4l.84 4.479 9.144-.459L13.89 4H3.102zM5 12a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm7 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm-7 1a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm7 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
+ </symbol>
+ <symbol id="chevron-right" viewBox="0 0 16 16">
+ <path fill-rule="evenodd" d="M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z"/>
+ </symbol>
+ <symbol id="door-closed" viewBox="0 0 16 16">
+ <path d="M3 2a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v13h1.5a.5.5 0 0 1 0 1h-13a.5.5 0 0 1 0-1H3V2zm1 13h8V2H4v13z"/>
+ <path d="M9 9a1 1 0 1 0 2 0 1 1 0 0 0-2 0z"/>
+ </symbol>
+ <symbol id="file-earmark" viewBox="0 0 16 16">
+ <path d="M14 4.5V14a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2h5.5L14 4.5zm-3 0A1.5 1.5 0 0 1 9.5 3V1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V4.5h-2z"/>
+ </symbol>
+ <symbol id="file-earmark-text" viewBox="0 0 16 16">
+ <path d="M5.5 7a.5.5 0 0 0 0 1h5a.5.5 0 0 0 0-1h-5zM5 9.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0 2a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2a.5.5 0 0 1-.5-.5z"/>
+ <path d="M9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4.5L9.5 0zm0 1v2A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5z"/>
+ </symbol>
+ <symbol id="gear-wide-connected" viewBox="0 0 16 16">
+ <path d="M7.068.727c.243-.97 1.62-.97 1.864 0l.071.286a.96.96 0 0 0 1.622.434l.205-.211c.695-.719 1.888-.03 1.613.931l-.08.284a.96.96 0 0 0 1.187 1.187l.283-.081c.96-.275 1.65.918.931 1.613l-.211.205a.96.96 0 0 0 .434 1.622l.286.071c.97.243.97 1.62 0 1.864l-.286.071a.96.96 0 0 0-.434 1.622l.211.205c.719.695.03 1.888-.931 1.613l-.284-.08a.96.96 0 0 0-1.187 1.187l.081.283c.275.96-.918 1.65-1.613.931l-.205-.211a.96.96 0 0 0-1.622.434l-.071.286c-.243.97-1.62.97-1.864 0l-.071-.286a.96.96 0 0 0-1.622-.434l-.205.211c-.695.719-1.888.03-1.613-.931l.08-.284a.96.96 0 0 0-1.186-1.187l-.284.081c-.96.275-1.65-.918-.931-1.613l.211-.205a.96.96 0 0 0-.434-1.622l-.286-.071c-.97-.243-.97-1.62 0-1.864l.286-.071a.96.96 0 0 0 .434-1.622l-.211-.205c-.719-.695-.03-1.888.931-1.613l.284.08a.96.96 0 0 0 1.187-1.186l-.081-.284c-.275-.96.918-1.65 1.613-.931l.205.211a.96.96 0 0 0 1.622-.434l.071-.286zM12.973 8.5H8.25l-2.834 3.779A4.998 4.998 0 0 0 12.973 8.5zm0-1a4.998 4.998 0 0 0-7.557-3.779l2.834 3.78h4.723zM5.048 3.967c-.03.021-.058.043-.087.065l.087-.065zm-.431.355A4.984 4.984 0 0 0 3.002 8c0 1.455.622 2.765 1.615 3.678L7.375 8 4.617 4.322zm.344 7.646.087.065-.087-.065z"/>
+ </symbol>
+ <symbol id="graph-up" viewBox="0 0 16 16">
+ <path fill-rule="evenodd" d="M0 0h1v15h15v1H0V0Zm14.817 3.113a.5.5 0 0 1 .07.704l-4.5 5.5a.5.5 0 0 1-.74.037L7.06 6.767l-3.656 5.027a.5.5 0 0 1-.808-.588l4-5.5a.5.5 0 0 1 .758-.06l2.609 2.61 4.15-5.073a.5.5 0 0 1 .704-.07Z"/>
+ </symbol>
+ <symbol id="house-fill" viewBox="0 0 16 16">
+ <path d="M8.707 1.5a1 1 0 0 0-1.414 0L.646 8.146a.5.5 0 0 0 .708.708L8 2.207l6.646 6.647a.5.5 0 0 0 .708-.708L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.707 1.5Z"/>
+ <path d="m8 3.293 6 6V13.5a1.5 1.5 0 0 1-1.5 1.5h-9A1.5 1.5 0 0 1 2 13.5V9.293l6-6Z"/>
+ </symbol>
+ <symbol id="list" viewBox="0 0 16 16">
+ <path fill-rule="evenodd" d="M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5z"/>
+ </symbol>
+ <symbol id="people" viewBox="0 0 16 16">
+ <path d="M15 14s1 0 1-1-1-4-5-4-5 3-5 4 1 1 1 1h8Zm-7.978-1A.261.261 0 0 1 7 12.996c.001-.264.167-1.03.76-1.72C8.312 10.629 9.282 10 11 10c1.717 0 2.687.63 3.24 1.276.593.69.758 1.457.76 1.72l-.008.002a.274.274 0 0 1-.014.002H7.022ZM11 7a2 2 0 1 0 0-4 2 2 0 0 0 0 4Zm3-2a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM6.936 9.28a5.88 5.88 0 0 0-1.23-.247A7.35 7.35 0 0 0 5 9c-4 0-5 3-5 4 0 .667.333 1 1 1h4.216A2.238 2.238 0 0 1 5 13c0-1.01.377-2.042 1.09-2.904.243-.294.526-.569.846-.816ZM4.92 10A5.493 5.493 0 0 0 4 13H1c0-.26.164-1.03.76-1.724.545-.636 1.492-1.256 3.16-1.275ZM1.5 5.5a3 3 0 1 1 6 0 3 3 0 0 1-6 0Zm3-2a2 2 0 1 0 0 4 2 2 0 0 0 0-4Z"/>
+ </symbol>
+ <symbol id="plus-circle" viewBox="0 0 16 16">
+ <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
+ <path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z"/>
+ </symbol>
+ <symbol id="puzzle" viewBox="0 0 16 16">
+ <path d="M3.112 3.645A1.5 1.5 0 0 1 4.605 2H7a.5.5 0 0 1 .5.5v.382c0 .696-.497 1.182-.872 1.469a.459.459 0 0 0-.115.118.113.113 0 0 0-.012.025L6.5 4.5v.003l.003.01c.004.01.014.028.036.053a.86.86 0 0 0 .27.194C7.09 4.9 7.51 5 8 5c.492 0 .912-.1 1.19-.24a.86.86 0 0 0 .271-.194.213.213 0 0 0 .039-.063v-.009a.112.112 0 0 0-.012-.025.459.459 0 0 0-.115-.118c-.375-.287-.872-.773-.872-1.469V2.5A.5.5 0 0 1 9 2h2.395a1.5 1.5 0 0 1 1.493 1.645L12.645 6.5h.237c.195 0 .42-.147.675-.48.21-.274.528-.52.943-.52.568 0 .947.447 1.154.862C15.877 6.807 16 7.387 16 8s-.123 1.193-.346 1.638c-.207.415-.586.862-1.154.862-.415 0-.733-.246-.943-.52-.255-.333-.48-.48-.675-.48h-.237l.243 2.855A1.5 1.5 0 0 1 11.395 14H9a.5.5 0 0 1-.5-.5v-.382c0-.696.497-1.182.872-1.469a.459.459 0 0 0 .115-.118.113.113 0 0 0 .012-.025L9.5 11.5v-.003a.214.214 0 0 0-.039-.064.859.859 0 0 0-.27-.193C8.91 11.1 8.49 11 8 11c-.491 0-.912.1-1.19.24a.859.859 0 0 0-.271.194.214.214 0 0 0-.039.063v.003l.001.006a.113.113 0 0 0 .012.025c.016.027.05.068.115.118.375.287.872.773.872 1.469v.382a.5.5 0 0 1-.5.5H4.605a1.5 1.5 0 0 1-1.493-1.645L3.356 9.5h-.238c-.195 0-.42.147-.675.48-.21.274-.528.52-.943.52-.568 0-.947-.447-1.154-.862C.123 9.193 0 8.613 0 8s.123-1.193.346-1.638C.553 5.947.932 5.5 1.5 5.5c.415 0 .733.246.943.52.255.333.48.48.675.48h.238l-.244-2.855zM4.605 3a.5.5 0 0 0-.498.55l.001.007.29 3.4A.5.5 0 0 1 3.9 7.5h-.782c-.696 0-1.182-.497-1.469-.872a.459.459 0 0 0-.118-.115.112.112 0 0 0-.025-.012L1.5 6.5h-.003a.213.213 0 0 0-.064.039.86.86 0 0 0-.193.27C1.1 7.09 1 7.51 1 8c0 .491.1.912.24 1.19.07.14.14.225.194.271a.213.213 0 0 0 .063.039H1.5l.006-.001a.112.112 0 0 0 .025-.012.459.459 0 0 0 .118-.115c.287-.375.773-.872 1.469-.872H3.9a.5.5 0 0 1 .498.542l-.29 3.408a.5.5 0 0 0 .497.55h1.878c-.048-.166-.195-.352-.463-.557-.274-.21-.52-.528-.52-.943 0-.568.447-.947.862-1.154C6.807 10.123 7.387 10 8 10s1.193.123 1.638.346c.415.207.862.586.862 1.154 0 .415-.246.733-.52.943-.268.205-.415.39-.463.557h1.878a.5.5 0 0 0 .498-.55l-.001-.007-.29-3.4A.5.5 0 0 1 12.1 8.5h.782c.696 0 1.182.497 1.469.872.05.065.091.099.118.115.013.008.021.01.025.012a.02.02 0 0 0 .006.001h.003a.214.214 0 0 0 .064-.039.86.86 0 0 0 .193-.27c.14-.28.24-.7.24-1.191 0-.492-.1-.912-.24-1.19a.86.86 0 0 0-.194-.271.215.215 0 0 0-.063-.039H14.5l-.006.001a.113.113 0 0 0-.025.012.459.459 0 0 0-.118.115c-.287.375-.773.872-1.469.872H12.1a.5.5 0 0 1-.498-.543l.29-3.407a.5.5 0 0 0-.497-.55H9.517c.048.166.195.352.463.557.274.21.52.528.52.943 0 .568-.447.947-.862 1.154C9.193 5.877 8.613 6 8 6s-1.193-.123-1.638-.346C5.947 5.447 5.5 5.068 5.5 4.5c0-.415.246-.733.52-.943.268-.205.415-.39.463-.557H4.605z"/>
+ </symbol>
+ <symbol id="search" viewBox="0 0 16 16">
+ <path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/>
+ </symbol>
+</svg>
+
+<header class="navbar sticky-top bg-dark flex-md-nowrap p-0 shadow" data-bs-theme="dark">
+ <a class="navbar-brand col-md-3 col-lg-2 me-0 px-3 fs-6 text-white" href="#">اسم الشركة</a>
+
+ <ul class="navbar-nav flex-row d-md-none">
+ <li class="nav-item text-nowrap">
+ <button class="nav-link px-3 text-white" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSearch" aria-controls="navbarSearch" aria-expanded="false" aria-label="تبديل البحث">
+ <svg class="bi"><use xlink:href="#search"/></svg>
+ </button>
+ </li>
+ <li class="nav-item text-nowrap">
+ <button class="nav-link px-3 text-white" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="تبديل التنقل">
+ <svg class="bi"><use xlink:href="#list"/></svg>
+ </button>
+ </li>
+ </ul>
+
+ <div id="navbarSearch" class="navbar-search w-100 collapse">
+ <input class="form-control w-100 rounded-0 border-0" type="text" placeholder="بحث" aria-label="بحث">
+ </div>
+</header>
+
+<div class="container-fluid">
+ <div class="row">
+ <div class="sidebar border border-right col-md-3 col-lg-2 p-0 bg-body-tertiary">
+ <div class="offcanvas-lg offcanvas-end bg-body-tertiary" tabindex="-1" id="sidebarMenu" aria-labelledby="sidebarMenuLabel">
+ <div class="offcanvas-header">
+ <h5 class="offcanvas-title" id="sidebarMenuLabel">Company name</h5>
+ <button type="button" class="btn-close" data-bs-dismiss="offcanvas" data-bs-target="#sidebarMenu" aria-label="يغلق"></button>
+ </div>
+ <div class="offcanvas-body d-md-flex flex-column p-0 pt-lg-3 overflow-y-auto">
+ <ul class="nav flex-column">
+ <li class="nav-item">
+ <a class="nav-link d-flex align-items-center gap-2 active" aria-current="page" href="#">
+ <svg class="bi"><use xlink:href="#house-fill"/></svg>
+ لوحة القيادة
+ </a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link d-flex align-items-center gap-2" href="#">
+ <svg class="bi"><use xlink:href="#file-earmark"/></svg>
+ الطلبات
+ </a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link d-flex align-items-center gap-2" href="#">
+ <svg class="bi"><use xlink:href="#cart"/></svg>
+ المنتجات
+ </a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link d-flex align-items-center gap-2" href="#">
+ <svg class="bi"><use xlink:href="#people"/></svg>
+ الزبائن
+ </a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link d-flex align-items-center gap-2" href="#">
+ <svg class="bi"><use xlink:href="#graph-up"/></svg>
+ التقارير
+ </a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link d-flex align-items-center gap-2" href="#">
+ <svg class="bi"><use xlink:href="#puzzle"/></svg>
+ التكاملات
+ </a>
+ </li>
+ </ul>
+
+ <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-body-secondary text-uppercase">
+ <span>التقارير المحفوظة</span>
+ <a class="link-secondary" href="#" aria-label="إضافة تقرير جديد">
+ <svg class="bi"><use xlink:href="#plus-circle"/></svg>
+ </a>
+ </h6>
+ <ul class="nav flex-column mb-auto">
+ <li class="nav-item">
+ <a class="nav-link d-flex align-items-center gap-2" href="#">
+ <svg class="bi"><use xlink:href="#file-earmark-text"/></svg>
+ الشهر الحالي
+ </a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link d-flex align-items-center gap-2" href="#">
+ <svg class="bi"><use xlink:href="#file-earmark-text"/></svg>
+ الربع الأخير
+ </a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link d-flex align-items-center gap-2" href="#">
+ <svg class="bi"><use xlink:href="#file-earmark-text"/></svg>
+ التفاعل الإجتماعي
+ </a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link d-flex align-items-center gap-2" href="#">
+ <svg class="bi"><use xlink:href="#file-earmark-text"/></svg>
+ مبيعات نهاية العام
+ </a>
+ </li>
+ </ul>
+
+ <hr class="my-3">
+
+ <ul class="nav flex-column mb-auto">
+ <li class="nav-item">
+ <a class="nav-link d-flex align-items-center gap-2" href="#">
+ <svg class="bi"><use xlink:href="#gear-wide-connected"/></svg>
+ إعدادات
+ </a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link d-flex align-items-center gap-2" href="#">
+ <svg class="bi"><use xlink:href="#door-closed"/></svg>
+ خروج
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
+ <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
+ <h1 class="h2">لوحة القيادة</h1>
+ <div class="btn-toolbar mb-2 mb-md-0">
+ <div class="btn-group me-2">
+ <button type="button" class="btn btn-sm btn-outline-secondary">مشاركة</button>
+ <button type="button" class="btn btn-sm btn-outline-secondary">تصدير</button>
+ </div>
+ <button type="button" class="btn btn-sm btn-outline-secondary dropdown-toggle d-flex align-items-center gap-1">
+ <svg class="bi"><use xlink:href="#calendar3"/></svg>
+ هذا الأسبوع
+ </button>
+ </div>
+ </div>
+
+ <canvas class="my-4 w-100" id="myChart" width="900" height="380"></canvas>
+
+ <h2>عنوان القسم</h2>
+ <div class="table-responsive small">
+ <table class="table table-striped table-sm">
+ <thead>
+ <tr>
+ <th scope="col">#</th>
+ <th scope="col">عنوان</th>
+ <th scope="col">عنوان</th>
+ <th scope="col">عنوان</th>
+ <th scope="col">عنوان</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>1,001</td>
+ <td>بيانات</td>
+ <td>عشوائية</td>
+ <td>تثري</td>
+ <td>الجدول</td>
+ </tr>
+ <tr>
+ <td>1,002</td>
+ <td>تثري</td>
+ <td>مبهة</td>
+ <td>تصميم</td>
+ <td>تنسيق</td>
+ </tr>
+ <tr>
+ <td>1,003</td>
+ <td>عشوائية</td>
+ <td>غنية</td>
+ <td>قيمة</td>
+ <td>مفيدة</td>
+ </tr>
+ <tr>
+ <td>1,003</td>
+ <td>معلومات</td>
+ <td>تثري</td>
+ <td>توضيحية</td>
+ <td>عشوائية</td>
+ </tr>
+ <tr>
+ <td>1,004</td>
+ <td>الجدول</td>
+ <td>بيانات</td>
+ <td>تنسيق</td>
+ <td>قيمة</td>
+ </tr>
+ <tr>
+ <td>1,005</td>
+ <td>قيمة</td>
+ <td>مبهة</td>
+ <td>الجدول</td>
+ <td>تثري</td>
+ </tr>
+ <tr>
+ <td>1,006</td>
+ <td>قيمة</td>
+ <td>توضيحية</td>
+ <td>غنية</td>
+ <td>عشوائية</td>
+ </tr>
+ <tr>
+ <td>1,007</td>
+ <td>تثري</td>
+ <td>مفيدة</td>
+ <td>معلومات</td>
+ <td>مبهة</td>
+ </tr>
+ <tr>
+ <td>1,008</td>
+ <td>بيانات</td>
+ <td>عشوائية</td>
+ <td>تثري</td>
+ <td>الجدول</td>
+ </tr>
+ <tr>
+ <td>1,009</td>
+ <td>تثري</td>
+ <td>مبهة</td>
+ <td>تصميم</td>
+ <td>تنسيق</td>
+ </tr>
+ <tr>
+ <td>1,010</td>
+ <td>عشوائية</td>
+ <td>غنية</td>
+ <td>قيمة</td>
+ <td>مفيدة</td>
+ </tr>
+ <tr>
+ <td>1,011</td>
+ <td>معلومات</td>
+ <td>تثري</td>
+ <td>توضيحية</td>
+ <td>عشوائية</td>
+ </tr>
+ <tr>
+ <td>1,012</td>
+ <td>الجدول</td>
+ <td>تثري</td>
+ <td>تنسيق</td>
+ <td>قيمة</td>
+ </tr>
+ <tr>
+ <td>1,013</td>
+ <td>قيمة</td>
+ <td>مبهة</td>
+ <td>الجدول</td>
+ <td>تصميم</td>
+ </tr>
+ <tr>
+ <td>1,014</td>
+ <td>قيمة</td>
+ <td>توضيحية</td>
+ <td>غنية</td>
+ <td>عشوائية</td>
+ </tr>
+ <tr>
+ <td>1,015</td>
+ <td>بيانات</td>
+ <td>مفيدة</td>
+ <td>معلومات</td>
+ <td>الجدول</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </main>
+ </div>
+</div>