feat: tailwind border-radius code (#419)

* feat: tailwind border-radius code

Added tailwind code generator for border radius property

* fix: added custom value for radius

* fix: build error fixed

---------

Co-authored-by: Aqsa Aqeel <[email protected]>

Author: aqsaaqeel

src/lib/packages.ts

@@ -79,8 +79,12 @@ export function copyCSSCodeToClipboard(
  * @param attribute The attribute name of the generator element
  * @param outputElement output element to display result
  */
-export function copyTailwindCodeToClipboard(attribute: string): void {
-  actOnTailwindGenerator(attribute);
+export function copyTailwindCodeToClipboard(
+  attribute: string,
+  outputElement?: HTMLElement | null
+): void {
+  if (outputElement) actOnTailwindGenerator(attribute, outputElement);
+  else console.log("Can't generate tailwind code");
 }
 
 export const addRule = (function (style) {
@@ -267,9 +271,12 @@ const actOnGenerator = (attribute: string, outputElement: HTMLElement) => {
  * @param attribute attribute of the clicked generator
  * @param outputElement output element to display result
  */
-const actOnTailwindGenerator = (attribute: string) => {
+const actOnTailwindGenerator = (
+  attribute: string,
+  outputElement: HTMLElement
+) => {
+  let element = outputElement.style;
   let codeToCopy = '';
-
   switch (attribute) {
     case 'pic-text':
       codeToCopy = ``;
@@ -284,7 +291,7 @@ const actOnTailwindGenerator = (attribute: string) => {
       codeToCopy = ``;
       break;
     case 'border-radius':
-      codeToCopy = ``;
+      codeToCopy = `rounded-[${element.borderRadius.replace(/ /g, '_')}]`;
       break;
     case 'box-shadow':
       codeToCopy = ``;

src/pages/border-radius.ts

@@ -148,7 +148,8 @@ getValues();
 
 // Tailwind codecopy handler
 function tailwindHandler() {
-  copyTailwindCodeToClipboard(attribute);
+  const outputElement = getOutput(attribute);
+  copyTailwindCodeToClipboard(attribute, outputElement);
   showPopup(
     'Tailwind Code Copied',
     'Code has been successfully copied to clipboard',