Merge pull request mostafizurhimself#162 from tech-masih/bugfix/respo…

…nsive-chart fix: responsive chart issue
AndrewSithole · May 1, 2023 · 16c89d6 · 16c89d6
2 parents e9bc042 + e85ddb3
commit 16c89d6
Show file tree

Hide file tree

Showing 53 changed files with 152 additions and 155 deletions.
diff --git a/src/accordion.html b/src/accordion.html
@@ -904,7 +904,7 @@ <h4 class="card-title">Flush Accordion</h4>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -923,7 +923,7 @@ <h4 class="card-title">Flush Accordion</h4>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/alert.html b/src/alert.html
@@ -1069,7 +1069,7 @@ <h4 class="card-title">Additional Content</h4>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -1089,7 +1089,7 @@ <h4 class="card-title">Additional Content</h4>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/avatar.html b/src/avatar.html
@@ -1066,7 +1066,7 @@ <h4 class="card-title">Avatar Group</h4>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -1085,7 +1085,7 @@ <h4 class="card-title">Avatar Group</h4>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/badge.html b/src/badge.html
@@ -918,7 +918,7 @@ <h4 class="card-title">Badge With Icon</h4>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -937,7 +937,7 @@ <h4 class="card-title">Badge With Icon</h4>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/basic-table.html b/src/basic-table.html
@@ -1826,7 +1826,7 @@ <h4 class="card-title">Color Table</h4>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -1845,7 +1845,7 @@ <h4 class="card-title">Color Table</h4>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/button.html b/src/button.html
@@ -1082,7 +1082,7 @@ <h4 class="card-title">Group Buttons</h4>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -1101,7 +1101,7 @@ <h4 class="card-title">Group Buttons</h4>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/calendar.html b/src/calendar.html
@@ -952,7 +952,7 @@ <h6 class="modal-title">Update Event</h6>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -971,7 +971,7 @@ <h6 class="modal-title">Update Event</h6>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/card.html b/src/card.html
@@ -959,7 +959,7 @@ <h4 class="card-title">Card Title</h4>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -978,7 +978,7 @@ <h4 class="card-title">Card Title</h4>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/carousel.html b/src/carousel.html
@@ -1761,7 +1761,7 @@ <h4 class="card-title">Custom Swiper</h4>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -1780,7 +1780,7 @@ <h4 class="card-title">Custom Swiper</h4>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/chart.html b/src/chart.html
@@ -768,7 +768,7 @@ <h4 class="card-title">Line Chart</h4>
 
                   <div id="line-chart-code-viewer" data-render-source="false" class="code-viewer relative mt-4">
                     <div class="code-viewer-content">
-                      <div id="line-chart"></div>
+                      <div id="line-chart" class="-ml-4 -mr-2 sm:-mx-4"></div>
                     </div>
                   </div>
                 </div>
@@ -783,7 +783,7 @@ <h4 class="card-title">Area Chart</h4>
 
                   <div id="area-chart-code-viewer" data-render-source="false" class="code-viewer mt-4">
                     <div class="code-viewer-content">
-                      <div id="area-chart"></div>
+                      <div id="area-chart" class="-ml-4 -mr-2 sm:-mx-4"></div>
                     </div>
                   </div>
                 </div>
@@ -797,7 +797,7 @@ <h4 class="card-title">Column Chart</h4>
                   <p class="card-subtitle">Example of a column chart.</p>
                   <div id="column-chart-code-viewer" data-render-source="false" class="code-viewer mt-4">
                     <div class="code-viewer-content">
-                      <div id="column-chart"></div>
+                      <div id="column-chart" class="-ml-4 -mr-2 sm:-mx-4"></div>
                     </div>
                   </div>
                 </div>
@@ -811,7 +811,7 @@ <h4 class="card-title">Bar Chart</h4>
                   <p class="card-subtitle">Example of a bar chart.</p>
                   <div id="bar-chart-code-viewer" data-render-source="false" class="code-viewer mt-4">
                     <div class="code-viewer-content">
