aotds-docks/src/lib/components/Notes.svelte

75 lines
1.6 KiB
Svelte

<aside transition:fly={{ x: -800, opacity: 1 }}>
<div>
<input
type="button"
class="button small red"
value="close"
on:click={close}
/>
</div>
<h3>welcome to the docks</h3>
<p>
This app is a ship builder for the game
<a href="https://shop.groundzerogames.co.uk/rules.html">Full Thrust</a>
.
</p>
<p>
The app, beside any exception mentioned here, is trying to follow the
<a href="http://members.ozemail.com.au/~laranzu/fullthrust/rules/">
Cross Dimensions rules
</a>
as closely as possible.
</p>
<p>
The app is mostly developed for Firefox. I also check as much as I can that
I don't mess things too badly on Chrome. For the other browsers... caveat
emptor.
</p>
<p>
Written by
<a href="https://twitter.com/yenzie">Yanick Champoux</a>
. Code available on
<a href="https://github.com/aotds/aotds-shipyard">Github</a>
</p>
</aside>
<script>
import { fly } from "svelte/transition";
import { createEventDispatcher } from "svelte";
const dispatch = createEventDispatcher();
const close = () => dispatch("close");
</script>
<style>
aside {
background-color: rgb(254, 218, 184);
position: absolute;
height: 20em;
max-width: 50%;
z-index: 200;
padding: 1em;
border: 3px solid var(--indigo-dye);
border-radius: 1em;
left: 0px;
border-left: 0px;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
top: 6em;
font-size: var(--font-scale-11);
}
h3 {
text-align: center;
margin: 0px;
}
div {
text-align: right;
}
</style>