learn-javascript-the-hard-way
/
blockstart
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add placeholders for all demos.

Browse Source
master
Zed A. Shaw 2 years ago
parent a54dfcda72
commit 216fd15479
14 changed files with 368 additions and 4 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 29
      public/blockstart/demos/breadcrumbs.html
  2. 29
      public/blockstart/demos/earlybird.html
  3. 22
      public/blockstart/demos/index.html
  4. 29
      public/blockstart/demos/pandadoc.html
  5. 29
      public/blockstart/demos/patreon.html
  6. 29
      public/blockstart/demos/shopify.html
  7. 29
      public/blockstart/demos/slack.html
  8. 29
      public/blockstart/demos/snapchat.html
  9. 29
      public/blockstart/demos/square.html
  10. 29
      public/blockstart/demos/vidyard.html
  11. 29
      public/blockstart/demos/vimeo.html
  12. 29
      public/blockstart/demos/wordstream.html
  13. 29
      public/blockstart/demos/zoom.html
  14. 2
      public/blockstart/index.html

29
public/blockstart/demos/breadcrumbs.html
Unescape View File

@ -0,0 +1,29 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Blockstart Template</title>
<link rel="stylesheet" href="/blockstart/blockstart.css">
<style>
</style>
</head>
<body>
<block class="horizontal pad" style="border-bottom: 1px solid var(--value6); --spacing: space-around; width: unset;">
<a href="/blockstart/">blockstart.css</a>
<div class="horizontal" style="--spacing: end;">
<a href="/blockstart/#about">About</a> &nbsp;|&nbsp;
<a href="/blockstart/#docs">Docs</a> &nbsp;|&nbsp;
<a href="/blockstart/demos/">Demos</a> &nbsp;|&nbsp;
<a href="/blockstart/blockstart.css">Download</a>
</div>
</block>
<h1>Coming soon...</h1>
</body>
</html>

29
public/blockstart/demos/earlybird.html
Unescape View File

@ -0,0 +1,29 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Blockstart Template</title>
<link rel="stylesheet" href="/blockstart/blockstart.css">
<style>
</style>
</head>
<body>
<block class="horizontal pad" style="border-bottom: 1px solid var(--value6); --spacing: space-around; width: unset;">
<a href="/blockstart/">blockstart.css</a>
<div class="horizontal" style="--spacing: end;">
<a href="/blockstart/#about">About</a> &nbsp;|&nbsp;
<a href="/blockstart/#docs">Docs</a> &nbsp;|&nbsp;
<a href="/blockstart/demos/">Demos</a> &nbsp;|&nbsp;
<a href="/blockstart/blockstart.css">Download</a>
</div>
</block>
<h1>Coming soon...</h1>
</body>
</html>

22
public/blockstart/demos/index.html
Unescape View File

@ -6,6 +6,10 @@
<title>blockstart.css Demos</title>
<link rel="stylesheet" href="/blockstart/blockstart.css">
<style>
grid > shape {
--w: 150px;
--h: 150px;
}
</style>
</head>
@ -26,9 +30,21 @@
<p>Here are a few simple demos of using <a href="/blockstart/blockstart.css">blockstart.css</a> to create copies of landing pages. Copying other websites is a great way to learn web development. The text in the demos is either taken from the "inspiration" site, or is from <a href="https://hipsum.co/">hipster ipsum</a>.</p>
<grid class="center" style="--gap: 1rem; --cols: 1fr 1fr 1fr; --text: 9">
<shape style="--w: 150px; --h: 150px;"><a href="asana.html">Asana</a></shape>
<shape style="--w: 150px; --h: 150px;"><a href="canva.html">Canva</a></shape>
<shape style="--w: 150px; --h: 150px;"><a href="todoist.html">Todoist</a></shape>
<shape><a href="asana.html">Asana</a></shape>
<shape><a href="canva.html">Canva</a></shape>
<shape><a href="todoist.html">Todoist</a></shape>
<shape><a href="square.html">Square</a></shape>
<shape><a href="earlybird.html">Earlybird</a></shape>
<shape><a href="pandadoc.html">Pandadoc</a></shape>
<shape><a href="vimeo.html">Vimeo</a></shape>
<shape><a href="wordstream.html">Wordstream</a></shape>
<shape><a href="breadcrumbs.html">Breadcrumbs</a></shape>
<shape><a href="vidyard.html">Vidyard</a></shape>
<shape><a href="snapchat.html">Snapchat</a></shape>
<shape><a href="patreon.html">Patreon</a></shape>
<shape><a href="shopify.html">Shopify</a></shape>
<shape><a href="slack.html">Slack</a></shape>
<shape><a href="zoom.html">Zoom</a></shape>
</grid>
</content>
</body>

