pad out the demo

docs/index.html.ejs

@@ -324,7 +324,7 @@
             <h3>Tab 3</h3>
             <p>Lorem Ipsum Dolor Sit</p>
           </article>
-      
+
         </section>
       `) %>
     </section>
@@ -669,7 +669,7 @@
 
 
         <%- example(`
-        <div class="window" style="width: 300px">
+        <div class="window" style="width: 400px">
           <div class="title-bar">
             <div class="title-bar-text">A Window With Tabs and Groups</div>
             <div class="title-bar-controls">
@@ -686,7 +686,7 @@
               <input type="radio" name="tab" id="dogs" />
               <label class="tab-title" for="dogs"><div class="tab-link">Dogs</div></label>
               <input type="radio" name="tab" id="cats" />
-              <label class="tab-title" for="cats"><div class="tab-link">Tab 3</div></label>
+              <label class="tab-title" for="cats"><div class="tab-link">Food</div></label>
 
 
 
@@ -711,18 +711,29 @@
                     <label for="radio${getCurrentId()}">EN. V</label>
                   </div>
                 </fieldset>
+
+
+
+                <section class="field-row">
+                  <button>Reset Alarm...</button>
+                  <label>Try this to get some attention</label>
+                </section>
+
               </article>
               <article class="tab">
-                <h3>Tab 3</h3>
-                <p>Lorem Ipsum Dolor Sit</p>
+                <img style="width: 100%" src="https://i.pinimg.com/originals/74/c5/03/74c503fb8e7c633c77cd4cb58ddc4c0d.jpg" />
               </article>
               <article class="tab">
                 <p>
                   You create the content for each tab by using an <code>article</code> tag.
                 </p>
+                <iframe width="100%" height="200" src="https://www.youtube.com/embed/TODJBQ0tnow" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
               </article>
-
             </section>
+
+
+
+
             <section class="field-row" style="justify-content: flex-end">
               <button>OK</button>
               <button>Cancel</button>

gui/_window.scss

@@ -4,6 +4,9 @@
     box-shadow: var(--border-window-outer), var(--border-window-inner);
     background: var(--surface);
     padding: 3px;
+    fieldset {
+        margin-bottom: 9px;
+    }
 }
 .title-bar {
     -webkit-font-smoothing: none;