Compare commits

10 Commits

7 changed files with 79 additions and 41 deletions

View File

@@ -49,13 +49,23 @@
@layer base { @layer base {
body { body {
@apply text-sm text-default-slate-dark @apply bg-base-background text-base-text font-['Pretendard-Regular']
} }
hr { hr {
@apply border-table-border @apply border-table-border
} }
.background-pattern {
background-image: repeating-linear-gradient(
-45deg,
rgba(255, 255, 255, 0.01) 0,
rgba(255, 255, 255, 0.01) 24px,
transparent 1px,
transparent 36px
);
}
a.disabled { a.disabled {
@apply pointer-events-none cursor-not-allowed opacity-50 @apply pointer-events-none cursor-not-allowed opacity-50
} }
@@ -65,7 +75,7 @@
} }
.btn { .btn {
@apply justify-center rounded-md bg-default-slate px-4 py-2 text-sm font-semibold leading-6 text-white @apply justify-center rounded-md bg-default-slate px-4 py-2 font-semibold leading-6 text-white
shadow-xs hover:opacity-80 cursor-pointer shadow-xs hover:opacity-80 cursor-pointer
} }
@@ -79,7 +89,7 @@
} }
.select-style { .select-style {
@apply block w-full px-2 py-1.5 border border-default-slate/50 rounded-xs text-base-background @apply block w-full px-2 py-1.5 border border-default-slate/50 rounded-xs text-base-background appearance-none
} }
.select-style option { .select-style option {
@@ -110,7 +120,8 @@
} }
.side-bar { .side-bar {
@apply w-[16rem] pl-4 text-lg font-bold divide-y divide-base-border; /*@apply w-[16rem] pl-4 text-lg font-bold divide-y divide-base-border;*/
@apply w-[16rem] pl-4 pr-4 lg:pr-0 text-lg font-bold;
} }
.content { .content {
@@ -139,7 +150,15 @@
/*Menu*/ /*Menu*/
.menu-group { .menu-group {
@apply flex flex-row py-6 px-4 gap-x-4 justify-between items-center w-full @apply flex flex-row py-2 px-4 my-4 gap-x-4 justify-between items-center w-full
}
.menu-group-active {
@apply bg-base-secondary text-white rounded-md;
}
.menu-group:hover {
@apply bg-base-secondary text-white transition-colors rounded-md;
} }
.menu-group-icon { .menu-group-icon {
@@ -250,3 +269,18 @@
.input-style[type="number"] { .input-style[type="number"] {
-moz-appearance: textfield; -moz-appearance: textfield;
} }
/*Fonts*/
@font-face {
font-family: 'GongGothicMedium';
src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicLight.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Pretendard-Regular';
src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
font-weight: 400;
font-style: normal;
}

View File

@@ -23,7 +23,7 @@
<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 class="min-h-screen bg-base-background text-base-text min-w-full overflow-x-auto h-full whitespace-nowrap"> <body class="background-pattern min-h-screen min-w-full overflow-x-auto h-full whitespace-nowrap">
<%= turbo_frame_tag :modals %> <%= turbo_frame_tag :modals %>
<main class="flex flex-col h-full" data-controller="sidebar"> <main class="flex flex-col h-full" data-controller="sidebar">
<%= render "partials/header" %> <%= render "partials/header" %>

View File

@@ -1,26 +1,28 @@
<div data-sidebar-target="overlay" data-action="click->sidebar#close" class="fixed inset-0 bg-black/50 z-40 hidden lg:hidden"></div> <div data-sidebar-target="overlay" data-action="click->sidebar#close" class="fixed inset-0 bg-black/50 z-40 hidden lg:hidden"></div>
<nav class="side-bar overflow-y-auto transition-transform lg:translate-x-0 -translate-x-full fixed lg:relative top-0 left-0 h-full bg-base-background z-40" data-sidebar-target="menu"> <nav class="side-bar overflow-y-auto transition-transform lg:translate-x-0 -translate-x-full bg-base-background lg:bg-transparent fixed lg:relative top-0 left-0 h-full z-40" data-sidebar-target="menu">
<div class="menu-group"> <%= link_to root_path, class: "menu-group #{'menu-group-active' if current_page?(root_path)}" do %>
<div class="menu-group-icon"> <div class="menu-group-icon">
<i class="fa-solid fa-house text-base-text/30 text-4xl"></i> <i class="fa-solid fa-chart-line text-base-text text-4xl"></i>
</div> </div>
<div class="menu-group-name"> <div class="menu-group-name">
HOME 현황
</div> </div>
</div> <% end %>
<hr >
<% @controllers.each do |c| %> <% @controllers.each do |c| %>
<%= link_to view_schedule_path(c.id), class: "menu-group" do %> <%= link_to view_schedule_path(c.id), class: "menu-group #{'menu-group-active' if current_page?(view_schedule_path(c.id))}" 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 text-4xl"></i>
</div> </div>
<div class="menu-group-name"> <div class="menu-group-name">
<%= c.name %> <%= c.name %>
</div> </div>
<% end %> <% end %>
<hr >
<% 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 text-4xl"></i>
</div> </div>
<div class="menu-group-name"> <div class="menu-group-name">
설청 설청

View File

@@ -5,8 +5,10 @@
<div class="text-xl">실내온도</div> <div class="text-xl">실내온도</div>
<div class="flex flex-row justify-between items-baseline w-full"> <div class="flex flex-row justify-between items-baseline w-full">
<i class="fa-solid fa-temperature-quarter text-base-text/80 text-4xl text-left w-full"></i> <i class="fa-solid fa-temperature-quarter text-base-text/80 text-4xl text-left w-full"></i>
<div class="items-baseline text-right w-full"><span class="text-4xl">15.5</span> <div class="items-baseline text-right w-full">
<span class="text-2xl">°C</span></div> <span class="text-4xl font-['GongGothicMedium'] font-light">15.5</span>
<span class="text-2xl">°C</span>
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -17,7 +19,7 @@
<div class="text-xl">실내습도</div> <div class="text-xl">실내습도</div>
<div class="flex flex-row justify-between items-baseline w-full"> <div class="flex flex-row justify-between items-baseline w-full">
<i class="fa-solid fa-droplet text-base-text/80 text-4xl text-left w-full"></i> <i class="fa-solid fa-droplet text-base-text/80 text-4xl text-left w-full"></i>
<div class="items-baseline text-right w-full"><span class="text-4xl">60</span> <span class="text-2xl">%</span> <div class="items-baseline text-right w-full"><span class="text-4xl font-['GongGothicMedium']">60</span> <span class="text-2xl">%</span>
</div> </div>
</div> </div>
</div> </div>
@@ -33,7 +35,7 @@
<span class="text-xl">CO</span><span class="text-sm">2</span> <span class="text-xl">CO</span><span class="text-sm">2</span>
</div> </div>
</div> </div>
<div class="items-baseline text-right"><span class="text-4xl">60</span> <span class="text-2xl">%</span></div> <div class="items-baseline text-right"><span class="text-4xl font-['GongGothicMedium']">60</span> <span class="text-2xl">%</span></div>
</div> </div>
</div> </div>
</div> </div>
@@ -47,7 +49,7 @@
<div class="text-xl">FAN</div> <div class="text-xl">FAN</div>
<div class="flex flex-row justify-between items-baseline w-full"> <div class="flex flex-row justify-between items-baseline w-full">
<i class="fa-solid fa-fan text-base-text/80 text-4xl text-left w-full"></i> <i class="fa-solid fa-fan text-base-text/80 text-4xl text-left w-full"></i>
<div class="items-baseline text-right w-full"><span class="text-4xl">60</span> <span class="text-2xl">%</span> <div class="items-baseline text-right w-full"><span class="text-4xl font-['GongGothicMedium']">60</span> <span class="text-2xl">%</span>
</div> </div>
</div> </div>
</div> </div>
@@ -59,7 +61,7 @@
<div class="text-xl">공조기</div> <div class="text-xl">공조기</div>
<div class="flex flex-row justify-between items-baseline w-full"> <div class="flex flex-row justify-between items-baseline w-full">
<i class="fa-solid fa-temperature-quarter text-base-text/80 text-4xl text-left w-full"></i> <i class="fa-solid fa-temperature-quarter text-base-text/80 text-4xl text-left w-full"></i>
<div class="items-baseline text-right w-full"><span class="text-4xl">15.5</span> <div class="items-baseline text-right w-full"><span class="text-4xl font-['GongGothicMedium']">15.5</span>
<span class="text-2xl">°C</span></div> <span class="text-2xl">°C</span></div>
</div> </div>
</div> </div>
@@ -71,7 +73,7 @@
<div class="text-xl">LED</div> <div class="text-xl">LED</div>
<div class="flex flex-row justify-between items-baseline w-full"> <div class="flex flex-row justify-between items-baseline w-full">
<i class="fa-solid fa-lightbulb text-base-text/80 text-4xl text-left w-full"></i> <i class="fa-solid fa-lightbulb text-base-text/80 text-4xl text-left w-full"></i>
<div class="items-baseline text-right w-full"><span class="text-4xl">60</span> <span class="text-2xl">%</span> <div class="items-baseline text-right w-full"><span class="text-4xl font-['GongGothicMedium']">60</span> <span class="text-2xl">%</span>
</div> </div>
</div> </div>
</div> </div>
@@ -84,7 +86,7 @@
<div class="dashboard-group"> <div class="dashboard-group">
<div class="flex justify-between items-baseline"> <div class="flex justify-between items-baseline">
<div class="text-4xl">pH</div> <div class="text-4xl">pH</div>
<div class="text-3xl">7.1</div> <div class="text-3xl font-['GongGothicMedium']">7.1</div>
</div> </div>
<div class="flex justify-between items-baseline"> <div class="flex justify-between items-baseline">
<div class="text-2xl"> <div class="text-2xl">
@@ -98,7 +100,7 @@
<div class="dashboard-group"> <div class="dashboard-group">
<div class="flex justify-between items-baseline"> <div class="flex justify-between items-baseline">
<div class="text-4xl">EC</div> <div class="text-4xl">EC</div>
<div class="text-3xl">0.1</div> <div class="text-3xl font-['GongGothicMedium']">0.1</div>
</div> </div>
<div class="flex justify-between items-baseline"> <div class="flex justify-between items-baseline">
<div class="text-2xl"> <div class="text-2xl">
@@ -114,7 +116,7 @@
<div class="text-xl">양액온도</div> <div class="text-xl">양액온도</div>
<div class="flex flex-row justify-between items-baseline w-full"> <div class="flex flex-row justify-between items-baseline w-full">
<!-- <i class="fa-solid fa-temperature-quarter text-base-text/80 text-4xl text-left w-full"></i>--> <!-- <i class="fa-solid fa-temperature-quarter text-base-text/80 text-4xl text-left w-full"></i>-->
<div class="items-baseline text-right w-full"><span class="text-4xl">20.96</span> <div class="items-baseline text-right w-full"><span class="text-4xl font-['GongGothicMedium']">20.96</span>
<span class="text-2xl">°C</span></div> <span class="text-2xl">°C</span></div>
</div> </div>
</div> </div>

View File

@@ -10,7 +10,7 @@
<ul class="divide-y divide-base-border whitespace-nowrap h-full relative"> <ul class="divide-y divide-base-border whitespace-nowrap h-full relative">
<% if @schedule.present? %> <% if @schedule.present? %>
<% @schedule.each do |s| %> <% @schedule.each do |s| %>
<li class="flex justify-between items-stretch px-4 py-2 space-x-4 h-full relative"> <li class="flex justify-between items-center px-4 py-2 space-x-4 h-full relative">
<div class="flex items-center space-x-4 basis-3/5 h-full"> <div class="flex items-center space-x-4 basis-3/5 h-full">
<!-- 시간 --> <!-- 시간 -->
<div class="flex flex-col lg:flex-row h-full items-center space-x-0 space-y-2 lg:space-x-4 lg:space-y-0"> <div class="flex flex-col lg:flex-row h-full items-center space-x-0 space-y-2 lg:space-x-4 lg:space-y-0">
@@ -18,11 +18,11 @@
<div class="text-xl flex items-center space-x-1 w-full h-full"> <div class="text-xl flex items-center space-x-1 w-full h-full">
<%= select_tag "schedule[#{s.id}][hour]", <%= select_tag "schedule[#{s.id}][hour]",
options_for_select((0..23).map { |h| [h.to_s.rjust(2, '0'), h] }, s.hour), options_for_select((0..23).map { |h| [h.to_s.rjust(2, '0'), h] }, s.hour),
class: "select-style text-white min-w-[60px] h-full" %> class: "select-style text-white min-w-[60px]" %>
<div>:</div> <div>:</div>
<%= number_field_tag "schedule[#{s.id}][minute]", <%= number_field_tag "schedule[#{s.id}][minute]",
s.minute, min: 0, max: 59, step: 1, inputmode: "decimal", s.minute, min: 0, max: 59, step: 1, inputmode: "decimal",
class: "input-style min-w-[60px] h-full" %> class: "input-style min-w-[60px]" %>
</div> </div>
</div> </div>
@@ -30,7 +30,7 @@
<div class="flex flex-col lg:flex-row h-full items-center space-x-0 space-y-2 lg:space-x-4 lg:space-y-0"> <div class="flex flex-col lg:flex-row h-full items-center space-x-0 space-y-2 lg:space-x-4 lg:space-y-0">
<div class="text-white text-left w-full lg:w-auto">온도 (°C)</div> <div class="text-white text-left w-full lg:w-auto">온도 (°C)</div>
<div class="text-xl flex items-center"> <div class="text-xl flex items-center">
<%= number_field_tag "schedule[#{s.id}][temperature]", s.temperature, min: -99, max: 99, step: "0.1", inputmode: "decimal", class: "input-style min-w-[68px] h-full" %> <%= number_field_tag "schedule[#{s.id}][temperature]", s.temperature, min: -99, max: 99, step: "0.1", inputmode: "decimal", class: "input-style min-w-[68px]" %>
</div> </div>
</div> </div>
</div> </div>

View File

@@ -14,9 +14,9 @@
<div class="flex flex-col lg:flex-row items-baseline space-x-2"> <div class="flex flex-col lg:flex-row items-baseline space-x-2">
<div class="text-white">시간</div> <div class="text-white">시간</div>
<div class="text-3xl flex items-baseline space-x-1"> <div class="text-3xl flex items-baseline space-x-1">
<div><%= s.hour.to_s.rjust(2, '0') %></div> <div class="text-center w-[36px]"><%= s.hour.to_s.rjust(2, '0') %></div>
<div>:</div> <div>:</div>
<div><%= s.minute.to_s.rjust(2, '0') %></div> <div class="text-center w-[36px]"><%= s.minute.to_s.rjust(2, '0') %></div>
</div> </div>
</div> </div>
@@ -24,7 +24,7 @@
<div class="flex flex-col lg:flex-row items-baseline space-x-4"> <div class="flex flex-col lg:flex-row items-baseline space-x-4">
<div class="text-white">온도</div> <div class="text-white">온도</div>
<div class="text-3xl flex items-end space-x-2"> <div class="text-3xl flex items-end space-x-2">
<div><%= s.temperature %></div> <div class="text-left w-[50px]"><%= s.temperature %></div>
<div class="text-white text-base leading-7">°C</div> <div class="text-white text-base leading-7">°C</div>
</div> </div>
</div> </div>
@@ -33,7 +33,7 @@
<!-- 사용 여부 --> <!-- 사용 여부 -->
<div class="flex flex-col lg:flex-row items-baseline space-x-0 lg:space-x-4 items-end"> <div class="flex flex-col lg:flex-row items-baseline space-x-0 lg:space-x-4 items-end">
<div class="text-white mb-1">ON/OFF</div> <div class="text-white mb-1">ON/OFF</div>
<div class="text-3xl mr-0"> <div class="text-3xl w-8 mr-0">
<%#= s.is_active %> <%#= s.is_active %>
<% if s.is_active %> <% if s.is_active %>
<i class="fa-solid fa-check text-notice"></i> <i class="fa-solid fa-check text-notice"></i>

View File

@@ -22,13 +22,13 @@ begin
end end
end end
rescue rescue
# error_message = "[#{Time.now}] #{mode} 실행 실패 (station_id: #{controller_id}, value: #{value})" error_message = "[#{Time.now}] #{mode} 실행 실패 (station_id: #{controller_id}, value: #{value})"
# res = Sms.send_one( res = Sms.send_one(
# { {
# to: '01062619801', to: '01062619801',
# from: '01062619801', from: '01062619801',
# text: error_message text: error_message
# } }
# ) )
# puts res puts res
end end