feat: ✨ send message through htmx

assests/main.css

@@ -0,0 +1,75 @@
+.main {
+    box-sizing: border-box;
+    margin: 1%;
+
+    /* @media screen { */
+    /*     width: 50%; */
+    /* } */
+    /**/
+    /* @media screen and (max-width:820px) { */
+    /*     width: 100%; */
+    /* } */
+
+    #name {
+        border-radius: 5px;
+        width: 10%;
+        font-size: x-large;
+    }
+
+    #email {
+        margin-top: 2%;
+        border-radius: 5px;
+        width: 10%;
+        font-size: x-large;
+    }
+
+    #message {
+        margin-top: 5%;
+        border-radius: 5px;
+        display: block;
+        font-size: x-large;
+        width: 40vh;
+        height: 50vh;
+        resize: none;
+    }
+
+    #send {
+        margin-top: 5%;
+        width: 10vh;
+        height: 5vh;
+        size: 10vh;
+    }
+
+    button:focus {
+        outline: none;
+    }
+
+    input:focus {
+        outline: none;
+    }
+
+    textarea:focus {
+        outline: none;
+    }
+
+    input:invalid {
+        border: 2px solid burlywood;
+    }
+
+    input:valid {
+        border: 2px solid lime;
+    }
+
+    textarea:invalid {
+        border: 2px solid burlywood;
+    }
+
+    textarea:valid {
+        border: 2px solid lime;
+    }
+}
+
+body {
+    background-color: rgba(0, 0, 0, 0.98);
+    color: silver;
+}