src/templates/index.html

   1 {% extends "base.html" %}
   2
   3 {% block head %}
   4         <meta name="description" content="{{ _("IPFire is a hardened, versatile, state-of-the-art Open Source firewall based on Linux.") }}" />
   5         <link rel="alternate" type="application/rss+xml" title="RSS" href="https://blog.ipfire.org/feed.xml" />
   6 {% end block %}
   7
   8 {% block title %}{{ _("Welcome to IPFire") }}{% end block %}
   9
  10 {% block container %}
  11         <header class="cover">
  12                 <div class="container d-flex h-100 align-items-center">
  13                         <div class="row flex-fill flex-md-row-reverse">
  14                                 <div class="col-12 col-md-5 my-5 text-center">
  15                                         <img class="img-fluid" src="{{ static_url("img/ipfire-tux.png") }}" alt="IPFire Logo" />
  16                                 </div>
  17
  18                                 <div class="col-12 col-md-7 align-self-center px-3">
  19                                         <h1>{{ _("The Open Source Firewall") }}</h1>
  20
  21                                         <div class="btn-toolbar my-5">
  22                                                 <a class="btn btn-outline-primary btn-glow-primary btn-lg mr-2" href="/download">{{ _("Download") }}</a>
  23                                                 <a class="btn btn-outline-secondary btn-glow-secondary btn-lg ml-2" href="/features">{{ _("Features") }}</a>
  24                                         </div>
  25                                 </div>
  26                         </div>
  27                 </div>
  28         </header>
  29
  30         <section class="inverse">
  31                 <div class="container">
  32                         <div class="row mb-5">
  33                                 <div class="col-12 col-md-9 col-lg-7">
  34                                         <h1 class="mb-0">{{ _("Secure your network with IPFire") }}</h1>
  35
  36                                         <p>
  37                                                 {{ _("IPFire is a hardened, versatile, state-of-the-art Open Source firewall based on Linux.") }}
  38                                                 {{ _("Its ease of use, high performance in any scenario and extensibility make it usable for everyone.") }}
  39                                         </p>
  40
  41                                         <a class="btn btn-secondary mb-5" href="/features">{{ _("Learn More") }}</a>
  42                                 </div>
  43                         </div>
  44
  45                         <div class="row mt-5">
  46                                 <div class="col-md-6 col-lg-4 mb-5 d-flex">
  47                                         <div class="align-self-stretch">
  48                                                 <span class="fas fa-shield-alt fa-2x text-primary px-3"></span>
  49                                         </div>
  50
  51                                         <div class="flex-column">
  52                                                 <h5 class="mb-3">{{ _("Security") }}</h5>
  53
  54                                                 <p>
  55                                                         {{ _("Security is the highest priority in IPFire.") }}
  56                                                         {{ _("It is hardened to protect itself from attacks from the Internet and prevents attacks on your network.") }}
  57                                                 </p>
  58                                         </div>
  59                                 </div>
  60
  61                                 <div class="col-md-6 col-lg-4 mb-5 d-flex">
  62                                         <div class="align-self-stretch">
  63                                                 <span class="fas fa-fire fa-2x text-primary px-3"></span>
  64                                         </div>
  65
  66                                         <div class="flex-column">
  67                                                 <h5 class="mb-3">{{ _("Firewall") }}</h5>
  68
  69                                                 <p>
  70                                                         {{ _("Its powerful firewall engine and Intrusion Prevention System protects your network against attacks from the Internet and Denial-of-Service attacks.") }}
  71                                                 </p>
  72                                         </div>
  73                                 </div>
  74
  75                                 <div class="col-md-6 col-lg-4 mb-5 d-flex">
  76                                         <div class="align-self-stretch">
  77                                                 <span class="fab fa-osi fa-2x text-primary px-3"></span>
  78                                         </div>
  79
  80                                         <div class="flex-column">
  81                                                 <h5 class="mb-3">{{ _("Open Source") }}</h5>
  82
  83                                                 <p>
  84                                                         {{ _("IPFire is free software and developed by an open community and trusted by hundreds of thousands of users from all around the world.") }}
  85                                                 </p>
  86                                         </div>
  87                                 </div>
  88                         </div>
  89                 </div>
  90         </section>
  91
  92         <section>
  93                 <div class="container">
  94                         <div class="row">
  95                                 <div class="col-12 col-md-6 col-lg-5 mb-5">
  96                                         <h1>{{ _("Latest Release") }}</h1>
  97
  98                                         <p class="mb-0">
  99                                                 <small>{{ locale.format_date(latest_release.date, shorter=True) }}</small>
 100                                         </p>
 101
 102                                         <h3 class="mb-5">
 103                                                 {% if latest_release.post %}
 104                                                         <a href="https://blog.ipfire.org/post/{{ latest_release.post.slug }}">
 105                                                                 {{ _("%s has been released!") % latest_release.name }}
 106                                                         </a>
 107                                                 {% else %}
 108                                                         {{ _("%s has been released!") % latest_release.name }}
 109                                                 {% end %}
 110                                         </h3>
 111
 112                                         <div class="row">
 113                                                 <div class="col-12 col-sm-6 col-md-12 col-xl-5 mb-3">
 114                                                         <a class="btn btn-primary btn-block" href="/download">
 115                                                                 <span class="fas fa-download"></span> {{ _("Download") }}
 116                                                         </a>
 117                                                 </div>
 118
 119                                                 <div class="col-12 col-sm-6 col-md-12 col-xl-5 mb-3">
 120                                                         <a class="btn btn-secondary btn-block" href="/donate">
 121                                                                 <span class="fas fa-heart"></span> {{ _("Donate") }}
 122                                                         </a>
 123                                                 </div>
 124                                         </div>
 125                                 </div>
 126
 127                                 <div class="col-12 col-md-6 col-lg-5 offset-lg-2">
 128                                         <h1>{{ _("What's going on?") }}</h1>
 129
 130                                         <dl class="dl-horizontal">
 131                                                 {% for post in posts %}
 132                                                         <dt>
 133                                                                 <small>{{ locale.format_date(post.published_at, relative=True, shorter=True) }} &nbsp;</small>
 134                                                         </dt>
 135
 136                                                         <dd class="text-overflow mb-4">
 137                                                                 <a href="https://blog.ipfire.org/post/{{ post.slug }}">{{ post.title }}</a>
 138                                                         </dd>
 139                                                 {% end %}
 140                                         </dl>
 141
 142                                         <a class="btn btn-secondary" href="https://blog.ipfire.org/">{{ _("Read More") }}</a>
 143                                 </div>
 144                         </div>
 145                 </div>
 146         </section>
 147 {% end block %}