Deploying to gh-pages from @ 2ac2a34 🚀

lookback · Jan 8, 2024 · c83a8c2 · c83a8c2
1 parent 3be318d
commit c83a8c2
Show file tree

Hide file tree

Showing 14 changed files with 231 additions and 453 deletions.
diff --git a/assets/site.css b/assets/site.css
diff --git a/components/buttons/index.html b/components/buttons/index.html
@@ -59,14 +59,14 @@
         </div>
         <div class="leading-none">
           <span class="block text-f5 text-blue-60">GitHub</span>
-          <small>5.6.2</small>
+          <small>6.0.1</small>
         </div>
       </a>
 
       <p class="mb-5 text-f6 text-muted">
         Site updated
-        <strong title="Wed Aug 30 2023 13:24:48 GMT+0000 (Coordinated Universal Time)"
-          >Aug 30, 2023</strong
+        <strong title="Mon Jan 08 2024 11:31:25 GMT+0000 (Coordinated Universal Time)"
+          >Jan 8, 2024</strong
         >
       </p>
 
@@ -305,6 +305,17 @@ <h2>Modifiers</h2>
 
   <pre class="language-html"><code class="language-html"><span class="highlight-line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>btn text-xs<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Tiny<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">></span></span></span><br><span class="highlight-line"></span><br><span class="highlight-line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>btn text-f6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Smaller<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">></span></span></span><br><span class="highlight-line"></span><br><span class="highlight-line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>btn rounded-full<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Rounded<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">></span></span></span><br><span class="highlight-line"></span><br><span class="highlight-line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>btn text-f5<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Larger<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">></span></span></span><br><span class="highlight-line"></span><br><span class="highlight-line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>btn text-f3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Huge<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">></span></span></span></code></pre>
 
+  <p>
+     <button class="btn" onclick="window.demoModal.showModal()">Show modal</button>
+  </p>
+
+  <dialog id="demoModal" class="p-3 rounded">
+    <h1>Hi there</h1>
+    <form method="dialog" class="text-center">
+        <button class="btn">Close</button>
+    </form>
+  </dialog>
+
   <aside class="callout">
     <h3 class="callout__title">Read more</h3>
     <ul>

diff --git a/components/loading/index.html b/components/loading/index.html
@@ -59,14 +59,14 @@
         </div>
         <div class="leading-none">
           <span class="block text-f5 text-blue-60">GitHub</span>
-          <small>5.6.2</small>
+          <small>6.0.1</small>
         </div>
       </a>
 
       <p class="mb-5 text-f6 text-muted">
         Site updated
-        <strong title="Wed Aug 30 2023 13:24:48 GMT+0000 (Coordinated Universal Time)"
-          >Aug 30, 2023</strong
+        <strong title="Mon Jan 08 2024 11:31:25 GMT+0000 (Coordinated Universal Time)"
+          >Jan 8, 2024</strong
         >
       </p>
 

diff --git a/index.html b/index.html
@@ -59,14 +59,14 @@
         </div>
         <div class="leading-none">
           <span class="block text-f5 text-blue-60">GitHub</span>
-          <small>5.6.2</small>
+          <small>6.0.1</small>
         </div>
       </a>
 
       <p class="mb-5 text-f6 text-muted">
         Site updated
-        <strong title="Wed Aug 30 2023 13:24:48 GMT+0000 (Coordinated Universal Time)"
-          >Aug 30, 2023</strong
+        <strong title="Mon Jan 08 2024 11:31:25 GMT+0000 (Coordinated Universal Time)"
+          >Jan 8, 2024</strong
         >
       </p>
 

diff --git a/styling/forms/index.html b/styling/forms/index.html
@@ -59,14 +59,14 @@
         </div>
         <div class="leading-none">
           <span class="block text-f5 text-blue-60">GitHub</span>
-          <small>5.6.2</small>
+          <small>6.0.1</small>
         </div>
       </a>
 
       <p class="mb-5 text-f6 text-muted">
         Site updated
-        <strong title="Wed Aug 30 2023 13:24:48 GMT+0000 (Coordinated Universal Time)"
-          >Aug 30, 2023</strong
+        <strong title="Mon Jan 08 2024 11:31:25 GMT+0000 (Coordinated Universal Time)"
+          >Jan 8, 2024</strong
         >
       </p>
 
