{% extends "base.html" %}

{% block head %}
	<!-- HTML Meta Tags -->
	<meta name="description" content="IPFire is a hardened, versatile, state-of-the-art Open Source firewall based on Linux.">

	{% module OpenGraph(
		title=_("Welcome To IPFire! - More Than A Firewall"),
		description=_("The Open Source Linux-based Firewall Operating System with a Comprehensive Feature Set"),
	) %}

	<link rel="alternate" type="application/atom+xml" title="RSS" href="/blog/feed.xml" />
{% end block %}

{% block title %}{{ _("Welcome to IPFire") }}{% end block %}

{% block container %}
	{# Christmas Banner #}
	{% if now.month == 12 and now.day >= 10 %}
		<section class="hero is-small is-primary">
			<div class="hero-body">
				<div class="container">
					<p class="has-text-centered px-2 py-1">
						<i class="fas fa-gifts"></i>
						<i class="fa-solid fa-candy-cane"></i>
						<i class="fa-solid fa-sleigh"></i>

						This festive season, spread cheer and security!
						Support IPFire with a holiday donation for a safer online world.
						Merry Christmas!

						&nbsp;

						<a class="has-text-weight-bold" href="/donate">
							{{ _("Donate") }}
						</a>
					</p>
				</div>
			</div>
		</section>
	{% end %}

	{% if latest_release %}
		<section class="has-background-light">
			<div class="container">
				<p class="has-text-centered px-2 py-1">
					{{ _("Latest Release: %(release)s from %(when)s") \
						% { "release" : latest_release.name, "when" : locale.format_day(latest_release.date, dow=False) } }}

					{% if latest_release.blog %}
						&nbsp;

						<a class="has-text-weight-bold" href="/blog/{{ latest_release.blog.slug }}">
							{{ _("Read More") }}
						</a>
					{% end %}
				</p>
			</div>
		</section>
	{% end %}

	<section class="hero is-large is-primary" id="hero-index">
		<video autoplay muted loop playsinline poster="{{ static_url("videos/firewall.jpg") }}">
			{# AV1 for modern browsers that support it #}
			<source src="{{ static_url("videos/firewall@1920.av1.mp4") }}" type="video/mp4; codecs=av01.0.05M.08" />

			{# H.265/HEVC for modern browsers #}
			<source src="{{ static_url("videos/firewall@1920.h265.mp4") }}" type="video/mp4; codecs=hvc1" />

			{# H.264/AVC for people who have a hardware decoder for it #}
			<source src="{{ static_url("videos/firewall@1920.h264.mp4") }}" type="video/mp4; codecs=avc1.4D401E" />

			{# VP9 as compatibility option for anything else #}
			<source src="{{ static_url("videos/firewall@1920.vp9.mp4") }}" type="video/mp4; codecs=vp9" />

			<p>
				Blazing Fire by Oleg Gamulinskii (CC)
				https://www.pexels.com/video/blazing-fire-2715412/
			</p>
		</video>

		<div class="hero-body">
			<div class="container">
				<h1 class="title is-1">
					{{ _("IPFire") }}_ {{ _("More Than A Firewall") }}
				</h1>

				<h4 class="subtitle is-4">
					The Open Source Linux-based Firewall Operating System with a Comprehensive Feature Set
				</h4>
			</div>
		</div>
	</section>

	<section class="section">
		<div class="container">
			<h3 class="title is-2 has-text-centered">
				{{ _("IPFire") }}<span class="has-text-primary">_</span> &dash; {{ _("The Open Source Firewall") }}
			</h3>
		</div>
	</section>

	<section class="section">
		<div class="container">
			<div class="columns">
				<div class="column has-text-centered">
					<span class="fas fa-shield-alt fa-4x p-4"></span>

					<h4 class="title is-4">{{ _("Robust Network Security") }}</h4>

					<p class="is-size-5">
						IPFire offers a powerful and secure firewall solution designed
						to protect networks against evolving cyber threats.
					</p>
				</div>

				<div class="column has-text-centered">
					<span class="fas fa-terminal fa-4x p-4"></span>

					<h4 class="title is-4">{{ _("Tailored to Your Needs") }}</h4>

					<p class="is-size-5">
						Enjoy the flexibility of customizing IPFire to match your unique
						network requirements, ensuring a personalized and secure setup.
					</p>
				</div>

				<div class="column has-text-centered">
					<span class="fas fa-fire fa-4x p-4"></span>

					<h4 class="title is-4">{{ _("Community-Driven") }}</h4>

					<p class="is-size-5">
						Be part of a thriving community where users and developers collaborate,
						sharing insights and innovations to enhance IPFire.
					</p>
				</div>
			</div>

			<div class="columns is-centered">
				<div class="column is-two-thirds p-5">
					<a class="button is-primary is-medium is-fullwidth" href="/about">
						{{ _("Learn More About IPFire") }}
					</a>
				</div>
			</div>
		</div>
	</section>

	<section class="section">
		<div class="container">
			<h5 class="title is-5">{{ _("Looking For More?") }}</h5>

			<div class="columns is-vcentered">
				<div class="column">
					<div class="box">
						<h5 class="title is-5">{{ _("IPFire Location") }}</h5>

						<div class="content">
							<p>
								IPFire Location is a geolocation service that maps
								IP addresses to their geographical locations,
								autonomous systems, and more!
							</p>
						</div>

						<div class="buttons">
							<a class="button is-primary is-fullwidth" href="/location">
								{{ _("Check It Out") }}
							</a>
						</div>
					</div>
				</div>

				<div class="column is-half">
					<div class="box p-6 has-background-lwl has-text-white">
						<h3 class="title is-3 has-text-white">{{ _("Appliances and Support") }}</h3>

						<div class="content">
							<p>
								Experience next-level security with our high-performance
								appliances, crafted to optimize IPFire's capabilities.
								Whether you're fortifying a business infrastructure or
								safeguarding your home network, we have the right
								appliance solution tailored for you.
							</p>

							<p>
								We are your partners in ensuring continuous network security.
								Our support solutions keep your systems running smoothly,
								providing peace of mind in the ever-evolving landscape of
								security.
							</p>
						</div>

						<div class="block">
							<a class="button is-white has-text-lwl is-fullwidth has-text-weight-bold"
									href="https://store.lightningwirelabs.com/?utm_source={{ hostname }}&amp;utm_medium=frontpage">
								{{ _("Go to Store") }}
							</a>
						</div>

						<div class="block has-text-centered">
							<figure class="image is-128x128 is-inline-block">
								<img src="{{ static_url("img/lightningwirelabs-logo.svg") }}"
									alt="{{ _("Lightning Wire Labs") }}">
							</figure>
						</div>
					</div>
				</div>

				<div class="column">
					<div class="box">
						<h5 class="title is-5">{{ _("Donate Today") }}</h5>

						<div class="content">
							<p>
								IPFire is being sponsored by its users.
								Help us with your donation today!
							</p>
						</div>

						<div class="buttons">
							<a class="button is-primary is-fullwidth" href="/donate">
								<span class="icon-text">
									<span class="icon">
										<i class="fas fa-heart"></i>
									</span>
									<span>
										{{ _("Donate") }}
									</span>
								</span>
							</a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>
{% end block %}