From 4bf84fda1b984ad40faa7673e79913d90c02a0f6 Mon Sep 17 00:00:00 2001
From: "Zed A. Shaw" <zed.shaw@gmail.com>
Date: Thu, 30 Jun 2022 14:36:45 -0400
Subject: [PATCH] Slack demo needed a few changes.  Turns out, if you say
 something is X wide, browsers think you mean X+padding wide not X wide. Go
 figure.

---
 public/blockstart/demos/slack.html | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/public/blockstart/demos/slack.html b/public/blockstart/demos/slack.html
index ef858f9..87b03a6 100644
--- a/public/blockstart/demos/slack.html
+++ b/public/blockstart/demos/slack.html
@@ -4,7 +4,7 @@
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
-  <title>Blockstart Template</title>
+  <title>Blockstart Slack Demo</title>
 
   <link rel="stylesheet" href="/blockstart/blockstart.css">
 
@@ -83,16 +83,16 @@
 
 
   <hr>
-  <block class="center sized solid pad" style="--value: 9;">
+  <block class="center solid sized" style="--value: 9; --w: 100%;">
 
-    <block class="center-self center-text pad sized" style="--w: 80vw;">
+    <block class="center-self sized center-text pad" style="--w: 80%;">
       <h1>Thundercats Tonx Pok Pok Pork</h1>
       <p>Cardigan raclette tbh, kitsch lomo fanny pack vegan.</p>
       <button class="pad">MEET SLACK FOR ENTERPRISE</button>
       <button class="pad">TALK TO SALES</button>
     </block>
 
-    <grid class="sized center-self" style="--cols: 1fr 1fr 1fr; --w: 80vw;">
+    <grid class="center-self sized" style="--cols: 1fr 1fr 1fr; --w: 80%;">
       <block>
         <h1>75%</h1>
         <span>Cardigan raclette tbh, kitsch lomo fanny pack vegan.</span>
@@ -105,7 +105,6 @@
         <h1>91%</h1>
         <span>Cardigan raclette tbh, kitsch lomo fanny pack vegan.</span>
       </block>
-
     </grid>
   </block>
 
@@ -136,8 +135,8 @@
   </grid>
 
   <hr>
-  <block class="solid center sized pad" style="--value: 2; --text: 9">
-    <block class="sized center-self center-text" style="--w: 80vw">
+  <block class="solid center sized" style="--value: 2; --text: 9; --w: 100%">
+    <block class="sized center-self center-text" style="--w: 80%">
     <h1>Welcome to your new digital HQ</h1>
 
       <button class="pad" style="--text: 0;">TRY FOR FREE</button>