diff options
| author | David Gay <david@davidgay.org> | 2021-06-05 19:31:44 -0400 |
|---|---|---|
| committer | David Gay <david@davidgay.org> | 2021-06-05 19:39:46 -0400 |
| commit | 57252386234e802b3a3707d32a8b74130de4a56e (patch) | |
| tree | 381eda6e3fba602dd0d49ce04f522c08342ab5f3 /app/views/layouts | |
| parent | 05c602a3ff76ddffd01bbe7f3ec6a75781a3551d (diff) | |
Improve UI responsiveness and scaling
Diffstat (limited to 'app/views/layouts')
| -rw-r--r-- | app/views/layouts/application.html.erb | 21 |
1 files changed, 10 insertions, 11 deletions
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index 513fcdd..577debc 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -15,35 +15,34 @@ <%= render "header" %> <div class="flex-1 bg-gray-900 rounded flex-grow"> - <div class="mx-auto p-2 grid gap-2 grid-cols-12 px-2" - style="max-width: 1800px;"> + <div class="mx-auto p-2 grid gap-2 grid-cols-12 px-2"> <% if user_signed_in? %> <%= render "navbar" %> <% end %> - <div class="flex flex-col col-span-12 sm:col-span-8"> - <div class="game-container-box mb-2 overflow-y-auto" style="height: 20rem;"> + <div class="flex flex-col game-container-column col-span-12 sm:col-span-8 xl:col-span-9"> + <div class="game-container-box mb-2 overflow-y-auto flex-grow"> <%= render "flash_messages" %> <%= yield %> </div> <% if user_signed_in? %> - <div class="game-container-box overflow-auto text-sm p-2" style="height: 15rem;" id="result_output" - data-turbolinks-permanent> + <div class="game-container-box overflow-auto text-sm p-2" id="result_output" + style="min-height: 30%; max-height: 50%" data-turbolinks-permanent> </div> <% end %> </div> <% if user_signed_in? %> - <div class="flex flex-col col-span-12 sm:col-span-4"> - <div class="game-container-box mb-2 overflow-y-auto" style="height: 15rem;" id="activity_controls" - data-turbolinks-permanent> + <div class="flex flex-col game-container-column col-span-12 sm:col-span-4 xl:col-span-3"> + <div class="game-container-box mb-2 overflow-y-auto" id="activity_controls" + style="min-height: 50%" data-turbolinks-permanent> <%= render "timer" %> </div> - <div id="chat" class="game-container-box col-span-12 sm:col-span-4" style="height: 20rem;" + <div id="chat" class="game-container-box overflow-y-auto" data-turbolinks-permanent> <%= render "chat" %> </div> </div> <% else %> - <div id="game_info" class="game-container-box col-span-12 sm:col-span-4" + <div id="game_info" class="game-container-box game-container-column col-span-12 sm:col-span-4 xl:col-span-3" data-turbolinks-permanent> <%= render "game_info" %> </div> |