diff --git a/index.html b/index.html index 0dbc3a7..b834bf0 100644 --- a/index.html +++ b/index.html @@ -27,7 +27,7 @@ /> -
+
diff --git a/src/App.svelte b/src/App.svelte index b35ed65..47e379b 100644 --- a/src/App.svelte +++ b/src/App.svelte @@ -3,6 +3,7 @@ import { Link, navigate, Route, Router } from 'svelte-navigator'; import { fade } from 'svelte/transition'; import { handleKeyboardNavigation, navigationContainers } from './lib/actions/focusAction'; + import HomePage from './lib/pages/HomePage.svelte'; let focusableElements: HTMLElement[] = []; @@ -19,36 +20,27 @@ } const navBarContainer = navigationContainers.navBar.getRegisterer(); + const mainContainer = navigationContainers.main.getRegisterer(); const homeContainer = navigationContainers.home.getRegisterer(); -
+
-
+
-
-
- Home path -
-
- Another item -
-
- Button perhaps? -
-
+ - +
about path
diff --git a/src/lib/actions/focusAction.ts b/src/lib/actions/focusAction.ts index 7d5925f..e3f81a9 100644 --- a/src/lib/actions/focusAction.ts +++ b/src/lib/actions/focusAction.ts @@ -174,11 +174,13 @@ export function handleKeyboardNavigation(event: KeyboardEvent) { } const navBar = new Container().setDirection('vertical'); +const main = new Container().setDirection('vertical'); const home = new Container(); -home.setLeftNeighbor(navBar); +home.setLeftNeighbor(main); export const navigationContainers = { home, + main, navBar }; diff --git a/src/lib/components/Card/CardPlaceholder.svelte b/src/lib/components/Card/CardPlaceholder.svelte index 772e9bf..130af4f 100644 --- a/src/lib/components/Card/CardPlaceholder.svelte +++ b/src/lib/components/Card/CardPlaceholder.svelte @@ -19,4 +19,5 @@ })} style={'animation-delay: ' + ((index * 100) % 2000) + 'ms;'} transition:fade|global + tabindex="0" /> diff --git a/src/lib/components/Selectable.svelte b/src/lib/components/Selectable.svelte new file mode 100644 index 0000000..8063609 --- /dev/null +++ b/src/lib/components/Selectable.svelte @@ -0,0 +1,3 @@ +
+ +
diff --git a/src/lib/pages/HomePage.svelte b/src/lib/pages/HomePage.svelte new file mode 100644 index 0000000..6ae2db3 --- /dev/null +++ b/src/lib/pages/HomePage.svelte @@ -0,0 +1,14 @@ + + +
+ + + +