Added basic pages

This commit is contained in:
2018-11-13 20:24:45 +00:00
committed by cdramey
parent 208e13d2a8
commit 412c625916
5 changed files with 185 additions and 2 deletions

BIN
assets/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 318 B

24
assets/index.html Normal file
View File

@ -0,0 +1,24 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>qurl.org</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" media="screen" href="qurl.css">
</head>
<body>
<div id="c">
qurl.org is a simple url shortening service, in the same vein as
<a href="https://bit.ly">bit.ly</a>, and
<a href="https://tinyurl.com">tinyurl.com</a>.
qurl.org is <a href="http://binarythought.com/qurl/LICENSE">open source</a>,
it's code is <a href="https://binarythought.com/fossils/qurl/">freely available</a>
and has an <a href="api/index.html">easy to use API</a>.
<form method="post" action="submit.html">
<input type="text" id="u" name="url" placeholder="https://qurl.org" />
<input type="submit" id="s" value="shorten" />
</form>
</div>
</body>
</html>

17
assets/qurl.css Normal file
View File

@ -0,0 +1,17 @@
* { box-sizing: border-box; font-family: Tahoma, Arial, san-serif; font-size: 16px; }
body { background-color: #fff; padding: 0; margin: 32px 16px; }
form { margin-top: 16px; white-space: nowrap; }
a { color: #3b8bba; text-decoration: none; }
a:hover { text-decoration: underline; }
input:focus { outline: 0; }
#c { border: 1px solid #eee; background-color: #fafafa; color: #757575; margin: auto; border-radius: 3px; text-align: justify; padding: 8px 16px; }
#u, #s { border: 1px solid #ccc; display: block; padding: 4px 8px; border-radius: 2px; margin: auto; }
#u { width: 100%; box-shadow: inset 0 1px 3px 0 #ddd; }
#u:focus { border-color: #129fea; }
#s { margin-top: 8px; color: #fff; background-color: #0078e7; border-color: transparent; }
#s:hover { background-image: linear-gradient(transparent,rgba(0,0,0,.05) 40%,rgba(0,0,0,.1)); cursor: hover; }
@media screen and (min-width: 640px) {
#c { max-width: 600px; }
#u, #s { display: inline-block; margin: 0; }
#u { width: 490px; display: inline-block; }
}