diff options
| author | Indrajith K L | 2024-06-21 00:43:41 +0530 |
|---|---|---|
| committer | Indrajith K L | 2024-06-21 02:38:36 +0530 |
| commit | f7275309ad3ec062ebed915a097766daf126813b (patch) | |
| tree | 12fa7deedd4e6332b28e2c0b7dc1b8b17fc1cde4 /src | |
| parent | 11c92db4208efb6381a2fd65bcc4de427d1f21f6 (diff) | |
| download | indrajith-dev-crystal-f7275309ad3ec062ebed915a097766daf126813b.tar.gz indrajith-dev-crystal-f7275309ad3ec062ebed915a097766daf126813b.tar.bz2 indrajith-dev-crystal-f7275309ad3ec062ebed915a097766daf126813b.zip | |
Basic Home Page Implementation
* Moves assets from old website
* Basic layout based on old website
* Move home page from old website
Diffstat (limited to 'src')
| -rw-r--r-- | src/indrajith-dev-crystal.cr | 21 | ||||
| -rw-r--r-- | src/views/home.ecr | 23 | ||||
| -rw-r--r-- | src/views/layout.ecr | 53 |
3 files changed, 95 insertions, 2 deletions
diff --git a/src/indrajith-dev-crystal.cr b/src/indrajith-dev-crystal.cr index a7a08b6..28948cf 100644 --- a/src/indrajith-dev-crystal.cr +++ b/src/indrajith-dev-crystal.cr @@ -3,8 +3,25 @@ require "kemal" module Indrajith::Dev::Crystal VERSION = "0.1.0" - get "/" do - "Hello World!" + macro page_renderer(filename) + render "src/views/#{{{filename}}}.ecr", "src/views/layout.ecr" + end + + def self.htmx_request?(context) + context.request.headers.has_key?("HX-Request") || + context.request.headers.has_key?("Hx-Request") || + context.request.headers.has_key?("hx-request") + end + + get "/" do |context| + if htmx_request?(context) + partial_content = render("src/views/home.ecr") + context.response.content_type = "text/html" + context.response.print partial_content + else + context.response.content_type = "text/html" + page_renderer "home" + end end Kemal.run diff --git a/src/views/home.ecr b/src/views/home.ecr new file mode 100644 index 0000000..5d7eb54 --- /dev/null +++ b/src/views/home.ecr @@ -0,0 +1,23 @@ +<div class="text-center"> + <div> + <p class="first-letter"> + "Hello Friend!! My name is Indrajith K L." I'm a web developer, hobbyist game developer from India, working as a front-end developer. + This site is where I write about my fun side projects, R&D's, random thoughts, game development etc. Since you are here why don't you read some <a href="/posts" class="text-main-cardheading font-bold">posts</a>. + </p> + </div> +</div> + +<div> + <div> + <h4>Books I'm reading now</h4> + <div id="gr_grid_widget_1676363812"></div> + </div> + <h4>Recent Posts</h4> + <ul> + <!-- + li -> posts + --> + </ul> +</div> +<script src="https://www.goodreads.com/review/grid_widget/162656738.Indrajith's%20currently-reading%20book%20montage?cover_size=medium&hide_link=&hide_title=true&num_books=20&order=a&shelf=currently-reading&sort=date_added&widget_id=1676363812" type="text/javascript" charset="utf-8"></script> + diff --git a/src/views/layout.ecr b/src/views/layout.ecr new file mode 100644 index 0000000..f16eefc --- /dev/null +++ b/src/views/layout.ecr @@ -0,0 +1,53 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>{indrajith.dev}</title> + <script src="https://unpkg.com/htmx.org@1.9.12"></script> + <link rel="stylesheet" href="/css/styles.css"> +</head> +<body> + <header class="header"> + <div class="logo-container"> + <a class="logo" href="/">{indrajith.dev}</a> + </div> + <h4 class="slogan">(Software is Art)</h4> + <nav> + <ul> + <li><a href="/" hx-get="/" hx-target="#content" hx-push-url="true" class="hvr-underline-reveal" id="home" class="links">home</a></li> + <li><a href="/posts" hx-get="/post" hx-target="#content" hx-push-url="true" class="hvr-underline-reveal" id="posts" class="links">posts</a></li> + <li><a href="/timeline" hx-get="/timeline" hx-target="#content" hx-push-url="true" class="hvr-underline-reveal" id="cv" class="links">timeline</a></li> + <li><a href="/about" hx-get="/about" hx-target="#content" hx-push-url="true" class="hvr-underline-reveal" id="about" class="links">about</a></li> + <li><a href="https://git.indrajith.dev" class="hvr-underline-reveal" id="cv" class="links">git</a></li> + <li><a href="/contact" hx-get="/contact" hx-target="#content" hx-push-url="true" id="cv" class="links hvr-underline-reveal">contact</a></li> + <li><a href="/feed.xml" id="cv" class="links hvr-underline-reveal">feed</a></li> + </ul> + </nav> + <hr> + </header> + <main id="content"> + <%= content %> + </main> + <footer> + <hr> + <ul> + <li> + <p>© 2024 Indrajith K L </p> + </li> + </ul> + <img src="/images/indrajith.dev.gif" class="etyone" alt=""> + </footer> + <script>htmx.config.getCacheBusterParam = true</script> + <script> + (function(){ + const currentLocation = location.pathname; + const navs = ["about","posts","cv"]; + const currentNav = navs.find(nav=>currentLocation.includes(nav)); + if (currentNav) { + document.getElementById(currentNav).parentElement.classList.add("text-lightish-50"); + } + })(); + </script> +</body> +</html> |