add images

Author: sajadevo

README.md

@@ -35,159 +35,297 @@ Visit <a href="https://www.material-tailwind.com/docs/react/installation">https:
   <tr>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/accordion">
-        <img alt="accordion" src="https://www.material-tailwind.com/img/react-thumbnails/accordion.jpg">
+        <img alt="accordion" src="https://www.material-tailwind.com/image/components/accordion-thumbnail.jpg">
       </a>
     </td>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/alert">
-        <img alt="alert" src="https://www.material-tailwind.com/img/react-thumbnails/alert.jpg">
+        <img alt="alert" src="https://www.material-tailwind.com/image/components/alert-thumbnail.jpg">
       </a>
     </td>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/avatar">
-        <img alt="avatar" src="https://www.material-tailwind.com/img/react-thumbnails/avatar.jpg">
+        <img alt="avatar" src="https://www.material-tailwind.com/image/components/avatar-thumbnail.jpg">
       </a>
     </td>
   </tr>
   <tr>
+    <td width="33.3333%">Badge</td>
     <td width="33.3333%">Breadcrumbs</td>
     <td width="33.3333%">Button</td>
-    <td width="33.3333%">Card</td>
   </tr>
   <tr>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/badge">
+        <img alt="badge" src="https://www.material-tailwind.com/image/components/badge-thumbnail.jpg">
+      </a>
+    </td>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/breadcrumbs">
-        <img alt="breadcrumbs" src="https://www.material-tailwind.com/img/react-thumbnails/breadcrumbs.jpg">
+        <img alt="breadcrumbs" src="https://www.material-tailwind.com/image/components/breadcrumbs-thumbnail.jpg">
       </a>
     </td>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/button">
-        <img alt="button" src="https://www.material-tailwind.com/img/react-thumbnails/button.jpg">
+        <img alt="button" src="https://www.material-tailwind.com/image/components/button-thumbnail.jpg">
+      </a>
+    </td>
+  </tr>
+  <tr>
+    <td width="33.3333%">Button Group</td>
+    <td width="33.3333%">Card</td>
+    <td width="33.3333%">Checkbox</td>
+  </tr>
+  <tr>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/button-group">
+        <img alt="button-group" src="https://www.material-tailwind.com/image/components/buttongroup-thumbnail.jpg">
       </a>
     </td>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/card">
-        <img alt="card" src="https://www.material-tailwind.com/img/react-thumbnails/card.jpg">
+        <img alt="card" src="https://www.material-tailwind.com/image/components/card-thumbnail.jpg">
+      </a>
+    </td>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/checkbox">
+        <img alt="checkbox" src="https://www.material-tailwind.com/image/components/checkbox-thumbnail.jpg">
       </a>
     </td>
   </tr>
   <tr>
-    <td width="33.3333%">Checkbox</td>
     <td width="33.3333%">Chip</td>
-    <td width="33.3333%">Dialog</td>
+    <td width="33.3333%">Collapse</td>
+    <td width="33.3333%">Carousel</td>
   </tr>
   <tr>
     <td width="33.3333%" style="padding: 0;">
-      <a href="https://www.material-tailwind.com/docs/react/checkbox">
-        <img alt="checkbox" src="https://www.material-tailwind.com/img/react-thumbnails/checkbox.jpg">
+      <a href="https://www.material-tailwind.com/docs/react/chip">
+        <img alt="chip" src="https://www.material-tailwind.com/image/components/chip-thumbnail.jpg">
       </a>
     </td>
     <td width="33.3333%" style="padding: 0;">
-      <a href="https://www.material-tailwind.com/docs/react/chip">
-        <img alt="chip" src="https://www.material-tailwind.com/img/react-thumbnails/chip.jpg">
+      <a href="https://www.material-tailwind.com/docs/react/collapse">
+        <img alt="collapse" src="https://www.material-tailwind.com/image/components/collapse-thumbnail.jpg">
       </a>
     </td>
     <td width="33.3333%" style="padding: 0;">
-      <a href="https://www.material-tailwind.com/docs/react/dialog">
-        <img alt="dialog" src="https://www.material-tailwind.com/img/react-thumbnails/dialog.jpg">
+      <a href="https://www.material-tailwind.com/docs/react/carousel">
+        <img alt="carousel" src="https://www.material-tailwind.com/image/components/carousel-thumbnail.jpg">
       </a>
     </td>
   </tr>
   <tr>
+    <td width="33.3333%">Dialog</td>
+    <td width="33.3333%">Drawer</td>
     <td width="33.3333%">Icon Button</td>
