style registration pages

assets/css/components.scss

@@ -1,5 +1,41 @@
 @layer components {
   .input {
-    @apply rounded-lg px-4 py-2;
+    @apply rounded-lg px-4 py-2 border;
+    @apply shadow-sm focus:shadow-lg;
+    @apply transition-all duration-300 ease-in-out;
+  }
+  
+  .input-primary {
+    @apply border-primary-500 hover:border-primary-600 active:border-primary-600;
+    @apply text-black;
+  }
+  
+  .checkbox {
+    -ms-transform: scale(1.5);
+    -moz-transform: scale(1.5);
+    -webkit-transform: scale(1.5);
+    -o-transform: scale(1.5);
+    transform: scale(1.5);
+    padding: 10px;
+  }
+  
+  .title {
+    @apply leading-5 tracking-wide;
+  }
+  
+  .btn {
+    @apply focus:outline-none px-4 py-2 rounded-lg;
+    @apply shadow-sm focus:shadow-lg;
+    @apply transition-all duration-300 ease-in-out;
+  }
+  
+  .btn-primary {
+    @apply bg-primary-500 focus:bg-primary-600 active:bg-primary-600;
+    @apply bg-primary-500 focus:bg-primary-600 active:bg-primary-600;
+    @apply text-white;
+  }
+  
+  .hr {
+    @apply border border-primary-500 w-full max-w-2xl;
   }
 }