templates/screenshots.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, <%= self.title %>, Overview">
   8     <meta name="description" content="Overview of all available <%= self.title %>.">
   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/breadcrumbs.css">
  17     <link rel="stylesheet" href="/static/css/header.css">
  18     <link rel="stylesheet" href="/static/css/footer.css">
  19     <link rel="stylesheet" href="/static/css/index.css">
  20     <title>Overview of all available <%= self.title %> | luflow.net</title>
  21 </head>
  22 <body>
  23     <div id="content">
  24
  25         <% include!("./partials/header.stpl"); %>
  26
  27         <% include!("./partials/screenshots_breadcrumbs.stpl"); %>
  28
  29         <main>
  30             <section class="light-text centered-text noise-bg">
  31                 <div class="screenshots-box top-shadow-bg">
  32                     <%
  33                     if let Some(screenshots) = self.screenshots.get(&self.title) {
  34                         for screenshot in screenshots {
  35                     %>
  36                     <div class="screenshot-preview">
  37                         <a href="/<%= screenshot.url %>/">
  38                             <img class="responsive-image" src="/<%= screenshot.image_min %>" alt="" />
  39                             <span class="screenshot-inset-shadow"></span>
  40                         </a>
  41                         <p class="screenshot-preview-description"><%= screenshot.title %>
  42                             <span class="hidden">.</span>
  43                         </p>
  44                     </div>
  45                     <%
  46                         }
  47                     }
  48                     %>
  49                 </div>
  50             </section>
  51         </main>
  52
  53         <% include!("./partials/footer.stpl"); %>
  54
  55     </div>
  56
  57     <% include!("./partials/script_core.stpl"); %>
  58     <script>
  59         // make menu item active visually:
  60         let menuItem = document.getElementById("Screenshots");
  61         if (menuItem)
  62         {
  63             menuItem.classList.add("menu-item-active");
  64         }
  65     </script>
  66
  67 </body>
  68 </html>