]>
Commit | Line | Data |
---|---|---|
081800ca | 1 | {% extends "base.html" %} |
81675874 | 2 | |
60b0917c MT |
3 | {% block title %}{{ _("Welcome to IPFire") }}{% end block %} |
4 | ||
5 | {% block container %} | |
cc59f0e1 MT |
6 | <div class="main"> |
7 | <section class="intro"> | |
8 | <div class="container"> | |
9 | <div class="branding"> | |
10 | <h1 class="display-1">IP<strong>Fire</strong></h1> | |
11 | <h5>The Open Source Firewall Distribution</h5> | |
12 | </div> | |
13 | ||
14 | <div class="row justify-content-center"> | |
15 | <a class="btn btn-outline-primary btn-lg mr-3" href="/download">{{ _("Download") }}</a> | |
16 | <a class="btn btn-outline-dark btn-lg ml-3" href="/features">{{ _("Features") }}</a> | |
17 | </div> | |
1423222c | 18 | </div> |
b4bff93b | 19 | |
cc59f0e1 MT |
20 | <div class="page-scroll"> |
21 | <a href="#features" class="btn btn-outline-primary rounded-circle scroll"> | |
22 | <svg class="icon i_lg i_arrow_down"><use xlink:href="#arrow_down"/></svg> | |
23 | </a> | |
9b5ac075 | 24 | </div> |
cc59f0e1 | 25 | </section> |
b4bff93b | 26 | |
cc59f0e1 MT |
27 | <section id="features"> |
28 | <div class="container"> | |
29 | <h1 class="text-center">{{ _("Secure up your network with IPFire") }}</h1> | |
60b0917c | 30 | |
cc59f0e1 MT |
31 | <div class="row mb-lg-6 mb-md-5"> |
32 | <div class="col-md-6 col-lg-4 mb-6 pb-lg-5 d-flex"> | |
33 | <div class="feature_icons align-self-stretch"> | |
34 | <svg class="icon i_lg i_shield"><use xlink:href="#shield"/></svg> | |
35 | </div> | |
36 | <div class="flex-column"> | |
37 | <h5 class="pb-3">{{ _("Firewall") }}</h5> | |
38 | <p> | |
39 | IPFire comes with a versatile and state of the art | |
40 | firewall engine that makes even the most complex | |
41 | setups easy to administer. | |
42 | </p> | |
43 | </div> | |
20df8773 | 44 | </div> |
cc59f0e1 MT |
45 | |
46 | <div class="col-md-6 col-lg-4 mb-6 d-flex"> | |
47 | <div class="feature_icons align-self-stretch"> | |
48 | <svg class="icon i_lg i_speed"><use xlink:href="#speed"/></svg> | |
49 | </div> | |
50 | <div class="flex-column"> | |
51 | <h5 class="pb-3">{{ _("Performance") }}</h5> | |
52 | <p> | |
53 | IPFire is ready for high performance networks | |
54 | and running evenly well on embedded hardware. | |
55 | </p> | |
56 | </div> | |
20df8773 | 57 | </div> |
cc59f0e1 MT |
58 | |
59 | <div class="col-md-6 col-lg-4 mb-6 d-flex"> | |
60 | <div class="feature_icons align-self-stretch"> | |
61 | <svg class="icon i_lg i_couch"><use xlink:href="#couch"/></svg> | |
62 | </div> | |
63 | <div class="flex-column"> | |
64 | <h5 class="pb-3">{{ _("Easy to use") }}</h5> | |
65 | <p class="mb-1"> | |
66 | IPFire is set up easily in 15 to 20 minutes | |
67 | but also comes with expert features that | |
68 | are needed in professional networks. | |
69 | </p> | |
70 | </div> | |
e2d13261 | 71 | </div> |
82468973 | 72 | |
cc59f0e1 MT |
73 | <div class="col-md-6 col-lg-4 mb-6 d-flex"> |
74 | <div class="feature_icons align-self-stretch"> | |
75 | <svg class="icon i_lg i_security"><use xlink:href="#security"/></svg> | |
76 | </div> | |
77 | <div class="flex-column"> | |
78 | <h5 class="pb-3">{{ _("Network Security") }}</h5> | |
79 | <p> | |
80 | IPFire is designed for high security. | |
81 | It is hardened to protect itself from attacks | |
82 | from the network. | |
83 | </p> | |
84 | </div> | |
e2d13261 | 85 | </div> |
cc59f0e1 MT |
86 | |
87 | <div class="col-md-6 col-lg-4 mb-6 d-flex"> | |
88 | <div class="feature_icons align-self-stretch"> | |
89 | <svg class="icon i_lg i_github"><use xlink:href="#github"/></svg> | |
90 | </div> | |
91 | <div class="flex-column"> | |
92 | <h5 class="pb-3">{{ _("Open Source") }}</h5> | |
93 | <p> | |
94 | IPFire is free software and developed by an open community, | |
95 | that improves it every single day. | |
96 | </p> | |
97 | </div> | |
20df8773 | 98 | </div> |
cc59f0e1 MT |
99 | |
100 | <div class="col-md-6 col-lg-4 mb-6 d-flex"> | |
101 | <div class="feature_icons align-self-stretch"> | |
102 | <svg class="icon i_lg i_heart"><use xlink:href="#heart"/></svg> | |
103 | </div> | |
104 | <div class="flex-column"> | |
105 | <h5 class="pb-3">{{ _("Trusted by thousands") }}</h5> | |
106 | <p> | |
107 | IPFire is developed in Europe and used all over the world | |
108 | <a href="https://fireinfo.ipfire.org/statistics/geo-locations">in hundreds of countries</a> | |
109 | by hundreds of thousands of users every day. | |
110 | </p> | |
111 | </div> | |
e2d13261 | 112 | </div> |
4b4334da S |
113 | </div> |
114 | ||
cc59f0e1 MT |
115 | <div class="btn-toolbar justify-content-center pt-0 pt-md-4"> |
116 | <a class="btn btn-primary btn-lg mr-4 px-4 px-md-6" href="/get-started">{{ _("Get Started") }}</a> | |
117 | <a class="btn btn-secondary btn-lg px-4 px-md-6" href="/features">{{ _("Learn more") }}</a> | |
4b4334da S |
118 | </div> |
119 | </div> | |
cc59f0e1 | 120 | </section> |
0cd3fe98 | 121 | |
cc59f0e1 MT |
122 | <section id="news"> |
123 | <div class="container"> | |
124 | <div class="row"> | |
125 | <div class="col-12 col-md-6 col-lg-5 mb-5"> | |
126 | <h1>Latest Release</h1> | |
0cd3fe98 | 127 | |
cc59f0e1 MT |
128 | <p class="mb-0"> |
129 | <small>{{ locale.format_date(latest_release.date, shorter=True) }}</small> | |
130 | </p> | |
0cd3fe98 | 131 | |
cc59f0e1 | 132 | <h3 class="mb-5"> |
5baa3aef MT |
133 | {% if latest_release.post %} |
134 | <a href="https://blog.ipfire.org/post/{{ latest_release.post.slug }}"> | |
135 | {{ _("%s has been released!") % latest_release.name }} | |
136 | </a> | |
137 | {% else %} | |
cc59f0e1 | 138 | {{ _("%s has been released!") % latest_release.name }} |
5baa3aef | 139 | {% end %} |
cc59f0e1 | 140 | </h3> |
0cd3fe98 | 141 | |
cc59f0e1 MT |
142 | <div class="btn-toolbar mb-5"> |
143 | <a class="btn btn-primary mr-3" href="/download"> | |
144 | <svg class="icon i_sm i_download"><use xlink:href="#download"/></svg> | |
145 | {{ _("Download") }} | |
146 | </a> | |
e434c81f | 147 | |
cc59f0e1 MT |
148 | <a class="btn btn-secondary ml-3" href="/donate"> |
149 | <svg class="icon i_sm i_heart"><use xlink:href="#heart"/></svg> | |
150 | {{ _("Donate") }} | |
151 | </a> | |
152 | </div> | |
0cd3fe98 | 153 | |
cc59f0e1 MT |
154 | <p> |
155 | A complete history of IPFire releases is available at our <a href="/news">News</a> page. | |
156 | </p> | |
157 | </div> | |
20df8773 | 158 | |
cc59f0e1 MT |
159 | <div class="col-12 col-md-6 col-lg-5 offset-lg-2"> |
160 | <h1>What’s going on?</h1> | |
161 | ||
162 | <dl class="dl-horizontal"> | |
7d88783f | 163 | {% for post in posts %} |
cc59f0e1 | 164 | <dt> |
5baa3aef | 165 | <small>{{ locale.format_date(post.published_at, relative=True, shorter=True) }} </small> |
cc59f0e1 | 166 | </dt> |
7c0605e8 | 167 | |
cc59f0e1 | 168 | <dd class="text-overflow mb-4"> |
7d88783f | 169 | <a href="https://blog.ipfire.org/post/{{ post.slug }}">{{ post.title }}</a> |
cc59f0e1 MT |
170 | </dd> |
171 | {% end %} | |
172 | </dl> | |
173 | ||
174 | <a class="btn btn-secondary" href="/news">{{ _("Read More") }}</a> | |
ac7f3ec6 | 175 | </div> |
20df8773 | 176 | </div> |
cc59f0e1 MT |
177 | </div> |
178 | </section> | |
e400e37d | 179 | |
cc59f0e1 MT |
180 | <section id="fireinfo"> |
181 | <div class="container"> | |
182 | <h1 class="text-center">Fire<strong>Info</strong> Statistics</h1> | |
183 | ||
184 | <div class="row mb-6 mb-md-5 pb-lg-5 mb-lg-6 justify-content-center"> | |
185 | <div class="col-6 col-md-3 mb-6 text-center"> | |
186 | <p class="mb-0 mb-sm-3 fireinfo_cat">Latest Release</p> | |
187 | <h6 class="pb-5 fireinfo">{{ latest_release.name }}</h6> | |
188 | <div class="r_circle circle mt-5"> | |
189 | <p class="fireinfo_per">{{ "%.0f%%" % (latest_release.penetration * 100) }}</p> | |
e400e37d MT |
190 | </div> |
191 | <script> | |
cc59f0e1 | 192 | $('.r_circle').circleProgress({ value: {{ latest_release.penetration }}, size: 128, thickness: 4, animation: false, startAngle: -Math.PI / 2, fill: { color: ["#1976d2"] } }); |
e400e37d MT |
193 | </script> |
194 | </div> | |
60b0917c | 195 | |
cc59f0e1 MT |
196 | {% if fireinfo_country %} |
197 | <div class="col-6 col-md-3 text-center"> | |
198 | <p class="mb-0 mb-sm-3 fireinfo_cat truncate"> | |
199 | {{ _("%.0f%% of all IPFire systems are running in") % (fireinfo_country.percentage * 100) }} | |
200 | </p> | |
201 | <h6 class="pb-5 fireinfo">{{ fireinfo_country.country.name }}</h6> | |
202 | <div class="v_circle circle mt-5"> | |
203 | <p class="fireinfo_per">{{ "%.0f%%" % (fireinfo_country.percentage * 100) }}</p> | |
204 | </div> | |
205 | <script> | |
206 | $('.v_circle').circleProgress({ value: {{ fireinfo_country.percentage }}, size: 128, thickness: 4, animation: false, startAngle: -Math.PI / 2, fill: { color: ["#ff8f00"] } }); | |
207 | </script> | |
208 | </div> | |
209 | {% end %} | |
4b4334da | 210 | </div> |
cc59f0e1 MT |
211 | |
212 | <div class="row justify-content-center"> | |
213 | <a class="btn btn-lg btn-primary" href="/stats">More Stats</a> | |
4b4334da S |
214 | </div> |
215 | </div> | |
cc59f0e1 MT |
216 | </section> |
217 | ||
218 | <section id="appliances"> | |
219 | <div class="container"> | |
220 | <h1 class="text-center">{{ _("Professional Appliances & Services") }}</h1> | |
221 | ||
222 | <div class="row mb-lg-6 mb-md-4 pb-6 pb-lg-4"> | |
223 | <div class="col-md-12 col-lg-7 mb-5 mb-md-6 mb-lg-0"> | |
224 | <p class="lead"> | |
225 | <a href="https://www.lightningwirelabs.com" target="_blank">Lightning Wire Labs</a> offer | |
226 | IPFire hardware appliances for enterprises, large businesses and SOHO. | |
227 | Deploying one of these on your network will provide you with the | |
228 | greatest reliability, stability and performance. | |
229 | </p> | |
230 | </div> | |
231 | <div class="col-sm-6 offset-sm-3 col-lg-4 offset-lg-1"> | |
232 | <a class="btn btn-dark btn-lg btn-block px-md-0 mb-4" href="/get-support#professional">{{ _("Get Professional Support") }}</a> | |
233 | <a class="btn btn-dark btn-lg btn-block px-md-0" href="/hardware">{{ _("Hardware Appliances") }}</a> | |
234 | </div> | |
235 | </div> | |
236 | <div class="text-center"> | |
237 | <picture> | |
238 | <source media="(max-width: 575px" srcset="{{ static_url("img/appliance-pro_xs.png") }}"> | |
239 | <source media="(max-width: 767px" srcset="{{ static_url("img/appliance-pro_sm.png") }}"> | |
240 | <source media="(max-width: 991px" srcset="{{ static_url("img/appliance-pro_md.png") }}"> | |
241 | <source media="(min-width: 992px" srcset="{{ static_url("img/appliance-pro.png") }}"> | |
242 | <img class="img-fluid" src="{{ static_url("img/appliance-pro.png") }}" alt="Appliance"> | |
243 | </picture> | |
244 | </div> | |
82468973 | 245 | </div> |
cc59f0e1 MT |
246 | </section> |
247 | </div> | |
f59b40f6 S |
248 | <script> |
249 | $(document).ready(function () { | |
250 | $('.scroll').on('click', function(event) { | |
251 | event.preventDefault(); | |
252 | $('html, body').stop().animate({ | |
253 | scrollTop: $('#features').offset().top -72 | |
254 | }, 1000); | |
255 | }); | |
256 | }); | |
257 | </script> | |
81675874 | 258 | {% end block %} |