diff options
| author | Andinus <andinus@nand.sh> | 2021-10-09 18:33:40 +0530 |
|---|---|---|
| committer | Andinus <andinus@nand.sh> | 2021-10-09 18:33:40 +0530 |
| commit | 28f2122ce73f197bf28d062f1e6c2bea366bf078 (patch) | |
| tree | 09a8fbb20bfd1ab21170359e4acd543feac80840 /src | |
| parent | 272dc0801973cd66733ea4f1b0fb7946fa3bb49c (diff) | |
| download | dorado-28f2122ce73f197bf28d062f1e6c2bea366bf078.tar.gz | |
Initialize Application
Diffstat (limited to 'src')
| -rw-r--r-- | src/App.svelte | 17 | ||||
| -rw-r--r-- | src/Home.svelte | 1 | ||||
| -rw-r--r-- | src/Navbar.svelte | 57 | ||||
| -rw-r--r-- | src/algorithms/line-drawing/DDA.svelte | 1 | ||||
| -rw-r--r-- | src/main.js | 7 |
5 files changed, 83 insertions, 0 deletions
diff --git a/src/App.svelte b/src/App.svelte new file mode 100644 index 0000000..7ce6b42 --- /dev/null +++ b/src/App.svelte @@ -0,0 +1,17 @@ +<script> + import Navbar from './Navbar.svelte' + + import Home from './Home.svelte' + import DDA from './algorithms/line-drawing/DDA.svelte' + + let page = Home +</script> + +<h1 class="title">CG Algorithms</h1> +<Navbar /> +<main> + <svelte:component this={page} /> +</main> + +<style> +</style> diff --git a/src/Home.svelte b/src/Home.svelte new file mode 100644 index 0000000..a3f6997 --- /dev/null +++ b/src/Home.svelte @@ -0,0 +1 @@ +<p>Home</p> diff --git a/src/Navbar.svelte b/src/Navbar.svelte new file mode 100644 index 0000000..a1a3712 --- /dev/null +++ b/src/Navbar.svelte @@ -0,0 +1,57 @@ +<nav class="ddmenu"> + <a href="#">Home</a> + + <div class="ddgroup"> + Line Drawing Algorithms + <div class="ddsub"> + <a href="#">DDA</a> + <a href="#">Bresenham</a> + </div> + </div> +</nav> + +<style> + .ddmenu { display: flex; } + + .ddmenu a, .ddmenu .ddgroup { + width: 100%; + padding: 15px; + color: var(--fg-main); + text-decoration: none; + background: var(--bg-alt); + border: 2px solid var(--bg-main); + } + .ddmenu a:hover, .ddmenu .ddgroup:hover { + color: var(--fg-special-cold); + background: var(--bg-dim); + cursor: pointer; + } + .ddmenu .ddgroup { position: relative; } + .ddsub { + width: 100%; + position: absolute; + top: 100%; left: 0; + display: none; + } + .ddsub a { + display: block; + box-sizing: border-box; + } + .ddgroup:hover .ddsub { display: block; } + .ddgroup::after { + content: "\27A4"; + position: absolute; + top: 13px; right: 10px; + transition: transform 0.2s; + } + .ddgroup:hover::after { + transform: rotate(90deg); + } + @media screen and (max-width: 640px) { + .ddmenu { flex-wrap: wrap; } + .ddsub { + position: static; + margin-top: 10px; + } + } +</style> diff --git a/src/algorithms/line-drawing/DDA.svelte b/src/algorithms/line-drawing/DDA.svelte new file mode 100644 index 0000000..5295cfd --- /dev/null +++ b/src/algorithms/line-drawing/DDA.svelte @@ -0,0 +1 @@ +<p>DDA</p> diff --git a/src/main.js b/src/main.js new file mode 100644 index 0000000..50a0732 --- /dev/null +++ b/src/main.js @@ -0,0 +1,7 @@ +import App from './App.svelte'; + +const app = new App({ + target: document.body, +}); + +export default app; |