@@ -134,7 +134,7 @@ <h1>Forms</h1>
   <form class="bg-white p-3 rounded-huge shadow-huge mb-4">
       <p>
         <label for="select" class="block">Product Delta team, January 2019</label>
-    
+
         <select id="select" class="w-8">
           <option>Martin</option>
           <option>Drew</option>
@@ -147,7 +147,17 @@ <h1>Forms</h1>
           <option>A really really really really really really really long text</option>
         </select>
       </p>
-
+
+      <p>
+        <label for="prog">Progress</label>
+        <progress id="prog" value="0.5">50%</progress>
+      </p>
+
+      <p>
+        <label for="prog-done">Progress done</label>
+        <progress id="prog-done" value="1">100%</progress>
+      </p>
+
       <p>
         <label class="block" for="name">Name</label>
         <input id="name" type="text" placeholder="Placeholder" />
@@ -162,7 +172,7 @@ <h1>Forms</h1>
         <label class="block" for="email">Email</label>
         <input id="email" type="email" placeholder="Email" required />
       </p>
-    
+
       <p>
         <label class="block" for="text">Text</label>
         <textarea id="text" placeholder="Placeholder">Some text</textarea>

diff --git a/styling/radii/index.html b/styling/radii/index.html
@@ -59,14 +59,14 @@
         </div>
         <div class="leading-none">
           <span class="block text-f5 text-blue-60">GitHub</span>
-          <small>5.6.2</small>
+          <small>6.0.1</small>
         </div>
       </a>
 
       <p class="mb-5 text-f6 text-muted">
         Site updated
-        <strong title="Wed Aug 30 2023 13:24:48 GMT+0000 (Coordinated Universal Time)"
-          >Aug 30, 2023</strong
+        <strong title="Mon Jan 08 2024 11:31:25 GMT+0000 (Coordinated Universal Time)"
+          >Jan 8, 2024</strong
         >
       </p>
 

diff --git a/styling/shadows/index.html b/styling/shadows/index.html
@@ -59,14 +59,14 @@
         </div>
         <div class="leading-none">
           <span class="block text-f5 text-blue-60">GitHub</span>
-          <small>5.6.2</small>
+          <small>6.0.1</small>
         </div>
       </a>
 
       <p class="mb-5 text-f6 text-muted">
         Site updated
-        <strong title="Wed Aug 30 2023 13:24:48 GMT+0000 (Coordinated Universal Time)"
-          >Aug 30, 2023</strong
+        <strong title="Mon Jan 08 2024 11:31:25 GMT+0000 (Coordinated Universal Time)"
+          >Jan 8, 2024</strong
         >
       </p>
 

diff --git a/styling/typography/index.html b/styling/typography/index.html
@@ -59,14 +59,14 @@
         </div>
         <div class="leading-none">
           <span class="block text-f5 text-blue-60">GitHub</span>
-          <small>5.6.2</small>
+          <small>6.0.1</small>
         </div>
       </a>
 
       <p class="mb-5 text-f6 text-muted">
         Site updated
-        <strong title="Wed Aug 30 2023 13:24:48 GMT+0000 (Coordinated Universal Time)"
-          >Aug 30, 2023</strong
+        <strong title="Mon Jan 08 2024 11:31:25 GMT+0000 (Coordinated Universal Time)"
+          >Jan 8, 2024</strong
         >
       </p>
 
@@ -175,6 +175,26 @@ <h4 class="tracking-huge">Heading with <code>tracking-huge</code></h4>
   Customer’s application(s) using the Services (“Testers” or “Participants”).
 </p>
 
+<figure>
+    <img src="https://upload.wikimedia.org/wikipedia/commons/0/0d/David_Bowie_and_Cher_1975.JPG" height="639" height="840" alt="David Bowie and Cher" />
+    <figcaption>
+        From <a href="https://en.wikipedia.org/wiki/David_Bowie">Wikipedia</a>. License: Public domain
+    </figcaption>
+</figure>
+
+<table>
+    <tr>
+        <th>Heading 1</th>
+        <th>Heading 2</th>
+        <th>Heading 3</th>
+    </tr>
+    <tr>
+        <td>Cell 1</td>
+        <td>Cell 2</td>
+        <td>Cell 3</td>
+    </tr>
+</table>
+
 <p>This is a <code>piece of code</code> in a paragraph.</p>
 
 <p>To continue, press <kbd>enter</kbd>.</p>

