GRN2-132: Fixed visual issues with mobile (Fixed #325) (#844)

* Fixed visual issues with mobile

* Fixed spacing above room name

app/views/rooms/components/_room_block.html.erb

@@ -46,11 +46,11 @@
           </div>
         </td>
         <td class="text-right">
-          <div class="item-action dropdown">
+          <div class="item-action dropdown" data-display="static">
-            <a href="javascript:void(0)" data-toggle="dropdown" class="icon <%= 'invisible' if room == current_user.main_room %>">
+            <a href="javascript:void(0)" data-toggle="dropdown" data-display="static" class="icon <%= 'invisible' if room == current_user.main_room %>">
               <i class="fas fa-ellipsis-v px-4"></i>
             </a>
-            <div class="dropdown-menu">
+            <div class="dropdown-menu dropdown-menu-right dropdown-menu-md-left">
               <a href="" data-toggle="modal" data-target="#createRoomModal" class="update-room dropdown-item">
                 <i class="dropdown-icon fas fa-cog"></i> <%= t("room.settings") %>
               </a>

app/views/rooms/show.html.erb

@@ -21,7 +21,7 @@
 <% end %>
 <div class="background pb-1">
   <div class="container">
-    <div class="row pt-9">
+    <div class="row pt-7 pt-sm-9">
       <div class="col-lg-8 col-sm-12">
         <div id="room-title" class="display-3 form-inline <%= 'edit_hover_class' if current_user.main_room != @room %>" data-path="<%= update_settings_path(@room) %>">
           <% if current_user.main_room == @room %>

app/views/shared/_header.html.erb

@@ -26,18 +26,18 @@
           <% if current_user.has_role? :super_admin %>
             <% admins_page = params[:controller] == "admins" && params[:action] == "index" ? "active" : "" %>
             <%= link_to admins_path, class: "px-3 mx-1 mt-1 header-nav #{admins_page}" do %>
-              <i class="fas fa-home pr-1 "></i> <%= t("header.dropdown.home") %>
+              <i class="fas fa-home pr-1 "></i><span class="d-none d-sm-inline-block"><%= t("header.dropdown.home") %></span>
             <% end %>
           <% else %>
             <% rooms_page = params[:controller] == "rooms" && params[:action] == "show" ? "active" : "" %>
             <%= link_to current_user.main_room, class: "px-3 mx-1 mt-1 header-nav #{rooms_page}" do %>
-              <i class="fas fa-home pr-1 "></i> <%= t("header.dropdown.home") %>
+              <i class="fas fa-home pr-1 "></i><span class="d-none d-sm-inline-block"><%= t("header.dropdown.home") %></span>
             <% end %>
 
             <% if current_user.highest_priority_role.get_permission("can_create_rooms") %>
               <% all_rec_page = params[:controller] == "users" && params[:action] == "recordings" ? "active" : "" %>
               <%= link_to get_user_recordings_path(current_user), class: "px-3 mx-1 mt-1 header-nav #{all_rec_page}" do %>
-                <i class="fas fa-video pr-1"></i> <%= t("header.all_recordings") %>
+                <i class="fas fa-video pr-1"></i><span class="d-none d-sm-inline-block"><%= t("header.all_recordings") %></span>
               <% end %>
             <% end %>
           <% end %>

app/views/shared/modals/_create_room_modal.html.erb

@@ -17,7 +17,7 @@
   <div class="modal-dialog modal-dialog-centered" role="document">
     <div class="modal-content text-center">
       <div class="modal-body">
-        <div class="card-body p-6">
+        <div class="card-body p-sm-6">
           <div class="card-title">
             <h3 class="create-only"><%= t("modal.create_room.title") %></h3>
             <h3 class="update-only"><%= t("modal.room_settings.title") %></h3>