UI bug fixes and feature refinements (#59)

* Rework settings page; touch up contour, output, and 3D tabs; font sizing

No stream placeholder; driver mode refined; cameras page

Make settings snackbar work

Lint fix

Fix settings page padding

Actually hide settings fields if unsupported

* Make toggle buttons less confusing; fix driver toggle; form validation

* Make eyedropper work and make input/select styling more consistent

* Fix color picker and tabbing bugs

* Set up camera and settings pages to talk to the backend

* Add auto reconnect

* Add lots of tooltips and improve related thematic consistency

* Only show output stream while color picking

* Unbreak robot offset

* Increase tooltip delay and refactor tooltip label into a component

* Remove toggle button switching behavior

* Fix PnP tab and add a flag to disable FOV configuration

* Move FPS indicator

* Make GPU acceleration status use one value in the store

* Only allow IPv4 static IPs and remove accidentally committed index

photon-client/src/components/common/cv-switch.vue

@@ -4,10 +4,13 @@
       dense
       align="center"
     >
-      <v-col :cols="2">
-        <span>{{ name }}</span>
+      <v-col :cols="textCols || 2">
+        <tooltipped-label
+          :tooltip="tooltip"
+          :text="name"
+        />
       </v-col>
-      <v-col>
+      <v-col :cols="12 - (textCols || 2)">
         <v-switch
           v-model="localValue"
           dark
@@ -21,24 +24,26 @@
 </template>
 
 <script>
-    export default {
-        name: 'CVSwitch',
-      // eslint-disable-next-line vue/require-prop-types
-        props: ['name', 'value', 'disabled'],
-        data() {
-            return {}
-        },
-        computed: {
-            localValue: {
-                get() {
-                    return this.value;
-                },
-                set(value) {
-                    this.$emit('input', value)
-                }
+import TooltippedLabel from "./cv-tooltipped-label";
+
+export default {
+    name: 'CVSwitch',
+    components: {
+        TooltippedLabel,
+    },
+  // eslint-disable-next-line vue/require-prop-types
+    props: ['name', 'value', 'disabled', 'textCols', 'tooltip'],
+    computed: {
+        localValue: {
+            get() {
+                return this.value;
+            },
+            set(value) {
+                this.$emit('input', value)
             }
         }
     }
+}
 </script>
 
 <style lang="" scoped>