initial commit

views/static/css/input.css

@@ -0,0 +1,78 @@
+@import "tailwindcss";
+
+/* não deve ser o jeito certo de fazer isso. */
+
+.primary_button {
+  @apply rounded p-2 bg-indigo-500;
+}
+
+.my-input {
+	@apply w-full bg-transparent placeholder:text-slate-400 text-slate-700 text-sm border border-slate-200 rounded-md px-3 py-2 transition duration-300 focus:outline-none focus:border-slate-400 hover:border-slate-300 shadow-sm focus:shadow;
+}
+
+.my-label {
+	@apply block mb-1 text-sm text-slate-600;
+}
+
+.however {
+	@apply flex items-center mt-2 text-xs text-slate-400;
+}
+
+.my-my-input {
+	@apply w-full min-w-[200px] mb-5;
+}
+
+.btn {
+	@apply w-full rounded-md bg-slate-800 py-2 px-4 my-4 border border-transparent text-center text-sm text-white transition-all shadow-md hover:shadow-lg focus:bg-slate-700 focus:shadow-none active:bg-slate-700 hover:bg-slate-700 active:shadow-none disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none;
+}
+
+h1 {
+	@apply text-5xl font-bold mb-5
+}
+
+h2 {
+	@apply text-4xl font-bold mb-5
+}
+
+
+
+
+@keyframes bounce {
+  0% {
+    transform: translateX(-7px);
+    timing-function: ease-in;
+  }
+  37% {
+    transform: translateX(7px);
+    timing-function: ease-out;
+  }
+  55% {
+    transform: translateX(-7px);
+    timing-function: ease-in;
+  }
+  73% {
+    transform: translateX(5px);
+    timing-function: ease-out;
+  }
+  82% {
+    transform: translateX(-5px);
+    timing-function: ease-in;
+  }
+  91% {
+    transform: translateX(2px);
+    timing-function: ease-out;
+  }
+  96% {
+    transform: translateX(-2px);
+    timing-function: ease-in;
+  }
+  100% {
+    transform: translateX(0px);
+    timing-function: ease-in;
+  }
+}
+
+.bounce {
+  animation-name: bounce;
+  animation-duration: .5s;
+}