fundraising-banner.html
No OneTemporary
Actions

Size

6 KB

Subscribers

None

fundraising-banner.html
View Options

	{% comment %}
	Copyright (C) 2021 The Software Heritage developers
	See the AUTHORS file at the top-level directory of this distribution
	License: GNU Affero General Public License version 3, or any later version
	See top-level LICENSE file for more information
	{% endcomment %}

	<!DOCTYPE html>

	{% load static %}
	{% load render_bundle from webpack_loader %}

	<html class="swh-fundraising-banner" lang="en">
	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<title>Software Heritage fundraising banner</title>
	{% render_bundle 'vendors' %}
	<script>
	/*
	@licstart The following is the entire license notice for the JavaScript code in this page.

	Copyright (C) 2021 The Software Heritage developers

	This program is free software: you can redistribute it and/or modify
	it under the terms of the GNU Affero General Public License as
	published by the Free Software Foundation, either version 3 of the
	License, or (at your option) any later version.

	This program is distributed in the hope that it will be useful,
	but WITHOUT ANY WARRANTY; without even the implied warranty of
	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
	GNU Affero General Public License for more details.

	You should have received a copy of the GNU Affero General Public License
	along with this program. If not, see <https://www.gnu.org/licenses/>.

	@licend The above is the entire license notice for the JavaScript code in this page.
	*/
	</script>
	<style>
	.swh-fundraising-banner {
	overflow: hidden;
	}

	.swh-fundraising-banner .row {
	height: 60px;
	background-color: #fecd1b;
	color: #e20026;
	font-size: larger;
	}

	.swh-fundraising-banner img {
	height: 60px;
	position: absolute;
	left: 0;
	padding-left: 6rem;
	}

	.swh-fundraising-banner .d-xl-none {
	font-size: medium;
	}

	.swh-fundraising-banner p {
	margin-bottom: 0;
	}

	.swh-fundraising-banner .progress {
	height: 30px;
	}

	.swh-fundraising-banner .btn {
	color: #fecd1b;
	font-weight: bold;
	}

	.swh-fundraising-banner .d-xl-none .btn {
	font-size: medium;
	}

	.swh-fundraising-banner .progress small {
	color: black;
	padding-top: 15px;
	font-size: large;
	}
	</style>
	</head>
	<body>
	<div class="content">
	<div class="container-fluid">

	{% comment %} large screen layout {% endcomment %}
	<div class="row align-items-center justify-content-end d-none d-xl-flex">
	<img id="swh-fundraising-img" src="{% static 'img/swh-donor.png' %}">
	<div class="col-8 text-right align-middle pr-3">
	<a target="_blank" rel="noopener noreferrer" id="swh-fundraising-text" href="{{ donation_form_url }}">
	{% if lang == "en" %}
	Help Preserve Software Source Code for Future Generations
	{% elif lang == "fr" %}
	Vous pouvez aider à préserver le code source des logiciels pour les générations futures
	{% elif lang == "es" %}
	Ayude a preservar el código fuente del software para generaciones futuras
	{% endif %}
	</a>
	</div>
	<div class="col-2 text-right">
	{% if nb_donations != -1 %}
	{% if lang == "en" %}
	<div class="progress position-relative" title="{{ goal_percent }}% complete">
	{% elif lang == "fr" %}
	<div class="progress position-relative" title="{{ goal_percent }}% complété">
	{% elif lang == "es" %}
	<div class="progress position-relative" title="{{ goal_percent }}% terminado">
	{% endif %}
	<div class="progress-bar" role="progressbar" style="width: {{ goal_percent }}%;"
	aria-valuenow="{{ nb_donations }}" aria-valuemin="0" aria-valuemax="{{ donations_goal }}">
	</div>
	<small class="justify-content-center d-flex position-absolute w-100">
	{% if lang == "en" %}
	Goal: {{ donations_goal }} donations
	{% elif lang == "fr" %}
	Objectif: {{ donations_goal }} donations
	{% elif lang == "es" %}
	Objetivo: {{ donations_goal }} donaciones
	{% endif %}
	</small>
	</div>
	{% endif %}
	</div>
	<div class="col-2 text-left pl-3">
	<a target="_blank" rel="noopener noreferrer" id="swh-fundraising-text" class="btn btn-lg btn-primary" role="button"
	href="{{ donation_form_url }}">
	{% if lang == "en" %}
	Become a donor
	{% elif lang == "fr" %}
	Devenez donateur
	{% elif lang == "es" %}
	Conviértete en donante
	{% endif %}
	</a>
	</div>
	</div>

	{% comment %} small screen layout {% endcomment %}
	<div class="row align-items-center d-xl-none">
	<div class="col-6 text-right align-middle">
	<a target="_blank" rel="noopener noreferrer" href="{{ donation_form_url }}">
	{% if lang == "en" %}
	Help Preserve Software Source Code for Future Generations
	{% elif lang == "fr" %}
	Vous pouvez aider à préserver le code source des logiciels pour les générations futures
	{% elif lang == "es" %}
	Ayude a preservar el código fuente del software para generaciones futuras
	{% endif %}
	</a>
	</div>
	<div class="col-6 text-center">
	<a target="_blank" rel="noopener noreferrer" class="btn btn-lg btn-primary" role="button"
	href="{{ donation_form_url }}">
	{% if lang == "en" %}
	Become a donor
	{% elif lang == "fr" %}
	Devenez donateur
	{% elif lang == "es" %}
	Conviértete en donante
	{% endif %}
	</a>
	</div>
	</div>
	</div>
	</div>
	<script>
	function hideOrShowText() {
	var rect1 = jQuery('#swh-fundraising-img')[0].getBoundingClientRect();
	var rect2 = jQuery('#swh-fundraising-text')[0].getBoundingClientRect();
	var overlap = !(rect1.right < rect2.left \|\|
	rect1.left > rect2.right \|\|
	rect1.bottom < rect2.top \|\|
	rect1.top > rect2.bottom);
	jQuery('#swh-fundraising-text').css('visibility', overlap ? 'hidden' : 'visible');

	}
	jQuery(window).resize(hideOrShowText);
	hideOrShowText();
	</script>
	</body>
	</html>

File Metadata

Mime Type: text/html
Expires: Fri, Jul 4, 1:41 PM (4 d, 48 m ago)
Storage Engine: blob
Storage Format: Raw Data
Storage Handle: 3238491

fundraising-banner.htmlNo OneTemporaryActions

fundraising-banner.htmlView Options

File Metadata

Event Timeline

fundraising-banner.html
No OneTemporary
Actions

fundraising-banner.html
View Options