templates/index.stpl

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4     <meta charset="UTF-8">
   5     <meta http-equiv="X-UA-Compatible" content="IE-edge">
   6     <meta name="viewport" content="width=device-width, initial-scale=1.0">
   7     <meta name="keywords" content="luflow, HFGE, Free Software, C++, Libre software, Engine, Game Engine, Graphics, 3D, 2D, Programming, Vulkan">
   8     <meta name="description" content="This website is dedicated to free software primarily in the area of graphics engines but also free software in general.">
   9     <link type="application/atom+xml" rel="alternate" title="luflow.net — Activity Feed" href="/feeds/blog.atom">
  10     <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
  11     <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
  12     <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
  13     <link rel="icon" type="image/svg+xml" sizes="any" href="/static/img/icon.svg" />
  14     <link rel="manifest" href="/site.webmanifest">
  15     <link rel="stylesheet" href="/static/css/common.css">
  16     <link rel="stylesheet" href="/static/css/elements.css">
  17     <link rel="stylesheet" href="/static/css/item-preview.css">
  18     <link rel="stylesheet" href="/static/css/header.css">
  19     <link rel="stylesheet" href="/static/css/buttons.css">
  20     <link rel="stylesheet" href="/static/css/footer.css">
  21     <link rel="stylesheet" href="/static/css/index.css">
  22     <title>HFGE 3D engine, coding and free software | luflow.net</title>
  23 </head>
  24 <body>
  25     <div id="content">
  26
  27         <% include!("./partials/header.stpl"); %>
  28
  29         <main>
  30             <% include!("./partials/index_featured_content.stpl"); %>
  31
  32             <section class="discovery-box">
  33                 <h2>Screenshots</h2>
  34                 <p class="limit-width centered-block">A few early development screenshots of <a href="/<%= self.hfge_url %>" class="link-yellow">HFGE</a> in action.</p>
  35                 <div class="screenshots-box">
  36                     <%
  37                         for screenshot in &self.screenshots {
  38                     %>
  39                     <div class="screenshot-preview">
  40                         <a href="/<%= screenshot.url %>/">
  41                             <img class="responsive-image" src="/<%= screenshot.image_min %>" alt="" />
  42                             <span class="screenshot-inset-shadow"></span>
  43                         </a>
  44                         <p class="screenshot-preview-description"><%= screenshot.title %>
  45                             <span class="hidden">.</span>
  46                         </p>
  47                     </div>
  48                     <% } %>
  49                 </div>
  50             </section>
  51
  52             <section class="centered-text">
  53             <h2>Latest blog posts</h2>
  54             <%
  55                 for blog_post in &self.blog_posts {
  56             %>
  57             <a class="item-preview" href="/<%= self.blog_base_dir %>/<%= blog_post.url %>/">
  58                 <h3 lang="en"><%= blog_post.title %></h3>
  59                 <p class="item-date"><%= blog_post.published.to_string() %></p>
  60                 <p class="item-summary" lang="en"><%= blog_post.snippet %></p>
  61             </a>
  62             <% } %>
  63             <div class="action-box centered-text">
  64                 <a class="button-big" href="/<%= self.blog_base_dir %>/">ALL POSTS</a>
  65             </div>
  66             </section>
  67         </main>
  68
  69         <% include!("./partials/footer.stpl"); %>
  70
  71     </div>
  72
  73     <% include!("./partials/script_core.stpl"); %>
  74     <script>
  75         // make menu item active visually:
  76         let menuItem = document.getElementById("Home");
  77         if (menuItem)
  78         {
  79             menuItem.classList.add("menu-item-active");
  80         }
  81     </script>
  82
  83 </body>
  84 </html>
  85