فهرست منبع

improved chat input and emoji dropdown css

Akira Laine 9 سال پیش
والد
کامیت
bd378b5ba8
3فایلهای تغییر یافته به همراه18 افزوده شده و 12 حذف شده
  1. 15 10
      app/client/app.css
  2. 2 0
      app/client/emojidropdown.css
  3. 1 2
      app/client/templates/room.html

+ 15 - 10
app/client/app.css

@@ -714,17 +714,17 @@ footer .fa {
     outline: 0;
     border: 1px solid white;
     background-color: transparent;
-    width: 90%;
+    width: 100%;
+    height: 70px;
+    padding: 5px;
     border-radius: 3px;
-    padding: 10px 15px;
-    margin: 1em auto 10px auto;
     text-align: left;
     font-size: 18px;
     color: #1C39B2;
     -webkit-transition-duration: 0.25s;
     transition-duration: 0.25s;
     font-weight: 300;
-    resize: vertical;
+    resize: none;
 }
 
 .song-input-select {
@@ -1199,13 +1199,18 @@ nav form input[type="image"]{
 .chat-message:nth-child(odd) {
     color: darkblue;
 }
-#submit{
-    margin-left: 10px;
-    font-size: 1.5em;
-    padding-top: 10px;
+#submit {
+    margin-bottom: 10px;
     cursor: pointer;
-    display: inline-block;
- }
+}
+#submit button{
+    width: 100%;
+    height: 40px;
+    font-size: 1.5em;
+}
+#submit i{
+    margin-left: 10px;
+}
 #chat-input-div {
     width: 100%;
     padding-left: 15px;

+ 2 - 0
app/client/emojidropdown.css

@@ -11,6 +11,8 @@
     font-size: inherit;
     letter-spacing: .025em;
     box-shadow: 3px 3px 3px rgba(0,0,0,.2);
+    top: 425px !important;
+    height: 287px;
 }
 .dropdown-menu a:hover {
     cursor: pointer;

+ 1 - 2
app/client/templates/room.html

@@ -124,8 +124,7 @@
                                 {{else}}
                                     <input id="chat-input" placeholder="Please register and login to chat." disabled>
                                 {{/if}}
-                                <div id="submit"><i id="submit-message" class="fa fa-paper-plane-o"></i>
-                                </div>
+                                <div id="submit"><button class="btn btn-danger">Submit<i id="submit-message" class="fa fa-paper-plane-o"></i></button></div>
                             </div>
                         </div>
                     </div>