From 631fea7f0ea1cd9592d934ad5f4d6cfcc2516f49 Mon Sep 17 00:00:00 2001
From: dimait <dima@surfly.com>
Date: Thu, 25 Nov 2021 18:50:00 +0100
Subject: [PATCH] minor

---
 breakpoints.html  |   3 +-
 css-samples.html  | 287 ----------------------------------------------
 log-debugger.html |   3 +-
 3 files changed, 4 insertions(+), 289 deletions(-)
 delete mode 100644 css-samples.html
diff --git a/breakpoints.html b/breakpoints.html
index 3a67f7f..f4af261 100644
--- a/breakpoints.html
+++ b/breakpoints.html
@@ -78,12 +78,13 @@ <h2>Trick of the day:</h2>
       </a>
       <div><!--spacer--></div>
       <a href="other-breakpoints.html">
-        <button id="next">Easy, next!</button>
+        <button id="next">Next</button>
       </a>
 
       <script>
         document.getElementById('next').onclick = e => {
           var allowed = false;
+          console.log('Allowed', allowed);
           if (!allowed) {
             alert('You shall not pass!')
             e.preventDefault();
diff --git a/css-samples.html b/css-samples.html
deleted file mode 100644
index a1d019c..0000000
--- a/css-samples.html
+++ /dev/null
@@ -1,287 +0,0 @@
-<!doctype html>
-<html lang="en" data-theme="dark">
-
-<head>
-  <meta charset="utf-8">
-  <title>WebCore</title>
-  <meta name="description" content="">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-
-  <link rel="manifest" href="site.webmanifest">
-  <link rel="icon" href="icon.png">
-
-  <link rel="stylesheet" href="css/main.css">
-  <link rel="stylesheet" href="css/pico.css">
-
-  <meta name="theme-color" content="#fafafa">
-</head>
-
-<body>
-
-
-<main class="container">
-
-  <!-- Preview -->
-  <section id="preview">
-    <h1>Unorthodox ways to debug JS</h1>
-    <p>Sed ultricies dolor non ante vulputate hendrerit. Vivamus sit amet suscipit sapien. Nulla iaculis eros a elit pharetra egestas.</p>
-    <form>
-      <div class="grid">
-        <input type="text" name="firstname" placeholder="First name" aria-label="First name" required="">
-        <input type="email" name="email" placeholder="Email address" aria-label="Email address" required="">
-        <button type="submit">Subscribe</button>
-      </div>
-      <fieldset>
-        <label for="terms">
-          <input type="checkbox" role="switch" id="terms" name="terms">
-          I agree to the <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank">Privacy Policy</a>
-        </label>
-      </fieldset>
-    </form>
-  </section><!-- ./ Preview -->
-
-  <!-- form -->
-  <section id="form">
-    <h2>Form</h2>
-    <p>Sed ultricies dolor non ante vulputate hendrerit. Vivamus sit amet suscipit sapien. Nulla iaculis eros a elit pharetra egestas.</p>
-    <form>
-      <div class="grid">
-        <input type="text" name="firstname" placeholder="First name" aria-label="First name" required="">
-        <input type="email" name="email" placeholder="Email address" aria-label="Email address" required="">
-        <button type="submit">Subscribe</button>
-      </div>
-      <fieldset>
-        <label for="terms">
-          <input type="checkbox" role="switch" id="terms" name="terms">
-          I agree to the <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank">Privacy Policy</a>
-        </label>
-      </fieldset>
-    </form>
-  </section><!-- ./ Preview -->
-
-  <!-- Typography-->
-  <section id="typography">
-    <h2>Typography</h2>
-    <p>Aliquam lobortis vitae nibh nec rhoncus. Morbi mattis neque eget efficitur feugiat. Vivamus porta nunc a erat mattis, mattis feugiat turpis pretium. Quisque sed tristique felis.</p>
-
-    <!-- Blockquote-->
-    <blockquote>
-      "Maecenas vehicula metus tellus, vitae congue turpis hendrerit non. Nam at dui sit amet ipsum cursus ornare."
-      <footer>
-        <cite>- Phasellus eget lacinia</cite>
-      </footer>
-    </blockquote>
-
-    <!-- Lists-->
-    <h3>Lists</h3>
-    <ul>
-      <li>Aliquam lobortis lacus eu libero ornare facilisis.</li>
-      <li>Nam et magna at libero scelerisque egestas.</li>
-    </ul>
-
-    <!-- Inline text elements-->
-    <h3>Inline text elements</h3>
-    <div class="grid">
-      <p><a href="#" onclick="event.preventDefault()">Primary link</a></p>
-      <p><a href="#" class="secondary" onclick="event.preventDefault()">Secondary link</a></p>
-      <p><a href="#" class="contrast" onclick="event.preventDefault()">Contrast link</a></p>
-    </div>
-    <div class="grid">
-      <p><strong>Bold</strong></p>
-      <p><em>Italic</em></p>
-      <p><u>Underline</u></p>
-    </div>
-    <div class="grid">
-      <p><del>Deleted</del></p>
-      <p><ins>Inserted</ins></p>
-      <p><s>Strikethrough</s></p>
-    </div>
-    <div class="grid">
-      <p><small>Small </small></p>
-      <p>Text <sub>Sub</sub></p>
-      <p>Text <sup>Sup</sup></p>
-    </div>
-    <div class="grid">
-      <p><abbr title="Abbreviation" data-tooltip="Abbreviation">Abbr.</abbr></p>
-      <p><kbd>Kbd</kbd></p>
-      <p><mark>Highlighted</mark></p>
-    </div>
-
-    <!-- Headings-->
-    <h3>Heading 3</h3>
-    <h4>Heading 4</h4>
-
-    <!-- Medias-->
-    <figure>
-      <img src="https://source.unsplash.com/a562ZEFKW8I/2000x1000" alt="Minimal landscape">
-      <figcaption>Image from <a href="https://unsplash.com">unsplash.com</a></figcaption>
-    </figure>
-  </section><!-- ./ Typography-->
-
-  <!-- Buttons-->
-  <section id="buttons">
-    <h2>Buttons</h2>
-    <div class="grid">
-      <button>Primary</button>
-      <button class="secondary">Secondary</button>
-      <button class="contrast">Contrast</button>
-    </div>
-    <div class="grid">
-      <button class="outline">Primary outline</button>
-      <button class="outline secondary">Secondary outline</button>
-      <button class="outline contrast">Contrast outline</button>
-    </div>
-  </section><!-- ./ Buttons -->
-
-  <!-- Form elements-->
-  <section id="form">
-    <form>
-      <h2>Form elements</h2>
-
-      <!-- Search -->
-      <label for="search">Search</label>
-      <input type="search" id="search" name="search" placeholder="Search">
-
-      <!-- Text -->
-      <label for="text">Text</label>
-      <input type="text" id="text" name="text" placeholder="Text">
-      <small>Curabitur consequat lacus at lacus porta finibus.</small>
-
-      <!-- Select -->
-      <label for="select">Select</label>
-      <select id="select" name="select" required="">
-        <option value="" selected="">Select…</option>
-        <option>…</option>
-      </select>
-
-      <!-- File browser -->
-      <label for="file">File browser
-        <input type="file" id="file" name="file">
-      </label>
-
-      <!-- Range slider control -->
-      <label for="range">Range slider
-        <input type="range" min="0" max="100" value="50" id="range" name="range">
-      </label>
-
-      <!-- States -->
-      <div class="grid">
-        <label for="valid">
-          Valid
-          <input type="text" id="valid" name="valid" placeholder="Valid" aria-invalid="false">
-        </label>
-        <label for="invalid">
-          Invalid
-          <input type="text" id="invalid" name="invalid" placeholder="Invalid" aria-invalid="true">
-        </label>
-        <label for="disabled">
-          Disabled
-          <input type="text" id="disabled" name="disabled" placeholder="Disabled" disabled="">
-        </label>
-      </div>
-
-      <div class="grid">
-
-        <!-- Date-->
-        <label for="date">Date
-          <input type="date" id="date" name="date">
-        </label>
-
-        <!-- Time-->
-        <label for="time">Time
-          <input type="time" id="time" name="time">
-        </label>
-
-        <!-- Color-->
-        <label for="color">Color
-          <input type="color" id="color" name="color" value="#0eaaaa">
-        </label>
-
-      </div>
-
-      <div class="grid">
-
-        <!-- Checkboxes -->
-        <fieldset>
-          <legend><strong>Checkboxes</strong></legend>
-          <label for="checkbox-1">
-            <input type="checkbox" id="checkbox-1" name="checkbox-1" checked="">
-            Checkbox
-          </label>
-          <label for="checkbox-2">
-            <input type="checkbox" id="checkbox-2" name="checkbox-2">
-            Checkbox
-          </label>
-        </fieldset>
-
-        <!-- Radio buttons -->
-        <fieldset>
-          <legend><strong>Radio buttons</strong></legend>
-          <label for="radio-1">
-            <input type="radio" id="radio-1" name="radio" value="radio-1" checked="">
-            Radio button
-          </label>
-          <label for="radio-2">
-            <input type="radio" id="radio-2" name="radio" value="radio-2">
-            Radio button
-          </label>
-        </fieldset>
-
-        <!-- Switch -->
-        <fieldset>
-          <legend><strong>Switches</strong></legend>
-          <label for="switch-1">
-            <input type="checkbox" id="switch-1" name="switch-1" role="switch" checked="">
-            Switch
-          </label>
-          <label for="switch-2">
-            <input type="checkbox" id="switch-2" name="switch-2" role="switch">
-            Switch
-          </label>
-        </fieldset>
-
-      </div>
-
-      <!-- Buttons -->
-      <input type="reset" value="Reset" onclick="event.preventDefault()">
-      <input type="submit" value="Submit" onclick="event.preventDefault()">
-
-    </form>
-  </section><!-- ./ Form elements-->
-
-
-  <!-- Accordions -->
-  <section id="accordions">
-    <h2>Accordions</h2>
-    <details>
-      <summary>Collapsible elements 1</summary>
-      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque urna diam, tincidunt nec porta sed, auctor id velit. Etiam venenatis nisl ut orci consequat, vitae tempus quam commodo. Nulla non mauris ipsum. Aliquam eu posuere orci. Nulla convallis lectus rutrum quam hendrerit, in facilisis elit sollicitudin. Mauris pulvinar pulvinar mi, dictum tristique elit auctor quis. Maecenas ac ipsum ultrices, porta turpis sit amet, congue turpis.</p>
-    </details>
-    <details open="">
-      <summary>Collapsible elements 2</summary>
-      <ul>
-        <li>Vestibulum id elit quis massa interdum sodales.</li>
-        <li>Nunc quis eros vel odio pretium tincidunt nec quis neque.</li>
-        <li>Quisque sed eros non eros ornare elementum.</li>
-        <li>Cras sed libero aliquet, porta dolor quis, dapibus ipsum.</li>
-      </ul>
-    </details>
-  </section><!-- ./ Accordions -->
-
-  <!-- Article-->
-  <article id="article">
-    <h2>Article</h2>
-    <p>Nullam dui arcu, malesuada et sodales eu, efficitur vitae dolor. Sed ultricies dolor non ante vulputate hendrerit. Vivamus sit amet suscipit sapien. Nulla iaculis eros a elit pharetra egestas. Nunc placerat facilisis cursus. Sed vestibulum metus eget dolor pharetra rutrum.</p>
-    <footer><small>Duis nec elit placerat, suscipit nibh quis, finibus neque.</small></footer>
-  </article><!-- ./ Article-->
-
-</main>
-
-  <footer class="container">
-    WebCore 2021
-  </footer>
-
-  <script src="js/main.js"></script>
-</body>
-
-</html>
diff --git a/log-debugger.html b/log-debugger.html
index aec75df..e829fca 100644
--- a/log-debugger.html
+++ b/log-debugger.html
@@ -56,7 +56,8 @@ <h2>Trick of the day:</h2>
 
         <code><u>setTimeout</u>(() => { <b>debugger</b>; }, <i>3000</i>);</code>
         in the browser's console
-        <p>Helps to debug <a id="modal-btn">auto closing modals</a></p>
+        <br><br>
+        <p>Helps to debug <a id="modal-btn">auto closing modals</a> or dropdowns</p>
 
       </article>
 
