Merge pull request #38 from lbryio/remove-bootstrap

Remove bootstrap
This commit is contained in:
Bill Bittner 2017-06-22 21:51:25 -07:00 committed by GitHub
commit 198ecfaa7c
20 changed files with 380 additions and 313 deletions

View file

@ -0,0 +1,81 @@
/* Containters */
.wrapper {
margin-left: 20%;
width:60%;
}
.top-bar {
width: 100%;
margin-bottom: 2px;
padding-bottom: 2px;
border-bottom: 1px lightgrey solid;
}
.main {
float: left;
width: 75%;
margin-right: 1%;
padding-right: 1%;
border-right: 1px lightgrey solid;
margin-bottom: 5px;
}
.sidebar {
float: left;
width: 22%;
}
/* panels */
.panel {
overflow: auto;
word-wrap: break-word;
}
.col-left, .col-right {
overflow: auto;
margin: 0px;
width: 48%;
}
.col-left {
padding: 5px 10px 5px 0px;
float: left;
}
.col-right {
padding: 5px 0px 5px 10px;
float: right;
}
/* text */
a {
text-decoration: none;
}
h1 {
font-size: x-large;
}
h2 {
font-size: medium;
border-top: 1px #999 solid;
background-color: lightgray;
padding: 6px;
}
h4 {
padding: 3px;
}
.code {
font-family: monospace;
color: darkgrey;
word-wrap: break-word;
}
/* other */
.stop-float {
clear: both;
}

View file

@ -0,0 +1,74 @@
/* top bar */
#logo, #title {
display: inline-block;
}
#logo {
height: 1.5em;
}
#title {
margin: 2px 5px 2px 5px;
}
/* examples */
.example {
display: inline-block;
width: 100%;
margin-bottom: 15px;
}
.example-image {
float: left;
width: 20%;
margin: 5px 15px 5px 0px;
}
/* meme */
canvas {
background-color: white;
width: 100%;
height: auto;
}
/* publish */
#drop-zone {
border: 1px dashed lightgrey;
padding: 1em;
height: 6em;
}
#image-preview {
display: none;
}
/* all claims */
.all-claims-img {
height: 200px;
}
/* footer */
footer {
width: 100%;
margin-bottom: 2px;
padding-bottom: 2px;
border-bottom: 1px lightgrey solid;
margin-top: 2px;
padding-top: 2px;
border-top: 1px lightgrey solid;
text-align: center;
color: grey;
}
/* meme fodder */
.meme-fodder-img {
width: 21%;
padding: 0px;
margin: 2% 4% 2% 0px;
float: left;
}

View file

@ -1,32 +0,0 @@
canvas {
background-color: white;
width: 100%;
height: auto;
}
#drop-zone {
border: 1px dashed lightgrey;
padding: 1em;
height: 200px;
width: 100%;
}
#image-preview {
display: none;
}
#tweet-meme-button {
float: left;
margin-right: 5px;
}
.row {
margin: 10px 0px 10px 0px;
}
.all-claims-img {
height: 200px;
}

View file

