src/templates/index.html

   1 {% extends "base.html" %}
   2
   3 {% block head %}
   4         <link rel="alternate" type="application/rss+xml" title="RSS" href="https://blog.ipfire.org/feed.xml" />
   5 {% end block %}
   6
   7 {% block title %}{{ _("Welcome to IPFire") }}{% end block %}
   8
   9 {% block container %}
  10         <section class="intro d-flex align-items-center">
  11                 <div class="container">
  12                         <div class="row flex-md-row-reverse">
  13                                 <div class="col-12 col-md-5 my-5 text-center">
  14                                         <img class="img-fluid" src="{{ static_url("img/ipfire-tux.png") }}" alt="IPFire Logo" />
  15                                 </div>
  16
  17                                 <div class="col-12 col-md-7 align-self-center px-3">
  18                                         <h1>{{ _("The Open Source Firewall") }}</h1>
  19
  20                                         <div class="btn-toolbar my-5">
  21                                                 <a class="btn btn-outline-primary btn-glow-primary btn-lg mr-2" href="/download">{{ _("Download") }}</a>
  22                                                 <a class="btn btn-outline-secondary btn-glow-secondary btn-lg ml-2" href="/features">{{ _("Features") }}</a>
  23                                         </div>
  24                                 </div>
  25                         </div>
  26                 </div>
  27         </section>
  28
  29         <section class="inverse">
  30                 <div class="container">
  31                         <div class="row mb-5">
  32                                 <div class="col col-md-6">
  33                                         <h1 class="mb-0">{{ _("Secure up your network with IPFire") }}</h1>
  34
  35                                         <p>
  36                                                 IPFire comes with a versatile and state of the art firewall engine
  37                                                 that makes even the most complex setups easy to administer.
  38                                         </p>
  39                                 </div>
  40                         </div>
  41
  42                         <div class="row mt-5 mb-lg-6 mb-md-5">
  43                                 <div class="col-md-6 col-lg-4 mb-5 pb-lg-5 d-flex">
  44                                         <div class="align-self-stretch">
  45                                                 <span class="fas fa-shield-alt fa-2x text-primary px-3"></span>
  46                                         </div>
  47
  48                                         <div class="flex-column">
  49                                                 <h5 class="pb-3">{{ _("Firewall") }}</h5>
  50                                                 <p>
  51                                                         IPFire comes with a versatile and state of the art
  52                                                         firewall engine that makes even the most complex
  53                                                         setups easy to administer.
  54                                                 </p>
  55                                         </div>
  56                                 </div>
  57
  58                                 <div class="col-md-6 col-lg-4 mb-5 d-flex">
  59                                         <div class="align-self-stretch">
  60                                                 <span class="fas fa-fast-forward fa-2x text-primary px-3"></span>
  61                                         </div>
  62
  63                                         <div class="flex-column">
  64                                                 <h5 class="pb-3">{{ _("Performance") }}</h5>
  65                                                 <p>
  66                                                         IPFire is ready for high performance networks
  67                                                         and running evenly well on embedded hardware.
  68                                                 </p>
  69                                         </div>
  70                                 </div>
  71
  72                                 <div class="col-md-6 col-lg-4 mb-5 d-flex">
  73                                         <div class="align-self-stretch">
  74                                                 <span class="fas fa-couch fa-2x text-primary px-3"></span>
  75                                         </div>
  76
  77                                         <div class="flex-column">
  78                                                 <h5 class="pb-3">{{ _("Easy to use") }}</h5>
  79                                                 <p class="mb-1">
  80                                                         IPFire is set up easily in 15 to 20 minutes
  81                                                         but also comes with expert features that
  82                                                         are needed in professional networks.
  83                                                 </p>
  84                                         </div>
  85                                 </div>
  86
  87                                 <div class="col-md-6 col-lg-4 mb-5 d-flex">
  88                                         <div class="align-self-stretch">
  89                                                 <span class="fas fa-lock fa-2x text-primary px-3"></span>
  90                                         </div>
  91
  92                                         <div class="flex-column">
  93                                                 <h5 class="pb-3">{{ _("Network Security") }}</h5>
  94                                                 <p>
  95                                                         IPFire is designed for high security.
  96                                                         It is hardened to protect itself from attacks
  97                                                         from the network.
  98                                                 </p>
  99                                         </div>
 100                                 </div>
 101
 102                                 <div class="col-md-6 col-lg-4 mb-5 d-flex">
 103                                         <div class="align-self-stretch">
 104                                                 <span class="fab fa-osi fa-2x text-primary px-3"></span>
 105                                         </div>
 106
 107                                         <div class="flex-column">
 108                                                 <h5 class="pb-3">{{ _("Open Source") }}</h5>
 109                                                 <p>
 110                                                         IPFire is free software and developed by an open community,
 111                                                         that improves it every single day.
 112                                                 </p>
 113                                         </div>
 114                                 </div>
 115
 116                                 <div class="col-md-6 col-lg-4 mb-5 d-flex">
 117                                         <div class="align-self-stretch">
 118                                                 <span class="fas fa-heart fa-2x text-primary px-3"></span>
 119                                         </div>
 120
 121                                         <div class="flex-column">
 122                                                 <h5 class="pb-3">{{ _("Trusted by thousands") }}</h5>
 123                                                 <p>
 124                                                         IPFire is developed in Europe and used all over the world
 125                                                         <a href="https://fireinfo.ipfire.org/statistics/geo-locations">in hundreds of countries</a>
 126                                                         by hundreds of thousands of users every day.
 127                                                 </p>
 128                                         </div>
 129                                 </div>
 130                         </div>
 131                 </div>
 132         </section>
 133
 134         <section>
 135                 <div class="container">
 136                         <div class="row">
 137                                 <div class="col-12 col-md-6 col-lg-5 mb-5">
 138                                         <h1>Latest Release</h1>
 139
 140                                         <p class="mb-0">
 141                                                 <small>{{ locale.format_date(latest_release.date, shorter=True) }}</small>
 142                                         </p>
 143
 144                                         <h3 class="mb-5">
 145                                                 {% if latest_release.post %}
 146                                                         <a href="https://blog.ipfire.org/post/{{ latest_release.post.slug }}">
 147                                                                 {{ _("%s has been released!") % latest_release.name }}
 148                                                         </a>
 149                                                 {% else %}
 150                                                         {{ _("%s has been released!") % latest_release.name }}
 151                                                 {% end %}
 152                                         </h3>
 153
 154                                         <div class="btn-toolbar mb-5">
 155                                                 <a class="btn btn-primary mr-3" href="/download">
 156                                                         <span class="fas fa-download"></span> {{ _("Download") }}
 157                                                 </a>
 158
 159                                                 <a class="btn btn-secondary ml-3" href="/donate">
 160                                                         <span class="fas fa-heart"></span> {{ _("Donate") }}
 161                                                 </a>
 162                                         </div>
 163                                 </div>
 164
 165                                 <div class="col-12 col-md-6 col-lg-5 offset-lg-2">
 166                                         <h1>{{ _("What's going on?") }}</h1>
 167
 168                                         <dl class="dl-horizontal">
 169                                                 {% for post in posts %}
 170                                                         <dt>
 171                                                                 <small>{{ locale.format_date(post.published_at, relative=True, shorter=True) }} &nbsp;</small>
 172                                                         </dt>
 173
 174                                                         <dd class="text-overflow mb-4">
 175                                                                 <a href="https://blog.ipfire.org/post/{{ post.slug }}">{{ post.title }}</a>
 176                                                         </dd>
 177                                                 {% end %}
 178                                         </dl>
 179
 180                                         <a class="btn btn-secondary" href="https://blog.ipfire.org/">{{ _("Read More") }}</a>
 181                                 </div>
 182                         </div>
 183                 </div>
 184         </section>
 185 {% end block %}