-    <td width="33.3333%">Input</td>
-    <td width="33.3333%">Menu</td>
   </tr>
   <tr>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/dialog">
+        <img alt="dialog" src="https://www.material-tailwind.com/image/components/dialog-thumbnail.jpg">
+      </a>
+    </td>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/drawer">
+        <img alt="drawer" src="https://www.material-tailwind.com/image/components/drawer-thumbnail.jpg">
+      </a>
+    </td>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/icon-button">
-        <img alt="icon-button" src="https://www.material-tailwind.com/img/react-thumbnails/icon-button.jpg">
+        <img alt="icon-button" src="https://www.material-tailwind.com/image/components/icon-button-thumbnail.jpg">
       </a>
     </td>
+  </tr>
+  <tr>
+    <td width="33.3333%">Input</td>
+    <td width="33.3333%">Form</td>
+    <td width="33.3333%">List</td>
+  </tr>
+  <tr>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/input">
-        <img alt="input" src="https://www.material-tailwind.com/img/react-thumbnails/input.jpg">
+        <img alt="input" src="https://www.material-tailwind.com/image/components/input-thumbnail.jpg">
       </a>
     </td>
     <td width="33.3333%" style="padding: 0;">
-      <a href="https://www.material-tailwind.com/docs/react/menu">
-        <img alt="menu" src="https://www.material-tailwind.com/img/react-thumbnails/menu.jpg">
+      <a href="https://www.material-tailwind.com/docs/react/form">
+        <img alt="form" src="https://www.material-tailwind.com/image/components/form-thumbnail.jpg">
+      </a>
+    </td>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/list">
+        <img alt="list" src="https://www.material-tailwind.com/image/components/list-thumbnail.jpg">
       </a>
     </td>
   </tr>
   <tr>
+    <td width="33.3333%">Menu</td>
     <td width="33.3333%">Navbar</td>
     <td width="33.3333%">Popover</td>
-    <td width="33.3333%">Progress Bar</td>
   </tr>
   <tr>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/menu">
+        <img alt="menu" src="https://www.material-tailwind.com/image/components/menu-thumbnail.jpg">
+      </a>
+    </td>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/navbar">
-        <img alt="navbar" src="https://www.material-tailwind.com/img/react-thumbnails/navbar.jpg">
+        <img alt="navbar" src="https://www.material-tailwind.com/image/components/navbar-thumbnail.jpg">
       </a>
     </td>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/popover">
-        <img alt="popover" src="https://www.material-tailwind.com/img/react-thumbnails/popover.jpg">
+        <img alt="popover" src="https://www.material-tailwind.com/image/components/popover-thumbnail.jpg">
       </a>
     </td>
+  </tr>
+  <tr>
+    <td width="33.3333%">Progress Bar</td>
+    <td width="33.3333%">Pagination</td>
+    <td width="33.3333%">Radio Button</td>
+  </tr>
+  <tr>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/progress-bar">
-        <img alt="progress-bar" src="https://www.material-tailwind.com/img/react-thumbnails/progress-bar.jpg">
+        <img alt="progress-bar" src="https://www.material-tailwind.com/image/components/progress-bar-thumbnail.jpg">
+      </a>
+    </td>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/pagination">
+        <img alt="pagination" src="https://www.material-tailwind.com/image/components/pagination-thumbnail.jpg">
+      </a>
+    </td>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/radio-button">
+        <img alt="radio-button" src="https://www.material-tailwind.com/image/components/radio-button-thumbnail.jpg">
       </a>
     </td>
   </tr>
   <tr>
-    <td width="33.3333%">Radio Button</td>
+    <td width="33.3333%">Rating Bar</td>
     <td width="33.3333%">Select</td>
-    <td width="33.3333%">Switch</td>
+    <td width="33.3333%">Slider</td>
   </tr>
   <tr>
     <td width="33.3333%" style="padding: 0;">
-      <a href="https://www.material-tailwind.com/docs/react/radio-button">
-        <img alt="radio-button" src="https://www.material-tailwind.com/img/react-thumbnails/radio-button.jpg">
+      <a href="https://www.material-tailwind.com/docs/react/rating-bar">
+        <img alt="rating-bar" src="https://www.material-tailwind.com/image/components/ratingbar-thumbnail.jpg">
       </a>
     </td>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/select">
-        <img alt="select" src="https://www.material-tailwind.com/img/react-thumbnails/select.jpg">
+        <img alt="select" src="https://www.material-tailwind.com/image/components/select-thumbnail.jpg">
       </a>
     </td>
     <td width="33.3333%" style="padding: 0;">
