-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
12 changed files
with
426 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,75 @@ | ||
| <script> | ||
| import notifier from '$stores/notifier' | ||
| //import settings from '$stores/settings' | ||
| export let show = true // $settings.notify | ||
| const handleDismiss = (message) => { | ||
| notifier.dismiss(message) | ||
| // guard to close popup when there are no more messages | ||
| if ($notifier.length === 0) { | ||
| //show = false | ||
| } | ||
| } | ||
| const toggle = () => { | ||
| // don't show popup when no messages | ||
| if ($notifier.length === 0) { | ||
| show = false | ||
| } else { | ||
| show = !show | ||
| } | ||
| } | ||
| const clearAll = () => { | ||
| notifier.clear() | ||
| } | ||
| // TODO auto disappear notify | ||
| </script> | ||
|
|
||
| <ul class="notifications"> | ||
| {#each $notifier as message} | ||
| <li> | ||
| <div class="notification is-warning"> | ||
| <button class="delete" on:click={() => handleDismiss(message)} /> | ||
| <p>{message.title}</p> | ||
| {#if message.htmlDeck} | ||
| <p>{@html message.htmlDeck}</p> | ||
| {:else} | ||
| <p>{message.deck}</p> | ||
| {/if} | ||
| </div> | ||
| </li> | ||
| {/each} | ||
| </ul> | ||
|
|
||
| {#if false && $notifier.length > 1} | ||
| <button class="" on:click={clearAll}>Clear all</button> | ||
| {/if} | ||
|
|
||
| <style lang="scss"> | ||
| .notifications { | ||
| padding: 0; | ||
| margin: 0; | ||
| list-style-type: none; | ||
| position: fixed; | ||
| z-index: 10000; | ||
| left: 0.5em; | ||
| top: 0.5em; | ||
| li { | ||
| width: 320px; | ||
| margin-bottom: 0.5em; | ||
| p { | ||
| margin: 0; | ||
| margin-bottom: 0.2em; | ||
| overflow: hidden; | ||
| a { | ||
| color: inherit; | ||
| } | ||
| } | ||
| } | ||
| } | ||
| </style> |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,26 @@ | ||
| import { writable } from 'svelte/store' | ||
| import { nanoid } from 'nanoid' | ||
|
|
||
| const createStore = () => { | ||
| const { subscribe, set, update } = writable([]) | ||
|
|
||
| const dismiss = (message) => | ||
| update((messages) => messages.filter((m) => m.id !== message.id)) | ||
|
|
||
| const add = (message) => { | ||
| message.id = message.id || nanoid() | ||
| message.timestamp = message.timestamp || new Date().getTime() | ||
| update((messages) => [message, ...messages]) | ||
| } | ||
|
|
||
| return { | ||
| subscribe, | ||
| add, | ||
| dismiss, | ||
| clear: () => set([]) | ||
| } | ||
| } | ||
|
|
||
| const notifier = createStore() | ||
|
|
||
| export default notifier |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,120 @@ | ||
| <script> | ||
| import { connected, signerAddress, chainData } from 'ethers-svelte' | ||
| import { Jazzicon } from 'ethers-svelte/components' | ||
| import { keyDownA11y, formatAddress } from '$lib/utils' | ||
| import blockchain from '$lib/blockchain.js' | ||
| import AppContext from '$components/AppContext.svelte' | ||
| import Icon from '$components/Icon.svelte' | ||
| import AppMenuPopover from '$components/design/AppMenuPopover.svelte' | ||
| import BreadcrumbNav from '../BreadcrumbNav.svelte' | ||
| let popparent | ||
| </script> | ||
|
|
||
| <AppContext> | ||
| <nav class="navbar" aria-label="main navigation"> | ||
| <div class="navbar-brand"> | ||
| <a class="navbar-item is-black" alt="Rouge Ticket" href="/book"> | ||
| <span class="mx-2 is-hidden-mobile" | ||
| ><img alt="Rouge Ticket logo" src="/rouge-ticket-black.svg" /></span> | ||
| <span class="mx-2 icon is-large is-hidden-tablet" | ||
| ><img alt="Rouge Ticket logo" src="/logo.svg" /></span> | ||
| </a> | ||
| </div> | ||
|
|
||
| {#if $connected} | ||
| <div | ||
| bind:this={popparent} | ||
| class="navbar-brand is-justify-content-center is-hidden-tablet"> | ||
| <AppMenuPopover let:toggle {popparent}> | ||
| <a | ||
| href="#apps" | ||
| class="navbar-item" | ||
| on:click={toggle} | ||
| on:keydown={keyDownA11y(toggle)}> | ||
| <Icon name="GridDots" /> | ||
| </a> | ||
| </AppMenuPopover> | ||
| </div> | ||
| {/if} | ||
|
|
||
| <div class="navbar-brand is-justify-content-flex-end"> | ||
| {#if $signerAddress} | ||
| <div class="navbar-item pr-0"> | ||
| <span class="icon-text"> | ||
| <span class="icon" | ||
| ><Jazzicon address={$signerAddress} size={24} /></span> | ||
| <small class="is-hidden-mobile" | ||
| >{formatAddress($signerAddress)}</small> | ||
| </span> | ||
| </div> | ||
| <div class="navbar-item"> | ||
| <span class="tag is-hidden-touch">{$chainData.name}</span> | ||
| <span class="tag is-hidden-desktop">{$chainData.shortName}</span> | ||
| </div> | ||
| {/if} | ||
| </div> | ||
| </nav> | ||
|
|
||
| <div class="container is-max-desktop"> | ||
| <div class="container is-fluid"> | ||
| <BreadcrumbNav class="mt-5 mb-2" /> | ||
|
|
||
| <div class="box"> | ||
| <slot /> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </AppContext> | ||
|
|
||
| <style lang="scss"> | ||
| @import '../../../scss/_variables.scss'; | ||
| @import 'bulma/sass/utilities/_all'; | ||
| :global(body) { | ||
| background-color: $grey-standalone; | ||
| } | ||
| :global(.version a) { | ||
| color: #888 !important; | ||
| } | ||
| .container.is-max-desktop { | ||
| @include mobile { | ||
| padding-top: 3.5rem; | ||
| } | ||
| @include tablet { | ||
| padding: 4rem; | ||
| } | ||
| } | ||
| .navbar { | ||
| background-color: $grey-standalone; | ||
| } | ||
| nav { | ||
| display: flex; | ||
| align-items: stretch; | ||
| background-color: transparent; | ||
| .navbar-brand { | ||
| flex: 1; | ||
| justify-content: left; | ||
| &:last-child { | ||
| justify-content: right; | ||
| } | ||
| a:hover { | ||
| color: currentColor; | ||
| } | ||
| } | ||
| } | ||
| .navbar-item .is-large img { | ||
| max-height: none; | ||
| } | ||
| </style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,2 @@ | ||
| export const prerender = false | ||
| // export const ssr = false |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,78 @@ | ||
| <script> | ||
| import { | ||
| getChainDataByChainId, | ||
| } from 'ethers-svelte' | ||
| import { | ||
| ethereum, | ||
| // metisBlack, | ||
| // arbitrum, | ||
| arbitrumNova, | ||
| optimism | ||
| } from '$icons/strings.js' | ||
| import { getSupportedChainIds } from '$lib/enums.js' | ||
| import registry from '$stores/registry.js' | ||
| import Icon from '$components/Icon.svelte' | ||
| $: supportedChainIds = getSupportedChainIds($registry.includeTestnets) | ||
| const graphics = { | ||
| 1: { icon: ethereum }, | ||
| 10: { icon: optimism }, | ||
| 42170: { icon: arbitrumNova } | ||
| } | ||
| </script> | ||
|
|
||
| <section class="sectionx"> | ||
|
|
||
| <div class="level"> | ||
| <div class="level-left"> | ||
| <h2 class="title">Choose the chain</h2> | ||
| </div> | ||
| </div> | ||
|
|
||
| <span class="field ml-2 hidden"> | ||
| <input | ||
| id="testnets" | ||
| type="checkbox" | ||
| name="testnets" | ||
| class="switch is-rtl" | ||
| bind:checked={$registry.includeTestnets} /> | ||
| <label class="has-text-grey-light" for="testnets" | ||
| >Include testnets?</label> | ||
| </span> | ||
|
|
||
|
|
||
|
|
||
| <section id="why" class="hero is-medium xis-info"> | ||
| <div class="hero-body has-text-centered has-big-titles"> | ||
| <div class="columns is-multiline mt-4"> | ||
|
|
||
| {#each supportedChainIds as id} | ||
| <div class="column is-half"> | ||
| <a | ||
| href="/hub/{getChainDataByChainId(id)?.shortName}"> | ||
| <div class="box"> | ||
| <p class="title">{getChainDataByChainId(id)?.name}</p> | ||
|
|
||
| <div class="m-auto" style="height: 5em; width: 5em;"> | ||
|
|
||
| {@html graphics[id].icon} | ||
| </div> | ||
|
|
||
| </div> | ||
| </a> | ||
| </div> | ||
| {/each} | ||
|
|
||
| </div> | ||
| </div> | ||
| </section> | ||
|
|
||
|
|
||
| </section> |
Oops, something went wrong.