@anjy7 is attempting to deploy a commit to the formbricks Team on Vercel.

A member of the Team first needs to authorize it.

Thank you for following the naming conventions for pull request titles! 🙏

Hi @anjy7, thank you for your contribution. I tested this feature on local and faced two issues,

• The width of the survey input is smaller than what we usually have, you can go to app.formbricks.com and create a survey to refer the actual width.
• Once we try to manipulate the height of the input field, the UI breaks.
  Please refer the screen recording shared below:

cc: @mattinannt

Hi @anjy7, thank you for your contribution. I tested this feature on local and faced two issues,

* The width of the survey input is smaller than what we usually have, you can go to app.formbricks.com and create a survey to refer the actual width.

* Once we try to manipulate the height of the input field, the UI breaks.
  Please refer the screen recording shared below:

Screen.Recording.2023-10-31.at.2.44.38.PM.mov

cc: @mattinannt
Ahh I see, thanks..I'll fix it :)

Heyy @neilchauhan2, I have fixed both the issues, please have a look -
https://www.loom.com/share/f8455d003e7a4208804533ab22f71835?sid=e21bbe83-102f-4685-a7a2-8b4e4898554c

@neilchauhan2 passing it back to you :)

I've solved most of the UI / UX issues, except for one: content position of images:

Task 1: Center the background image in the frame vertically and horizontally..

Code Review

We have quite some redundant code in:

• SurveyBg.tsx
• PreviewSurveyBgDeskstop.tsx (incl. typo :)

Task 2: Please refactor so that it is reusable and follows the DRY principle.

Task 3: Apart from that, please go through the complete PR and see if you notice anything else which deviates from our How we code at Formbricks best practices.

Task 4: Make a complete end-to-end test of the UI & UX. Catch all the bugs / inconsistencies which could arise with other link survey functionality.

Thanks 🙏

whats missing is to refactor MediaBackground so that we can remove the redundant code in PreviewSurveyBgMobile.tsx

Merge conflicts

@mattinannt allllllrighty, seems all good! It works well, just getting a build error but dont think its related to my refactoring:

Pls resolve and merge 🚀

Just updated the data model and added a more generic styling property to the survey model in preparation for the upcoming improved styling functionality.
Ready to merge!!!!!! Great job everyone! 🚀

Lets gooooo!!💪🏻🔥