29
public/blockstart/demos/pandadoc.html
Unescape View File

@ -0,0 +1,29 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Blockstart Template</title>
<link rel="stylesheet" href="/blockstart/blockstart.css">
<style>
</style>
</head>
<body>
<block class="horizontal pad" style="border-bottom: 1px solid var(--value6); --spacing: space-around; width: unset;">
<a href="/blockstart/">blockstart.css</a>
<div class="horizontal" style="--spacing: end;">
<a href="/blockstart/#about">About</a> &nbsp;|&nbsp;
<a href="/blockstart/#docs">Docs</a> &nbsp;|&nbsp;
<a href="/blockstart/demos/">Demos</a> &nbsp;|&nbsp;
<a href="/blockstart/blockstart.css">Download</a>
</div>
</block>
<h1>Coming soon...</h1>
</body>
</html>

29
public/blockstart/demos/patreon.html
Unescape View File

@ -0,0 +1,29 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Blockstart Template</title>
<link rel="stylesheet" href="/blockstart/blockstart.css">
<style>
</style>
</head>
<body>
<block class="horizontal pad" style="border-bottom: 1px solid var(--value6); --spacing: space-around; width: unset;">
<a href="/blockstart/">blockstart.css</a>
<div class="horizontal" style="--spacing: end;">
<a href="/blockstart/#about">About</a> &nbsp;|&nbsp;
<a href="/blockstart/#docs">Docs</a> &nbsp;|&nbsp;
<a href="/blockstart/demos/">Demos</a> &nbsp;|&nbsp;
<a href="/blockstart/blockstart.css">Download</a>
</div>
</block>
<h1>Coming soon...</h1>
</body>
</html>

29
public/blockstart/demos/shopify.html
Unescape View File

@ -0,0 +1,29 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Blockstart Template</title>
<link rel="stylesheet" href="/blockstart/blockstart.css">
<style>
</style>
</head>
<body>
<block class="horizontal pad" style="border-bottom: 1px solid var(--value6); --spacing: space-around; width: unset;">
<a href="/blockstart/">blockstart.css</a>
<div class="horizontal" style="--spacing: end;">
<a href="/blockstart/#about">About</a> &nbsp;|&nbsp;
<a href="/blockstart/#docs">Docs</a> &nbsp;|&nbsp;
<a href="/blockstart/demos/">Demos</a> &nbsp;|&nbsp;
<a href="/blockstart/blockstart.css">Download</a>
</div>
</block>
<h1>Coming soon...</h1>
</body>
</html>

29
public/blockstart/demos/slack.html
Unescape View File

@ -0,0 +1,29 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Blockstart Template</title>
<link rel="stylesheet" href="/blockstart/blockstart.css">
<style>
</style>
</head>
<body>
<block class="horizontal pad" style="border-bottom: 1px solid var(--value6); --spacing: space-around; width: unset;">
<a href="/blockstart/">blockstart.css</a>
<div class="horizontal" style="--spacing: end;">
<a href="/blockstart/#about">About</a> &nbsp;|&nbsp;
<a href="/blockstart/#docs">Docs</a> &nbsp;|&nbsp;
<a href="/blockstart/demos/">Demos</a> &nbsp;|&nbsp;
<a href="/blockstart/blockstart.css">Download</a>
</div>
</block>
<h1>Coming soon...</h1>
</body>
</html>

29
public/blockstart/demos/snapchat.html
Unescape View File

@ -0,0 +1,29 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Blockstart Template</title>
<link rel="stylesheet" href="/blockstart/blockstart.css">
<style>
</style>
</head>
<body>
<block class="horizontal pad" style="border-bottom: 1px solid var(--value6); --spacing: space-around; width: unset;">
<a href="/blockstart/">blockstart.css</a>
<div class="horizontal" style="--spacing: end;">
<a href="/blockstart/#about">About</a> &nbsp;|&nbsp;
<a href="/blockstart/#docs">Docs</a> &nbsp;|&nbsp;
<a href="/blockstart/demos/">Demos</a> &nbsp;|&nbsp;
<a href="/blockstart/blockstart.css">Download</a>
</div>
</block>
<h1>Coming soon...</h1>
</body>
</html>

29
public/blockstart/demos/square.html
Unescape View File

