feat(components.scss): Add global styles for components

Author: neural-loop

assets/scss/components.scss

@@ -1,4 +1,43 @@
-// ... (other styles in the file)
+main {
+  min-height: 70vh;
+  @apply mb-8;
+}
+
+// section style
+.section {
+  @apply py-24 xl:py-28;
+  &-sm {
+    @apply py-16 xl:py-20;
+  }
+}
+
+// container
+.container {
+  @apply mx-auto px-4 2xl:max-w-[1320px];
+}
+
+// form style
+.form-input {
+  @apply bg-theme-light text-dark placeholder:text-light focus:border-primary dark:border-darkmode-border dark:bg-darkmode-theme-light dark:text-darkmode-light w-full rounded border-transparent px-6 py-4 focus:ring-transparent;
+}
+
+.form-label {
+  @apply font-secondary text-dark dark:text-darkmode-light mb-4 block text-xl font-normal;
+}
+
+// social icons
+.social-icons {
+  @apply space-x-4;
+  li {
+    @apply inline-block;
+    a {
+      @apply bg-primary dark:bg-darkmode-primary dark:text-dark flex h-9 w-9 items-center justify-center rounded text-center leading-9 text-white;
+      svg {
+        @apply h-5 w-5;
+      }
+    }
+  }
+}
 
 // content style
 .content {
@@ -109,4 +148,4 @@
   .btn {
     @apply dark:hover:text-dark no-underline hover:text-white #{!important};
   }
-}
+}