implemented inline form

This commit is contained in:
Beatrice Olivera 2018-09-05 23:23:10 +01:00
parent a0ef7458aa
commit 9ddbd38bce
2 changed files with 48 additions and 25 deletions

View File

@ -5,15 +5,29 @@
position: relative; position: relative;
.chat { .chat {
position: absolute; position: absolute;
bottom: 10px; bottom: 0px;
} }
} }
#messages-container { #messages-container {
overflow: scroll; overflow: scroll;
height: 80%; height: 95%;
padding: 10px; padding: 10px;
.message { .message {
color: white; color: white;
} }
} }
select:not([multiple]) {
-webkit-appearance: none;
-moz-appearance: none;
background-position: right 50%;
background-repeat: no-repeat;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAMCAYAAABSgIzaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDZFNDEwNjlGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDZFNDEwNkFGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0NkU0MTA2N0Y3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0NkU0MTA2OEY3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuGsgwQAAAA5SURBVHjaYvz//z8DOYCJgUxAf42MQIzTk0D/M+KzkRGPoQSdykiKJrBGpOhgJFYTWNEIiEeAAAMAzNENEOH+do8AAAAASUVORK5CYII=);
padding: .5em;
padding-right: 1.5em;
}
#language-1 {
border-radius: 0;
}

View File

@ -5,11 +5,9 @@
<div id="chatroom-hook" data-chatroom-id='<%= @chat_room.id %>'></div> <div id="chatroom-hook" data-chatroom-id='<%= @chat_room.id %>'></div>
<!-- <div class="row"> <div class="row">
<div class="col-xs-12 col-sm-6 col-lg-4"></div>
<div class="col-xs-12 col-sm-6 col-lg-4"></div>
</div> -->
<div class="call-container"> <div class="call-container">
<div class="col-xs-12 col-sm-6 col-lg-4">
<div id="remote-video-container"> <div id="remote-video-container">
<div id="video_overlays"> <div id="video_overlays">
<video id="local-video" autoplay muted></video> <video id="local-video" autoplay muted></video>
@ -17,21 +15,32 @@
<video id="remote-video" autoplay></video> <video id="remote-video" autoplay></video>
<i class="far fa-hand-paper hand"></i> <i class="far fa-hand-paper hand"></i>
</div> </div>
</div>
<div class="col-xs-12 col-sm-6 col-lg-4 no-padding">
<div class="messages-container-container"> <div class="messages-container-container">
<div id="messages-container"> <div id="messages-container">
</div> </div>
<div class="chat"> <div class="chat">
<select id="language-1" class="input-field-text-black input-dropdown form-control"> <div class="input-group">
<select id="language-1" class="form-control no-radius">
<% @languages.each do |language| %> <% @languages.each do |language| %>
<option value="<%= language.code %>"><%= language.name %></option> <option value="<%= language.code %>"><%= language.name %></option>
<% end %> <% end %>
</select> </select>
<span class="input-group-addon" style="width:0px; padding-left:0px; padding-right:0px; border:none;"></span>
<input type="text" class="form-control" name="chat-input" id="chat-input" value=""> <input type="text" class="form-control" name="chat-input" id="chat-input" value="">
<button class="btn btn-primary" id="send-btn" type="submit" remote: true>Send</button> <span class="input-group-btn">
<button class="btn btn-primary form-control" id="send-btn" type="submit" remote: true>Send</button>
<!-- <i class="far fa-paper-plane"></i> -->
</span>
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
</div>
<div><span id="current-user" class="text-color" style="display:none"><%= current_user.id %></span></div> <div><span id="current-user" class="text-color" style="display:none"><%= current_user.id %></span></div>