-                      <div id="bar-chart"></div>
+                      <div id="bar-chart" class="-ml-4 -mr-2 sm:-mx-4"></div>
                     </div>
                   </div>
                 </div>
@@ -825,7 +825,7 @@ <h4 class="card-title">Scatter Chart</h4>
                   <p class="card-subtitle">Example of a scatter chart.</p>
                   <div id="scatter-chart-code-viewer" data-render-source="false" class="code-viewer mt-4">
                     <div class="code-viewer-content">
-                      <div id="scatter-chart"></div>
+                      <div id="scatter-chart" class="-ml-4 -mr-2 sm:-mx-4"></div>
                     </div>
                   </div>
                 </div>
@@ -840,7 +840,7 @@ <h4 class="card-title">Pie Chart</h4>
                   <div id="pie-chart-code-viewer" data-render-source="false" class="code-viewer mt-4">
                     <div class="code-viewer-content">
                       <div class="flex items-center justify-center">
-                        <div id="pie-chart"></div>
+                        <div id="pie-chart" class="-ml-4 -mr-2 sm:-mx-4"></div>
                       </div>
                     </div>
                   </div>
@@ -856,7 +856,7 @@ <h4 class="card-title">Donut Chart</h4>
                   <div id="donut-chart-code-viewer" data-render-source="false" class="code-viewer mt-4">
                     <div class="code-viewer-content">
                       <div class="flex items-center justify-center">
-                        <div id="donut-chart"></div>
+                        <div id="donut-chart" class="-ml-4 -mr-2 sm:-mx-4"></div>
                       </div>
                     </div>
                   </div>
@@ -890,7 +890,7 @@ <h4 class="card-title">Donut Chart</h4>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -909,7 +909,7 @@ <h4 class="card-title">Donut Chart</h4>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/chat.html b/src/chat.html
@@ -1411,7 +1411,7 @@ <h6 class="whitespace-nowrap text-sm font-medium text-slate-700 dark:text-slate-
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -1430,7 +1430,7 @@ <h6 class="whitespace-nowrap text-sm font-medium text-slate-700 dark:text-slate-
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/checkbox.html b/src/checkbox.html
@@ -1103,7 +1103,7 @@ <h6>Svelte Js</h6>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -1122,7 +1122,7 @@ <h6>Svelte Js</h6>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/customer-list.html b/src/customer-list.html
@@ -1460,7 +1460,7 @@ <h6 class="whitespace-nowrap text-sm font-medium text-slate-700 dark:text-slate-
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -1479,7 +1479,7 @@ <h6 class="whitespace-nowrap text-sm font-medium text-slate-700 dark:text-slate-
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/data-table.html b/src/data-table.html
@@ -839,7 +839,7 @@ <h4 class="card-title">Data Table With Column Filter</h4>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -858,7 +858,7 @@ <h4 class="card-title">Data Table With Column Filter</h4>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/datepicker.html b/src/datepicker.html
@@ -957,7 +957,7 @@ <h4 class="card-title">Custom Datepicker</h4>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -976,7 +976,7 @@ <h4 class="card-title">Custom Datepicker</h4>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/drawer.html b/src/drawer.html
@@ -1363,7 +1363,7 @@ <h5>Disable Drawer Keypress</h5>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -1382,7 +1382,7 @@ <h5>Disable Drawer Keypress</h5>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>

diff --git a/src/dropdown.html b/src/dropdown.html
@@ -1530,7 +1530,7 @@ <h4 class="card-title">Custom Dropdown</h4>
       <div class="modal" id="search-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header px-6">
+            <div class="modal-header px-4 sm:px-6">
               <div class="group flex items-center">
                 <i
                   data-feather="search"
@@ -1549,7 +1549,7 @@ <h4 class="card-title">Custom Dropdown</h4>
                 </button>
               </div>
             </div>
-            <div class="modal-body max-h-[600px] p-6"></div>
+            <div class="modal-body max-h-[600px] px-4 py-6 sm:px-6"></div>
           </div>
         </div>
       </div>