-      <a href="https://www.material-tailwind.com/docs/react/switch">
-        <img alt="switch" src="https://www.material-tailwind.com/img/react-thumbnails/switch.jpg">
+      <a href="https://www.material-tailwind.com/docs/react/slider">
+        <img alt="slider" src="https://www.material-tailwind.com/image/components/slider-thumbnail.jpg">
       </a>
     </td>
   </tr>
   <tr>
+    <td width="33.3333%">Speed Dial</td>
+    <td width="33.3333%">Spinner</td>
+    <td width="33.3333%">Stepper</td>
+  </tr>
+  <tr>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/speed-dial">
+        <img alt="speed-dial" src="https://www.material-tailwind.com/image/components/speeddial-thumbnail.jpg">
+      </a>
+    </td>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/spinner">
+        <img alt="spinner" src="https://www.material-tailwind.com/image/components/spinner-thumbnail.jpg">
+      </a>
+    </td>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/stepper">
+        <img alt="stepper" src="https://www.material-tailwind.com/image/components/stepper-thumbnail.jpg">
+      </a>
+    </td>
+  </tr>
+  <tr>
+    <td width="33.3333%">Switch</td>
     <td width="33.3333%">Tabs</td>
-    <td width="33.3333%">Textarea</td>
-    <td width="33.3333%">Tooltip</td>
+    <td width="33.3333%">Text Area</td>
   </tr>
   <tr>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/switch">
+        <img alt="switch" src="https://www.material-tailwind.com/image/components/switch-thumbnail.jpg">
+      </a>
+    </td>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/tabs">
-        <img alt="tabs" src="https://www.material-tailwind.com/img/react-thumbnails/tabs.jpg">
+        <img alt="tabs" src="https://www.material-tailwind.com/image/components/tabs-thumbnail.jpg">
       </a>
     </td>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/textarea">
-        <img alt="textarea" src="https://www.material-tailwind.com/img/react-thumbnails/text-area.jpg">
+        <img alt="textarea" src="https://www.material-tailwind.com/image/components/text-area-thumbnail.jpg">
+      </a>
+    </td>
+  </tr>
+  <tr>
+    <td width="33.3333%">Timeline</td>
+    <td width="33.3333%">Tooltip</td>
+    <td width="33.3333%">Typography</td>
+  </tr>
+  <tr>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/timeline">
+        <img alt="timeline" src="https://www.material-tailwind.com/image/components/timeline-thumbnail.jpg">
       </a>
     </td>
     <td width="33.3333%" style="padding: 0;">
       <a href="https://www.material-tailwind.com/docs/react/tooltip">
-        <img alt="tooltip" src="https://www.material-tailwind.com/img/react-thumbnails/tooltip.jpg">
+        <img alt="tooltip" src="https://www.material-tailwind.com/image/components/tooltip-thumbnail.jpg">
+      </a>
+    </td>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/typography">
+        <img alt="typography" src="https://www.material-tailwind.com/image/components/typography-thumbnail.jpg">
       </a>
     </td>
   </tr>
   <tr>
-    <td width="33.3333%">Typography</td>
+    <td width="33.3333%">Footer</td>
+    <td width="33.3333%">Image</td>
+    <td width="33.3333%">Video</td>
   </tr>
   <tr>
     <td width="33.3333%" style="padding: 0;">
-      <a href="https://www.material-tailwind.com/docs/react/typography">
-        <img alt="typography" src="https://www.material-tailwind.com/img/react-thumbnails/typography.jpg">
+      <a href="https://www.material-tailwind.com/docs/react/footer">
+        <img alt="footer" src="https://www.material-tailwind.com/image/components/footer-thumbnail.jpg">
+      </a>
+    </td>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/img">
+        <img alt="img" src="https://www.material-tailwind.com/image/components/img-thumbnail.jpg">
+      </a>
+    </td>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/video">
+        <img alt="video" src="https://www.material-tailwind.com/image/components/video-thumbnail.jpg">
+      </a>
+    </td>
+  </tr>
+  <tr>
+    <td width="33.3333%">Sidebar</td>
+    <td width="33.3333%">Table</td>
+  </tr>
+  <tr>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/sidebar">
+        <img alt="sidebar" src="https://www.material-tailwind.com/image/components/sidebar-thumbnail.jpg">
+      </a>
+    </td>
+    <td width="33.3333%" style="padding: 0;">
+      <a href="https://www.material-tailwind.com/docs/react/table">
+        <img alt="table" src="https://www.material-tailwind.com/image/components/table-thumbnail.jpg">
       </a>
     </td>
   </tr>