mirror of
https://github.com/boostorg/website-v2.git
synced 2026-02-27 17:42:08 +00:00
101 lines
3.0 KiB
HTML
101 lines
3.0 KiB
HTML
{% load static %}
|
|
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<title>{% block title %}{% endblock %}</title>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="description" content="{% block description %}{% endblock %}">
|
|
<meta name="keywords" content="{% block keywords %}{% endblock %}">
|
|
<meta name="author" content="{% block author %}{% endblock %}">
|
|
<link href="{% static 'css/styles.css' %}" rel="stylesheet">
|
|
<!-- Google fonts for Cairo Medium and SemiBold -->
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css" />
|
|
<script defer src="https://unpkg.com/alpinejs@3.10.5/dist/cdn.min.js"></script>
|
|
{% block extra_head %}{% endblock %}
|
|
|
|
<style>
|
|
#lottie{
|
|
width:100%;
|
|
height:100%;
|
|
display:block;
|
|
overflow: hidden;
|
|
transform: translate3d(0,0,0);
|
|
text-align: center;
|
|
opacity: 1;
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
|
|
<body class="h-screen bg-black font-cairo">
|
|
<div class="container mx-auto">
|
|
{% include "includes/_header.html" %}
|
|
|
|
{% comment %}body block is for use in forums{% endcomment %}
|
|
{% block forum_body %}{% endblock %}
|
|
|
|
<div class="md:px-11">
|
|
{% block content_wrapper %}
|
|
{% block subnav %}{% endblock %}
|
|
{% block content %}{% endblock %}
|
|
{% endblock %}
|
|
</div>
|
|
|
|
{% include "includes/_footer.html" %}
|
|
</div>
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/bodymovin/5.7.4/lottie.min.js"></script>
|
|
|
|
{% block footer_js %}{% endblock %}
|
|
|
|
<script>
|
|
var params = {
|
|
container: document.getElementById('icon-container'),
|
|
path: '{% static "animations/4dots.json" %}',
|
|
renderer: 'svg',
|
|
loop: true,
|
|
autoplay: true,
|
|
name: "4 Dots",
|
|
};
|
|
|
|
var mobileParams = {
|
|
container: document.getElementById('icon-container-mobile'),
|
|
path: '{% static "animations/4dots.json" %}',
|
|
renderer: 'svg',
|
|
loop: true,
|
|
autoplay: true,
|
|
name: "4 Dots",
|
|
};
|
|
|
|
var scene1Params = {
|
|
container: document.getElementById('scene01'),
|
|
path: '{% static "animations/Scene01/data.json" %}',
|
|
renderer: 'svg',
|
|
loop: true,
|
|
autoplay: true,
|
|
name: "4 Dots",
|
|
};
|
|
|
|
var scene3Params = {
|
|
container: document.getElementById('scene03'),
|
|
path: '{% static "animations/Scene03/data.json" %}',
|
|
renderer: 'svg',
|
|
loop: true,
|
|
autoplay: true,
|
|
name: "4 Dots",
|
|
};
|
|
|
|
anim = lottie.loadAnimation(params);
|
|
mobileAnim = lottie.loadAnimation(mobileParams);
|
|
anim2 = lottie.loadAnimation(scene1Params);
|
|
anim3 = lottie.loadAnimation(scene3Params);
|
|
</script>
|
|
</body>
|
|
|
|
</html>
|