add icons

This commit is contained in:
Nolan Lawson 2018-01-07 16:00:42 -08:00
parent 70749d9053
commit 259754ffe6
12 changed files with 101 additions and 28 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 721 B

After

Width:  |  Height:  |  Size: 749 B

View file

@ -32,8 +32,51 @@ a:visited {
color: royalblue; color: royalblue;
} }
input {
border: 1px solid #dadada;
padding: 5px;
}
label {
font-size: 1.1em;
}
input {
font-size: 1.1em;
}
button {
font-size: 1.2em;
border: 1px solid #333;
background: #ededed;
border-radius: 2px;
padding: 10px 15px;
}
button:hover {
background: #ddd;
}
button:active {
background: #fafafa;
}
button.primary {
border: 1px solid #1e3066;
background: #668cff;
color: white;
}
button.primary:hover {
background: #446add;
}
button.primary:active {
background: #99b3ff;
}
@media (max-width: 767px) { @media (max-width: 767px) {
p { p, label, input {
font-size: 1.3em; font-size: 1.3em;
} }
} }

Binary file not shown.

Before

Width:  |  Height:  |  Size: 80 KiB

BIN
assets/icon-192.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

View file

@ -7,14 +7,9 @@
"start_url": "/", "start_url": "/",
"icons": [ "icons": [
{ {
"src": "svelte-logo-192.png", "src": "icon-192.png",
"sizes": "192x192", "sizes": "192x192",
"type": "image/png" "type": "image/png"
},
{
"src": "svelte-logo-512.png",
"sizes": "512x512",
"type": "image/png"
} }
] ]
} }

1
assets/sailboat.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 100 100" x="0px" y="0px"><title>Artboard 1</title><path d="M92.12,59.93H59.87V8.23C70.4,14.9,87.34,30,92.12,59.93ZM31,26.9A122.4,122.4,0,0,1,9.39,60.35H31ZM37.76,99H62.24A30.67,30.67,0,0,0,92.91,68.33H50.52V6.27A5.27,5.27,0,0,0,40,6.27V68.33H7.09A30.67,30.67,0,0,0,37.76,99Z" fill="#ffffff"/></svg>

After

Width:  |  Height:  |  Size: 372 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2 KiB

View file

@ -7,7 +7,7 @@
<p>Pinafore is a web client for <a href="https://joinmastodon.org">Mastodon</a>, optimized for performance and simplicity.</p> <p>Pinafore is a web client for <a href="https://joinmastodon.org">Mastodon</a>, optimized for performance and simplicity.</p>
<p>To get started, <a href="/settings/instance-wizard">log in to an instance</a>.</p> <p>To get started, <a href="/settings/add-instance">log in to an instance</a>.</p>
<p>Don't have an instance? <a href="https://joinmastodon.org">Join Mastodon!</a></p> <p>Don't have an instance? <a href="https://joinmastodon.org">Join Mastodon!</a></p>
</Layout> </Layout>

View file

@ -0,0 +1,52 @@
<:Head>
<title>Instance Wizard</title>
</:Head>
<Layout page='settings'>
<h1>Add an instance</h1>
<p>Log in to your instance to use Pinafore.</p>
<form on:submit='handleSubmit(event)'>
<label for="instanceInput">Instance name:</label>
<input type="text" id="instanceInput" bind:value='instanceName' placeholder=''>
<button class="primary" type="submit" id="submitButton">Add instance</button>
</form>
<p>Don't have an instance? <a href="https://joinmastodon.org">Join Mastodon!</a></p>
</Layout>
<style>
input {
}
form {
background: #fafafa;
padding: 5px 10px 15px;
border: 1px solid #ccc;
margin: 0 auto;
}
form label, form input, form button {
display: block;
margin: 20px 5px;
}
</style>
<script>
import Layout from '../_components/Layout.html';
export default {
components: {
Layout
},
data: () => ({
instanceName: ''
}),
methods: {
handleSubmit(event) {
event.preventDefault()
let instanceName = this.get('instanceName')
alert(instanceName)
}
}
}
</script>

View file

@ -1,19 +0,0 @@
<:Head>
<title>Instance Wizard</title>
</:Head>
<Layout page='settings'>
<h1>Instance Wizard</h1>
<p>Add an instance!</p>
</Layout>
<script>
import Layout from '../_components/Layout.html';
export default {
components: {
Layout
}
};
</script>

View file

@ -10,7 +10,7 @@
<link rel='icon' type='image/png' href='/favicon.png'> <link rel='icon' type='image/png' href='/favicon.png'>
<script> <script>
if ('serviceWorker' in navigator) { if (!location.origin.match('localhost') && 'serviceWorker' in navigator) {
navigator.serviceWorker.register('/service-worker.js'); navigator.serviceWorker.register('/service-worker.js');
} }
</script> </script>
@ -33,5 +33,6 @@
and anything else it needs to hydrate the app and and anything else it needs to hydrate the app and
initialise the router --> initialise the router -->
<script src='%sapper.main%'></script> <script src='%sapper.main%'></script>
<!-- Icon thanks to sailboat by Gregor Cresnar from the Noun Project -->
</body> </body>
</html> </html>