downloads: Redesign file listing

[ipfire.org.git] / src / templates / download / release.html

{% extends "../base.html" %}

{% block title %}{{ release }}{% end block %}

{% block container %}
	<div class="header">
		<div class="container">
			<h1>{{ _("Download") }}</h1>

			<p class="text-muted">
				IPFire is free to download for everyone... XXX
			</p>
		</div>
	</div>

	<div class="container">
		<section>
			<h2>{{ release }}</h2>

			<p class="text-muted">
				{{ _("Released %s") % locale.format_date(release.published, relative=True, shorter=True) }}

				{% if release.blog %}
					&bull;
					<a href="/blog/{{ release.blog.slug }}">{{ _("Release Notes") }}</a>
				{% end %}
			</p>

			<div class="card-deck">
				{% for arch in release.arches %}
					<div class="card">
						<div class="card-body">
							<h6 class="card-title mb-0">
								{{ arch }}

								{% if arch in release.experimental_arches %}
									<span class="badge badge-success">{{ _("Experimental") }}</span>
								{% elif arch in release.secondary_arches %}
									<span class="badge badge-warning">{{ _("Legacy") }}</span>
								{% end %}
							</h6>
						</div>

						<div class="list-group list-group-flush">
							{% for file in release.get_files_by_arch(arch) %}
								<a class="list-group-item list-group-item-action
										d-flex justify-content-between align-items-center download-splash" href="{{ file.url }}">
									<span>
										<i class="fas fa-download text-primary"></i> {{ _(file.desc) }}
									</span>

									<span class="text-muted small">
										{{ format_size(file.size) }}
									</span>
								</a>
							{% end %}
						</div>
					</div>
				{% end %}
			</div>
		</section>
	</div>

	<section class="inverse">
		<div class="container">
			<div class="row flex-md-row-reverse">
				<div class="col-12 col-md-4 text-center text-md-right">
					<span class="fas fa-cloud fa-10x my-5"></span>
				</div>

				<div class="col-12 col-md-8">
					<h1>{{ _("Running IPFire in the Cloud?") }}</h1>

					<p>
						{{ _("IPFire is now available in the Amazon Cloud.") }}
						{{ _("Create flexible firewall rules and use our Intrusion Detection System to protect your servers in the Cloud.") }}
						{{ _("Connect to them securely using our VPN technologies.") }}
					</p>

					<a class="btn btn-lwl" href="https://aws.amazon.com/marketplace/pp/B07HYRD4FX">
						{{ _("Go to Amazon Web Services") }} <span class="fas fa-external-link-alt ml-2"></span>
					</a>
				</div>
			</div>
		</div>
	</section>

	<div class="container">
		<section>
			<p>
				{{ _("All downloads will be served from one of our mirror servers that are sponsored by various organisations from all around the world to help us make IPFire available for everyone") }}
			</p>

			<a class="btn btn-light btn-block" href="/download/mirrors">
				{{ _("Browse Mirrors") }}
			</a>
		</section>
	</div>
{% end block %}

{% block javascript %}
	<script type="text/javascript">
		$("a.download-splash").click(function(e) {
			e.preventDefault();

			window.location = "/download/thank-you?file=" + this.href;
		});
	</script>
{% end %}