{% extends "base-1.html" %}
-{% block title %}{{ _("Home") }}{% end block %}
+{% block title %}{{ _("Welcome to IPFire") }}{% end block %}
-{% block header %}
- <div class="jumbotron masthead">
+{% block container %}
+ <section class="intro">
<div class="container">
- <div class="row">
- <div class="col-lg-4 col-md-4">
- <img src="{{ static_url("images/tux/ipfire_tux_512x512.png") }}" alt="IPFire Logo" />
- </div>
-
- <div class="col-lg-8 col-md-8">
- <h1>IPFire</h1>
- <p class="lead">An Open Source Firewall Distribution</p>
-
- <p>
- <a class="btn btn-primary btn-lg" href="/download">{{ _("Download IPFire") }}</a>
- </p>
-
- <ul class="masthead-links">
- {% if latest_release %}
- <li>
- {{ _("Latest release") }}:<br>
- {{ latest_release.name }} ‐
- {{ locale.format_date(latest_release.date, relative=True, shorter=True) }}
- </li>
- {% end %}
- </ul>
- </div>
+ <div class="branding">
+ <h1 class="display-1">IP<strong>Fire</strong></h1>
+ <h2 class="display-4">The Open Source Firewall Distribution</h2>
+ </div>
+
+ <div class="row justify-content-center">
+ <a class="btn btn-outline-primary btn-lg" href="/download">{{ _("Download") }}</a>
+ <a class="btn btn-outline-secondary btn-lg" href="/features">{{ _("Features") }}</a>
</div>
</div>
- </div>
-{% end block %}
-
-{% block body %}
- <br>
-
- <div class="row">
- <div class="col-lg-6 col-md-6 objectives">
- {% if lang == "de" %}
- <p>
- <strong>IPFire</strong> ist eine gehärtete Linux-Appliance-Distribution
- mit primärem Einsatzzweck als Firewall.
- </p>
- <p>
- Mit IPFire kommt eine unternehmensfähige Absicherung des Netzwerks
- für Jedermann - vom Heimnetzwerk bis zum großen Unternehmen,
- Schulnetzwerken und Behörden.
- </p>
- <p>
- Besonderer Fokus liegt auf Sicherheit, Stabilität und einfache Benutzbarkeit.
- Das Nachinstallieren von zusätzlichen Funktionen geht mit nur einem Klick.
- </p>
- {% else %}
- <p>
- <strong>IPFire</strong> is a hardened Linux appliance distribution
- designed for use as a firewall.
- </p>
- <p>
- It offers corporate-level network protection for anyone who needs it,
- from home users all the way up to large corporations, school networks
- and authorities.
- </p>
- <p>
- IPFire focusses on security, stability and ease of use.
- A variety of add-ons can be installed with a single click, to
- add more features to the base system.
- </p>
- {% end %}
-
- <hr>
-
- <img class="icon pull-left" src="{{ static_url("images/icons/security.png") }}" alt="{{ _("Security") }}" />
- <h4>{{ _("Security") }}</h4>
-
- {% if lang == "de" %}
- <p>
- Das wichtigste: Sicherheitsupdates werden
- regelmäßig und zügig bereitgestellt.
- </p>
- {% else %}
- <p>
- As the most important issue: Security updates
- are deployed regularly and promptly.
- </p>
- {% end %}
-
- <hr>
-
- <img class="icon pull-left" src="{{ static_url("images/icons/flexibility.png") }}" alt="{{ _("Flexibility") }}" />
- <h4>{{ _("Flexibility") }}</h4>
-
- {% if lang == "de" %}
- <p>
- IPFire ist ein schlankes System, welches leicht durch
- zusätzliche Funktionen erweitert werden kann.
- </p>
- {% else %}
- <p>
- IPFire is a very small system and can be easily
- customized with additional functions.
- </p>
- {% end %}
-
- <hr>
-
- <img class="icon pull-left" src="{{ static_url("images/icons/community.png") }}" alt="{{ _("Community") }}" />
- <h4>{{ _("Open Source") }}</h4>
-
- {% if lang == "de" %}
- <p>
- IPFire ist freie Software, welche von einer offenen
- Community tagtäglich verbessert wird.
- </p>
- {% else %}
- <p>
- IPFire is free software and developed by an open community,
- that improves it every single day.
- </p>
- {% end %}
-
- <hr>
-
- <p class="ac">
- <a href="/features">{{ _("Read more") }} »</a>
- </p>
-
+
+ <div id="scrollto" class="page-scroll">
+ <a href="#features" class="btn btn-outline-primary rounded-circle">
+ <svg class="icon i_lg i_arrow_down"><use xlink:href="#arrow_down"/></svg>
+ </a>
</div>
+ </section>
- <div class="col-lg-6 col-md-6">
- <div class="panel panel-default">
- <div class="panel-body">
- <h3>
- <a href="/news">{{ _("What's new?") }}</a>
- <a class="pull-right" href="http://www.ipfire.org/news.rss"><small>[RSS]</small></a>
- </h3>
-
- <table class="news-entries">
- {% for item in latest_news %}
- <tr>
- <td class="date">
- {{ locale.format_date(item.published, relative=True, shorter=True) }} ‐
- </td>
- <td class="link">
- <a href="/news/{{ item.slug }}">{{ item.title }}</a>
- </td>
- </tr>
- {% end %}
- </table>
-
- <hr>
-
- <h3>
- <a href="http://planet.ipfire.org">{{ _("IPFire Planet") }}</a>
- <a class="pull-right" href="http://planet.ipfire.org/rss"><small>[RSS]</small></a>
- </h3>
-
- <table class="news-entries">
- {% for item in planet_posts %}
- <tr>
- <td class="date">
- {{ locale.format_date(item.published, relative=True, shorter=True) }} ‐
- </td>
- <td class="link">
- <a href="http://planet.ipfire.org/post/{{ item.slug }}">{{ item.title }}</a>
- </td>
- </tr>
- {% end %}
- </table>
-
- {% if wishlist_items %}
- <hr>
-
- <h3>
- <a href="http://wishlist.ipfire.org">{{ _("IPFire Wishlist") }}</a>
- <small>{{ _("The IPFire Crowdfunding Platform") }}</small>
- </h3>
-
- <table class="table-wishlist-widget">
- {% for item in wishlist_items %}
- <tr>
- <td>
- {% if item.is_new() %}
- <span class="label label-success pull-right">{{ _("NEW") }}</span>
- {% elif item.remaining_days and item.remaining_days <= 10 %}
- <span class="pull-right">
- {{ _("one day left", "%(num)s days left", item.remaining_days) % { "num" : item.remaining_days } }}
- </span>
- {% else %}
- <span class="pull-right">
- {{ _("%d%% funded") % item.percentage }}
- </span>
- {% end %}
-
- <a href="http://wishlist.ipfire.org/wish/{{ item.slug }}" target="_blank">{{ item.title }}</a>
-
- <br class="separator-small">
-
- <div class="progress progress-small">
- <div class="progress-bar progress-{{ item.progressbar_colour }}" style="width: {{ "%.2f%%" % item.percentage_bar }};"></div>
- </div>
- </td>
- </tr>
+ <section id="features" class="content-section">
+ <div class="container">
+ <h3 class="display-2 text-center">{{ _("Secure up your network with IPFire") }}</h2>
+
+ <div class="row mb-lg-6 mb-md-5">
+ <div class="col-md-6 col-lg-4 mb-6 pb-lg-5 d-flex">
+ <div class="feature_icons align-self-stretch">
+ <svg class="icon i_lg i_shield"><use xlink:href="#shield"/></svg>
+ </div>
+ <div class="flex-column">
+ <h4 class="pb-3">{{ _("Firewall") }}</h4>
+ <p>
+ {% if lang == "de" %}
+ Die vielseitige und State-of-the-Art Firewall-Engine
+ in IPFire ist auch in komplexen Netzen übersichtlich
+ und leicht zu nutzen.
+ {% else %}
+ IPFire comes with a versatile and state of the art
+ firewall engine that makes even the most complex
+ setups easy to administer.
{% end %}
- </table>
- {% end %}
+ </p>
+ </div>
</div>
-
- <div class="panel-footer">
- <div class="pull-right">
- <a href="https://www.facebook.com/IPFire.org"><img src="{{ static_url("images/icons/social/facebook.png") }}" alt="Facebook"></a>
- <a href="https://twitter.com/ipfire"><img src="{{ static_url("images/icons/social/twitter.png") }}" alt="Twitter"></a>
+
+ <div class="col-md-6 col-lg-4 mb-6 d-flex">
+ <div class="feature_icons align-self-stretch">
+ <svg class="icon i_lg i_speed"><use xlink:href="#speed"/></svg>
</div>
-
- <a href="/donate"><strong>{{ _("Please support us with your donation!") }}</strong></a>
+ <div class="flex-column">
+ <h4 class="pb-3">{{ _("Performance") }}</h4>
+ <p>
+ {% if lang == "de" %}
+ Auch schnelle Netze und der Einsatz
+ auf eingebetteten Systemen sind kein Problem
+ für IPFire.
+ {% else %}
+ IPFire is ready for high performance networks
+ and running evenly well on embedded hardware.
+ {% end %}
+ </p>
+ </div>
</div>
- </div>
- </div>
- </div>
-
- <br class="separator">
-
- <div class="row">
- <div class="col-lg-offset-2 col-lg-8 col-md-8">
- <div class="panel panel-default">
- <div class="panel-body">
- <h3>
- {{ _("IPFire Hardware Appliances & Consulting") }} <small>{{ _("by Lightning Wire Labs") }}</small>
- </h3>
-
- <div class="row">
- <div class="col-lg-6 col-md-6">
+
+ <div class="col-md-6 col-lg-4 mb-6 d-flex">
+ <div class="feature_icons align-self-stretch">
+ <svg class="icon i_lg i_couch"><use xlink:href="#couch"/></svg>
+ </div>
+ <div class="flex-column">
+ <h4 class="pb-3">{{ _("Easy to use") }}</h4>
+ <p class="mb-1">
{% if lang == "de" %}
- <p>
- Lightning Wire Labs bietet mit IPFire vorinstallierte Hardware-Appliances an.
- Dazu bieten sie professionellen Service & Support durch qualifizierte Consultants.
- </p>
+ IPFire ist in 15 bis 20 Minuten installiert
+ und kommt mit vielen wichtigen Funktionen für
+ professionelle Netzwerke.
{% else %}
- <p>
- Lightning Wire Labs offers hardware appliances that come pre-installed
- with the latest version of IPFire.
- They also provide professional services & support through their certified consultants.
- </p>
+ IPFire is set up easily in 15 to 20 minutes
+ but also comes with expert features that
+ are needed in professional networks.
{% end %}
- </div>
+ </p>
+ </div>
+ </div>
- <div class="col-lg-6 col-md-6 ac">
- <a href="http://www.lightningwirelabs.com/products/ipfire/appliances" target="_blank">
- <img src="{{ static_url("images/LWL/appliance-eco.jpg") }}" alt="Appliance Eco">
- </a>
- </div>
+ <div class="col-md-6 col-lg-4 mb-6 d-flex">
+ <div class="feature_icons align-self-stretch">
+ <svg class="icon i_lg i_security"><use xlink:href="#security"/></svg>
+ </div>
+ <div class="flex-column">
+ <h4 class="pb-3">{{ _("Network Security") }}</h4>
+ <p>
+ {% if lang == "de" %}
+ Sicherheit hat höchste Priorität.
+ Das gehärtete System schützt sich selbst vor
+ Angriffen aus dem Netz.
+ {% else %}
+ IPFire is designed for high security.
+ It is hardened to protect itself from attacks
+ from the network.
+ {% end %}
+ </p>
+ </div>
+ </div>
+
+ <div class="col-md-6 col-lg-4 mb-6 d-flex">
+ <div class="feature_icons align-self-stretch">
+ <svg class="icon i_lg i_github"><use xlink:href="#github"/></svg>
+ </div>
+ <div class="flex-column">
+ <h4 class="pb-3">{{ _("Open Source") }}</h4>
+ <p>
+ {% if lang == "de" %}
+ IPFire ist freie Software, welche von einer offenen
+ Community tagtäglich verbessert wird.
+ {% else %}
+ IPFire is free software and developed by an open community,
+ that improves it every single day.
+ {% end %}
+ </p>
+ </div>
+ </div>
+
+ <div class="col-md-6 col-lg-4 mb-6 d-flex">
+ <div class="feature_icons align-self-stretch">
+ <svg class="icon i_lg i_heart"><use xlink:href="#heart"/></svg>
</div>
+ <div class="flex-column">
+ <h4 class="pb-3">{{ _("Trusted by thousands") }}</h4>
+ <p>
+ {% if lang == "de" %}
+ IPFire wird in Europa entwickelt,
+ <a href="http://fireinfo.ipfire.org/statistics/geo-locations">in vielen Ländern</a>
+ überall auf der Welt eingesetzt, und bietet
+ Internetzugang für hundertausende Nutzer jeden Tag.
+ {% else %}
+ IPFire is developed in Europe and used all over the world
+ <a href="http://fireinfo.ipfire.org/statistics/geo-locations">in hundreds of countries</a>
+ by hundreds of thousands of users every day.
+ {% end %}
+ </p>
+ </div>
+ </div>
+ </div>
+
+ <div class="row justify-content-center pt-0 pt-md-4">
+ <a class="btn btn-primary btn-lg px-4 px-md-6" href="/get-started">{{ _("Get Started") }}</a>
+ <a class="btn btn-white btn-lg px-4 px-md-6" href="/learn-more">{{ _("Learn more") }}</a>
+ </div>
+ </div>
+ </section>
- <div class="ac">
- <a href="http://www.lightningwirelabs.com/products/ipfire/appliances" target="_blank">
- <img src="{{ static_url("images/LWL/appliance-pro.jpg") }}" alt="Appliance Professional">
+ <section id="news" class="content-section">
+ <div class="container">
+ <div class="row">
+ <div class="col-12 col-md-6 col-lg-5 mb-6">
+ <h2 class="display-2 mb-6">Latest Release</h2>
+ <p class="mb-3"><small>{{ locale.format_date(latest_release.date, shorter=True) }}</small></p>
+ <h3 class="display-3 mb-5 pb-5"><a href="/news/{{ latest_release.news.slug }}">
+ {{ _("%s has been released!") % latest_release.name }}
+ </a>
+ </h3>
+ <div class="btn-toolbar mb-6">
+ <a class="btn btn-primary btn-md mr-3" href="/download">
+ <svg class="icon i_sm i_download"><use xlink:href="#download"/></svg>
+ {{ _("Download") }}
+ </a>
+ <a class="btn btn-white btn-md ml-3" href="/donate">
+ <svg class="icon i_sm i_heart"><use xlink:href="#heart"/></svg>
+ {{ _("Donate") }}
</a>
</div>
+
+ <p>A complete history of IPFire releases is available at our <a href="/news">News</a> page.</p>
</div>
- <div class="panel-footer ac">
- <a href="http://www.lightningwirelabs.com/" target="_blank">www.lightningwirelabs.com</a>
+
+ <div class="col-12 col-md-6 col-lg-5 offset-lg-2">
+ <h2 class="display-2 mb-6">What’s going on?</h2>
+ <dl class="dl-horizontal">
+ {% for type, item in latest_news %}
+ <dt>
+ <small>{{ locale.format_date(item.published, relative=True, shorter=True) }} </small>
+ </dt>
+ <dd class="text-overflow mb-4 pb-4">
+ {% if type == "news" %}
+ <a href="/news/{{ item.slug }}">
+ <strong>{{ item.title }}</strong>
+ </a>
+ {% elif type == "planet" %}
+ <a href="http://planet.ipfire.org/post/{{ item.slug }}">
+ {{ item.title }}
+ </a>
+ {% end %}
+ </dd>
+ {% end %}
+ </dl>
+
+ <a class="btn btn-white" href="/news">{{ _("Read More") }}</a>
+
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="wishlist" class="content-section">
+ <div class="container">
+
+ <h2 class="display-2 text-center text-white">IP<strong>Fire</strong>’s Wishlist</h2>
+
+ {% if hottest_wish %}
+ <div class="d-flex flex-row justify-content-between align-items-baseline">
+ <h3 class="text-white">{{ hottest_wish.title }}</h3>
+
+ {% if hottest_wish.is_new() %}
+ <span class="label label-success pull-right">{{ _("NEW") }}</span>
+ {% elif hottest_wish.remaining_days and hottest_wish.remaining_days <= 10 %}
+ <span>
+ {{ _("one day left", "%(num)s days left", hottest_wish.remaining_days) % { "num" : hottest_wish.remaining_days } }}
+ </span>
+ {% else %}
+ <span class="amber-800 hidden-xs-down">
+ {{ _("%d%% funded") % hottest_wish.percentage }}
+ </span>
+ {% end %}
+ </div>
+
+ <div class="progress progress-small mb-5">
+ <div class="progress-bar bg-progress" role="progressbar" aria-valuenow="{{ hottest_wish.percentage_bar }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ hottest_wish.percentage_bar }}%; height: .5rem;">
+ <span class="sr-only">{{ _("%.2f%% complete") % hottest_wish.percentage_bar }}</span>
+ </div>
+ </div>
+
+ <p class="text-white"><a style="color: white; text-decoration: underline;" href="http://wishlist.ipfire.org/wish/{{ hottest_wish.slug }}">Read more</a> about that wish.</p>
+
+ {% end %}
+
+ </div>
+ </section>
+
+ <section id="fireinfo" class="content-section">
+ <div class="container">
+ <h2 class="display-2 text-center">Fire<strong>Info</strong> Statistics</h2>
+
+ <div class="row mb-6 mb-md-5 pb-lg-5 mb-lg-6">
+ <div class="col-6 col-md-3 mb-6 text-center">
+ <p class="mb-0 mb-sm-3"><small>Latest Release</small></p>
+ <h4 class="pb-5">2.19 Core 109</h4>
+ <div class="r_circle circle mt-5">
+ <p class="lead">48%</p>
+ </div>
+ <script>
+ $('.r_circle').circleProgress({ value: 0.48, size: 128, thickness: 4, animation: false, startAngle: -Math.PI / 2, fill: { color: ["#1976d2"] } });
+ </script>
+ </div>
+
+ <div class="col-6 col-md-3 mb-6 text-center">
+ <p class="mb-0 mb-sm-3"><small>Favorite Kernel</small></p>
+ <h4 class="pb-5 truncate">3.14.79-ipfire-pae</h4>
+ <div class="f_circle circle mt-5">
+ <p class="lead">36%</p>
+ </div>
+ <script>
+ $('.f_circle').circleProgress({ value: 0.36, size: 128, thickness: 4, animation: false, startAngle: -Math.PI / 2, fill: { color: ["#00bcd4"] } });
+ </script>
</div>
+
+ <div class="col-6 col-md-3 text-center">
+ <p class="mb-0 mb-sm-3"><small>Favorite CPU</small></p>
+ <h4 class="pb-5">Intel</h4>
+ <div class="c_circle circle mt-5">
+ <p class="lead">71%</p>
+ </div>
+ <script>
+ $('.c_circle').circleProgress({ value: 0.71, size: 128, thickness: 4, animation: false, startAngle: -Math.PI / 2, fill: { color: ["#43a047"] } });
+ </script>
+ </div>
+
+ <div class="col-6 col-md-3 text-center">
+ <p class="mb-0 mb-sm-3 truncate"><small>Favorite Virtualisation</small></p>
+ <h4 class="pb-5">VMWare</h4>
+ <div class="v_circle circle mt-5">
+ <p class="lead">46%</p>
+ </div>
+ <script>
+ $('.v_circle').circleProgress({ value: 0.46, size: 128, thickness: 4, animation: false, startAngle: -Math.PI / 2, fill: { color: ["#ff8f00"] } });
+ </script>
+ </div>
+ </div>
+
+ <div class="row justify-content-center">
+ <a class="btn btn-lg btn-primary" href="/stats">More Stats</a>
+ </div>
+ </div>
+ </section>
+
+ <section id="appliances" class="content-section">
+ <div class="container">
+ <h2 class="display-2 text-center">{{ _("Professional Appliances & Services") }}</h2>
+
+ <div class="row mb-lg-6 mb-md-4 pb-6">
+ <div class="col-md-12 col-lg-7 mb-5 mb-md-6">
+ <p class="lead">
+ {% if lang == "de" %}
+ <a href="http://www.lightningwirelabs.com" target="_blank">Lightning Wire Labs</a> bietet
+ Hardware-Appliances für mittlere bis große Unternehmen und SOHO an.
+ Diese sorgen in jedem Netz für beste Zuverlässigkeit, Stabilität
+ und Performance.
+ {% else %}
+ <a href="http://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.
+ {% end %}
+ </p>
+ </div>
+ <div class="col-sm-6 offset-sm-3 col-lg-4 offset-lg-1 mt-sm-5">
+ <a class="btn btn-bluegrey900 btn-lg btn-block px-md-0" href="/get-support#professional">{{ _("Get Professional Support") }}</a>
+ <a class="btn btn-bluegrey900 btn-lg btn-block px-md-0" href="/hardware">{{ _("Hardware Appliances") }}</a>
+ </div>
+ </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>
- </div>
+ </section>
{% end block %}
projects / people / shoehn / ipfire.org.git / blobdiff