From 2d22e7b59b002f6396a6ee36324281d6c740aa51 Mon Sep 17 00:00:00 2001
From: lstoeferle <48953604+lstoeferle@users.noreply.github.com>
Date: Fri, 26 Feb 2021 10:17:58 +0100
Subject: [PATCH] Fixed styling issues on mobile

---
 src/components/FeatureSection.vue | 6 +++---
 src/components/HeroSection.vue    | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/FeatureSection.vue b/src/components/FeatureSection.vue
index bfc7130..b4379b3 100644
--- a/src/components/FeatureSection.vue
+++ b/src/components/FeatureSection.vue
@@ -4,21 +4,21 @@
       <Heading2> Installed Vite plugins </Heading2>
     </div>
     <div class="flex flex-wrap -m-4">
-      <div class="pr-4 py-4 md:w-1/3">
+      <div class="pr-4 py-4 xs:pl-4 md:w-1/3 w-full">
         <Feature
           title="vite-plugin-vue2"
           text="Vue 2 support for Vite"
           url="https://github.com/underfin/vite-plugin-vue2"
         />
       </div>
-      <div class="p-4 md:w-1/3">
+      <div class="p-4 md:w-1/3 w-full">
         <Feature
           title="vite-plugin-components"
           text="On demand components auto importing for Vite"
           url="https://github.com/antfu/vite-plugin-components"
         />
       </div>
-      <div class="pl-4 py-4 md:w-1/3">
+      <div class="pl-4 py-4 xs:pr-4 md:w-1/3 w-full">
         <Feature
           title="vite-plugin-windicss"
           text="Windi CSS for Vit"
diff --git a/src/components/HeroSection.vue b/src/components/HeroSection.vue
index c9f99f1..eb8f923 100644
--- a/src/components/HeroSection.vue
+++ b/src/components/HeroSection.vue
@@ -1,6 +1,6 @@
 <template>
   <section
-    class="text-gray-600 body-fontcontainer mx-auto flex py-12 md:flex-row flex-col items-center"
+    class="text-gray-600 body-font container mx-auto flex py-12 md:flex-row flex-col items-center px-5"
   >
     <div class="lg:max-w-lg lg:w-full md:w-1/2 w-5/6 mb-10 md:mb-0">
       <img