@ -137,22 +137,27 @@ socket.on('publish-complete', function(msg){
var publishResults;
var directUrl = '/' + msg.name + '/' + msg.result.claim_id;
// build new publish area
publishResults = '<p><span id="tweet-meme-button"></span>Your publish is complete! <a target="_blank" href="' + directUrl + '">View it here!</a></p>';
publishResults = '<p>Your publish is complete! View it here:</p>';
publishResults += `<p><a id="text-to-copy" target="_blank" href="${directUrl}">spee.ch' + directUrl + '</a></p>`;
publishResults += '<p><button class="copy-button">Copy to clipboard</button></p>';
publishResults += '<p><a target="_blank" href="https://explorer.lbry.io/#!/transaction/' + msg.result.txid + '">View the transaction details</a></p>';
publishResults += '<a href="/"><button>Reload</button></a></p>';
// update publish area
document.getElementById('publish-active-area').innerHTML = publishResults;
// add a tweet button
twttr.widgets
.createShareButton(
document.getElementById('tweet-meme-button'),
{
text: 'Check out my image, hosted for free on the distributed awesomeness that is the LBRY blockchain!',
url: 'https://spee.ch/' + directUrl,
hashtags: 'LBRY',
via: 'lbryio'
})
.then( function( el ) {
console.log('Tweet button added.');
});
// update the link holder
document.getElementById('direct-link-holder').innerHTML = 'https://spee.ch' + directUrl;
// enable copy-to-clipboard
var copyBtn = document.querySelector('.copy-button');
copyBtn.addEventListener('click', function(event) {
// select the text
var text = document.getElementById('direct-link-holder');
text.select();
try {
var successful = document.execCommand('copy');
var msg = successful ? 'successful' : 'unsuccessful';
console.log('Copying text command was ' + msg);
} catch (err) {
alert('Oops, unable to copy');
}
});
});

View file

@ -116,22 +116,27 @@ socket.on('publish-complete', function(msg){
var publishResults;
var directUrl = '/' + msg.name + '/' + msg.result.claim_id;
// build new publish area
publishResults = '<p><span id="tweet-meme-button"></span>Your publish is complete! <a target="_blank" href="' + directUrl + '">View it here!</a></p>';
publishResults = '<p>Your publish is complete! View it here:</p>';
publishResults += '<p><a target="_blank" href="' + directUrl + '">spee.ch' + directUrl + '</a></p>';
publishResults += '<p><button class="copy-button">Copy to clipboard</button></p>';
publishResults += '<p><a target="_blank" href="https://explorer.lbry.io/#!/transaction/' + msg.result.txid + '">View the transaction details</a></p>';
publishResults += '<a href="/"><button>Reload</button></a></p>';
publishResults += '<a href="/meme-fodder/play"><button>Reload</button></a></p>';
// update publish area
document.getElementById('publish-active-area').innerHTML = publishResults;
// add a tweet button
twttr.widgets
.createShareButton(
document.getElementById('tweet-meme-button'),
{
text: 'Check out my meme creation on the LBRY blockchain!',
url: 'https://spee.ch/' + directUrl,
hashtags: 'LBRYMemeFodder',
via: 'lbryio'
})
.then( function( el ) {
console.log('Tweet button added.');
});
// update the link holder
document.getElementById('direct-link-holder').innerHTML = 'https://spee.ch' + directUrl;
// enable copy-to-clipboard
var copyBtn = document.querySelector('.copy-button');
copyBtn.addEventListener('click', function(event) {
// select the text
var text = document.getElementById('direct-link-holder');
text.select();
try {
var successful = document.execCommand('copy');
var msg = successful ? 'successful' : 'unsuccessful';
console.log('Copying text command was ' + msg);
} catch (err) {
alert('Oops, unable to copy');
}
});
});

View file

