mission_control-servers 0.1.3 → 0.1.5

Sign up to get free protection for your applications and to get access to all the features.
Files changed (22) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +13 -0
  3. data/app/assets/builds/mission_control_servers_application.css +1 -1
  4. data/app/assets/stylesheets/mission_control/servers/application.tailwind.css +72 -0
  5. data/app/controllers/mission_control/servers/scripts_controller.rb +42 -0
  6. data/app/javascript/mission_control/servers/controllers/dark_mode_controller.js +44 -0
  7. data/app/javascript/mission_control/servers/controllers/pie_chart_controller.js +44 -12
  8. data/app/views/layouts/mission_control/servers/application.html.erb +0 -1
  9. data/app/views/mission_control/servers/dashboards/cpu_histories/show.html.erb +3 -3
  10. data/app/views/mission_control/servers/dashboards/cpu_usages/show.html.erb +4 -6
  11. data/app/views/mission_control/servers/dashboards/disk_frees/show.html.erb +1 -1
  12. data/app/views/mission_control/servers/dashboards/memory_histories/show.html.erb +3 -3
  13. data/app/views/mission_control/servers/dashboards/memory_usages/show.html.erb +3 -3
  14. data/app/views/mission_control/servers/dashboards/project_tables/show.html.erb +16 -16
  15. data/app/views/mission_control/servers/projects/_form.html.erb +2 -2
  16. data/app/views/mission_control/servers/projects/edit.html.erb +11 -2
  17. data/app/views/mission_control/servers/projects/index.html.erb +16 -7
  18. data/app/views/mission_control/servers/projects/new.html.erb +11 -2
  19. data/app/views/mission_control/servers/projects/show.html.erb +8 -8
  20. data/config/tailwind.config.js +4 -0
  21. data/lib/mission_control/servers/version.rb +1 -1
  22. metadata +4 -3
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: e601ccf1a8047896df63047cb3a99365b274c23967be5a2c37b48575d6207b83
4
- data.tar.gz: b8028d770b72455f545aac51656cf38e64e44d2d155c684d5f89facacef449a3
3
+ metadata.gz: 1e5d038f875ef51a4f7dc561205175a10227a789186f97ae3fdbdf86cada7732
4
+ data.tar.gz: 41c76212a3edcb6894bb3936af826f7e0dc64381645e8cbd47c71c84616d3feb
5
5
  SHA512:
6
- metadata.gz: 8f41196d43858513ae61bb80947bd6748a1d247e67285ed9b5fbe7a3736affe5b1ebf8e750a305815808f1d698c9665eaae44b6b626a541d2d1616f64331d3ae
7
- data.tar.gz: 46a4dbb218f11323f4a1b0dab2c8a3bb49b5e219e793491a20df32b56a55e2febc5656a9406152050b03c0be54ea52ed0c87793f9d3ca0bd5d03ff96ae35bab3
6
+ metadata.gz: eaf1bc78062af2f7af6e2c3aa7bbdb5b8f5c7152989aef9c27ff60c2677c3da744f6898afe850bcd7c287d58695d3b0a1acd6ef89bf83cecf6e9c5608498d0c4
7
+ data.tar.gz: f497006e08f5795c3a6165f4c76a0bba806dbcc300e704048a4f632fd168e0986b8351ead9247f77e1c38057309d3c0026592b7dea4be1d35c3e8fb82db96632
data/README.md CHANGED
@@ -48,6 +48,14 @@ Install a script which captures:
48
48
  The data will be retained for 7 days automatically. After 7 days, the data will start truncating itself
49
49
  so that it doesn't take up much disk space within the database.
50
50
 
51
+ If you would like to put the dashboard on something like a Raspberry Pi, you can use the `dark` parameter to
52
+ change the dashboard to a dark mode automatically. This will hopefully help provide a "hands off" approach to
53
+ setting up the kiosk mode.
54
+
55
+ ```html
56
+ http://localhost:3000/mission_control-servers/projects?dark=true
57
+ ```
58
+
51
59
  ## Protecting the Dashboard
52
60
 
53
61
  You can protect the dashboard by using a constraint. This will allow you to only allow certain users to access
@@ -92,5 +100,10 @@ Detailed Dashboard updates automatically
92
100
 
