디바이스 메인 템플릿 스타일 적용

This commit is contained in:
ming 2025-04-25 13:28:36 +09:00
parent d4d30f1982
commit ec259c981c
7 changed files with 124 additions and 129 deletions

View File

@ -9,7 +9,7 @@
--color-warning: rgb(255, 202, 40); --color-warning: rgb(255, 202, 40);
--color-accept: rgb(121, 134, 203); --color-accept: rgb(121, 134, 203);
--color-danger: rgb(239, 83, 80); --color-danger: rgb(239, 83, 80);
--color-table-border: rgb(203, 213, 225); --color-table-border: rgb(130, 144, 158);
/* theme */ /* theme */
--color-base-background: rgb(39, 44, 56); --color-base-background: rgb(39, 44, 56);
@ -179,15 +179,15 @@
/*Base Table*/ /*Base Table*/
.base-table { .base-table {
@apply min-w-full divide-y divide-table-border whitespace-nowrap border border-table-border @apply min-w-full whitespace-nowrap border border-table-border
} }
.base-table th { .base-table th {
@apply bg-default px-2 py-2 text-left font-semibold text-default-slate-dark lg:table-cell @apply bg-base-text px-2 py-2 text-left font-bold lg:table-cell
} }
.base-table td { .base-table td {
@apply border-t border-table-border px-2 py-1 text-default-slate lg:table-cell whitespace-nowrap @apply border-t border-table-border px-2 py-1 lg:table-cell whitespace-nowrap
} }
} }
@ -205,6 +205,7 @@
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 6px; width: 6px;
height: 6px; height: 6px;
padding: 4px;
} }
::-webkit-scrollbar-track { ::-webkit-scrollbar-track {

View File

@ -1,4 +1,12 @@
class ApplicationController < ActionController::Base class ApplicationController < ActionController::Base
# Only allow modern browsers supporting webp images, web push, badges, import maps, CSS nesting, and CSS :has. # Only allow modern browsers supporting webp images, web push, badges, import maps, CSS nesting, and CSS :has.
allow_browser versions: :modern allow_browser versions: :modern
before_action :set_controllers
private
def set_controllers
@controllers = Controller.all
end
end end

View File

@ -23,12 +23,14 @@
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
</head> </head>
<body> <body class="h-screen overflow-hidden bg-base-background text-base-text min-w-[400px] overflow-x-auto">
<%= turbo_frame_tag :modals %> <%= turbo_frame_tag :modals %>
<main class="flex flex-col h-full divide-y divide-border-table-border"> <main class="flex flex-col h-full">
<%= render "partials/header" %> <%= render "partials/header" %>
<div class="flex flex-row flex-1 w-full divide-x divide-border-table-border"> <div class="flex flex-row flex-1 w-full overflow-hidden">
<div class="w-full h-full"> <%= render "partials/sidebar" %>
<div class="flex-1 h-full pb-4 pr-4">
<div class="flex-1 h-full content">
<% if flash[:notice] %> <% if flash[:notice] %>
<div class="m-4 rounded px-4 py-2 bg-accept text-white"> <div class="m-4 rounded px-4 py-2 bg-accept text-white">
<%= raw flash[:notice] %> <%= raw flash[:notice] %>
@ -41,6 +43,7 @@
<%= yield %> <%= yield %>
</div> </div>
</div> </div>
</div>
</main> </main>
</body> </body>

View File

@ -7,30 +7,16 @@
HOME HOME
</div> </div>
</div> </div>
<div class="menu-group"> <% @controllers.each do |c| %>
<%= link_to view_schedule_path(c.id), class: "menu-group" do %>
<div class="menu-group-icon"> <div class="menu-group-icon">
<i class="fa-solid fa-temperature-high text-base-text/30 text-4xl"></i> <i class="fa-solid fa-temperature-high text-base-text/30 text-4xl"></i>
</div> </div>
<div class="menu-group-name"> <div class="menu-group-name">
메뉴 2 <%= c.name %>
</div>
</div>
<div class="menu-group">
<div class="menu-group-icon">
<i class="fa-solid fa-fan text-base-text/30 text-4xl"></i>
</div>
<div class="menu-group-name">
메뉴 3
</div>
</div>
<div class="menu-group">
<div class="menu-group-icon">
<i class="fa-solid fa-arrows-spin text-base-text/30 text-4xl"></i>
</div>
<div class="menu-group-name">
메뉴 4
</div>
</div> </div>
<% end %>
<% end %>
<div class="menu-group"> <div class="menu-group">
<div class="menu-group-icon"> <div class="menu-group-icon">
<i class="fa-solid fa-gear text-base-text/30 text-4xl"></i> <i class="fa-solid fa-gear text-base-text/30 text-4xl"></i>

View File

@ -1,7 +1 @@
<div class="p-4"> <div>MAIN</div>
<div class="flex flex-wrap gap-2 justify-center">
<% @controllers.each do |c| %>
<%= link_to c.name, view_schedule_path(c.id), class: "btn bg-primary" %>
<% end %>
</div>
</div>

View File

@ -1,7 +1,12 @@
<%= form_with url: schedule_edit_update_schedules_path, method: :post, class: 'flex flex-col h-full divide-y divide-border-table-border' do %> <div class="flex flex-col h-full text-white overflow-y-auto ">
<div class="flex flex-col flex-1 divide-y divide-base-border">
<%= form_with url: schedule_edit_update_schedules_path, method: :post, class: 'flex flex-col h-full divide-y divide-border-base-border p-4' do %>
<%= hidden_field_tag :controller_id, params[:id] %> <%= hidden_field_tag :controller_id, params[:id] %>
<div class="flex-1 p-4"> <div class="space-y-4">
<span class="text-2xl font-bold"><%= @controller.name %> 컨트롤러</span> <div class="flex justify-between">
<div class="text-2xl font-bold"><%= @controller.name %> 컨트롤러</div>
<%= submit_tag "업데이트", class: "btn bg-primary" %>
</div>
<table class="base-table"> <table class="base-table">
<thead> <thead>
<tr> <tr>
@ -36,18 +41,12 @@
</tbody> </tbody>
</table> </table>
</div> </div>
<div class="flex p-4">
<%= submit_tag "업데이트", class: "btn bg-primary" %>
</div>
<% end %> <% end %>
<div class="flex p-4"> <div class="flex p-4 space-x-4">
<%= button_to "초기화", reset_schedule_path(params[:id]), <%= button_to "초기화", reset_schedule_path(params[:id]),
method: :post, method: :post,
data: { turbo_confirm: "정말 초기화하시겠습니까? 모든 스케줄 데이터가 삭제됩니다." }, data: { turbo_confirm: "정말 초기화하시겠습니까? 모든 스케줄 데이터가 삭제됩니다." },
class: "btn bg-danger" %> class: "btn bg-danger" %>
</div>
<div class="flex p-4">
<%= button_to "추가하기", open_modals_path(type: "add_schedule", id: params[:id]), <%= button_to "추가하기", open_modals_path(type: "add_schedule", id: params[:id]),
class: "btn bg-default-slate", class: "btn bg-default-slate",
data: { data: {
@ -55,3 +54,5 @@
turbo_frame: "modals" turbo_frame: "modals"
} %> } %>
</div> </div>
</div>
</div>

View File

@ -1,6 +1,10 @@
<div class="flex flex-col h-full divide-y divide-border-table-border"> <div class="flex flex-col h-full divide-y divide-base-border text-white">
<div class="flex flex-col flex-1 p-4 space-y-4"> <div class="flex flex-col flex-1 p-4 space-y-4 overflow-y-hidden">
<span class="text-2xl font-bold"><%= @controller.name %> 컨트롤러</span> <div class="overflow-y-auto space-y-4">
<div class="flex justify-between">
<div class="text-2xl font-bold"><%= @controller.name %> 컨트롤러</div>
<%= link_to "수정", schedule_edit_schedule_path(@controller.id), class: "btn bg-default-slate" %>
</div>
<table class="base-table"> <table class="base-table">
<thead> <thead>
<tr> <tr>
@ -22,7 +26,5 @@
</tbody> </tbody>
</table> </table>
</div> </div>
<div class="flex p-4">
<%= link_to "수정", schedule_edit_schedule_path(@controller.id), class: "btn bg-default-slate" %>
</div> </div>
</div> </div>