replace container with mx-auto

frullah · frullah · commit 9151ed5cc6e9 · 2021-11-22T21:46:21.000+07:00
diff --git a/src/components/Layout/Nav.svelte b/src/components/Layout/Nav.svelte
@@ -3,7 +3,7 @@
 <header
   class="flex items-center py-1 px-4 border-b-[3px] h-[54px] z-20 fixed inset-x-0 top-0 bg-white"
 >
-  <div class="container max-w-screen-sm flex items-center">
+  <div class="mx-auto max-w-screen-sm flex items-center">
     <a class="text-2xl" href="#home">Fajarullah</a>
   </div>
 </header>
diff --git a/src/components/Sections/ProfileSection.svelte b/src/components/Sections/ProfileSection.svelte
@@ -26,7 +26,7 @@
 </script>
 
 <section id="home">
-  <div class="container max-w-screen-sm mx-auto mt-24 p-4">
+  <div class="max-w-screen-sm mx-auto mt-24 p-4">
     <h1 aria-label="introduction" class="text-2xl text-center mb-4">
       Hi, I am <strong aria-label="my name">Fajarullah</strong>
     </h1>
diff --git a/src/components/Sections/TechnologiesSection.svelte b/src/components/Sections/TechnologiesSection.svelte
@@ -24,7 +24,7 @@
 </script>
 
 <section id="technologies">
-  <div class="container my-4 p-4 max-w-screen-sm">
+  <div class="mx-auto my-4 p-4 max-w-screen-sm">
     <h2 class="text-xl text-center mb-4">My Tech Stacks</h2>
     <ul class="flex flex-wrap justify-center">
       {#each usedTechnologies as usedTechnology}
diff --git a/tailwind.config.cjs b/tailwind.config.cjs
@@ -14,9 +14,6 @@ module.exports = {
       textColor: {
         'body-color': 'var(--text-body)'
       }
-    },
-    container: {
-      center: true
     }
   },
 }

Original file line number	Diff line number	Diff line change
`@@ -3,7 +3,7 @@`
`3`	`3`	`<header`
`4`	`4`	`class="flex items-center py-1 px-4 border-b-[3px] h-[54px] z-20 fixed inset-x-0 top-0 bg-white"`
`5`	`5`	`>`
`6`		`- <div class="container max-w-screen-sm flex items-center">`
	`6`	`+ <div class="mx-auto max-w-screen-sm flex items-center">`
`7`	`7`	`<a class="text-2xl" href="#home">Fajarullah</a>`
`8`	`8`	`</div>`
`9`	`9`	`</header>`