Merge pull request #135 from raazseth/PR87

[Done] Not-allowed alert in tailwind #87

Author: jsvigneshkanna

tailwind_components/alerts/collection.js

@@ -1,3 +1,4 @@
+import not_allowed_alert from "./not_allowed_alert";
 import infoAlert from "./info_alert";
 import tickAlert from "./tick_alert";
 import report_alert from "./report_alert";
@@ -6,6 +7,6 @@ const alertCollections = [
   {componentName: "Info Alert", component: infoAlert},
   {componentName: "Tick Alert", component: tickAlert},
   {componentName: "Report Alert", component: report_alert},
-]
-
+  {componentName: "Not-Allowed Alert", component: not_allowed_alert},
+];
 export default alertCollections;

tailwind_components/alerts/not_allowed_alert.jsx

@@ -0,0 +1,20 @@
+import {stripIndent} from "react-codepen-prefill-embed";
+
+const not_allowed_alert = stripIndent`
+<div className="flex justify-center mt-56 bg-slate-300 w-1/2 mx-auto p-4">
+  <div class="flex flex-row bg-[#ffdede] w-11/12 mr-auto mt-40 ml-auto h-11 text-[#c6473b] rounded-xl p-2 border-[#c6473b]">
+
+  <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 27 27" strokeWidth={1.5} stroke="currentColor"  className="flex w-1 h-1 mt-20 mb-20">
+  <path strokeLinecap="round" strokeLinejoin="round" d="M18.364 18.364A9 9 0 005.636 5.636m12.728 12.728A9 9 0 015.636 5.636m12.728 12.728L5.636 5.636" />
+  </svg>
+
+   <h3 class="mr-auto">This is a not allowed alert!</h3>
+
+  <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 27 27" strokeWidth={1.5} stroke="currentColor" className="w-6 h-6 mt-auto mb-auto ml-auto text-right cursor-pointer">
+  <path strokeLinecap="round" class="ml-10" strokeLinejoin="round" d="M6 18L18 6M6 6l12 12" />
+  </svg>
+  
+  </div>
+</div>`;
+
+export default not_allowed_alert;

tailwind_components/alerts/report_alert.jsx

@@ -3,15 +3,15 @@ import {stripIndent} from "react-codepen-prefill-embed";
 const check_box = stripIndent`
 <div className="flex justify-center mt-56 bg-slate-300 w-1/2 mx-auto p-4">
   <div class="flex flex-row bg-[#fff6ef] w-11/12 mr-auto mt-40 ml-auto h-11 text-[#d4975c] rounded-xl p-2 border-x-orange-500">
-   
-    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 27 27" strokeWidth={1.5} stroke="currentColor" className="flex w-1 h-1 mt-20 mb-20">
+    
+  <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 27 27" strokeWidth={1.5} stroke="currentColor" className="flex w-1 h-1 mt-20 mb-20">
     <path strokeLinecap="round" strokeLinejoin="round" d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z" />
   </svg>
 
    <h3 class="mr-auto">This is a warning alert!</h3>
 
-  <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 27 27" strokeWidth={1.5} stroke="currentColor" className="w-6 h-6 mt-auto mb-auto ml-auto text-right	">
-  <path strokeLinecap="round" class="ml-10" strokeLinejoin="round" d="M6 18L18 6M6 6l12 12" />
+  <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 27 27" strokeWidth={1.5} stroke="currentColor" className="w-6 h-6 mt-auto mb-auto ml-auto text-right	cursor-pointer">
+   <path strokeLinecap="round" class="ml-10" strokeLinejoin="round" d="M6 18L18 6M6 6l12 12" />
   </svg>
   
   </div>