Update demo styles around sample code

javierjulio · Dec 25, 2022 · 4a2349d · 4a2349d
1 parent 90c0087
commit 4a2349d
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 8 deletions.
diff --git a/demo/demo.css b/demo/demo.css
@@ -104,13 +104,11 @@ pre {
 
 .demo-options a {
   display: inline-block;
-  /* font-size: 14px; */
   margin: 0 8px;
 }
 
 .site-footer {
   font-size: 1.125rem;
-  margin-top: 60px;
 }
 
 textarea {

diff --git a/demo/index.html b/demo/index.html
@@ -27,7 +27,7 @@ <h1 class="logo">Textarea AutoSize</h1>
     <p>The sample code assumes a single line is the default.</p>
 
     <p>Sample HTML:</p>
-    <div class="highlight highlight-html"><pre>&lt;textarea class="js-auto-size" rows="1"&gt;&lt;/textarea&gt;
+    <div><pre>&lt;textarea class="js-auto-size" rows="1"&gt;&lt;/textarea&gt;
 &lt;script type="module"&gt;
   import { TextareaAutoSize } from './src/textarea-autosize.js'
   const wrapper = new TextareaAutoSize(
@@ -44,7 +44,7 @@ <h1 class="logo">Textarea AutoSize</h1>
 }
 </pre></div>
 
-    <p>The min and max height in the sample CSS is a pre-calculated value. If your font-size is 16px, line-height is 1.5 and top/bottom padding is 6px each, then the minimum height would be 36px since 16 * 1.5 + 12 = 36.</p>
+    <p class="margin-bottom-5x">The min and max height in the sample CSS is a pre-calculated value. If your font-size is 16px, line-height is 1.5 and top/bottom padding is 6px each, then the minimum height would be 36px since 16 * 1.5 + 12 = 36.</p>
 
     <footer class="site-footer text-center">
       <p>

diff --git a/index.html b/index.html
@@ -26,7 +26,7 @@ <h1 class="logo">Textarea AutoSize</h1>
     <p>The sample code assumes a single line is the default.</p>
 
     <p>Sample HTML:</p>
-    <div class="highlight highlight-html"><pre>&lt;textarea class="js-auto-size" rows="1"&gt;&lt;/textarea&gt;
+    <div><pre>&lt;textarea class="js-auto-size" rows="1"&gt;&lt;/textarea&gt;
 &lt;script type="module"&gt;
   import { TextareaAutoSize } from './src/textarea-autosize.js'
   const wrapper = new TextareaAutoSize(
@@ -43,7 +43,7 @@ <h1 class="logo">Textarea AutoSize</h1>
 }
 </pre></div>
 
-    <p>The min and max height in the sample CSS is a pre-calculated value. If your font-size is 16px, line-height is 1.5 and top/bottom padding is 6px each, then the minimum height would be 36px since 16 * 1.5 + 12 = 36.</p>
+    <p class="margin-bottom-5x">The min and max height in the sample CSS is a pre-calculated value. If your font-size is 16px, line-height is 1.5 and top/bottom padding is 6px each, then the minimum height would be 36px since 16 * 1.5 + 12 = 36.</p>
 
     <footer class="site-footer text-center">
       <p>

diff --git a/public/demo.css b/public/demo.css
@@ -104,13 +104,11 @@ pre {
 
 .demo-options a {
   display: inline-block;
-  /* font-size: 14px; */
   margin: 0 8px;
 }
 
 .site-footer {
   font-size: 1.125rem;
-  margin-top: 60px;
 }
 
 textarea {