feat: Remove Foundation in favor of Tailwind (#8984)

* feat: Remove foundation

* chore: Minor fix

* Minor fix

* Update _forms.scss

* chore: More changes

* chore: Minor fix

* chore: Clean up

* fix: font-weight

* chore: More changes

* chore: Setting page

* chore: Editor fix

* chore: Reports page

* chore: More changes

* chore: Minor changes

* chore: More fixes

* chore: More changes

* chore: More changes

* chore: More changes

* chore: Minor fix

* chore: More changes

* chore: More changes

* chore: More changes

* chore: More changes

* chore: Clean up

* chore: Minor fix

* chore: Clean ups

* chore: Rename basic file

* chore: Remove unused files

* chore: Fix expanded input

* Fix campaign rendering

* chore: Clean up

* chore: More changes

* chore: Remove unused files

* fix: Overflow issue

* chore: Minor fix

* chore: Clean up

* chore: Minor fix

* chore: Remove unused files

* chore: Minor fix

* chore: Minor fix

* fix: autoprefixer start/end value has mixed support

* chore: Minor fix

* chore: Remove unused files

* chore: Minor fix

* chore: Minor fix

* chore: Minor fix

* Add responsive design to label settings

* fix inbox view

* chore: Minor fix

* w-60% to w-2/3

* chore: Fix team

* chore: Fix button

* w-[34%] to w-1/3

* chore: Fix border

* Add support mobile views in team page

* chore: fix snackbar

* chore: clean up

* chore: Clean up

* fix: loading state alignment

* fix: alert styles

* chore: Minor fix

* fix: spacing for agent bot row

* fix: layout

* fix: layout for SLA

* fix: checkbox

* fix: SLA checkbox spacing

* Update inbox settings pages

* fix macros listing page layout

* fix canned responses

* chore: Fix bot page

* chore: fix automation page

* chore: fix agents page

* chore: fix canned response editor

* chore: Fix settings table

* chore: fix settings layout

* chore: Minor fix

* fix: canned response table layou

* fix: layout for table header for webhooks

* fix: webhook row layout

* fix: dashboard app modal layout

* fix: add title to canned response truncated shortcode

* fix: dashboard apps row layuot

* fix: layouts hooks

* fix: body color

* fix: delete action color in portal locales

* fix: text color for campagin title

* fix: success button color

---------

Co-authored-by: Pranav <pranav@chatwoot.com>
Co-authored-by: Vishnu Narayanan <iamwishnu@gmail.com>
Co-authored-by: Shivam Mishra <scm.mymail@gmail.com>

app/javascript/dashboard/components/SettingsSection.vue

@@ -1,19 +1,21 @@
 <template>
   <div
-    class="ml-0 mr-0 flex pt-0 pr-4 pb-4 pl-0"
+    class="ml-0 mr-0 flex py-8 w-full xl:w-3/4 flex-col xl:flex-row"
     :class="{
-      'pt-4 border-b border-solid border-slate-50 dark:border-slate-700/30':
+      'border-b border-solid border-slate-50 dark:border-slate-700/30':
         showBorder,
     }"
   >
-    <div class="w-[30%] min-w-0 max-w-[30%] pr-12">
+    <div class="w-full xl:w-1/4 min-w-0 xl:max-w-[30%] pr-12">
       <p
         v-if="title"
         class="text-base text-woot-500 dark:text-woot-500 mb-0 font-medium"
       >
         {{ title }}
       </p>
-      <p class="text-sm mb-2">
+      <p
+        class="text-sm mb-2 text-slate-700 dark:text-slate-300 leading-5 tracking-normal mt-2"
+      >
         <slot v-if="subTitle" name="subTitle">
           {{ subTitle }}
         </slot>
@@ -23,7 +25,7 @@
         {{ note }}
       </p>
     </div>
-    <div class="w-[50%] min-w-0 max-w-[50%]">
+    <div class="w-full xl:w-1/2 min-w-0 xl:max-w-[50%]">
       <slot />
     </div>
   </div>