<!doctype html>
< html lang = "en" >
< head >
< meta charset = "utf-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
< title > Blockstart Slack Demo< / title >
< link rel = "stylesheet" href = "/blockstart/blockstart.css" >
< style >
< / style >
< / head >
< body class = "solid" style = "--value: 8" >
< block class = "horizontal pad solid" style = "--value: 2; --spacing: space-around; width: unset; --text: 9" >
< a href = "/blockstart/demos/" > SLACK< / a >
< div class = "horizontal" style = "--spacing: end;" >
< a href = "#" > Q< / a >
< a href = "#" > =< / a >
< / div >
< / block >
< block class = "solid pad" style = "--value: 2; --text: 9; --pad: 3rem;" >
< h1 > Flexitarian Vice Poutine Synth< / h1 >
< p > Tofu single-origin coffee cray offal gastropub hoodie edison bulb fam flannel pug tumblr celiac..< / p >
< button style = "--text: 0" > Sign up with email< / button >
< button style = "--text: 0" > Sign up with google< / button >
< p > Cardigan raclette tbh, kitsch lomo fanny pack vegan.< / p >
< hr >
< shape style = "--w: 700px; --h: 400px;" >
< h1 > Phone Demo< / h1 >
< / shape >
< / block >
< block class = "pad center center-text" style = "--pad: 2rem;" >
< h4 > TRUSTED BY COMPANIES ALL OVER THE WORLD< / h4 >
< hr >
< div style = "font-size: 1.5em;" > Flexitarian Vice Poutine Synth Flexitarian Vice Poutine Synth< / div >
< / block >
< block class = "horizontal" style = "--spacing: start" >
< shape style = "--h: 800px; --w: 400px;" >
< h1 > People Dancing For Work< / h1 >
< / shape >
< / block >
< block >
< h2 > Thundercats Tonx Pok Pok Pork< / h2 >
< p > I'm baby kogi heirloom truffaut succulents plaid normcore microdosing craft beer gochujang humblebrag bitters bicycle rights gastropub keytar. Flexitarian vice poutine synth affogato small batch XOXO ramps jianbing quinoa.< / p >
< a href = "#" > Link to stuff.< / a >
< / block >
< hr >
< block class = "horizontal" style = "--spacing: end" >
< shape style = "--h: 800px; --w: 400px;" >
< h1 > People Dancing For Work< / h1 >
< / shape >
< / block >
< block >
< h2 > Thundercats Tonx Pok Pok Pork< / h2 >
< p > I'm baby kogi heirloom truffaut succulents plaid normcore microdosing craft beer gochujang humblebrag bitters bicycle rights gastropub keytar. Flexitarian vice poutine synth affogato small batch XOXO ramps jianbing quinoa.< / p >
< a href = "#" > Link to stuff.< / a >
< / block >
< hr >
< block class = "horizontal" style = "--spacing: start" >
< shape style = "--h: 800px; --w: 400px;" >
< h1 > People Dancing For Work< / h1 >
< / shape >
< / block >
< block >
< h2 > Thundercats Tonx Pok Pok Pork< / h2 >
< p > I'm baby kogi heirloom truffaut succulents plaid normcore microdosing craft beer gochujang humblebrag bitters bicycle rights gastropub keytar. Flexitarian vice poutine synth affogato small batch XOXO ramps jianbing quinoa.< / p >
< a href = "#" > Link to stuff.< / a >
< / block >
< hr >
< block class = "center solid sized" style = "--value: 9; --w: 100%;" >
< 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 = "center-self sized" style = "--cols: 1fr 1fr 1fr; --w: 80%;" >
< block >
< h1 > 75%< / h1 >
< span > Cardigan raclette tbh, kitsch lomo fanny pack vegan.< / span >
< / block >
< block >
< h1 > 84%< / h1 >
< span > Cardigan raclette tbh, kitsch lomo fanny pack vegan.< / span >
< / block >
< block >
< h1 > 91%< / h1 >
< span > Cardigan raclette tbh, kitsch lomo fanny pack vegan.< / span >
< / block >
< / grid >
< / block >
< shape style = "--h: 400px" >
< h1 > Video< / h1 >
< / shape >
< block class = "solid pad" style = "--value: 9" >
< blockquote >
"I'm baby kogi heirloom truffaut succulents plaid normcore microdosing craft beer gochujang humblebrag bitters bicycle rights gastropub keytar. Flexitarian vice poutine synth affogato small batch XOXO ramps jianbing quinoa." -- < b > Quote Person< / b >
< / blockquote >
< / block >
< hr >
< grid style = "--cols: 1fr 1fr 1fr 1fr; --gap: 1rem;" >
< shape style = "--w: 200px; --h: 400px;" >
< h1 > Card< / h1 >
< / shape >
< shape style = "--w: 200px; --h: 400px;" >
< h1 > Card< / h1 >
< / shape >
< shape style = "--w: 200px; --h: 400px;" >
< h1 > Card< / h1 >
< / shape >
< shape style = "--w: 200px; --h: 400px;" >
< h1 > Card< / h1 >
< / shape >
< / grid >
< hr >
< 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 >
< button class = "pad" style = "--text: 0;" > TALK TO SALES< / button >
< / block >
< / block >
< hr >
< block class = "sized solid" style = "--value: 9; --h: 700px;" >
< h1 > Footer< / h1 >
< / block >
< / body >
< / html >