Honestly, this is one of the most helpful software's that I've used till now. The way you give out the entire code is really something to appreciate. A sincere gratitude from my side for developing this piece of art♥️
Thank you for this well-made plugin, thank you so much!!! I just have one question, if I have several Framers to animate my landing page, will locofy be able to do those animations in code?
Very helpful video for understanding 👏. I didn't get what's the difference in use of deploy and export option?? At the end we just need code, and we can do copy and paste in our vocode and run from there !! Can you tell me a difference I both options?
Hi Swastik! When you export - you GET the code so that you can edit and customize it. You need to do this if you need to pull in data from a database into your website/app. We'll be doing a video guide on this soon! When you deploy - you PUBLISH the code, so that it runs on a server and people can start accessing your website/app. For a static website that does not need any code edits, this option is useful to easily make your product go live! Please do reach out if you need any further help, we're happy to jump on a call with you
Hi dear locofy i get a troublesome question when deploy to vercel. It fail and show"No Output Directory named "dist" found after the Build completed." How?
FIND IT HARD TO FOLLOW DUE TO NOT FULLY DISCLOSURE of how to find other TOOLS LIKE HAMBURGER ICON, so I had TO SEARCH OTHER INFORMATION BEFORE CONTINUING WITH THE VIDEO,ITS TOOK ME HOURS TO FINISHH 1 HOUR VIDEO
We understand. In this video, we assumed that the icons are present in the design. We recommend using Figma plugins such as Iconify to get icons you need.
I tried to hide the hamburger menu for the large device it worked but its not showing up in the small device and I even changed the display property to show for the small device the links gets hidden once the device changed to small one, I don't know why the hamburger menu is not showing up!
We have updated our flow significantly since this video. To view the same options choose Locofy Classic and follow the steps below. You can click edit in Step 3: Edit Styling & Layout to view the same UI
Hamburger Menu is initially hidden on the Figma file. We make use of the Media Queries and show the hamburger menu on smaller media queries using Styling and Layout Section on the Locofy Plugin.
We have updated our flow significantly since this video. To view the same options choose Locofy Classic and follow the steps below. You can click edit in Step 3: Edit Styling & Layout or Step 4: Add actions to view the same UI.
I am having problem to fir the webpage into mobile frame i.e. 428px. My hero section's width is either cut out or I am seeing the scroll bar below. Can Someone help me with how I can adjust my hero section to perfectly displayed on 428px.
Hi @mohannad khan, do check out this video on how to make your designs responsive - please let us know if this helps! ruclips.net/video/mcROyX3hQ6g/видео.html
Around @15:26 The option for selecting a Container doesn't seem to be there for me anywhere. Where can I find it, or what should I use instead? I really really appreciate what you all have made here, Locofy is wonderful.
We have simplified the tags further and instead of offering container tag, we now directly allow you to choose between section, header, etc. tags that were previously present under the "container" tag.
There is issue is when you creating your design on figma so it's creating CSS on Position: Absolute; Property. Which is not goog for developers. Because if we need to change anything in future so it's a big issue for us. So how can I fix it. Is there any idea about this issue??
Use auto-layout to make your design responsive. Also, we suggest you to go through these docs: www.locofy.ai/docs/design-structure/responsiveness/auto-layout/ www.locofy.ai/docs/design-structure/responsiveness/locofys-approach/
Hey there! I tried using the locofy software , but there's always this relative and absolute styling that keeps occuring! for example i have two div tags inside a section tag, by default it should be like flex and gap or padding for the div container, but instead i keep getting relative for section and absolute for div tags which have height and width and top and left accurately measured , help me fix this issue of how to let locofy know how to nest items or containers!
By default, if you use auto layout, Locofy generated code will feature a flex property. The absolute positions occur when you have an absolute position item on your design and uses fixed sizes. You can read more on Locofy.ai's approach here: www.locofy.ai/docs/design-structure/responsiveness/locofys-approach/
hey locofy team, i believe u will anser my question, I am using breakpoint plugin in figma to combine for example 3,4 prototypes into one prototype to showcase it's responsiveness for different devices. so once i used breakpoint, then while using locofy plugin it can't recognize my responsive design at all as i used breakpoint though. what can I do then?
Hi @Showbik, at the moment we do not integrate with other plugins, here's a guide which shows you how you can approach responsiveness with Locofy: ruclips.net/video/9Ae6SeOQFDc/видео.html
Serioulsy, great work guys - lots of saving options and if everything is smooth. hats off! Also, it is quite a bit of work to organize all figma per frames...
@@locofy_ai Been playing with it last and was able to render pretty nicely a react build. you guys did a lot of work! The plugin sometimes lags when the previews are heavy. Also now. except this video, you guys dont have a guide to explain how to properly set your frames / auto-layouts so it will fit well with responsive design after tagging. Would be great to have a guide on how to set a nav bar / a two column, 3 columns... with their correct autolayout settings
Hey @Cyril, we do have a sample Figma project that guides you through these common layouts. Please head to www.figma.com/@locofy and duplicate our "Building a responsive website" tutorial
I loved the video! However, in the part where he explains how to make the design responsive, the video cuts to the final result. Is the explanation available? 9:17
HI Ayush, to make the navbar stick to the top, you would have to apply custom CSS properties: position: sticky, top:0. You can add all these using the Locofy plugin. For the drawer, we have a doc on this: www.locofy.ai/docs/export-and-deployment/examples/exporting-a-responsive-navbar/ Let us know if you need further help. Also, would love to invite you to our Slack community where you'll get support and relevant resources: www.locofy.ai/join-slack
Have you created your Locofy account and tried opening the plugin in Figma? You can follow this doc to get started: www.locofy.ai/docs/getting-started/create-new-locofy-account/
Instead of using the hover (and other states) from your plugin, can I use custom components states (default, pressed etc) I have already made on Figma?
Hi @Md. Mashuqur Rahman, we definitely do not think so. You still know how to read and understand the generated code in order to extend it and add logic to it. What Locofy does is help you to do the repetitive/mundane tasks, so that you can focus on the core logic of the app
Hi Mohamed, you can tag that hamburger as a button and add an action for it to open a popup that you've created. Do let us know if you need help with this!
Yes, Figma recently updated their UI. To add auto spacing, you need to first apply auto layout, then you will find the gap value (below the direction arrows), in the dropdown for the gaps, you will find "Auto", which will apply auto spacing. Here is a document by Figma: help.figma.com/hc/en-us/articles/360040451373-Explore-auto-layout-properties#spacing-between
And after all these efforts it will generate you a non sense code base which is helpful to beginners only because they don't know much about HTML CSS with flex box and containers.
Suman, would really like you to try the product before passing any judgement. Happy to help you try it out. Feel free to join our Slack community and our team is happy to answer your questions: www.locofy.ai/join-slack
@@locofy_ai yes I have tried it. When we put frames inside another frames it is producing a design where the inner frames are having absolute positioning producing unexpected outcomes.
I was worried to first create a figma design and then code it and making design layouts css was a nightmare to me even in css frameworks but this software solved my problem thanks Very much
Do check out our guide on Autolayout to learn more about how to apply Autolayout to your designs ruclips.net/video/uI2pEqz2THk/видео.html - you can also reach us on hello@locofy.ai or on our slack channel if you need further help www.locofy.ai/join-slack
Hi @Brendan, in the Styling & Layout tab, you can add this key-value pair in the custom css section "color: #aabbcc" where #aabbcc is the hex code of the text colour you want to use. Let us know if you need help with this!
Hi @Healing yourself, we're currently in Free BETA! You can create a free account and start using Locofy: www.locofy.ai/signup Let us know if you need any help!
Hi Arnob, if you are using our Figma file over here: www.figma.com/community/file/1142126078245550116/ You'll find the hamburger menu in the header bar as a hidden layer. That's because we have set it to be hidden on desktop screen size, and set it to show on mobile devices using the Locofy plugin.
Hi @Ed, for now, you can export your code and connect with your API endpoints from your code editor. Soon we'll be allowing you to do that from within Locofy Builder itself.
Yes animations are possible. We support Lottiefiles and also some prebuilt animation. Checkout our doc on the same: www.locofy.ai/docs/tagging/animations/tagging-animations/
Hey @coder amar, with Locofy, our goal is for you to be able to get more done in less time. Our platform currently generates the UI code for you, so that you can focus on the more complex problems like adding the logic layer.
Hi @Locofy, I wonder if we can do a dropdown for input? For React and HTML/CSS. Thanks, wonderful platform! And you can click one of the dropdown option to open a link or to show additional hidden input boxes
Currently you can use some of the dropdown components from popular UI libraries such as Material UI, Ant Design, Bootstrap and more. For custom dropdowns that you design yourself, that is something that we will be working on supporting. Could you share a few screenshots with us at hello@locofy.ai to better understand your use case?
i used locofy for converting my figma into html, but why the smart-animate for the page transitions dont work? and i made a submenu button for my website, but it also doesnt work
Hi @Bernhard Cr, converting smart animations is currently not available and is something that we're planning to work on soon. Regarding the submenu button issue, could you share more details with us at hello@locofy.ai so that we can investigate this?
@@locofy_ai i found a funny thing....locofy is not currently available to do with smart-animations. however if i link a webpage to other pages, it required me to use smart-animate... the link wont works if i choose instant transition. the transition looks like Instant animation, but it requiered me to make sure that i choose smart animate for every page transition
@@locofy_ai yea, that's what im experiencing on Figma. but this is not a big problem for me...it just requires me to use smart-animate for every page transition (every button that links to other pages) or otherwise my webpage wont be able to click to connect with the other webpages. however when i convert the figma file into HTML the smart-animate did not works
@@locofy_ai I thank all that excellent working group that is something disruptive what they created. I will tell you everything I am achieving with your help and ask everything that is necessary until I have no doubt :)
@@LosHuevosDelDIbuVaLadas We'd love that! Please feel free to also join our slack channel where our team is there to help and listen to your questions www.locofy.ai/join-slack
![Locofy.ai | Figma design to Live Fashion Website with Locofy [Quick Build]](http://i.ytimg.com/vi/X7ws6QNxC6U/mqdefault.jpg)
![Locofy.ai | Going from a Stocks Dashboard Figma Design to a Next.js app with Locofy.ai [Quick Build]](/img/1.gif)
Honestly, this is one of the most helpful software's that I've used till now. The way you give out the entire code is really something to appreciate. A sincere gratitude from my side for developing this piece of art♥️
Thanks for the kind words Anil ❤, we're so glad that you found this helpful for you!
You guys solved the biggest problem that i was facing thanks for your hardwork
It makes our day to hear that! Please let us know if you need any help, or have any feedback for us
Thank you for this well-made plugin, thank you so much!!! I just have one question, if I have several Framers to animate my landing page, will locofy be able to do those animations in code?
This is amazing! I can already think of the apps I want to build. Thank you so much!!!
Awesome! Let us know if you need any help!
Very helpful video for understanding 👏. I didn't get what's the difference in use of deploy and export option?? At the end we just need code, and we can do copy and paste in our vocode and run from there !!
Can you tell me a difference I both options?
Hi Swastik!
When you export - you GET the code so that you can edit and customize it. You need to do this if you need to pull in data from a database into your website/app. We'll be doing a video guide on this soon!
When you deploy - you PUBLISH the code, so that it runs on a server and people can start accessing your website/app. For a static website that does not need any code edits, this option is useful to easily make your product go live!
Please do reach out if you need any further help, we're happy to jump on a call with you
Just amazing! Good job, Locofy!
Wow! Definitely @Locofy is ahead of the game compared with other existing tools. Thank you very much.
Appreciate it @alianmorales5750! Do let us know if you have feedback or need help!
Not anima
Hi dear locofy i get a troublesome question when deploy to vercel. It fail and show"No Output Directory named "dist" found after the Build completed." How?
Hi, can you please reach our to LocoSid on our discord server: You can join our discord from this link: discord.com/invite/r6UDBhEQ4s
Where do we get that hamburger icon, what i got from a plugin does not get recognised by locofy while developing
You will need to add a hamburger icon which is hidden initially on Figma. This will need to be done manually
I bet You are Vietnamese:))
FIND IT HARD TO FOLLOW DUE TO NOT FULLY DISCLOSURE of how to find other TOOLS LIKE HAMBURGER ICON, so I had TO SEARCH OTHER INFORMATION BEFORE CONTINUING WITH THE VIDEO,ITS TOOK ME HOURS TO FINISHH 1 HOUR VIDEO
can't continue without small details
We understand. In this video, we assumed that the icons are present in the design. We recommend using Figma plugins such as Iconify to get icons you need.
you guys are amazing I tried it so well and I loved it
We're glad that you're enjoying Locofy! Do let us know how we can further improve Locofy for you
I tried to hide the hamburger menu for the large device it worked but its not showing up in the small device and I even changed the display property to show for the small device the links gets hidden once the device changed to small one, I don't know why the hamburger menu is not showing up!
Facing same issue
Request you to please join our Discord Server: discord.gg/r6UDBhEQ4s
You can share your figma file with Loco Sid so he investigate the issue.
@21.23 i can't see the layout direction
We have updated our flow significantly since this video. To view the same options choose Locofy Classic and follow the steps below.
You can click edit in Step 3: Edit Styling & Layout to view the same UI
How did you get the hamburger as I cannot see it
Hamburger Menu is initially hidden on the Figma file. We make use of the Media Queries and show the hamburger menu on smaller media queries using Styling and Layout Section on the Locofy Plugin.
i am not able to see the styling & layout and actions button
We have updated our flow significantly since this video. To view the same options choose Locofy Classic and follow the steps below.
You can click edit in Step 3: Edit Styling & Layout or Step 4: Add actions to view the same UI.
I am having problem to fir the webpage into mobile frame i.e. 428px. My hero section's width is either cut out or I am seeing the scroll bar below. Can Someone help me with how I can adjust my hero section to perfectly displayed on 428px.
Hi @mohannad khan, do check out this video on how to make your designs responsive - please let us know if this helps!
ruclips.net/video/mcROyX3hQ6g/видео.html
if i have responsive design in figma can i just get responsive code with this plug in
Exactly!
so responsive design is must to have responsive code?
@@locofy_ai
Around @15:26 The option for selecting a Container doesn't seem to be there for me anywhere. Where can I find it, or what should I use instead? I really really appreciate what you all have made here, Locofy is wonderful.
We have simplified the tags further and instead of offering container tag, we now directly allow you to choose between section, header, etc. tags that were previously present under the "container" tag.
There is issue is when you creating your design on figma so it's creating CSS on Position: Absolute; Property. Which is not goog for developers. Because if we need to change anything in future so it's a big issue for us. So how can I fix it. Is there any idea about this issue??
Use auto-layout to make your design responsive. Also, we suggest you to go through these docs:
www.locofy.ai/docs/design-structure/responsiveness/auto-layout/
www.locofy.ai/docs/design-structure/responsiveness/locofys-approach/
Hey there!
I tried using the locofy software
, but there's always this relative and absolute styling that keeps occuring!
for example i have two div tags inside a section tag, by default it should be like flex and gap or padding for the div container, but instead i keep getting relative for section and absolute for div tags which have height and width and top and left accurately measured , help me fix this issue of how to let locofy know how to nest items or containers!
By default, if you use auto layout, Locofy generated code will feature a flex property. The absolute positions occur when you have an absolute position item on your design and uses fixed sizes. You can read more on Locofy.ai's approach here: www.locofy.ai/docs/design-structure/responsiveness/locofys-approach/
hey locofy team, i believe u will anser my question, I am using breakpoint plugin in figma to combine for example 3,4 prototypes into one prototype to showcase it's responsiveness for different devices. so once i used breakpoint, then while using locofy plugin it can't recognize my responsive design at all as i used breakpoint though. what can I do then?
Hi @Showbik, at the moment we do not integrate with other plugins, here's a guide which shows you how you can approach responsiveness with Locofy: ruclips.net/video/9Ae6SeOQFDc/видео.html
Serioulsy, great work guys - lots of saving options and if everything is smooth. hats off! Also, it is quite a bit of work to organize all figma per frames...
Thanks Cyril! We're just getting started, and are working on a feature to help you organize Figma layers more easily!
@@locofy_ai Been playing with it last and was able to render pretty nicely a react build. you guys did a lot of work! The plugin sometimes lags when the previews are heavy. Also now. except this video, you guys dont have a guide to explain how to properly set your frames / auto-layouts so it will fit well with responsive design after tagging. Would be great to have a guide on how to set a nav bar / a two column, 3 columns... with their correct autolayout settings
Hey @Cyril, we do have a sample Figma project that guides you through these common layouts. Please head to www.figma.com/@locofy and duplicate our "Building a responsive website" tutorial
JUST FREAKING AWESOMEEEEE !!!!
Glad that you liked it!
How did you created form 1:43?
This form was created before hand and added manually to the deisgn.
I loved the video! However, in the part where he explains how to make the design responsive, the video cuts to the final result. Is the explanation available? 9:17
You can refer to our Responsiveness & Styling Playlist here: ruclips.net/video/u70KP7J-0NE/видео.html
Let us know if you have any further questions.
How to make navigation stick to the top? And how to create a navigation popup after clicking hamburger menu?
HI Ayush, to make the navbar stick to the top, you would have to apply custom CSS properties:
position: sticky, top:0.
You can add all these using the Locofy plugin. For the drawer, we have a doc on this: www.locofy.ai/docs/export-and-deployment/examples/exporting-a-responsive-navbar/
Let us know if you need further help. Also, would love to invite you to our Slack community where you'll get support and relevant resources: www.locofy.ai/join-slack
when I saw in your vidoe , you simply copy the template in locofy ,
when I'm doing the copy , I didn't get the locofy option !! why it is so ?
Have you created your Locofy account and tried opening the plugin in Figma?
You can follow this doc to get started: www.locofy.ai/docs/getting-started/create-new-locofy-account/
Instead of using the hover (and other states) from your plugin, can I use custom components states (default, pressed etc) I have already made on Figma?
Hi @Aun, we're working on a feature to allow you to do this! Do stay tuned for updates
I have a question. please answer bro. Is locofy a trouble for web developers? I mean, Will front end devolopers be use less ?
Hi @Md. Mashuqur Rahman, we definitely do not think so. You still know how to read and understand the generated code in order to extend it and add logic to it.
What Locofy does is help you to do the repetitive/mundane tasks, so that you can focus on the core logic of the app
The hamburger menu is not effective in this case?
I mean if i want to switch the navigation links to pop up on the menu click, how can i do that?
Hi Mohamed, you can tag that hamburger as a button and add an action for it to open a popup that you've created. Do let us know if you need help with this!
In updated Figma there is no spacing mode settings in advanced auto layout menu. What to do in that case?
Yes, Figma recently updated their UI. To add auto spacing, you need to first apply auto layout, then you will find the gap value (below the direction arrows), in the dropdown for the gaps, you will find "Auto", which will apply auto spacing. Here is a document by Figma: help.figma.com/hc/en-us/articles/360040451373-Explore-auto-layout-properties#spacing-between
It was awesome locofy. Just finished it. Btw it did not take 30 minutes 😄
We are glad you liked Locofy and that it helped you convert your design to code in under 30 minutes.
Much Appreciated for your efforts to build up this solution, Thanks Again
Thanks. Please do give it a try and let us know if you have any feedback
This is so empowering! Thank you for everything.
We're just getting started! Do share with us any feedback and we'll keep on improving the experience for you!
Do you have a community the hamburger hiding option is not working for me
Hi Salman, thanks for reaching out. Please join our Slack community and our team can help you : www.locofy.ai/join-slack
how did u pull the frame off and duplicate?
im assuming u duplicate
That's correct - we duplicate and pull the requisite layers off the main design.
And after all these efforts it will generate you a non sense code base which is helpful to beginners only because they don't know much about HTML CSS with flex box and containers.
Suman, would really like you to try the product before passing any judgement. Happy to help you try it out. Feel free to join our Slack community and our team is happy to answer your questions: www.locofy.ai/join-slack
@@locofy_ai yes I have tried it. When we put frames inside another frames it is producing a design where the inner frames are having absolute positioning producing unexpected outcomes.
I was worried to first create a figma design and then code it and making design layouts css was a nightmare to me even in css frameworks but this software solved my problem thanks Very much
That is the problem that we're trying to solve! Do let us know if you need any help or have any feedback
Auto Layout screws my whole design what should i do?😥
Do check out our guide on Autolayout to learn more about how to apply Autolayout to your designs ruclips.net/video/uI2pEqz2THk/видео.html - you can also reach us on hello@locofy.ai or on our slack channel if you need further help www.locofy.ai/join-slack
Hey the Input boxes the text it always black how do I fix this?
Hi @Brendan, in the Styling & Layout tab, you can add this key-value pair in the custom css section "color: #aabbcc" where #aabbcc is the hex code of the text colour you want to use.
Let us know if you need help with this!
You guys make the human civilization more advance =) so amazing that finally someone you guys make this AI
Thanks for the kind words!
You guys just changed the coding landscape. I am gonna wait the backend and logic integration
Databinding and API integration is coming very soon, do stay tuned 😉
Please help
Hi, can you please reach our to LocoSid on our discord server: You can join our discord from this link: discord.com/invite/r6UDBhEQ4s
I hope this will be free in the near future or offer us at very affordable pricing. Thanks !
Hi @Healing yourself, we're currently in Free BETA! You can create a free account and start using Locofy: www.locofy.ai/signup
Let us know if you need any help!
Loco is Awesome,
I used it in my project and it's superb.
Thanks for giving it a try!
Thanks so much for all .Your video is so good and i appreciate a lot.
We're glad you found it useful! Let us know what other guides you'd like to see!
Where can I find the hamburger menu?
Hi Arnob, if you are using our Figma file over here: www.figma.com/community/file/1142126078245550116/
You'll find the hamburger menu in the header bar as a hidden layer. That's because we have set it to be hidden on desktop screen size, and set it to show on mobile devices using the Locofy plugin.
if we have some data that will come through an API endpoint how we should tag them?
Hi @Ed, for now, you can export your code and connect with your API endpoints from your code editor. Soon we'll be allowing you to do that from within Locofy Builder itself.
@@locofy_ai Okay you will be able to say this is form and API right?
Is animation possible?
Yes animations are possible. We support Lottiefiles and also some prebuilt animation. Checkout our doc on the same: www.locofy.ai/docs/tagging/animations/tagging-animations/
So basically locofy is going to take away jobs of web developers now…. Nice , welcome to disasterous future
Hey @coder amar, with Locofy, our goal is for you to be able to get more done in less time. Our platform currently generates the UI code for you, so that you can focus on the more complex problems like adding the logic layer.
Huh???
Hi @Locofy, I wonder if we can do a dropdown for input? For React and HTML/CSS. Thanks, wonderful platform!
And you can click one of the dropdown option to open a link or to show additional hidden input boxes
Currently you can use some of the dropdown components from popular UI libraries such as Material UI, Ant Design, Bootstrap and more. For custom dropdowns that you design yourself, that is something that we will be working on supporting. Could you share a few screenshots with us at hello@locofy.ai to better understand your use case?
@@locofy_ai awesome!
i used locofy for converting my figma into html, but why the smart-animate for the page transitions dont work? and i made a submenu button for my website, but it also doesnt work
Hi @Bernhard Cr, converting smart animations is currently not available and is something that we're planning to work on soon.
Regarding the submenu button issue, could you share more details with us at hello@locofy.ai so that we can investigate this?
@@locofy_ai thx for replying! 😃
@@locofy_ai i found a funny thing....locofy is not currently available to do with smart-animations. however if i link a webpage to other pages, it required me to use smart-animate... the link wont works if i choose instant transition. the transition looks like Instant animation, but it requiered me to make sure that i choose smart animate for every page transition
@@bernhardcr7665 Hi Bernhard, that is quite strange! Is this happening on Figma? Where it is forcing you to choose smart animation?
@@locofy_ai yea, that's what im experiencing on Figma. but this is not a big problem for me...it just requires me to use smart-animate for every page transition (every button that links to other pages) or otherwise my webpage wont be able to click to connect with the other webpages. however when i convert the figma file into HTML the smart-animate did not works
I really wish this is free to use
Hey @BONSA, Locofy is currently in Free Beta and you can use all features and functionality for free!
This tutorial was really helpful
Glad that you found it helpful.
Sweet!
This is a lot better
Great work guys!!
Thanks for the appreciation, Milan.
looks clean 🙌❣️
Let us know any feedback you have!
Hey, is this responsive??
Hi Sam, yes it's responsive - you can get a copy the Locofied file on Figma and try it for yourself!
See the link in the description for more info!
love this amazing idea
Do let us know if you need any help or have any feedback!
@@locofy_ai I thank all that excellent working group that is something disruptive what they created. I will tell you everything I am achieving with your help and ask everything that is necessary until I have no doubt :)
@@LosHuevosDelDIbuVaLadas We'd love that! Please feel free to also join our slack channel where our team is there to help and listen to your questions
www.locofy.ai/join-slack
@@locofy_ai 🥰
This is Great job Dear
Thank you so much