Refinement R2 examples (#2)

Author: Matteo-it

examples/video-face-detection/assets/index.html

@@ -51,7 +51,7 @@ <h1 class="arduino-text">Video Face Detection</h1>
                                 <div class="slider-container">
                                     <div class="slider-progress" id="sliderProgress"></div>
                                     <div class="confidence-value-display" id="confidenceValueDisplay">0.5</div>
-                                    <input type="range" id="confidenceSlider" min="0" max="1" step="0.05" value="0.5">
+                                    <input type="range" id="confidenceSlider" min="0" max="1" step="0.01" value="0.5">
                                 </div>
                                 <span class="confidence-limits">1</span>
                             </div>

examples/video-face-detection/assets/style.css

@@ -284,7 +284,7 @@ body {
 }
 
 .arduino-logo {
-    height: 32px;
+    height: 48px;
     width: auto;
 }
 
@@ -612,7 +612,7 @@ body {
     font-weight: inherit;
     color: inherit;
     text-align: center;
-    width: 32px;
+    width: 40px;
     padding: 0;
     margin: 0;
     outline: none;
@@ -640,6 +640,10 @@ body {
     opacity: 1;
 }
 
+.feedback-section {
+    margin-bottom: 8px;
+}
+
 .feedback-content {
     display: flex;
     flex-direction: column;
@@ -700,7 +704,7 @@ body {
 
 .popover {
     position: absolute;
-    left: 25%;
+    left: 5%;
     top: 70%;
     margin-left: 8px;
     display: none;

examples/video-generic-object-detection/assets/index.html

@@ -50,7 +50,7 @@ <h1 class="arduino-text">Video Generic Object Detection</h1>
                                 <div class="slider-container">
                                     <div class="slider-progress" id="sliderProgress"></div>
                                     <div class="confidence-value-display" id="confidenceValueDisplay">0.5</div>
-                                    <input type="range" id="confidenceSlider" min="0" max="1" step="0.05" value="0.5">
+                                    <input type="range" id="confidenceSlider" min="0" max="1" step="0.01" value="0.5">
                                 </div>
                                 <span class="confidence-limits">1</span>
                             </div>

examples/video-generic-object-detection/assets/style.css

@@ -284,7 +284,7 @@ body {
 }
 
 .arduino-logo {
-    height: 32px;
+    height: 48px;
     width: auto;
 }
 
@@ -605,14 +605,18 @@ body {
     height: 36px;
 }
 
+.feedback-section {
+    margin-bottom: 8px;
+}
+
 .confidence-input {
     border: none;
     background: transparent;
     font-size: 12px;
     font-weight: inherit;
     color: inherit;
     text-align: center;
-    width: 32px;
+    width: 40px;
     padding: 0;
     margin: 0;
     outline: none;
@@ -695,7 +699,7 @@ body {
 
 .popover {
     position: absolute;
-    left: 25%;
+    left: 5%;
     top: 70%;
     margin-left: 8px;
     display: none;

examples/video-person-classification/assets/index.html

@@ -50,7 +50,7 @@ <h1 class="arduino-text">Video Person Classification</h1>
                                 <div class="slider-container">
                                     <div class="slider-progress" id="sliderProgress"></div>
                                     <div class="confidence-value-display" id="confidenceValueDisplay">0.5</div>
-                                    <input type="range" id="confidenceSlider" min="0" max="1" step="0.05" value="0.5">
+                                    <input type="range" id="confidenceSlider" min="0" max="1" step="0.01" value="0.5">
                                 </div>
                                 <span class="confidence-limits">1</span>
                             </div>

examples/video-person-classification/assets/style.css

@@ -284,7 +284,7 @@ body {
 }
 
 .arduino-logo {
-    height: 32px;
+    height: 48px;
     width: auto;
 }
 
@@ -358,7 +358,7 @@ body {
 
 .scan-content,
 .scan-content-time {
-    font-size: 14px;
+    font-size: 12px;
     font-style: normal;
     font-weight: 600;
     line-height: 160%;
@@ -605,14 +605,18 @@ body {
     height: 36px;
 }
 
+.feedback-section {
+    margin-bottom: 8px;
+}
+
 .confidence-input {
     border: none;
     background: transparent;
     font-size: 12px;
     font-weight: inherit;
     color: inherit;
     text-align: center;
-    width: 32px;
+    width: 40px;
     padding: 0;
     margin: 0;
     outline: none;
@@ -701,7 +705,7 @@ body {
 
 .popover {
     position: absolute;
-    left: 25%;
+    left: 5%;
     top: 70%;
     margin-left: 8px;
     display: none;