{% block title %}{{ _("Welcome to IPFire") }}{% end block %}
{% block container %}
- <div class="main">
- <div class="container intro">
+ <section class="intro">
+ <div class="container d-flex align-items-center">
<div class="row flex-md-row-reverse">
- <div class="col-md-5 my-5 text-center">
+ <div class="col-12 col-md-5 my-5 text-center">
<img class="img-fluid" src="{{ static_url("img/ipfire-tux.png") }}" alt="IPFire Logo" />
</div>
- <div class="col-md-7 my-5 align-self-center px-3">
- <h1 class="display-1">The Open Source Firewall Distribution</h1>
+ <div class="col-12 col-md-7 align-self-center px-3">
+ <h1>{{ _("The Open Source Firewall") }}</h1>
- <div class="btn-toolbar">
- <a class="btn btn-outline-primary btn-glow-primary btn-lg mr-3" href="/download">{{ _("Download") }}</a>
- <a class="btn btn-outline-secondary btn-glow-secondary btn-lg ml-3" href="/features">{{ _("Features") }}</a>
+ <div class="btn-toolbar my-5">
+ <a class="btn btn-outline-primary btn-glow-primary btn-lg mr-2" href="/download">{{ _("Download") }}</a>
+ <a class="btn btn-outline-secondary btn-glow-secondary btn-lg ml-2" href="/features">{{ _("Features") }}</a>
</div>
</div>
</div>
</div>
+ </section>
+
+ <section class="inverse">
+ <div class="container">
+ <div class="row mb-5">
+ <div class="col col-md-6">
+ <h1 class="mb-0">{{ _("Secure up your network with IPFire") }}</h1>
+
+ <p>
+ IPFire comes with a versatile and state of the art firewall engine
+ that makes even the most complex setups easy to administer.
+ </p>
+ </div>
+ </div>
- <section class="inverse">
- <div class="container">
- <div class="row mb-5">
- <div class="col col-md-6">
- <h1 class="display-1 mb-0">{{ _("Secure up your network with IPFire") }}</h1>
+ <div class="row mt-5 mb-lg-6 mb-md-5">
+ <div class="col-md-6 col-lg-4 mb-5 pb-lg-5 d-flex">
+ <div class="align-self-stretch">
+ <span class="fas fa-shield-alt fa-2x text-primary px-3"></span>
+ </div>
+ <div class="flex-column">
+ <h5 class="pb-3">{{ _("Firewall") }}</h5>
<p>
- IPFire comes with a versatile and state of the art firewall engine
- that makes even the most complex setups easy to administer.
+ IPFire comes with a versatile and state of the art
+ firewall engine that makes even the most complex
+ setups easy to administer.
</p>
</div>
</div>
- <div class="row mt-5 mb-lg-6 mb-md-5">
- <div class="col-md-6 col-lg-4 mb-5 pb-lg-5 d-flex">
- <div class="align-self-stretch">
- <span class="fas fa-shield-alt fa-2x text-primary px-3"></span>
- </div>
-
- <div class="flex-column">
- <h5 class="pb-3">{{ _("Firewall") }}</h5>
- <p>
- IPFire comes with a versatile and state of the art
- firewall engine that makes even the most complex
- setups easy to administer.
- </p>
- </div>
+ <div class="col-md-6 col-lg-4 mb-5 d-flex">
+ <div class="align-self-stretch">
+ <span class="fas fa-fast-forward fa-2x text-primary px-3"></span>
</div>
-
- <div class="col-md-6 col-lg-4 mb-5 d-flex">
- <div class="align-self-stretch">
- <span class="fas fa-fast-forward fa-2x text-primary px-3"></span>
- </div>
-
- <div class="flex-column">
- <h5 class="pb-3">{{ _("Performance") }}</h5>
- <p>
- IPFire is ready for high performance networks
- and running evenly well on embedded hardware.
- </p>
- </div>
+
+ <div class="flex-column">
+ <h5 class="pb-3">{{ _("Performance") }}</h5>
+ <p>
+ IPFire is ready for high performance networks
+ and running evenly well on embedded hardware.
+ </p>
</div>
-
- <div class="col-md-6 col-lg-4 mb-5 d-flex">
- <div class="align-self-stretch">
- <span class="fas fa-couch fa-2x text-primary px-3"></span>
- </div>
-
- <div class="flex-column">
- <h5 class="pb-3">{{ _("Easy to use") }}</h5>
- <p class="mb-1">
- IPFire is set up easily in 15 to 20 minutes
- but also comes with expert features that
- are needed in professional networks.
- </p>
- </div>
+ </div>
+
+ <div class="col-md-6 col-lg-4 mb-5 d-flex">
+ <div class="align-self-stretch">
+ <span class="fas fa-couch fa-2x text-primary px-3"></span>
</div>
- <div class="col-md-6 col-lg-4 mb-5 d-flex">
- <div class="align-self-stretch">
- <span class="fas fa-lock fa-2x text-primary px-3"></span>
- </div>
-
- <div class="flex-column">
- <h5 class="pb-3">{{ _("Network Security") }}</h5>
- <p>
- IPFire is designed for high security.
- It is hardened to protect itself from attacks
- from the network.
- </p>
- </div>
+ <div class="flex-column">
+ <h5 class="pb-3">{{ _("Easy to use") }}</h5>
+ <p class="mb-1">
+ IPFire is set up easily in 15 to 20 minutes
+ but also comes with expert features that
+ are needed in professional networks.
+ </p>
</div>
-
- <div class="col-md-6 col-lg-4 mb-5 d-flex">
- <div class="align-self-stretch">
- <span class="fab fa-osi fa-2x text-primary px-3"></span>
- </div>
-
- <div class="flex-column">
- <h5 class="pb-3">{{ _("Open Source") }}</h5>
- <p>
- IPFire is free software and developed by an open community,
- that improves it every single day.
- </p>
- </div>
+ </div>
+
+ <div class="col-md-6 col-lg-4 mb-5 d-flex">
+ <div class="align-self-stretch">
+ <span class="fas fa-lock fa-2x text-primary px-3"></span>
</div>
-
- <div class="col-md-6 col-lg-4 mb-5 d-flex">
- <div class="align-self-stretch">
- <span class="fas fa-heart fa-2x text-primary px-3"></span>
- </div>
-
- <div class="flex-column">
- <h5 class="pb-3">{{ _("Trusted by thousands") }}</h5>
- <p>
- IPFire is developed in Europe and used all over the world
- <a href="https://fireinfo.ipfire.org/statistics/geo-locations">in hundreds of countries</a>
- by hundreds of thousands of users every day.
- </p>
- </div>
+
+ <div class="flex-column">
+ <h5 class="pb-3">{{ _("Network Security") }}</h5>
+ <p>
+ IPFire is designed for high security.
+ It is hardened to protect itself from attacks
+ from the network.
+ </p>
</div>
</div>
- </div>
- </section>
- <section>
- <div class="container">
- <div class="row">
- <div class="col-12 col-md-6 col-lg-5 mb-5">
- <h1>Latest Release</h1>
+ <div class="col-md-6 col-lg-4 mb-5 d-flex">
+ <div class="align-self-stretch">
+ <span class="fab fa-osi fa-2x text-primary px-3"></span>
+ </div>
- <p class="mb-0">
- <small>{{ locale.format_date(latest_release.date, shorter=True) }}</small>
+ <div class="flex-column">
+ <h5 class="pb-3">{{ _("Open Source") }}</h5>
+ <p>
+ IPFire is free software and developed by an open community,
+ that improves it every single day.
</p>
+ </div>
+ </div>
- <h3 class="mb-5">
- {% if latest_release.post %}
- <a href="https://blog.ipfire.org/post/{{ latest_release.post.slug }}">
- {{ _("%s has been released!") % latest_release.name }}
- </a>
- {% else %}
- {{ _("%s has been released!") % latest_release.name }}
- {% end %}
- </h3>
+ <div class="col-md-6 col-lg-4 mb-5 d-flex">
+ <div class="align-self-stretch">
+ <span class="fas fa-heart fa-2x text-primary px-3"></span>
+ </div>
- <div class="btn-toolbar mb-5">
- <a class="btn btn-primary mr-3" href="/download">
- <span class="fas fa-download"></span> {{ _("Download") }}
- </a>
+ <div class="flex-column">
+ <h5 class="pb-3">{{ _("Trusted by thousands") }}</h5>
+ <p>
+ IPFire is developed in Europe and used all over the world
+ <a href="https://fireinfo.ipfire.org/statistics/geo-locations">in hundreds of countries</a>
+ by hundreds of thousands of users every day.
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </section>
- <a class="btn btn-secondary ml-3" href="/donate">
- <span class="fas fa-heart"></span> {{ _("Donate") }}
+ <section>
+ <div class="container">
+ <div class="row">
+ <div class="col-12 col-md-6 col-lg-5 mb-5">
+ <h1>Latest Release</h1>
+
+ <p class="mb-0">
+ <small>{{ locale.format_date(latest_release.date, shorter=True) }}</small>
+ </p>
+
+ <h3 class="mb-5">
+ {% if latest_release.post %}
+ <a href="https://blog.ipfire.org/post/{{ latest_release.post.slug }}">
+ {{ _("%s has been released!") % latest_release.name }}
</a>
- </div>
- </div>
-
- <div class="col-12 col-md-6 col-lg-5 offset-lg-2">
- <h1>{{ _("What's going on?") }}</h1>
-
- <dl class="dl-horizontal">
- {% for post in posts %}
- <dt>
- <small>{{ locale.format_date(post.published_at, relative=True, shorter=True) }} </small>
- </dt>
-
- <dd class="text-overflow mb-4">
- <a href="https://blog.ipfire.org/post/{{ post.slug }}">{{ post.title }}</a>
- </dd>
- {% end %}
- </dl>
-
- <a class="btn btn-secondary" href="https://blog.ipfire.org/">{{ _("Read More") }}</a>
+ {% else %}
+ {{ _("%s has been released!") % latest_release.name }}
+ {% end %}
+ </h3>
+
+ <div class="btn-toolbar mb-5">
+ <a class="btn btn-primary mr-3" href="/download">
+ <span class="fas fa-download"></span> {{ _("Download") }}
+ </a>
+
+ <a class="btn btn-secondary ml-3" href="/donate">
+ <span class="fas fa-heart"></span> {{ _("Donate") }}
+ </a>
</div>
</div>
+
+ <div class="col-12 col-md-6 col-lg-5 offset-lg-2">
+ <h1>{{ _("What's going on?") }}</h1>
+
+ <dl class="dl-horizontal">
+ {% for post in posts %}
+ <dt>
+ <small>{{ locale.format_date(post.published_at, relative=True, shorter=True) }} </small>
+ </dt>
+
+ <dd class="text-overflow mb-4">
+ <a href="https://blog.ipfire.org/post/{{ post.slug }}">{{ post.title }}</a>
+ </dd>
+ {% end %}
+ </dl>
+
+ <a class="btn btn-secondary" href="https://blog.ipfire.org/">{{ _("Read More") }}</a>
+ </div>
</div>
- </section>
-
- <section class="inverse">
- <div class="container">
- <h1 class="text-center">{{ _("Professional Appliances & Services") }}</h1>
-
- <div class="row mb-lg-6 mb-md-4 pb-6 pb-lg-4">
- <div class="col-md-12 col-lg-7 mb-5 mb-md-6 mb-lg-0">
- <p class="lead">
- <a href="https://www.lightningwirelabs.com" target="_blank">Lightning Wire Labs</a> offer
- IPFire hardware appliances for enterprises, large businesses and SOHO.
- Deploying one of these on your network will provide you with the
- greatest reliability, stability and performance.
- </p>
- </div>
- <div class="col-sm-6 offset-sm-3 col-lg-4 offset-lg-1">
- <a class="btn btn-light btn-lg btn-block px-md-0 mb-4" href="https://www.lightningwirelabs.com/">{{ _("Get Professional Support") }}</a>
- <a class="btn btn-light btn-lg btn-block px-md-0" href="https://www.lightningwirelabs.com/products/ipfire/appliances">{{ _("Hardware Appliances") }}</a>
- </div>
+ </div>
+ </section>
+
+ <section class="inverse">
+ <div class="container">
+ <h1 class="text-center">{{ _("Professional Appliances & Services") }}</h1>
+
+ <div class="row mb-lg-6 mb-md-4 pb-6 pb-lg-4">
+ <div class="col-md-12 col-lg-7 mb-5 mb-md-6 mb-lg-0">
+ <p class="lead">
+ <a href="https://www.lightningwirelabs.com" target="_blank">Lightning Wire Labs</a> offer
+ IPFire hardware appliances for enterprises, large businesses and SOHO.
+ Deploying one of these on your network will provide you with the
+ greatest reliability, stability and performance.
+ </p>
</div>
- <div class="text-center">
- <picture>
- <source media="(max-width: 575px" srcset="{{ static_url("img/appliance-pro_xs.png") }}">
- <source media="(max-width: 767px" srcset="{{ static_url("img/appliance-pro_sm.png") }}">
- <source media="(max-width: 991px" srcset="{{ static_url("img/appliance-pro_md.png") }}">
- <source media="(min-width: 992px" srcset="{{ static_url("img/appliance-pro.png") }}">
- <img class="img-fluid" src="{{ static_url("img/appliance-pro.png") }}" alt="Appliance">
- </picture>
+ <div class="col-sm-6 offset-sm-3 col-lg-4 offset-lg-1">
+ <a class="btn btn-light btn-lg btn-block px-md-0 mb-4" href="https://www.lightningwirelabs.com/">{{ _("Get Professional Support") }}</a>
+ <a class="btn btn-light btn-lg btn-block px-md-0" href="https://www.lightningwirelabs.com/products/ipfire/appliances">{{ _("Hardware Appliances") }}</a>
</div>
</div>
- </section>
- </div>
+ <div class="text-center">
+ <picture>
+ <source media="(max-width: 575px" srcset="{{ static_url("img/appliance-pro_xs.png") }}">
+ <source media="(max-width: 767px" srcset="{{ static_url("img/appliance-pro_sm.png") }}">
+ <source media="(max-width: 991px" srcset="{{ static_url("img/appliance-pro_md.png") }}">
+ <source media="(min-width: 992px" srcset="{{ static_url("img/appliance-pro.png") }}">
+ <img class="img-fluid" src="{{ static_url("img/appliance-pro.png") }}" alt="Appliance">
+ </picture>
+ </div>
+ </div>
+ </section>
<script>
$(document).ready(function () {
$('.scroll').on('click', function(event) {