diff --git a/index.html b/index.html index 029475dd..7fa7af6e 100644 --- a/index.html +++ b/index.html @@ -2,7 +2,6 @@ - Recycling Locator widget diff --git a/public/recycling-locator-logo.webp b/public/recycling-locator-logo.webp new file mode 100644 index 00000000..0e7968c2 Binary files /dev/null and b/public/recycling-locator-logo.webp differ diff --git a/public/vite.svg b/public/vite.svg deleted file mode 100644 index e7b8dfb1..00000000 --- a/public/vite.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/app/Start.tsx b/src/app/Start.tsx index 88e71974..3da4c6b8 100644 --- a/src/app/Start.tsx +++ b/src/app/Start.tsx @@ -2,7 +2,7 @@ export default function StartPage() { return (
- Recycling Locator +

Find places to recycle

diff --git a/src/components/Layout/Layout.stories.ts b/src/components/Layout/Layout.stories.ts index a28ab043..1d71df50 100644 --- a/src/components/Layout/Layout.stories.ts +++ b/src/components/Layout/Layout.stories.ts @@ -8,9 +8,8 @@ const meta: Meta = { }; export default meta; -type Story = StoryObj; -export const Layout: Story = { +export const Layout: StoryObj = { render: () => html`
Header
diff --git a/src/components/Logo/Logo.stories.ts b/src/components/Logo/Logo.stories.ts new file mode 100644 index 00000000..b3145bf8 --- /dev/null +++ b/src/components/Logo/Logo.stories.ts @@ -0,0 +1,14 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import { html } from 'lit'; + +import './Logo'; + +const meta: Meta = { + component: 'locator-logo', +}; + +export default meta; + +export const Logo: StoryObj = { + render: () => html``, +}; diff --git a/src/components/Logo/Logo.ts b/src/components/Logo/Logo.ts new file mode 100644 index 00000000..a2a06584 --- /dev/null +++ b/src/components/Logo/Logo.ts @@ -0,0 +1,28 @@ +import { LitElement, css, html } from 'lit'; +import { customElement } from 'lit/decorators.js'; + +@customElement('locator-logo') +export class Logo extends LitElement { + static styles = css` + :host { + display: block; + } + + img { + display: block; + width: min(230px, 100%); + height: auto; + } + `; + + render() { + return html` + Recycling Locator + `; + } +} diff --git a/vite.config.ts b/vite.config.ts index 7d78344a..ac24d001 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -3,6 +3,9 @@ import { defineConfig } from 'vite'; // https://vitejs.dev/config/ export default defineConfig({ + server: { + port: 3000, + }, plugins: [ preact({ babel: {