From 91b85b5f1e3888e7cb308ca30dbe12480bd54cbc Mon Sep 17 00:00:00 2001
From: Ingvar Stepanyan <rreverser@google.com>
Date: Mon, 17 Jan 2022 21:58:16 +0000
Subject: [PATCH] More styling tweaks

---
 ui/index.html | 16 +++++++++-------
 ui/index.js   | 26 +++++++++++++++-----------
 2 files changed, 24 insertions(+), 18 deletions(-)

diff --git a/ui/index.html b/ui/index.html
index 7960cf6..71bdfc8 100644
--- a/ui/index.html
+++ b/ui/index.html
@@ -18,24 +18,26 @@
         text-align: center;
       }
 
-      #capture {
-        width: 20ch;
-      }
-
       #config {
         overflow-y: auto;
         max-height: 100vh;
         padding-left: 5px;
         box-sizing: border-box;
-        border-left: 3px solid black;
+        border-left: 3px solid #777;
+      }
+
+      #config .pure-button {
+        margin: 1px;
+        width: 20ch;
       }
 
       #config label {
-        max-width: 40%;
+        width: 40%;
       }
 
+      #config input,
       #config select {
-        max-width: 50%;
+        width: 50%;
       }
     </style>
     <script type="importmap">
diff --git a/ui/index.js b/ui/index.js
index 82d35d2..85367c1 100644
--- a/ui/index.js
+++ b/ui/index.js
@@ -199,18 +199,22 @@ class App extends Component {
             h(
               'form',
               { class: 'pure-form pure-form-aligned' },
-              this.connection.supportedOps.triggerCapture
-                ? h(CaptureButton, { getFile: this.captureImage })
-                : undefined,
-              ' ',
               h(
-                'a',
-                {
-                  class: 'pure-button',
-                  href: 'https://github.com/GoogleChromeLabs/web-gphoto2',
-                  target: '_blank'
-                },
-                '⭐ Star on Github'
+                'fieldset',
+                null,
+                this.connection.supportedOps.triggerCapture
+                  ? h(CaptureButton, { getFile: this.captureImage })
+                  : undefined,
+                ' ',
+                h(
+                  'a',
+                  {
+                    class: 'pure-button',
+                    href: 'https://github.com/GoogleChromeLabs/web-gphoto2',
+                    target: '_blank'
+                  },
+                  '⭐ Star on Github'
+                )
               ),
               h(Widget, { config: state.config, setValue: this.setValue })
             )