93
101
  ![ScreenShot-2024-02-06-22-21-15](https://github.com/kobaltz/mission_control-servers/assets/635114/320c57ad-64bf-4582-a680-c79c91e62b60)
94
102
 
103
+ Dark Mode support added in v0.1.4 (you can set this with a URL Param dark=true)
104
+
105
+ ![ScreenShot-2024-02-08-23-08-05](https://github.com/kobaltz/mission_control-servers/assets/635114/5a7b2cd5-0218-448d-86fa-c54f821a8999)
106
+
107
+
95
108
  ## License
96
109
  The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
data/app/assets/builds/mission_control_servers_application.css CHANGED
@@ -1 +1 @@
1
- /*! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:Inter var,ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#9ca3af;opacity:1}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}[multiple],[type=date],[type=datetime-local],[type=email],[type=month],[type=number],[type=password],[type=search],[type=tel],[type=text],[type=time],[type=url],[type=week],select,textarea{--tw-shadow:0 0 #0000;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-color:#6b7280;border-radius:0;border-width:1px;font-size:1rem;line-height:1.5rem;padding:.5rem .75rem}[multiple]:focus,[type=date]:focus,[type=datetime-local]:focus,[type=email]:focus,[type=month]:focus,[type=number]:focus,[type=password]:focus,[type=search]:focus,[type=tel]:focus,[type=text]:focus,[type=time]:focus,[type=url]:focus,[type=week]:focus,select:focus,textarea:focus{--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);border-color:#2563eb;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);outline:2px solid #0000;outline-offset:2px}input::-moz-placeholder,textarea::-moz-placeholder{color:#6b7280;opacity:1}input::placeholder,textarea::placeholder{color:#6b7280;opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-date-and-time-value{min-height:1.5em}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-bottom:0;padding-top:0}select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact}[multiple]{background-image:none;background-position:0 0;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset}[type=checkbox],[type=radio]{--tw-shadow:0 0 #0000;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;background-origin:border-box;border-color:#6b7280;border-width:1px;color:#2563eb;display:inline-block;flex-shrink:0;height:1rem;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:1rem}[type=checkbox]{border-radius:0}[type=radio]{border-radius:100%}[type=checkbox]:focus,[type=radio]:focus{--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:2px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);outline:2px solid #0000;outline-offset:2px}[type=checkbox]:checked,[type=radio]:checked{background-color:currentColor;background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border-color:#0000}[type=checkbox]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0z'/%3E%3C/svg%3E")}[type=radio]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E")}[type=checkbox]:checked:focus,[type=checkbox]:checked:hover,[type=checkbox]:indeterminate,[type=radio]:checked:focus,[type=radio]:checked:hover{background-color:currentColor;border-color:#0000}[type=checkbox]:indeterminate{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:100% 100%}[type=checkbox]:indeterminate:focus,[type=checkbox]:indeterminate:hover{background-color:currentColor;border-color:#0000}[type=file]{background:unset;border-color:inherit;border-radius:0;border-width:0;font-size:unset;line-height:inherit;padding:0}[type=file]:focus{outline:1px solid ButtonText;outline:1px auto -webkit-focus-ring-color}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.sr-only{clip:rect(0,0,0,0);border-width:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.static{position:static}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:0}.z-10{z-index:10}.order-first{order:-9999}.m-4{margin:1rem}.-mx-4{margin-left:-1rem;margin-right:-1rem}.-my-2{margin-bottom:-.5rem;margin-top:-.5rem}.mx-4{margin-left:1rem;margin-right:1rem}.mx-auto{margin-left:auto;margin-right:auto}.my-10{margin-bottom:2.5rem;margin-top:2.5rem}.my-4{margin-bottom:1rem;margin-top:1rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.flow-root{display:flow-root}.grid{display:grid}.hidden{display:none}.h-full{height:100%}.min-h-full{min-height:100%}.w-full{width:100%}.min-w-0{min-width:0}.min-w-full{min-width:100%}.max-w-2xl{max-width:42rem}.max-w-4xl{max-width:56rem}.max-w-7xl{max-width:80rem}.max-w-lg{max-width:32rem}.flex-1{flex:1 1 0%}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.list-inside{list-style-position:inside}.list-disc{list-style-type:disc}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.flex-col{flex-direction:column}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0{gap:0}.gap-0\.5{gap:.125rem}.divide-y>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-bottom-width:calc(1px*var(--tw-divide-y-reverse));border-top-width:calc(1px*(1 - var(--tw-divide-y-reverse)))}.divide-gray-200>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(229 231 235/var(--tw-divide-opacity))}.divide-gray-300>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(209 213 219/var(--tw-divide-opacity))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.whitespace-nowrap{white-space:nowrap}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.border{border-width:1px}.border-red-400{--tw-border-opacity:1;border-color:rgb(248 113 113/var(--tw-border-opacity))}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity))}.bg-gray-300{--tw-bg-opacity:1;background-color:rgb(209 213 219/var(--tw-bg-opacity))}.bg-gray-400\/5{background-color:#9ca3af0d}.bg-gray-500{--tw-bg-opacity:1;background-color:rgb(107 114 128/var(--tw-bg-opacity))}.bg-gray-700{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity))}.bg-indigo-50{--tw-bg-opacity:1;background-color:rgb(238 242 255/var(--tw-bg-opacity))}.bg-indigo-600{--tw-bg-opacity:1;background-color:rgb(79 70 229/var(--tw-bg-opacity))}.bg-red-100{--tw-bg-opacity:1;background-color:rgb(254 226 226/var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.bg-opacity-75{--tw-bg-opacity:0.75}.p-4{padding:1rem}.p-8{padding:2rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.py-1\.5{padding-bottom:.375rem;padding-top:.375rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.py-3\.5{padding-bottom:.875rem;padding-top:.875rem}.py-4{padding-top:1rem}.pb-4,.py-4{padding-bottom:1rem}.pl-3{padding-left:.75rem}.pl-4{padding-left:1rem}.pr-3{padding-right:.75rem}.pr-4{padding-right:1rem}.pt-5{padding-top:1.25rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.align-middle{vertical-align:middle}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-6xl{font-size:3.75rem;line-height:1}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.leading-6{line-height:1.5rem}.leading-7{line-height:1.75rem}.leading-tight{line-height:1.25}.tracking-tight{letter-spacing:-.025em}.text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235/var(--tw-text-opacity))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity))}.text-indigo-600{--tw-text-opacity:1;color:rgb(79 70 229/var(--tw-text-opacity))}.text-red-700{--tw-text-opacity:1;color:rgb(185 28 28/var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.shadow{--tw-shadow:0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a;--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 #0000000d;--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.shadow-xl{--tw-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.ring-1{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ring-inset{--tw-ring-inset:inset}.ring-gray-300{--tw-ring-opacity:1;--tw-ring-color:rgb(209 213 219/var(--tw-ring-opacity))}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-150,.transition-all{transition-duration:.15s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.hover\:bg-blue-600:hover{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity))}.hover\:bg-blue-700:hover{--tw-bg-opacity:1;background-color:rgb(29 78 216/var(--tw-bg-opacity))}.hover\:bg-gray-50:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity))}.hover\:bg-indigo-100:hover{--tw-bg-opacity:1;background-color:rgb(224 231 255/var(--tw-bg-opacity))}.hover\:bg-indigo-500:hover{--tw-bg-opacity:1;background-color:rgb(99 102 241/var(--tw-bg-opacity))}.hover\:text-blue-800:hover{--tw-text-opacity:1;color:rgb(30 64 175/var(--tw-text-opacity))}.focus\:outline-none:focus{outline:2px solid #0000;outline-offset:2px}.focus-visible\:outline:focus-visible{outline-style:solid}.focus-visible\:outline-2:focus-visible{outline-width:2px}.focus-visible\:outline-offset-2:focus-visible{outline-offset:2px}.focus-visible\:outline-indigo-600:focus-visible{outline-color:#4f46e5}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-30:disabled{opacity:.3}.disabled\:hover\:bg-white:hover:disabled{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}@media (min-width:640px){.sm\:-mx-6{margin-left:-1.5rem;margin-right:-1.5rem}.sm\:mx-0{margin-left:0;margin-right:0}.sm\:my-8{margin-bottom:2rem;margin-top:2rem}.sm\:ml-16{margin-left:4rem}.sm\:mt-0{margin-top:0}.sm\:block{display:block}.sm\:inline{display:inline}.sm\:flex{display:flex}.sm\:w-full{width:100%}.sm\:flex-auto{flex:1 1 auto}.sm\:flex-none{flex:none}.sm\:grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:items-center{align-items:center}.sm\:truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sm\:rounded-lg{border-radius:.5rem}.sm\:p-6{padding:1.5rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:py-8{padding-bottom:2rem;padding-top:2rem}.sm\:pl-6{padding-left:1.5rem}.sm\:pr-6{padding-right:1.5rem}.sm\:text-3xl{font-size:1.875rem;line-height:2.25rem}.sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}.sm\:tracking-tight{letter-spacing:-.025em}}@media (min-width:768px){.md\:max-w-3xl{max-width:48rem}}@media (min-width:1024px){.lg\:-mx-8{margin-left:-2rem;margin-right:-2rem}.lg\:ml-4{margin-left:1rem}.lg\:mt-0{margin-top:0}.lg\:flex{display:flex}.lg\:table-cell{display:table-cell}.lg\:max-w-none{max-width:none}.lg\:grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:items-center{align-items:center}.lg\:justify-between{justify-content:space-between}.lg\:px-8{padding-left:2rem}.lg\:pr-8,.lg\:px-8{padding-right:2rem}}
1
+ /*! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:Inter var,ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#9ca3af;opacity:1}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}[multiple],[type=date],[type=datetime-local],[type=email],[type=month],[type=number],[type=password],[type=search],[type=tel],[type=text],[type=time],[type=url],[type=week],select,textarea{--tw-shadow:0 0 #0000;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-color:#6b7280;border-radius:0;border-width:1px;font-size:1rem;line-height:1.5rem;padding:.5rem .75rem}[multiple]:focus,[type=date]:focus,[type=datetime-local]:focus,[type=email]:focus,[type=month]:focus,[type=number]:focus,[type=password]:focus,[type=search]:focus,[type=tel]:focus,[type=text]:focus,[type=time]:focus,[type=url]:focus,[type=week]:focus,select:focus,textarea:focus{--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);border-color:#2563eb;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);outline:2px solid #0000;outline-offset:2px}input::-moz-placeholder,textarea::-moz-placeholder{color:#6b7280;opacity:1}input::placeholder,textarea::placeholder{color:#6b7280;opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-date-and-time-value{min-height:1.5em}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-bottom:0;padding-top:0}select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact}[multiple]{background-image:none;background-position:0 0;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset}[type=checkbox],[type=radio]{--tw-shadow:0 0 #0000;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;background-origin:border-box;border-color:#6b7280;border-width:1px;color:#2563eb;display:inline-block;flex-shrink:0;height:1rem;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:1rem}[type=checkbox]{border-radius:0}[type=radio]{border-radius:100%}[type=checkbox]:focus,[type=radio]:focus{--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:2px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);outline:2px solid #0000;outline-offset:2px}[type=checkbox]:checked,[type=radio]:checked{background-color:currentColor;background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border-color:#0000}[type=checkbox]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0z'/%3E%3C/svg%3E")}[type=radio]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E")}[type=checkbox]:checked:focus,[type=checkbox]:checked:hover,[type=checkbox]:indeterminate,[type=radio]:checked:focus,[type=radio]:checked:hover{background-color:currentColor;border-color:#0000}[type=checkbox]:indeterminate{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:100% 100%}[type=checkbox]:indeterminate:focus,[type=checkbox]:indeterminate:hover{background-color:currentColor;border-color:#0000}[type=file]{background:unset;border-color:inherit;border-radius:0;border-width:0;font-size:unset;line-height:inherit;padding:0}[type=file]:focus{outline:1px solid ButtonText;outline:1px auto -webkit-focus-ring-color}body{background-color:rgb(255 255 255/var(--tw-bg-opacity));color:rgb(17 24 39/var(--tw-text-opacity))}:is(.dark body),body{--tw-bg-opacity:1;--tw-text-opacity:1}:is(.dark body){background-color:rgb(17 24 39/var(--tw-bg-opacity));color:rgb(209 213 219/var(--tw-text-opacity))}h1,h2,h3,h4,h5,h6{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}:is(.dark h1),:is(.dark h2),:is(.dark h3),:is(.dark h4),:is(.dark h5),:is(.dark h6){--tw-text-opacity:1;color:rgb(209 213 219/var(--tw-text-opacity))}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.text-gray-light{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity))}:is(.dark .text-gray-light){--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity))}.text-gray-normal{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity))}:is(.dark .text-gray-normal){--tw-text-opacity:1;color:rgb(209 213 219/var(--tw-text-opacity))}.btn{--tw-shadow:0 1px 2px 0 #0000000d;--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-inset:inset;align-items:center;border-radius:.375rem;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);display:inline-flex;font-size:.875rem;font-weight:600;line-height:1.25rem;padding:.5rem .75rem}.btn-default{--tw-bg-opacity:1;--tw-text-opacity:1;--tw-ring-opacity:1;--tw-ring-color:rgb(209 213 219/var(--tw-ring-opacity));background-color:rgb(255 255 255/var(--tw-bg-opacity));color:rgb(17 24 39/var(--tw-text-opacity))}.btn-default:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity))}:is(.dark .btn-default){--tw-bg-opacity:1;--tw-text-opacity:1;--tw-ring-opacity:1;--tw-ring-color:rgb(75 85 99/var(--tw-ring-opacity));background-color:rgb(31 41 55/var(--tw-bg-opacity));color:rgb(209 213 219/var(--tw-text-opacity))}:is(.dark .btn-default:hover){--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity))}.btn-primary{--tw-bg-opacity:1;--tw-text-opacity:1;--tw-ring-opacity:1;--tw-ring-color:rgb(99 102 241/var(--tw-ring-opacity));background-color:rgb(79 70 229/var(--tw-bg-opacity));color:rgb(255 255 255/var(--tw-text-opacity))}.btn-primary:hover{--tw-bg-opacity:1;background-color:rgb(67 56 202/var(--tw-bg-opacity))}:is(.dark .btn-primary){--tw-bg-opacity:1;--tw-text-opacity:1;--tw-ring-opacity:1;--tw-ring-color:rgb(129 140 248/var(--tw-ring-opacity));background-color:rgb(49 46 129/var(--tw-bg-opacity));color:rgb(156 163 175/var(--tw-text-opacity))}:is(.dark .btn-primary:hover){--tw-bg-opacity:1;background-color:rgb(129 140 248/var(--tw-bg-opacity))}.btn-danger{--tw-bg-opacity:1;--tw-text-opacity:1;--tw-ring-opacity:1;--tw-ring-color:rgb(239 68 68/var(--tw-ring-opacity));background-color:rgb(220 38 38/var(--tw-bg-opacity));color:rgb(255 255 255/var(--tw-text-opacity))}.btn-danger:hover{--tw-bg-opacity:1;background-color:rgb(185 28 28/var(--tw-bg-opacity))}:is(.dark .btn-danger){--tw-bg-opacity:1;--tw-text-opacity:1;--tw-ring-opacity:1;--tw-ring-color:rgb(248 113 113/var(--tw-ring-opacity));background-color:rgb(127 29 29/var(--tw-bg-opacity));color:rgb(209 213 219/var(--tw-text-opacity))}:is(.dark .btn-danger:hover){--tw-bg-opacity:1;background-color:rgb(248 113 113/var(--tw-bg-opacity))}.btn-primary-subtle{--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(238 242 255/var(--tw-bg-opacity));color:rgb(79 70 229/var(--tw-text-opacity))}.btn-primary-subtle:hover{--tw-bg-opacity:1;background-color:rgb(224 231 255/var(--tw-bg-opacity))}:is(.dark .btn-primary-subtle){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(55 48 163/var(--tw-bg-opacity));color:rgb(199 210 254/var(--tw-text-opacity))}:is(.dark .btn-primary-subtle:hover){--tw-bg-opacity:1;background-color:rgb(67 56 202/var(--tw-bg-opacity))}.card-heading{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity));font-size:1.875rem;font-weight:600;letter-spacing:-.025em;line-height:2.25rem;order:-9999}:is(.dark .card-heading){--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity))}.progress-bar{--tw-bg-opacity:1;background-color:rgb(209 213 219/var(--tw-bg-opacity))}:is(.dark .progress-bar){--tw-bg-opacity:1;background-color:rgb(75 85 99/var(--tw-bg-opacity))}.progress{--tw-bg-opacity:1;background-color:rgb(79 70 229/var(--tw-bg-opacity))}:is(.dark .progress){--tw-bg-opacity:1;background-color:rgb(55 48 163/var(--tw-bg-opacity))}.sr-only{clip:rect(0,0,0,0);border-width:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.static{position:static}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:0}.z-10{z-index:10}.m-4{margin:1rem}.-mx-4{margin-left:-1rem;margin-right:-1rem}.-my-2{margin-bottom:-.5rem;margin-top:-.5rem}.mx-4{margin-left:1rem;margin-right:1rem}.mx-auto{margin-left:auto;margin-right:auto}.my-10{margin-bottom:2.5rem;margin-top:2.5rem}.my-4{margin-bottom:1rem;margin-top:1rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.table{display:table}.flow-root{display:flow-root}.grid{display:grid}.hidden{display:none}.h-full{height:100%}.min-h-full{min-height:100%}.w-full{width:100%}.min-w-0{min-width:0}.min-w-full{min-width:100%}.max-w-2xl{max-width:42rem}.max-w-4xl{max-width:56rem}.max-w-7xl{max-width:80rem}.max-w-lg{max-width:32rem}.flex-1{flex:1 1 0%}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.list-inside{list-style-position:inside}.list-disc{list-style-type:disc}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.flex-col{flex-direction:column}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0{gap:0}.gap-0\.5{gap:.125rem}.divide-y>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-bottom-width:calc(1px*var(--tw-divide-y-reverse));border-top-width:calc(1px*(1 - var(--tw-divide-y-reverse)))}.divide-gray-200>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(229 231 235/var(--tw-divide-opacity))}.divide-gray-300>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(209 213 219/var(--tw-divide-opacity))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.whitespace-nowrap{white-space:nowrap}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.border{border-width:1px}.border-red-400{--tw-border-opacity:1;border-color:rgb(248 113 113/var(--tw-border-opacity))}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity))}.bg-gray-300{--tw-bg-opacity:1;background-color:rgb(209 213 219/var(--tw-bg-opacity))}.bg-gray-400\/5{background-color:#9ca3af0d}.bg-gray-500{--tw-bg-opacity:1;background-color:rgb(107 114 128/var(--tw-bg-opacity))}.bg-gray-700{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity))}.bg-red-100{--tw-bg-opacity:1;background-color:rgb(254 226 226/var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.bg-opacity-75{--tw-bg-opacity:0.75}.p-4{padding:1rem}.p-8{padding:2rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.py-1\.5{padding-bottom:.375rem;padding-top:.375rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.py-3\.5{padding-bottom:.875rem;padding-top:.875rem}.py-4{padding-top:1rem}.pb-4,.py-4{padding-bottom:1rem}.pl-3{padding-left:.75rem}.pl-4{padding-left:1rem}.pr-3{padding-right:.75rem}.pr-4{padding-right:1rem}.pt-5{padding-top:1.25rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.align-middle{vertical-align:middle}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-6xl{font-size:3.75rem;line-height:1}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.leading-6{line-height:1.5rem}.leading-7{line-height:1.75rem}.leading-tight{line-height:1.25}.tracking-tight{letter-spacing:-.025em}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity))}.text-red-700{--tw-text-opacity:1;color:rgb(185 28 28/var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.shadow{--tw-shadow:0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a;--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 #0000000d;--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.shadow-xl{--tw-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.ring-1{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ring-gray-300{--tw-ring-opacity:1;--tw-ring-color:rgb(209 213 219/var(--tw-ring-opacity))}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-150,.transition-all{transition-duration:.15s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.hover\:bg-blue-600:hover{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity))}.focus\:outline-none:focus{outline:2px solid #0000;outline-offset:2px}:is(.dark .dark\:bg-gray-900){--tw-bg-opacity:1;background-color:rgb(17 24 39/var(--tw-bg-opacity))}@media (min-width:640px){.sm\:-mx-6{margin-left:-1.5rem;margin-right:-1.5rem}.sm\:mx-0{margin-left:0;margin-right:0}.sm\:my-8{margin-bottom:2rem;margin-top:2rem}.sm\:ml-16{margin-left:4rem}.sm\:mt-0{margin-top:0}.sm\:block{display:block}.sm\:inline{display:inline}.sm\:flex{display:flex}.sm\:w-full{width:100%}.sm\:flex-auto{flex:1 1 auto}.sm\:flex-none{flex:none}.sm\:grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:items-center{align-items:center}.sm\:truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sm\:rounded-lg{border-radius:.5rem}.sm\:p-6{padding:1.5rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:py-8{padding-bottom:2rem;padding-top:2rem}.sm\:pl-6{padding-left:1.5rem}.sm\:pr-6{padding-right:1.5rem}.sm\:text-3xl{font-size:1.875rem;line-height:2.25rem}.sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}.sm\:tracking-tight{letter-spacing:-.025em}}@media (min-width:768px){.md\:max-w-3xl{max-width:48rem}}@media (min-width:1024px){.lg\:-mx-8{margin-left:-2rem;margin-right:-2rem}.lg\:ml-4{margin-left:1rem}.lg\:mt-0{margin-top:0}.lg\:flex{display:flex}.lg\:table-cell{display:table-cell}.lg\:max-w-none{max-width:none}.lg\:grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:items-center{align-items:center}.lg\:justify-between{justify-content:space-between}.lg\:px-8{padding-left:2rem}.lg\:pr-8,.lg\:px-8{padding-right:2rem}}
data/app/assets/stylesheets/mission_control/servers/application.tailwind.css CHANGED
@@ -1,3 +1,75 @@
1
1
  @tailwind base;
2
2
  @tailwind components;
3
3
  @tailwind utilities;
4
+
5
+ @layer base {
6
+ body {
7
+ @apply bg-white text-gray-900;
8
+ @apply dark:bg-gray-900 dark:text-gray-300;
9
+ }
10
+
11
+ h1, h2, h3, h4, h5, h6 {
12
+ @apply text-white;
13
+ @apply dark:text-gray-300;
14
+ }
15
+ }
16
+
17
+ @layer components {
18
+ .text-gray-light {
19
+ @apply text-gray-500 ;
20
+ @apply dark:text-gray-400;
21
+ }
22
+
23
+ .text-gray-normal {
24
+ @apply text-gray-700 ;
25
+ @apply dark:text-gray-300;
26
+ }
27
+ }
28
+
29
+ @layer components {
30
+ .btn {
31
+ @apply inline-flex items-center rounded-md;
32
+ @apply px-3 py-2 text-sm font-semibold;
33
+ @apply shadow-sm ring-1 ring-inset;
34
+ }
35
+
36
+ .btn-default {
37
+ @apply bg-white text-gray-900 ring-gray-300 hover:bg-gray-50;
38
+ @apply dark:bg-gray-800 dark:text-gray-300 dark:ring-gray-600 dark:hover:bg-gray-700;
39
+ }
40
+
41
+ .btn-primary {
42
+ @apply bg-indigo-600 text-white ring-indigo-500 hover:bg-indigo-700;
43
+ @apply dark:bg-indigo-900 dark:text-gray-400 dark:ring-indigo-400 dark:hover:bg-indigo-400;
44
+ }
45
+
46
+ .btn-danger {
47
+ @apply bg-red-600 text-white ring-red-500 hover:bg-red-700;
48
+ @apply dark:bg-red-900 dark:text-gray-300 dark:ring-red-400 dark:hover:bg-red-400;
49
+ }
50
+
51
+ .btn-primary-subtle {
52
+ @apply bg-indigo-50 text-indigo-600 hover:bg-indigo-100;
53
+ @apply dark:bg-indigo-800 dark:text-indigo-200 dark:hover:bg-indigo-700;
54
+ }
55
+ }
56
+
57
+ @layer components {
58
+ .card-heading {
59
+ @apply order-first text-3xl font-semibold tracking-tight;
60
+ @apply text-gray-900;
61
+ @apply dark:text-gray-400;
62
+ }
63
+ }
64
+
65
+ @layer components {
66
+ .progress-bar {
67
+ @apply bg-gray-300;
68
+ @apply dark:bg-gray-600;
69
+ }
70
+
71
+ .progress {
72
+ @apply bg-indigo-600;
73
+ @apply dark:bg-indigo-800;
74
+ }
75
+ }
data/app/controllers/mission_control/servers/scripts_controller.rb CHANGED
@@ -18,6 +18,29 @@ module MissionControl::Servers
18
18
 
19
19
  def script_content
20
20
  <<~SCRIPT
21
+ if [ "$(id -u)" -eq 0 ]; then
22
+ SUDO=""
23
+ else
24
+ if command -v sudo > /dev/null; then
25
+ SUDO="sudo"
26
+ else
27
+ echo "Script needs to be run as root or with sudo installed."
28
+ exit 1
29
+ fi
30
+ fi
31
+
32
+ if command -v apt-get > /dev/null; then
33
+ $SUDO apt-get update
34
+ $SUDO apt-get install -y curl cron
35
+ elif command -v yum > /dev/null; then
36
+ $SUDO yum install -y curl cronie
37
+ elif command -v zypper > /dev/null; then
38
+ $SUDO zypper install -y curl cron
39
+ else
40
+ echo "Unsupported package manager. Please install curl and cron manually."
41
+ exit 1
42
+ fi
43
+
21
44
  cat <<'EOF' > metrics.sh
22
45
  #!/bin/bash
23
46
 
@@ -41,6 +64,25 @@ module MissionControl::Servers
41
64
 
42
65
  cron_job="* * * * * $(pwd)/metrics.sh"
43
66
  (crontab -l 2>/dev/null | grep -v -F "$cron_job"; echo "$cron_job") | crontab -
67
+ echo
68
+
69
+ echo "████████████████████████████████████████████████████████████████████████████"
70
+ echo "█ █"
71
+ echo "█ ██╗███╗ ██╗███████╗████████╗ █████╗ ██╗ ██╗ ███████╗██████╗ █"
72
+ echo "█ ██║████╗ ██║██╔════╝╚══██╔══╝██╔══██╗██║ ██║ ██╔════╝██╔══██╗ █"
73
+ echo "█ ██║██╔██╗ ██║███████╗ ██║ ███████║██║ ██║ █████╗ ██║ ██║ █"
74
+ echo "█ ██║██║╚██╗██║╚════██║ ██║ ██╔══██║██║ ██║ ██╔══╝ ██║ ██║ █"
75
+ echo "█ ██║██║ ╚████║███████║ ██║ ██║ ██║███████╗███████╗███████╗██████╔╝ █"
76
+ echo "█ ╚═╝╚═╝ ╚═══╝╚══════╝ ╚═╝ ╚═╝ ╚═╝╚══════╝╚══════╝╚══════╝╚═════╝ █"
77
+ echo "█ █"
78
+ echo "█ Metrics script installed and scheduled to run every minute. █"
79
+ echo "█ This script is idempotent and can be run multiple times. █"
80
+ echo "█ █"
81
+ echo "█ To uninstall, remove the cron job (crontab -e) and █"
82
+ echo "█ delete the metrics.sh file. █"
83
+ echo "█ █"
84
+ echo "████████████████████████████████████████████████████████████████████████████"
85
+
44
86
  SCRIPT
45
87
  end
46
88
  end
data/app/javascript/mission_control/servers/controllers/dark_mode_controller.js ADDED
@@ -0,0 +1,44 @@
1
+ import { Controller } from "@hotwired/stimulus"
2
+
3
+ export default class extends Controller {
4
+ connect() {
5
+ this.checkUrlForDarkMode();
6
+ this.toggleDarkMode();
7
+ }
8
+
9
+ checkUrlForDarkMode() {
10
+ const urlParams = new URLSearchParams(window.location.search);
11
+ const dark = urlParams.get('dark');
12
+
13
+ if (dark === 'true') {
14
+ document.documentElement.classList.add('dark');
15
+ localStorage.setItem('darkMode', 'true');
16
+ } else if (dark === 'false') {
17
+ document.documentElement.classList.remove('dark');
18
+ localStorage.setItem('darkMode', 'false');
19
+ }
20
+ }
21
+
22
+ toggleDarkMode() {
23
+ if (localStorage.getItem('darkMode') === 'true') {
24
+ document.documentElement.classList.add('dark');
25
+ this.element.innerHTML = 'Light Mode';
26
+ } else {
27
+ document.documentElement.classList.remove('dark');
28
+ this.element.innerHTML = 'Dark Mode';
29
+ }
30
+ }
31
+
32
+ toggle() {
33
+ let htmlClasses = document.documentElement.classList;
34
+ if (htmlClasses.contains('dark')) {
35
+ htmlClasses.remove('dark');
36
+ localStorage.setItem('darkMode', 'false');
37
+ this.element.innerHTML = 'Dark Mode';
38
+ } else {
39
+ htmlClasses.add('dark');
40
+ localStorage.setItem('darkMode', 'true');
41
+ this.element.innerHTML = 'Light Mode';
42
+ }
43
+ }
44
+ }
data/app/javascript/mission_control/servers/controllers/pie_chart_controller.js CHANGED
@@ -8,25 +8,57 @@ export default class extends Controller {
8
8
  idleLabel: String,
9
9
  usedLabel: String,
10
10
  idleColor: "rgb(235, 235, 235)",
11
- usedColor: "rgb(54, 162, 235)"
11
+ idleDarkColor: "rgb(32, 32, 32)",
12
+ usedColor: "rgb(54, 162, 235)",
13
+ usedDarkColor: "rgb(32, 32, 128)",
14
+ darkBorderColor: "rgb(255, 255, 255, 0.1)",
15
+ lightBorderColor: "rgb(0, 0, 0, 0.1)"
12
16
  }
17
+
13
18
  connect() {
14
- const ctx = this.element
15
- new Chart(ctx, {
19
+ this.observeHtmlClassChanges();
20
+ this.displayChart();
21
+ }
22
+
23
+ observeHtmlClassChanges() {
24
+ const observer = new MutationObserver(mutations => {
25
+ mutations.forEach(mutation => {
26
+ if (mutation.type === "attributes" && mutation.attributeName === "class") {
27
+ this.updateChartColors();
28
+ }
29
+ });
30
+ });
31
+ observer.observe(document.documentElement, { attributes: true });
32
+ }
33
+
34
+ updateChartColors() {
35
+ const isDarkMode = document.documentElement.classList.contains('dark');
36
+ const idleColor = isDarkMode ? this.idleDarkColorValue : this.idleColorValue;
37
+ const usedColor = isDarkMode ? this.usedDarkColorValue : this.usedColorValue;
38
+ this.chart.data.datasets.forEach(dataset => {
39
+ dataset.backgroundColor = [usedColor, idleColor];
40
+ dataset.borderColor = isDarkMode ? this.darkBorderColorValue : this.lightBorderColorValue;
41
+ });
42
+ this.chart.update();
43
+ }
44
+
45
+ displayChart() {
46
+ const isDarkMode = document.documentElement.classList.contains('dark');
47
+ const idleColor = isDarkMode ? this.idleDarkColorValue : this.idleColorValue;
48
+ const usedColor = isDarkMode ? this.usedDarkColorValue : this.usedColorValue;
49
+ this.chart = new Chart(this.element, {
16
50
  type: 'doughnut',
17
51
  data: {
18
52
  labels: [this.usedLabelValue, this.idleLabelValue],
19
- datasets: [
20
- {
21
- label: this.labelValue,
22
- data: [this.usedValue, this.idleValue],
23
- backgroundColor: [this.usedColorValue,this.idleColorValue],
24
- hoverOffset: 4
25
- }
26
- ]
53
+ datasets: [{
54
+ label: this.labelValue,
55
+ data: [this.usedValue, this.idleValue],
56
+ backgroundColor: [usedColor, idleColor],
57
+ borderColor: isDarkMode ? this.darkBorderColorValue : this.lightBorderColorValue,
58
+ hoverOffset: 4
59
+ }]
27
60
  },
28
61
  options: { animation: false }
29
62
  });
30
63
  }
31
-
32
64
  }
data/app/views/layouts/mission_control/servers/application.html.erb CHANGED
@@ -6,7 +6,6 @@
6
6
  <%= csp_meta_tag %>
7
7
  <meta name="viewport" content="width=device-width,initial-scale=1">
8
8
  <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
9
-
10
9
  <%= stylesheet_link_tag "mission_control_servers_application", media: "all" %>
11
10
  <%= javascript_importmap_tags "application-mcs" %>
12
11
  </head>
data/app/views/mission_control/servers/dashboards/cpu_histories/show.html.erb CHANGED
@@ -1,6 +1,6 @@
1
1
  <%= turbo_frame_tag dom_id(@project, [@hostname, :cpu_history].join('-')) do %>
2
- <div class="progress-bar bg-gray-300" style="height: 5px; width: 100%;">
3
- <div class="progress bg-blue-500" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
2
+ <div class="progress-bar" style="height: 5px; width: 100%;">
3
+ <div class="progress" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
4
4
  </div>
5
5
  <div class="flex flex-col bg-gray-400/5 p-8">
6
6
  <dt class="text-sm font-semibold leading-6 text-gray-600">
@@ -10,6 +10,6 @@
10
10
  data-line-chart-data-array-value="<%= @cpu_history_data[:cpu_usages] %>"
11
11
  data-line-chart-color-value="rgb(54, 162, 235)"></canvas>
12
12
  </dt>
13
- <dd class="order-first text-3xl font-semibold tracking-tight text-gray-900">CPU History</dd>
13
+ <dd class="card-heading">CPU History</dd>
14
14
  </div>
15
15
  <% end %>
data/app/views/mission_control/servers/dashboards/cpu_usages/show.html.erb CHANGED
@@ -1,6 +1,6 @@
1
1
  <%= turbo_frame_tag dom_id(@project, [@hostname, :cpu_usage].join('-')) do %>
2
- <div class="progress-bar bg-gray-300" style="height: 5px; width: 100%;">
3
- <div class="progress bg-blue-500" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
2
+ <div class="progress-bar" style="height: 5px; width: 100%;">
3
+ <div class="progress" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
4
4
  </div>
5
5
  <div class="flex flex-col bg-gray-400/5 p-8">
6
6
  <dt class="text-sm font-semibold leading-6 text-gray-600">
@@ -8,11 +8,9 @@
8
8
  data-pie-chart-label-value="CPU Usage"
9
9
  data-pie-chart-idle-value="<%= 100.0 - @service.cpu %>"
10
10
  data-pie-chart-idle-label-value="Idle"
11
- data-pie-chart-idle-color-value="rgb(235, 235, 235)"
12
11
  data-pie-chart-used-value="<%= @service.cpu %>"
13
- data-pie-chart-used-label-value="Active"
14
- data-pie-chart-used-color-value="rgb(54, 162, 235)"></canvas>
12
+ data-pie-chart-used-label-value="Active"></canvas>
15
13
  </dt>
16
- <dd class="order-first text-3xl font-semibold tracking-tight text-gray-900">CPU Usage</dd>
14
+ <dd class="card-heading">CPU Usage</dd>
17
15
  </div>
18
16
  <% end %>
data/app/views/mission_control/servers/dashboards/disk_frees/show.html.erb CHANGED
@@ -6,6 +6,6 @@
6
6
  <dt class="text-6xl font-semibold leading-6 mt-5 text-gray-600">
7
7
  <%= @service.disk_free %>
8
8
  </dt>
9
- <dd class="order-first text-3xl font-semibold tracking-tight text-gray-900">Disk Free</dd>
9
+ <dd class="card-heading">Disk Free</dd>
10
10
  </div>
11
11
  <% end %>
data/app/views/mission_control/servers/dashboards/memory_histories/show.html.erb CHANGED
@@ -1,6 +1,6 @@
1
1
  <%= turbo_frame_tag dom_id(@project, [@hostname, :memory_history].join('-')) do %>
2
- <div class="progress-bar bg-gray-300" style="height: 5px; width: 100%;">
3
- <div class="progress bg-blue-500" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
2
+ <div class="progress-bar" style="height: 5px; width: 100%;">
3
+ <div class="progress" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
4
4
  </div>
5
5
  <div class="flex flex-col bg-gray-400/5 p-8">
6
6
  <dt class="text-sm font-semibold leading-6 text-gray-600">
@@ -10,6 +10,6 @@
10
10
  data-line-chart-data-array-value="<%= @memory_history_data[:memory_usages] %>"
11
11
  data-line-chart-color-value="rgb(54, 162, 235)"></canvas>
12
12
  </dt>
13
- <dd class="order-first text-3xl font-semibold tracking-tight text-gray-900">Memory Used History</dd>
13
+ <dd class="card-heading">Memory Used History</dd>
14
14
  </div>
15
15
  <% end %>
data/app/views/mission_control/servers/dashboards/memory_usages/show.html.erb CHANGED
@@ -1,6 +1,6 @@
1
1
  <%= turbo_frame_tag dom_id(@project, [@hostname, :memory_usage].join('-')) do %>
2
- <div class="progress-bar bg-gray-300" style="height: 5px; width: 100%;">
3
- <div class="progress bg-blue-500" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
2
+ <div class="progress-bar" style="height: 5px; width: 100%;">
3
+ <div class="progress" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
4
4
  </div>
5
5
  <div class="flex flex-col bg-gray-400/5 p-8">
6
6
  <dt class="text-sm font-semibold leading-6 text-gray-600">
@@ -13,6 +13,6 @@
13
13
  data-pie-chart-used-label-value="Active"
14
14
  data-pie-chart-used-color-value="rgb(54, 162, 235)"></canvas>
15
15
  </dt>
16
- <dd class="order-first text-3xl font-semibold tracking-tight text-gray-900">Memory Usage</dd>
16
+ <dd class="card-heading">Memory Usage</dd>
17
17
  </div>
18
18
  <% end %>
data/app/views/mission_control/servers/dashboards/project_tables/show.html.erb CHANGED
@@ -1,17 +1,17 @@
1
1
  <%= turbo_frame_tag dom_id(@project, "table") do %>
2
2
  <div class="mx-4 my-4 ring-1 ring-gray-300 sm:mx-0 sm:rounded-lg">
3
- <div class="progress-bar ring-1 ring-gray-300 sm:mx-0 sm:rounded-lg bg-gray-300" style="height: 5px; width: 100%;">
4
- <div class="progress bg-blue-500 ring-1 ring-gray-300 sm:mx-0 sm:rounded-lg" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
3
+ <div class="progress-bar" style="height: 5px; width: 100%;">
4
+ <div class="progress" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
5
5
  </div>
6
6
  <table class="min-w-full divide-y divide-gray-300">
7
7
  <thead>
8
8
  <tr>
9
- <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6">Hostname</th>
10
- <th scope="col" class="px-3 py-3.5 text-left text-sm font-semibold text-gray-900">CPU Usage</th>
11
- <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-900 lg:table-cell">Memory Used</th>
12
- <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-900 lg:table-cell">Memory Used %</th>
13
- <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-900 lg:table-cell">Memory Free</th>
14
- <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-900 lg:table-cell">Disk Free</th>
9
+ <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-normal sm:pl-6">Hostname</th>
10
+ <th scope="col" class="px-3 py-3.5 text-left text-sm font-semibold text-gray-normal">CPU Usage</th>
11
+ <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-normal lg:table-cell">Memory Used</th>
12
+ <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-normal lg:table-cell">Memory Used %</th>
13
+ <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-normal lg:table-cell">Memory Free</th>
14
+ <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-normal lg:table-cell">Disk Free</th>
15
15
  <th scope="col" class="relative py-3.5 pl-3 pr-4 sm:pr-6">
16
16
  <span class="sr-only">Select</span>
17
17
  </th>
@@ -21,16 +21,16 @@
21
21
  <% @project.services.group_by(&:hostname).each do |hostname, services| %>
22
22
  <tr>
23
23
  <td class="relative py-4 pl-4 pr-3 text-sm sm:pl-6">
24
- <div class="font-medium text-gray-900"><%= hostname%></div>
24
+ <div class="font-medium text-gray-normal"><%= hostname%></div>
25
25
  </td>
26
- <td class="px-3 py-3.5 text-sm text-gray-500 lg:table-cell"><%= services.last.cpu %>%</td>
27
- <td class="hidden px-3 py-3.5 text-sm text-gray-500 lg:table-cell"><%= number_to_human_size(services.last.mem_used.to_f * 1.megabyte) %></td>
28
- <td class="hidden px-3 py-3.5 text-sm text-gray-500 lg:table-cell"><%= services.last.mem_percent %>%</td>
29
- <td class="hidden px-3 py-3.5 text-sm text-gray-500 lg:table-cell"><%= number_to_human_size(services.last.mem_free.to_f * 1.megabyte) %></td>
30
- <td class="hidden px-3 py-3.5 text-sm text-gray-500 lg:table-cell"><%= services.last.disk_free %></td>
26
+ <td class="px-3 py-3.5 text-sm text-gray-light lg:table-cell"><%= services.last.cpu %>%</td>
27
+ <td class="hidden px-3 py-3.5 text-sm text-gray-light lg:table-cell"><%= number_to_human_size(services.last.mem_used.to_f * 1.megabyte) %></td>
28
+ <td class="hidden px-3 py-3.5 text-sm text-gray-light lg:table-cell"><%= services.last.mem_percent %>%</td>
29
+ <td class="hidden px-3 py-3.5 text-sm text-gray-light lg:table-cell"><%= number_to_human_size(services.last.mem_free.to_f * 1.megabyte) %></td>
30
+ <td class="hidden px-3 py-3.5 text-sm text-gray-light lg:table-cell"><%= services.last.disk_free %></td>
31
31
  <td class="relative py-3.5 pl-3 pr-4 text-right text-sm font-medium sm:pr-6">
32
- <%= link_to "Dashboard", project_path(@project, hostname: hostname), target: :_top, class: "inline-flex items-center rounded-md bg-white px-2.5 py-1.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-30 disabled:hover:bg-white" %>
33
- <%= link_to "Remove", project_path(@project, hostname: hostname), data: { "turbo-method": :delete, "turbo-confirm": "Are you sure?" }, class: "inline-flex items-center rounded-md bg-white px-2.5 py-1.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-30 disabled:hover:bg-white" %>
32
+ <%= link_to "Dashboard", project_path(@project, hostname: hostname), target: :_top, class: "btn btn-default" %>
33
+ <%= link_to "Remove", project_path(@project, hostname: hostname), data: { "turbo-method": :delete, "turbo-confirm": "Are you sure?" }, class: "btn btn-danger" %>
34
34
  </td>
35
35
  </tr>
36
36
  <% end %>
data/app/views/mission_control/servers/projects/_form.html.erb CHANGED
@@ -21,7 +21,7 @@
21
21
  </div>
22
22
 
23
23
  <div class="flex items-center justify-between">
24
- <%= form.submit class: "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline" %>
25
- <%= link_to "Cancel", project, class: "text-blue-600 px-4 hover:text-blue-800 transition duration-150 ease-in-out" %>
24
+ <%= form.submit class: "btn btn-primary btn-block" %>
25
+ <%= link_to "Cancel", project, class: "text-gray-light px-4 transition duration-150 ease-in-out" %>
26
26
  </div>
27
27
  <% end %>
data/app/views/mission_control/servers/projects/edit.html.erb CHANGED
@@ -1,9 +1,18 @@
1
+ <div class="lg:flex lg:items-center lg:justify-between">
2
+ <div class="min-w-0 flex-1"></div>
3
+ <div class="mt-5 flex lg:ml-4 lg:mt-0">
4
+ <span class="hidden sm:block">
5
+ <button data-controller="dark-mode" data-action="click->dark-mode#toggle" class="btn btn-default">Dark Mode</button>
6
+ </span>
7
+ </div>
8
+ </div>
9
+
1
10
  <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 my-10">
2
- <h1 class="text-2xl text-center font-semibold text-gray-900 mb-8">Editing project</h1>
11
+ <h1 class="text-2xl text-center font-semibold text-gray-normal mb-8">Editing project</h1>
3
12
 
4
13
  <%= render "form", project: @project %>
5
14
 
6
15
  <div class="text-center mt-6">
7
- <%= link_to "Back to projects", projects_path, class: "text-blue-600 px-4 hover:text-blue-800 transition duration-150 ease-in-out" %>
16
+ <%= link_to "Back to projects", projects_path, class: "text-gray-light px-4 transition duration-150 ease-in-out" %>
8
17
  </div>
9
18
  </div>
data/app/views/mission_control/servers/projects/index.html.erb CHANGED
@@ -1,12 +1,21 @@
1
+ <div class="lg:flex lg:items-center lg:justify-between">
2
+ <div class="min-w-0 flex-1"></div>
3
+ <div class="mt-5 flex lg:ml-4 lg:mt-0">
4
+ <span class="hidden sm:block">
5
+ <button data-controller="dark-mode" data-action="click->dark-mode#toggle" class="btn btn-default">Dark Mode</button>
6
+ </span>
7
+ </div>
8
+ </div>
9
+
1
10
  <div class="px-4 sm:px-6 lg:px-8">
2
11
  <div class="sm:flex sm:items-center">
3
12
  <div class="sm:flex-auto">
4
- <h1 class="text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">Projects</h1>
5
- <p class="mt-2 text-sm text-gray-700">Resource monitor for your Ruby on Rails applications.</p>
13
+ <h1 class="text-3xl font-bold tracking-tight sm:text-4xl">Projects</h1>
14
+ <p class="mt-2 text-sm text-gray-normal">Resource monitor for your Ruby on Rails applications.</p>
6
15
  </div>
7
16
  <div class="mt-4 sm:ml-16 sm:mt-0 sm:flex-none">
8
17
  <% if allowed_to_create_project? %>
9
- <%= link_to "New project", new_project_path, class: "block rounded-md bg-indigo-600 px-3 py-2 text-center text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600" %>
18
+ <%= link_to "New project", new_project_path, class: "btn btn-primary" %>
10
19
  <% end %>
11
20
  </div>
12
21
  </div>
@@ -14,13 +23,13 @@
14
23
  <div class="-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
15
24
  <div class="inline-block min-w-full py-2 align-middle">
16
25
  <table class="min-w-full divide-y divide-gray-300">
17
- <tbody class="divide-y divide-gray-200 bg-white">
26
+ <tbody class="divide-y divide-gray-200">
18
27
  <% @projects.each do |project| %>
19
28
  <tr>
20
- <td class="whitespace-nowrap text-2xl font-bold tracking-tight text-gray-900 sm:text-3xl"><%= project.title %></td>
29
+ <td class="whitespace-nowrap text-2xl font-bold tracking-tight text-gray-normal sm:text-3xl"><%= project.title %></td>
21
30
  <td class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-6 lg:pr-8">
22
- <%= link_to "Dashboards", project, target: :_top, class: "rounded-md bg-indigo-50 px-2.5 py-1.5 text-sm font-semibold text-indigo-600 shadow-sm hover:bg-indigo-100" %>
23
- <%= link_to "Remove", project, data: { "turbo-method": :delete, "turbo-confirm": "Are you sure?" }, class: "inline-flex items-center rounded-md bg-white px-2.5 py-1.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-30 disabled:hover:bg-white" %>
31
+ <%= link_to "Dashboards", project, target: :_top, class: "btn btn-default" %>
32
+ <%= link_to "Remove", project, data: { "turbo-method": :delete, "turbo-confirm": "Are you sure?" }, class: "btn btn-danger" %>
24
33
  </td>
25
34
  </tr>
26
35
  <tr>
data/app/views/mission_control/servers/projects/new.html.erb CHANGED
@@ -1,9 +1,18 @@
1
+ <div class="lg:flex lg:items-center lg:justify-between">
2
+ <div class="min-w-0 flex-1"></div>
3
+ <div class="mt-5 flex lg:ml-4 lg:mt-0">
4
+ <span class="hidden sm:block">
5
+ <button data-controller="dark-mode" data-action="click->dark-mode#toggle" class="btn btn-default">Dark Mode</button>
6
+ </span>
7
+ </div>
8
+ </div>
9
+
1
10
  <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 my-10">
2
- <h1 class="text-2xl text-center font-semibold text-gray-900 mb-8">New Project</h1>
11
+ <h1 class="text-2xl text-center font-semibold text-gray-normal mb-8">New Project</h1>
3
12
 
4
13
  <%= render "form", project: @project %>
5
14
 
6
15
  <div class="text-center mt-6">
7
- <%= link_to "Back to projects", projects_path, class: "text-blue-600 hover:text-blue-800 transition duration-150 ease-in-out" %>
16
+ <%= link_to "Back to projects", projects_path, class: "text-gray-light transition duration-150 ease-in-out" %>
8
17
  </div>
9
18
  </div>
data/app/views/mission_control/servers/projects/show.html.erb CHANGED
@@ -5,25 +5,25 @@
5
5
 
6
6
  <div class="mt-5 flex lg:ml-4 lg:mt-0">
7
7
  <span class="hidden sm:block">
8
- <%= link_to edit_project_path(@project), class: "inline-flex items-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50" do %>
8
+ <button data-controller="dark-mode" data-action="click->dark-mode#toggle" class="btn btn-default">Dark Mode</button>
9
+
10
+ <%= link_to edit_project_path(@project), class: "btn btn-default" do %>
9
11
  Edit
10
12
  <% end %>
11
- <%= link_to projects_path, class: "inline-flex items-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50" do %>
12
- Projects
13
- <% end %>
13
+ <%= link_to projects_path, class: "btn btn-default" do %>Projects<% end %>
14
14
 
15
15
  <span data-controller="dialog copy">
16
- <button data-action="click->dialog#show" class="rounded-md bg-indigo-50 px-2.5 py-1.5 text-sm font-semibold text-indigo-600 shadow-sm hover:bg-indigo-100">
16
+ <button data-action="click->dialog#show" class="btn btn-primary-subtle">
17
17
  Deploy
18
18
  </button>
19
19
  <div data-dialog-target="modal" class="hidden fixed z-10 inset-0 overflow-y-auto" aria-labelledby="modal-title" role="dialog" aria-modal="true">
20
20
  <div data-action="click->dialog#hide" class="fixed inset-0 bg-gray-500 bg-opacity-75"></div>
21
21
  <div class="flex items-end justify-center min-h-full p-4 text-center sm:items-center">
22
- <div class="relative bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 md:max-w-3xl sm:w-full">
22
+ <div class="relative bg-white dark:bg-gray-900 rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 md:max-w-3xl sm:w-full">
23
23
  <div class="px-4 pt-5 pb-4 sm:p-6">
24
24
  <h3 class="text-lg leading-6 font-medium text-gray-900" id="modal-title">Installation Instructions</h3>
25
25
  <div class="mt-2">
26
- <p class="text-sm text-gray-500">
26
+ <p class="text-sm text-gray-light">
27
27
  You'll make a cURL request from each server that you want to monitor.
28
28
  Copy and paste the script below to each server to start sending metrics to your dashboard.
29
29
  </p>
@@ -43,7 +43,7 @@
43
43
  </div>
44
44
 
45
45
  <% @services.each do |hostname, services| %>
46
- <div class="bg-white py-4 sm:py-8">
46
+ <div class="py-4 sm:py-8">
47
47
  <div class="mx-auto max-w-7xl px-6 lg:px-8">
48
48
  <div class="mx-auto max-w-2xl lg:max-w-none">
49
49
  <div class="text-center">
data/config/tailwind.config.js CHANGED
@@ -1,12 +1,16 @@
1
1
  const defaultTheme = require('tailwindcss/defaultTheme')
2
2
 
3
3
  module.exports = {
4
+ darkMode: 'class',
4
5
  content: [
5
6
  './public/*.html',
6
7
  './app/helpers/**/*.rb',
7
8
  './app/javascript/**/*.js',
8
9
  './app/views/**/*.{erb,haml,html,slim}'
9
10
  ],
11
+ options: {
12
+ safelist: ['btn-primary-subtle'],
13
+ },
10
14
  theme: {
11
15
  extend: {
12
16
  fontFamily: {
data/lib/mission_control/servers/version.rb CHANGED
@@ -1,5 +1,5 @@
1
1
  module MissionControl
2
2
  module Servers
3
- VERSION = "0.1.3"
3
+ VERSION = "0.1.5"
4
4
  end
5
5
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: mission_control-servers
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.3
4
+ version: 0.1.5
5
5
  platform: ruby
6
6
  authors:
7
7
  - Dave Kimura
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2024-02-08 00:00:00.000000000 Z
11
+ date: 2024-02-09 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: rails
@@ -114,6 +114,7 @@ files:
114
114
  - app/javascript/mission_control/servers/application.js
115
115
  - app/javascript/mission_control/servers/controllers/application.js
116
116
  - app/javascript/mission_control/servers/controllers/copy_controller.js
117
+ - app/javascript/mission_control/servers/controllers/dark_mode_controller.js
117
118
  - app/javascript/mission_control/servers/controllers/dialog_controller.js
118
119
  - app/javascript/mission_control/servers/controllers/index.js
119
120
  - app/javascript/mission_control/servers/controllers/line_chart_controller.js
@@ -168,7 +169,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
168
169
  - !ruby/object:Gem::Version
169
170
  version: '0'
170
171
  requirements: []
171
- rubygems_version: 3.5.5
172
+ rubygems_version: 3.5.6
172
173
  signing_key:
173
174
  specification_version: 4
174
175
  summary: Dashboard for managing servers.