src/templates/blog/index.html

   1 {% extends "base.html" %}
   2
   3 {% block title %}{{ _("Welcome!") }}{% end block %}
   4
   5 {% block head %}
   6         <meta name="description" content="{{ _("The IPFire Blog has the latest news from the IPFire Project about Development, Current Affairs, and many more interesting things.") }}" />
   7 {% end %}
   8
   9 {% block container %}
  10         <section class="hero has-background-primary-light">
  11                 <div class="hero-body">
  12                         <div class="container">
  13                                 <nav class="breadcrumb is-medium" aria-label="breadcrumbs">
  14                                         <ul>
  15                                                 <li>
  16                                                         <a href="/">Home</a>
  17                                                 </li>
  18                                                 <li class="is-active">
  19                                                         <a href="#" aria-current="page">{{ _("Blog") }}</a>
  20                                                 </li>
  21                                         </ul>
  22                                 </nav>
  23
  24                                 <h1 class="title is-1">{{ _("IPFire Blog") }}</h1>
  25
  26                                 {% if q %}
  27                                         <h6 class="subtitle is-5">
  28                                                 {{ _("Search Results for '%s'") % q }}
  29                                         </h6>
  30                                 {% end %}
  31                         </div>
  32                 </div>
  33         </section>
  34
  35         <section class="section">
  36                 <div class="container">
  37                         <div class="columns">
  38                                 <div class="column is-8">
  39                                         {% if latest_post %}
  40                                                 <div class="notification is-primary">
  41                                                         <h4 class="title is-4">
  42                                                                 <a href="/blog/{{ latest_post.slug }}">
  43                                                                         Latest: {{ latest_post.title }}
  44                                                                 </a>
  45                                                         </h4>
  46
  47                                                         <div class="content">
  48                                                                 {{ latest_post.excerpt }}
  49                                                         </div>
  50
  51                                                         <p>
  52                                                                 <a href="/blog/{{ latest_post.slug }}">Read more</a>
  53                                                         </p>
  54                                                 </div>
  55                                         {% end %}
  56
  57                                         {% if q and not posts %}
  58                                                 <div class="notification">
  59                                                         {{ _("No Results Found For '%s'") % q }}
  60                                                 </div>
  61                                         {% end %}
  62
  63                                         {% module BlogList(posts, relative=True) %}
  64                                 </div>
  65
  66                                 <div class="column is-4">
  67                                         <div class="block">
  68                                                 <form method="GET" action="">
  69                                                         <div class="field">
  70                                                                 <div class="control has-icons-left">
  71                                                                         <input class="input is-medium" type="text"
  72                                                                                 name="q" {% if q %}value="{{ q }}"{% end %}
  73                                                                                 placeholder="{{ _("Search...") }}">
  74                                                                         <span class="icon is-small is-left">
  75                                                                                 <i class="fas fa-search"></i>
  76                                                                         </span>
  77                                                                 </div>
  78                                                         </div>
  79                                                 </form>
  80                                         </div>
  81
  82                                         <div class="block">
  83                                                 <div class="notification">
  84                                                         <h5 class="title is-5">Follow Us!</h5>
  85
  86                                                         <div class="level is-mobile">
  87                                                                 <div class="level-item">
  88                                                                         <a href="https://twitter.com/ipfire">
  89                                                                                 <i class="fa-brands fa-twitter"></i>
  90                                                                         </a>
  91                                                                 </div>
  92                                                                 <div class="level-item">
  93                                                                         <a href="https://social.ipfire.org">
  94                                                                                 <i class="fa-brands fa-mastodon"></i>
  95                                                                         </a>
  96                                                                 </div>
  97                                                                 <div class="level-item">
  98                                                                         <a href="https://linkedin.com/company/ipfire">
  99                                                                                 <i class="fa-brands fa-linkedin-in"></i>
 100                                                                         </a>
 101                                                                 </div>
 102                                                         </div>
 103                                                         <div class="level is-mobile">
 104                                                                 <div class="level-item">
 105                                                                         <a href="/feed.xml">
 106                                                                                 <i class="fas fa-rss fa-2x"></i>
 107                                                                         </a>
 108                                                                 </div>
 109                                                 </div>
 110                                         </div>
 111
 112                                         {% module BlogHistoryNavigation() %}
 113                                 </div>
 114                         </div>
 115                 </div>
 116         </section>
 117 {% end block %}