@ -1,20 +1,20 @@
<div class="container">
{{> topBar}}
<div class="row">
<div class="col-md-12">
<h3>All Claims</h3>
<p>These are all the free, public assets at that claim. You can publish more at <a href="/">spee.ch</a>.</p>
{{#each claims}}
<img class="all-claims-img" src="/{{this.name}}/{{this.claim_id}}" />
<div class="card card-block">
<p>claim_id: {{this.claim_id}}</p>
<p>direct link <a href="/{{this.name}}/{{this.claim_id}}">here</a></p>
<p>author: {{this.value.stream.metadata.author}}</p>
<p>description: {{this.value.stream.metadata.description}}</p>
<p>license: {{this.value.stream.metadata.license}}</p>
</div>
<hr>
{{/each}}
</div>
<div class="wrapper">
<div class="top-bar">
{{> topBar}}
</div>
</div>
<div>
<h3>All Claims</h3>
<p>These are all the free, public assets at that claim. You can publish more at <a href="/">spee.ch</a>.</p>
{{#each claims}}
<img class="all-claims-img" src="/{{this.name}}/{{this.claim_id}}" />
<div class="card card-block">
<p>claim_id: {{this.claim_id}}</p>
<p>direct link <a href="/{{this.name}}/{{this.claim_id}}">here</a></p>
<p>author: {{this.value.stream.metadata.author}}</p>
<p>description: {{this.value.stream.metadata.description}}</p>
<p>license: {{this.value.stream.metadata.license}}</p>
</div>
<hr>
{{/each}}
</div>
</div>

View file

@ -1,9 +1,9 @@
<div class="container">
{{> topBar}}
<div class="row">
<div class="col-md-12">
<h3>404: Not Found</h3>
<p>That page does not exist. Return <a href="/">home</a>.</p>
</div>
<div class="wrapper">
<div class="top-bar">
{{> topBar}}
</div>
<div>
<h3>404: Not Found</h3>
<p>That page does not exist. Return <a href="/">home</a>.</p>
</div>
</div>

View file

@ -1,21 +1,22 @@
<div class="container">
{{> topBar}}
<div class="row">
<div class="wrapper">
<div class="top-bar">
{{> topBar}}
</div>
<div class="main">
{{> publish}}
</div>
<div class="row">
{{> examples}}
</div>
<div class="row">
{{> documentation}}
</div>
<div class="row">
<div class="sidebar">
<p>Spee.ch is a single-serving site that reads and publishes images to and from the <a class="white-text" href="https://lbry.io">LBRY</a> blockchain.</p>
{{> contribute}}
</div>
<div class="footer">
{{> footer}}
</div>
</div>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
<script src="/socket.io/socket.io.js"></script>
<script src="/siofu/client.js"></script>

View file

@ -5,25 +5,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Spee.ch</title>
<!-- Font Awesome -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">
<!-- Bootstrap core CSS -->
<link href="/vendors/MDB/css/bootstrap.min.css" rel="stylesheet">
<!-- Material Design Bootstrap -->
<link href="/vendors/MDB/css/mdb.min.css" rel="stylesheet">
<!-- custom styles -->
<link rel="stylesheet" href="/assets/css/style.css" type="text/css">
<link rel="stylesheet" href="/assets/css/allStyle.css" type="text/css">
<link rel="stylesheet" href="/assets/css/componentStyle.css" type="text/css">
</head>
<body>
{{{ body }}}
<!-- JQuery -->
<script type="text/javascript" src="/vendors/MDB/js/jquery-3.1.1.min.js"></script>
<!-- Bootstrap tooltips -->
<script type="text/javascript" src="/vendors/MDB/js/tether.min.js"></script>
<!-- Bootstrap core JavaScript -->
<script type="text/javascript" src="/vendors/MDB/js/bootstrap.min.js"></script>
<!-- MDB core JavaScript -->
<script type="text/javascript" src="/vendors/MDB/js/mdb.min.js"></script>
<!-- google analytics -->
{{ googleAnalytics }}
</body>

View file

@ -1,16 +1,20 @@
<div class="container">
{{> topBar}}
<div class="row">
{{> memeFodderMaker}}
<div class="wrapper">
<div class="top-bar">
{{> topBar}}
</div>
<div class="row">
<div class="main">
{{> memeFodderMaker}}
{{> memeFodderResults}}
</div>
<div class="sidebar">
<p>Spee.ch is a single-serving site that reads and publishes images to and from the <a class="white-text" href="https://lbry.io">LBRY</a> blockchain.</p>
{{> contribute}}
</div>
<div class="footer">
{{> footer}}
</div>
</div>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
<script src="/socket.io/socket.io.js"></script>
<script src="/siofu/client.js"></script>

View file

@ -1,10 +1,10 @@
<div class="container">
{{> topBar}}
<div class="row">
<div class="col-md-12">
<h3>No Claims</h3>
<p>There are no free, public images at that claim. You should publish one at <a href="/">spee.ch</a>.</p>
<p>NOTE: it is possible your claim was published, but it is still being processed by the blockchain</p>
</div>
<div class="wrapper">
<div class="top-bar">
{{> topBar}}
</div>
<div>
<h3>No Claims</h3>
<p>There are no free, public images at that claim. You should publish one at <a href="/">spee.ch</a>.</p>
<p>NOTE: it is possible your claim was published, but it is still being processed by the blockchain</p>
</div>
</div>

View file

@ -1,14 +1,8 @@
<div class="col-md-12">
<div class="card card-block">
<div class="row">
<div class="col-md-6" id="contribute">
<h2>Contribute</h2>
<p>If you would like to help make Spee.ch amazing, join our <a href="https://lbry.slack.com">slack</a> channel!</p>
</div>
<div class="col-md-6" id="bugs">
<h2>Bugs</h2>
<p>Spee.ch is young and under continuous development so it will have bugs. Please leave an issue on our <a href="https://github.com/lbryio/spee.ch">github</a> if you experience a problem or have suggestions.</p>
</div>
</div>
</div>
</div>
<div class="" id="contribute">
<h2>Contribute</h2>
<p>If you would like to help make Spee.ch amazing, join our <a href="https://lbry.slack.com">slack</a> channel!</p>
</div>
<div class="" id="bugs">
<h2>Bugs</h2>
<p>Spee.ch is young and under continuous development so it will have bugs. Please leave an issue on our <a href="https://github.com/lbryio/spee.ch">github</a> if you experience a problem or have suggestions.</p>
</div>

View file

@ -1,26 +1,23 @@
<div class="col-md-12">
<div class="card" id="documentation">
<div class="card-title card-block grey lighten-1 white-text">
<h2>Documentation</h2>
</div>
<div class="row">
<div class="col-md-12">
<strong>spee.ch/</strong>
<li><a href="/">https://spee.ch</a></li>
<li>Learn about Spee.ch and publish your own media</li>
<br>
<strong>spee.ch/&ltthe name of the claim&gt</strong>
<li >Serves the newest file with the largest bid at a claim</li>
<li >E.g. <a href="/doitlive">spee.ch/doitlive</a>.</li>
<br>
<strong>spee.ch/&lt the name of the claim &gt/&lt the claim_id &gt</strong>
<li >Serves a specific file at a claim</li>
<li >E.g. <a href="/doitlive/c496c8c55ed79816fec39e36a78645aa4458edb5">spee.ch/doitlive/c496c8c55ed79816fec39e36a78645aa4458edb5</a></li>
<br>
<strong>spee.ch/&ltthe name of the claim&gt/all</strong>
<li >Displays a list of all files at a claim</li>
<li >E.g. <a href="/doitlive/all">spee.ch/doitlive/all</a></li>
</div>
</div>
</div>
<div class="panel">
<h2>Documentation</h2>
<strong>spee.ch/</strong>
<ul>
<li><a href="/">https://spee.ch</a></li>
<li>Learn about Spee.ch and publish your own media</li>
</ul>
<strong>spee.ch/&ltthe name of the claim&gt</strong>
<ul>
<li >Serves the newest file with the largest bid at a claim</li>
<li >E.g. <a href="/doitlive">spee.ch/doitlive</a></li>
</ul>
<strong>spee.ch/&lt the name of the claim &gt/&lt the claim_id &gt</strong>
<ul>
<li >Serves a specific file at a claim</li>
<li >E.g. <a href="/doitlive/c496c8c55ed79816fec39e36a78645aa4458edb5">spee.ch/doitlive/c496c8c55ed79816fec39e36a78645aa4458edb5</a></li>
</ul>
<strong>spee.ch/&ltthe name of the claim&gt/all</strong>
<ul>
<li >Displays a list of all files at a claim</li>
<li >E.g. <a href="/doitlive/all">spee.ch/doitlive/all</a></li>
</ul>
</div>

View file

@ -1,26 +1,23 @@
<div class="col-md-12">
<div class="card" id="examples">
<div class="card-title card-block grey lighten-1 white-text">
<h2>What Is Spee.ch?</h2>
</div>
<div class="row">
<div class="col-md-6" id="contribute">
<h2>Spee.ch is for sharing</h2>
<p>Spee.ch is a platform by which you can publish images to the Lbry blockchain. Just upload an image, title it, and send it off into the lbry ecosystem.</p>
<p>Spee.ch is also a platform to serve you those images. It's like have a personal chef that will serve you a meal anywhere in the world. All you have to do is ask for it, by using "spee.ch/" + the name of a claim.</p>
<p>If you want a specific image, just ask for it with the claim_id by using "spee.ch/" + the name of the claim + "/" + the claim id.</p>
</div>
<div class="col-md-6" id="bugs">
<h2>Examples</h2>
<h5>Use spee.ch to serve the top asset at a lbry claim:</h5>
<a href="/coconuts">spee.ch/coconuts</a><br>
<a href="/wood">spee.ch/wood</a><br>
<a href="/doitlive">spee.ch/doitlive</a><br>
<h5>Use spee.ch to show you all the assets at a lbry claim:</h5>
<a href="/doitlive/all">spee.ch/doitlive/all</a>
<h5>Use spee.ch to serve you a specific asset by claim id:</h5>
<a href="/doitlive/ca3023187e901df9e9aabd95d6ae09b6cc69b3f0">spee.ch/doitlive/ca3023187e901df9e9aabd95d6ae09b6cc69b3f0</a>
</div>
<div class="panel">
<h2>What is spee.ch? </h2>
<p>Spee.ch is an image hosting service based on the LBRY blockchain. It reads and publishes free, public images.</p>
<div class="example">
<h4>Use spee.ch to embed a specific image:</h4>
<img class="example-image" src="/doitlive/ca3023187e901df9e9aabd95d6ae09b6cc69b3f0"/>
<span class="code">&lt;img src="https://spee.ch/doitlive/ca3023187e901df9e9aabd95d6ae09b6cc69b3f0"/&gt;</span>
<p><a href="/doitlive/ca3023187e901df9e9aabd95d6ae09b6cc69b3f0">spee.ch/doitlive/ca3023187e901df9e9aabd95d6ae09b6cc69b3f0</a></p>
</div>
<div class="example">
<h4>Use spee.ch to serve a top LBRY claim:</h4>
<img class="example-image" src="/doitlive"/>
<span class="code">&lt;img src="https://spee.ch/doitlive"/&gt;</span>
<p><a href="/doitlive">spee.ch/doitlive</a></p>
</div>
<div class="example">
<h4>Use spee.ch to view all the assets at a LBRY claim:</h4>
<div class="example">
<a href="/doitlive/all">spee.ch/doitlive/all</a>
</div>
</div>
</div>

View file

@ -0,0 +1,3 @@
<footer class="stop-float">
<p>thanks for visiting spee.ch</p>
</footer>

View file

@ -1,50 +1,31 @@
<div class="col-md-12">
<div class="card" id="publish">
<div class="card-title card-block grey lighten-1 white-text">
<h2>#LBRYMemeFodder</h2>
</div>
<div class="card-block">
<div class="row">
<div class="col-md-12">
<h3>Congratulations, you found the /meme-fodder game</h3>
<p>Create a meme based on the current <i>lbry://meme-fodder</i> claims using the tool below. Got a masterpiece? <a href="https://twitter.com/hashtag/LBRYMemeFodder" target="_blank">Share it with the community</a> and see what they think!</p>
<p>Spee.ch/meme-fodder/play uses the free, public images at the claim <a href="lbry://meme-fodder">lbry://meme-fodder</a>. Want to put a different image on the chopping block? Go publish it!</p>
</div>
</div>
<div class="row">
<div class="col-md-5">
<canvas id="meme-canvas">
If you can see this, the meme generator is not supported by your browser.
</canvas>
<img id="start-image" src="/meme-fodder" alt="a picture to make your meme with"/>
</div>
<div class="col-md-7">
<div id="publish-active-area">
<div class="row">
<div class="col-md-12">
<label for="top-text">Meme:</label>
<input id="top-text" type="text" value="Hello" />
</div>
</div>
<div class="row">
<div class="col-md-12">
<input id="bottom-text" type="text" value="world!" />
</div>
</div>
<div class="row">
<div class="col-md-12">
<label for="meme-name">Claim Name:</label>
<input id="file-name-input" type="text" value="My-Claim-Name" />
</div>
</div>
<div class="row">
<div class="col-md-12">
<button onclick="startPublish()">Save and Publish</button>
</div>
</div>
</div>
</div>
</div>
<div class="card" id="publish">
<h2>#LBRYMemeFodder</h2>
<div class="col-md-12">
<h3>Congratulations, you found the /meme-fodder game!</h3>
<p>Create a meme based on the current <i>lbry://meme-fodder</i> claims using the tool below.</p>
</div>
<div class="col-left">
<canvas id="meme-canvas">
If you can see this, the meme generator is not supported by your browser.
</canvas>
<img id="start-image" src="/meme-fodder" alt="a picture to make your meme with"/>
</div>
<div class="col-right">
<textarea id="direct-link-holder" hidden="true">No URL yet</textarea>
<div id="publish-active-area">
<p>
<label for="top-text">Meme:</label><br/>
<input id="top-text" type="text" value="Hello" /><br/>
<input id="bottom-text" type="text" value="world!" /><br/>
</p>
<p>
<label for="meme-name">Claim Name:</label></br>
<input id="file-name-input" type="text" value="My-Claim-Name" />
</p>
<p>
<button onclick="startPublish()">Save and Publish</button>
</p>
</div>
</div>
<p class="stop-float">Got a masterpiece? <a href="https://twitter.com/hashtag/LBRYMemeFodder" target="_blank">Share it with the community</a> and see what they think!</p>
</div>

View file

@ -1,22 +1,11 @@
<div class="col-md-12">
<div class="card" id="publish">
<div class="card-title card-block grey lighten-1 white-text">
<h2>Recent Meme Fodder</h2>
</div>
<div class="card-block" id="publish-active-area">
<div class="row">
<div class="col-md-12">
<p>Below are the images published to /meme-fodder. Click one to choose it as your canvas.</p>
</div>
</div>
<div class="row">
{{#each claims}}
<div class="col-md-3">
<img class="all-claims-img" src="/{{this.name}}/{{this.claim_id}}" onclick="newCanvas(this)"/>
</div>
<hr>
{{/each}}
</div>
</div>
<div class="stop-float" id="publish">
<h2>Recent Meme Fodder</h2>
<div class="row">
<p>Below are the free, public images published to <a href="lbry://meme-fodder">lbry://meme-fodder</a>. Want to put a different image on the chopping block? Go publish it!</p>
</div>
<div class="row">
{{#each claims}}
<img class="meme-fodder-img" src="/{{this.name}}/{{this.claim_id}}" onclick="newCanvas(this)"/>
{{/each}}
</div>
</div>

View file

@ -1,39 +1,33 @@
<div class="col-md-12">
<div class="card" id="publish">
<div class="card-title card-block grey lighten-1 white-text">
<h2>Publish Your Own</h2>
<div class="panel">
<h2>Publish</h2>
<div class="col-left">
<div id="drop-zone" ondrop="drop_handler(event);" ondragover="dragover_handler(event);" ondragend="dragend_handler(event)">
<p>Drag and drop your file here, or choose your file below.</p>
<input type="file" id="siofu_input" name="file" accept="video/*,image/*" onchange="previewAndStageFile(event.target.files[0])" enctype="multipart/form-data"/>
</div>
<div class="card-block">
<div class="row">
<div class="col-md-6">
<div id="drop-zone" ondrop="drop_handler(event);" ondragover="dragover_handler(event);" ondragend="dragend_handler(event)">
<p>Drag and drop your file here, or choose your file below.</p>
<input type="file" id="siofu_input" name="file" accept="video/*,image/*" onchange="previewAndStageFile(event.target.files[0])" enctype="multipart/form-data"/>
</div>
<img id="image-preview" src="" height="200" alt="Image preview..."/>
</div>
<div id="publish-active-area" class="col-md-6">
<form>
<div class="md-form">
<input type="text" id="publish-name" value="Name" class="form-control">
</div>
<fieldset class="form-group">
License:
<select type="text" id="publish-license" name="license" value="license">
<option value="Public Domain">Public Domain</option>
<option value="Creative Commons">Creative Commons</option>
</select>
</fieldset>
<fieldset class="form-group">
<input type="checkbox" id="publish-nsfw">
<label for="publish-nsfw">NSFW</label>
</fieldset>
<p><i>By clicking 'Publish' I attest that I have read and agree to the <a href="https://lbry.io/termsofservice" target="_blank">LBRY terms of service</a>.</i></p>
<button id="publish-submit">Publish</button>
<button id="publish-reset">Reset</button>
</form>
</div>
</div>
<img id="image-preview" src="" height="200" alt="Image preview..."/>
</div>
<div class="col-right">
<textarea id="direct-link-holder" hidden="true">No URL yet</textarea>
<div id="publish-active-area">
<input type="text" id="publish-name" value="Name" class="form-control">
<p>
<label for="publish-license">License:</label>
<br/>
<select type="text" id="publish-license" name="license" value="license">
<option value="Public Domain">Public Domain</option>
<option value="Creative Commons">Creative Commons</option>
</select>
</p>
<p>
<input type="checkbox" id="publish-nsfw">
<label for="publish-nsfw">NSFW</label>
</p>
<p>
<button id="publish-submit">Publish</button>
<a href="/"><button id="publish-reset">Reset</button></a>
</p>
<p><i>By clicking 'Publish' I attest that I have read and agree to the <a href="https://lbry.io/termsofservice" target="_blank">LBRY terms of service</a>.</i></p>
</div>
</div>
</div>

View file

@ -1,21 +1,4 @@
<div class="row">
<div class="col-md-12">
<div class="card card-block grey white-text">
<div class="card-title">
<div class="row">
<div class="col-md-2">
<img src="/speech/900227fe5c778eb2a6424d923af806c669ea3a3c"/>
</div>
<div class="col-md-10 align-self-center">
<h1><a class="white-text" href="/">Spee.ch</a></h1>
</div>
</div>
<div class="row">
<div class="col-md-12">
<p>Spee.ch is a single-serving site that reads and publishes images to and from the <a class="white-text" href="https://lbry.io">LBRY</a> blockchain.</p>
</div>
</div>
</div>
</div>
</div>
<div>
<img id="logo" src="/speech/900227fe5c778eb2a6424d923af806c669ea3a3c"/>
<h1 id="title"><a href="/">Spee.ch</a></h1>
</div>

View file

@ -0,0 +1,5 @@
<h2>What Is Spee.ch?</h2>
<h3>Spee.ch is for sharing</h3>
<p>Spee.ch is a platform by which you can publish images to the Lbry blockchain. Just upload an image, title it, and send it off into the lbry ecosystem.</p>
<p>Spee.ch is also a platform to serve you those images. It's like have a personal chef that will serve you a meal anywhere in the world. All you have to do is ask for it, by using "spee.ch/" + the name of a claim.</p>
<p>If you want a specific image, just ask for it with the claim_id by using "spee.ch/" + the name of the claim + "/" + the claim id.</p>