Merge pull request #63 from zainbinfurqan/setting-button

worked on setting icon button

Author: jsvigneshkanna

tailwind_components/buttons/collection.js

@@ -2,12 +2,14 @@ import test from "./test_file";
 import test1 from "./test1_file";
 import deleteButton from "./delete_button";
 import cardWithButton from "./card_with_button_button1";
+import settingButton from "./rectangle_setting";
 
 const buttonCollections = [
-  {componentName: "button1", component: test},
-  {componentName: "button2", component: test1},
-  {componentName: "Card with button", component: cardWithButton},
-  {componentName: "Delete button", component: deleteButton},
+  { componentName: "button1", component: test },
+  { componentName: "button2", component: test1 },
+  { componentName: "Card with button", component: cardWithButton },
+  { componentName: "Delete button", component: deleteButton },
+  { componentName: "Setting button", component: settingButton },
 
 ];
 

tailwind_components/buttons/rectangle_setting.jsx

@@ -0,0 +1,22 @@
+import { stripIndent } from "react-codepen-prefill-embed";
+
+const rectangleSettingButton = stripIndent`<div class="bg-gray-50">
+<div class="mx-auto max-w-7xl py-12 px-4 sm:px-6 lg:flex lg:items-center lg:justify-between lg:py-16 lg:px-8">
+  <div class="mt-8 flex lg:mt-0 lg:flex-shrink-0">
+    <div class="inline-flex rounded-md shadow">
+      <a
+        href="#"
+        class="inline-flex items-center justify-center rounded-sm border border-blue-400 bg-blue-200 px-5 py-3 text-base font-medium text-blue-500 hover:bg-blue-200">
+        <span class="mx-2">
+        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
+        <path stroke-linecap="round" stroke-linejoin="round" d="M10.5 6h9.75M10.5 6a1.5 1.5 0 11-3 0m3 0a1.5 1.5 0 10-3 0M3.75 6H7.5m3 12h9.75m-9.75 0a1.5 1.5 0 01-3 0m3 0a1.5 1.5 0 00-3 0m-3.75 0H7.5m9-6h3.75m-3.75 0a1.5 1.5 0 01-3 0m3 0a1.5 1.5 0 00-3 0m-9.75 0h9.75" />
+      </svg>
+</span>
+       Setting
+      </a>
+    </div>
+  </div>
+</div>
+</div>`;
+
+export default rectangleSettingButton;