diff --git a/styling/utilities/index.html b/styling/utilities/index.html
@@ -59,14 +59,14 @@
         </div>
         <div class="leading-none">
           <span class="block text-f5 text-blue-60">GitHub</span>
-          <small>5.6.2</small>
+          <small>6.0.1</small>
         </div>
       </a>
 
       <p class="mb-5 text-f6 text-muted">
         Site updated
-        <strong title="Wed Aug 30 2023 13:24:48 GMT+0000 (Coordinated Universal Time)"
-          >Aug 30, 2023</strong
+        <strong title="Mon Jan 08 2024 11:31:25 GMT+0000 (Coordinated Universal Time)"
+          >Jan 8, 2024</strong
         >
       </p>
 

diff --git a/styling/widths/index.html b/styling/widths/index.html
@@ -59,14 +59,14 @@
         </div>
         <div class="leading-none">
           <span class="block text-f5 text-blue-60">GitHub</span>
-          <small>5.6.2</small>
+          <small>6.0.1</small>
         </div>
       </a>
 
       <p class="mb-5 text-f6 text-muted">
         Site updated
-        <strong title="Wed Aug 30 2023 13:24:48 GMT+0000 (Coordinated Universal Time)"
-          >Aug 30, 2023</strong
+        <strong title="Mon Jan 08 2024 11:31:25 GMT+0000 (Coordinated Universal Time)"
+          >Jan 8, 2024</strong
         >
       </p>
 

diff --git a/tech/classes/index.html b/tech/classes/index.html
@@ -59,14 +59,14 @@
         </div>
         <div class="leading-none">
           <span class="block text-f5 text-blue-60">GitHub</span>
-          <small>5.6.2</small>
+          <small>6.0.1</small>
         </div>
       </a>
 
       <p class="mb-5 text-f6 text-muted">
         Site updated
-        <strong title="Wed Aug 30 2023 13:24:48 GMT+0000 (Coordinated Universal Time)"
-          >Aug 30, 2023</strong
+        <strong title="Mon Jan 08 2024 11:31:25 GMT+0000 (Coordinated Universal Time)"
+          >Jan 8, 2024</strong
         >
       </p>
 

diff --git a/tech/colors/index.html b/tech/colors/index.html
@@ -59,14 +59,14 @@
         </div>
         <div class="leading-none">
           <span class="block text-f5 text-blue-60">GitHub</span>
-          <small>5.6.2</small>
+          <small>6.0.1</small>
         </div>
       </a>
 
       <p class="mb-5 text-f6 text-muted">
         Site updated
-        <strong title="Wed Aug 30 2023 13:24:48 GMT+0000 (Coordinated Universal Time)"
-          >Aug 30, 2023</strong
+        <strong title="Mon Jan 08 2024 11:31:25 GMT+0000 (Coordinated Universal Time)"
+          >Jan 8, 2024</strong
         >
       </p>
 

diff --git a/tech/intro/index.html b/tech/intro/index.html
@@ -59,14 +59,14 @@
         </div>
         <div class="leading-none">
           <span class="block text-f5 text-blue-60">GitHub</span>
-          <small>5.6.2</small>
+          <small>6.0.1</small>
         </div>
       </a>
 
       <p class="mb-5 text-f6 text-muted">
         Site updated
-        <strong title="Wed Aug 30 2023 13:24:48 GMT+0000 (Coordinated Universal Time)"
-          >Aug 30, 2023</strong
+        <strong title="Mon Jan 08 2024 11:31:25 GMT+0000 (Coordinated Universal Time)"
+          >Jan 8, 2024</strong
         >
       </p>
 

diff --git a/tech/variables/index.html b/tech/variables/index.html
@@ -59,14 +59,14 @@
         </div>
         <div class="leading-none">
           <span class="block text-f5 text-blue-60">GitHub</span>
-          <small>5.6.2</small>
+          <small>6.0.1</small>
         </div>
       </a>
 
       <p class="mb-5 text-f6 text-muted">
         Site updated
-        <strong title="Wed Aug 30 2023 13:24:48 GMT+0000 (Coordinated Universal Time)"
-          >Aug 30, 2023</strong
+        <strong title="Mon Jan 08 2024 11:31:25 GMT+0000 (Coordinated Universal Time)"
+          >Jan 8, 2024</strong
         >
       </p>