@ -0,0 +1,29 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Blockstart Template</title>
<link rel="stylesheet" href="/blockstart/blockstart.css">
<style>
</style>
</head>
<body>
<block class="horizontal pad" style="border-bottom: 1px solid var(--value6); --spacing: space-around; width: unset;">
<a href="/blockstart/">blockstart.css</a>
<div class="horizontal" style="--spacing: end;">
<a href="/blockstart/#about">About</a> &nbsp;|&nbsp;
<a href="/blockstart/#docs">Docs</a> &nbsp;|&nbsp;
<a href="/blockstart/demos/">Demos</a> &nbsp;|&nbsp;
<a href="/blockstart/blockstart.css">Download</a>
</div>
</block>
<h1>Coming soon...</h1>
</body>
</html>

29
public/blockstart/demos/vidyard.html
Unescape View File

@ -0,0 +1,29 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Blockstart Template</title>
<link rel="stylesheet" href="/blockstart/blockstart.css">
<style>
</style>
</head>
<body>
<block class="horizontal pad" style="border-bottom: 1px solid var(--value6); --spacing: space-around; width: unset;">
<a href="/blockstart/">blockstart.css</a>
<div class="horizontal" style="--spacing: end;">
<a href="/blockstart/#about">About</a> &nbsp;|&nbsp;
<a href="/blockstart/#docs">Docs</a> &nbsp;|&nbsp;
<a href="/blockstart/demos/">Demos</a> &nbsp;|&nbsp;
<a href="/blockstart/blockstart.css">Download</a>
</div>
</block>
<h1>Coming soon...</h1>
</body>
</html>

29
public/blockstart/demos/vimeo.html
Unescape View File

@ -0,0 +1,29 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Blockstart Template</title>
<link rel="stylesheet" href="/blockstart/blockstart.css">
<style>
</style>
</head>
<body>
<block class="horizontal pad" style="border-bottom: 1px solid var(--value6); --spacing: space-around; width: unset;">
<a href="/blockstart/">blockstart.css</a>
<div class="horizontal" style="--spacing: end;">
<a href="/blockstart/#about">About</a> &nbsp;|&nbsp;
<a href="/blockstart/#docs">Docs</a> &nbsp;|&nbsp;
<a href="/blockstart/demos/">Demos</a> &nbsp;|&nbsp;
<a href="/blockstart/blockstart.css">Download</a>
</div>
</block>
<h1>Coming soon...</h1>
</body>
</html>

29
public/blockstart/demos/wordstream.html
Unescape View File

@ -0,0 +1,29 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Blockstart Template</title>
<link rel="stylesheet" href="/blockstart/blockstart.css">
<style>
</style>
</head>
<body>
<block class="horizontal pad" style="border-bottom: 1px solid var(--value6); --spacing: space-around; width: unset;">
<a href="/blockstart/">blockstart.css</a>
<div class="horizontal" style="--spacing: end;">
<a href="/blockstart/#about">About</a> &nbsp;|&nbsp;
<a href="/blockstart/#docs">Docs</a> &nbsp;|&nbsp;
<a href="/blockstart/demos/">Demos</a> &nbsp;|&nbsp;
<a href="/blockstart/blockstart.css">Download</a>
</div>
</block>
<h1>Coming soon...</h1>
</body>
</html>

29
public/blockstart/demos/zoom.html
Unescape View File

@ -0,0 +1,29 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Blockstart Template</title>
<link rel="stylesheet" href="/blockstart/blockstart.css">
<style>
</style>
</head>
<body>
<block class="horizontal pad" style="border-bottom: 1px solid var(--value6); --spacing: space-around; width: unset;">
<a href="/blockstart/">blockstart.css</a>
<div class="horizontal" style="--spacing: end;">
<a href="/blockstart/#about">About</a> &nbsp;|&nbsp;
<a href="/blockstart/#docs">Docs</a> &nbsp;|&nbsp;
<a href="/blockstart/demos/">Demos</a> &nbsp;|&nbsp;
<a href="/blockstart/blockstart.css">Download</a>
</div>
</block>
<h1>Coming soon...</h1>
</body>
</html>

2
public/blockstart/index.html
Unescape View File

@ -341,7 +341,7 @@ npx http-server -d -c-1 public
</code>
</pre>
<p>Once you do that you can place the <a href="/blockstart/blockstart.css">blockstart.css</a> in the <code>public/</code> directory and start putting your <code>.html</code> files in the same place. Here's a decen starter template:</p>
<p>Once you do that you can place the <a href="/blockstart/blockstart.css">blockstart.css</a> in the <code>public/</code> directory and start putting your <code>.html</code> files in the same place. Here's a reasonable starter template:</p>
<pre>
<code>

Write Preview
Loading…
Cancel
Save