forked from ORGANISATION-KA-INTERNATIONALE/FEDIVERSE-OKI
feat: improve donate page and rename it
This commit is contained in:
@@ -315,6 +315,151 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Plateformes de don externes */
|
||||||
|
.donation-platforms {
|
||||||
|
background: var(--card-bg);
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 30px;
|
||||||
|
box-shadow: var(--card-shadow);
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.donation-platforms h3 {
|
||||||
|
color: var(--primary-red);
|
||||||
|
margin-bottom: 24px;
|
||||||
|
font-size: 1.5rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.platforms-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.platform-btn {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 16px;
|
||||||
|
padding: 20px;
|
||||||
|
background: var(--card-bg);
|
||||||
|
border: 2px solid var(--border-color);
|
||||||
|
border-radius: 12px;
|
||||||
|
text-decoration: none;
|
||||||
|
color: var(--text-color);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.platform-btn:hover {
|
||||||
|
transform: translateY(-4px);
|
||||||
|
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
|
.platform-btn.liberapay {
|
||||||
|
border-color: #f6c915;
|
||||||
|
}
|
||||||
|
|
||||||
|
.platform-btn.liberapay:hover {
|
||||||
|
background: rgba(246, 201, 21, 0.1);
|
||||||
|
border-color: #f6c915;
|
||||||
|
}
|
||||||
|
|
||||||
|
.platform-btn.kofi {
|
||||||
|
border-color: #13C3FF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.platform-btn.kofi:hover {
|
||||||
|
background: rgba(19, 195, 255, 0.1);
|
||||||
|
border-color: #13C3FF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.platform-icon {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
flex-shrink: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.platform-icon svg {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.platform-info {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.platform-name {
|
||||||
|
font-size: 1.2rem;
|
||||||
|
font-weight: bold;
|
||||||
|
color: var(--text-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.platform-desc {
|
||||||
|
font-size: 0.9rem;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Onglets don ponctuel / mensuel */
|
||||||
|
.donation-tabs {
|
||||||
|
display: flex;
|
||||||
|
gap: 8px;
|
||||||
|
margin-bottom: 24px;
|
||||||
|
background: var(--main-bg);
|
||||||
|
padding: 4px;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-btn {
|
||||||
|
flex: 1;
|
||||||
|
padding: 12px 16px;
|
||||||
|
background: transparent;
|
||||||
|
border: none;
|
||||||
|
border-radius: 6px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-btn:hover {
|
||||||
|
background: var(--hover-bg);
|
||||||
|
color: var(--text-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-btn.active {
|
||||||
|
background: var(--primary-red);
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-btn i {
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-content {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-content.active {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.donation-btn-custom {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
/* Dark theme adjustments */
|
/* Dark theme adjustments */
|
||||||
[data-theme="dark"] .donation-security {
|
[data-theme="dark"] .donation-security {
|
||||||
background: var(--card-bg);
|
background: var(--card-bg);
|
||||||
@@ -328,4 +473,19 @@
|
|||||||
|
|
||||||
[data-theme="dark"] .donation-btn:hover {
|
[data-theme="dark"] .donation-btn:hover {
|
||||||
background: rgba(255, 0, 0, 0.1);
|
background: rgba(255, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme="dark"] .platform-btn {
|
||||||
|
background: var(--main-bg);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Responsive pour les plateformes */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.platforms-grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.donation-tabs {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
+295
@@ -0,0 +1,295 @@
|
|||||||
|
<?php
|
||||||
|
/**
|
||||||
|
* Page de dons - Template d'exemple
|
||||||
|
* Support via LiberaPay, Ko-fi et Stripe
|
||||||
|
*
|
||||||
|
* Pour personnaliser cette page :
|
||||||
|
* 1. Copiez ce fichier vers dons.php
|
||||||
|
* 2. Activez les dons dans config.local.php :
|
||||||
|
* define('DONATIONS_ENABLED', true);
|
||||||
|
* 3. Configurez au moins une plateforme de don :
|
||||||
|
* - define('LIBERAPAY_URL', 'https://liberapay.com/votre-compte/donate');
|
||||||
|
* - define('KOFI_URL', 'https://ko-fi.com/votre-compte');
|
||||||
|
* - define('STRIPE_ENABLED', true); + configurez les liens STRIPE_ONE_TIME_LINKS et STRIPE_MONTHLY_LINKS
|
||||||
|
* 4. Personnalisez le contenu selon vos besoins
|
||||||
|
*/
|
||||||
|
|
||||||
|
require_once 'includes/config.php';
|
||||||
|
require_once 'includes/security.php';
|
||||||
|
|
||||||
|
// Vérifier si les dons sont activés
|
||||||
|
if (!defined('DONATIONS_ENABLED') || !DONATIONS_ENABLED) {
|
||||||
|
http_response_code(404);
|
||||||
|
include '404.php';
|
||||||
|
exit;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Vérifier qu'au moins une plateforme de don est configurée
|
||||||
|
$hasLiberaPay = !empty(LIBERAPAY_URL);
|
||||||
|
$hasKofi = !empty(KOFI_URL);
|
||||||
|
$hasStripe = defined('STRIPE_ENABLED') && STRIPE_ENABLED;
|
||||||
|
|
||||||
|
if (!$hasLiberaPay && !$hasKofi && !$hasStripe) {
|
||||||
|
http_response_code(500);
|
||||||
|
error_log('Aucune plateforme de don configurée');
|
||||||
|
include '500.php';
|
||||||
|
exit;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Définir les headers de sécurité
|
||||||
|
setSecurityHeaders();
|
||||||
|
|
||||||
|
// Configuration des montants et devise
|
||||||
|
$donationAmounts = defined('DONATION_AMOUNTS') ? DONATION_AMOUNTS : [1, 5, 10, 20, 50];
|
||||||
|
$currency = defined('DONATION_CURRENCY') ? DONATION_CURRENCY : 'EUR';
|
||||||
|
$currencySymbol = $currency === 'EUR' ? '€' : '$';
|
||||||
|
|
||||||
|
// Récupérer les liens Stripe s'ils sont configurés
|
||||||
|
$stripeOneTimeLinks = defined('STRIPE_ONE_TIME_LINKS') ? STRIPE_ONE_TIME_LINKS : [];
|
||||||
|
$stripeMonthlyLinks = defined('STRIPE_MONTHLY_LINKS') ? STRIPE_MONTHLY_LINKS : [];
|
||||||
|
|
||||||
|
?>
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta name="csrf-token" content="<?php echo generateCSRFToken(); ?>">
|
||||||
|
|
||||||
|
<!-- PERSONNALISEZ: Titre et description de votre page de dons -->
|
||||||
|
<title>Soutenir <?php echo ORGANIZATION_NAME; ?> - Dons</title>
|
||||||
|
<meta name="description" content="Soutenez <?php echo ORGANIZATION_NAME; ?> par un don. Chaque contribution compte pour maintenir notre plateforme indépendante.">
|
||||||
|
|
||||||
|
<!-- Styles -->
|
||||||
|
<link rel="stylesheet" href="css/styles.css?v=<?php echo filemtime('css/styles.css'); ?>">
|
||||||
|
<link rel="stylesheet" href="css/donations.css?v=<?php echo filemtime('css/donations.css'); ?>">
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" crossorigin="anonymous">
|
||||||
|
|
||||||
|
<!-- Favicons -->
|
||||||
|
<link rel="apple-touch-icon" sizes="180x180" href="img/apple-touch-icon.png">
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon-32x32.png">
|
||||||
|
<link rel="icon" type="image/png" sizes="16x16" href="img/favicon-16x16.png">
|
||||||
|
<link rel="manifest" href="site.webmanifest">
|
||||||
|
<link rel="icon" type="image/x-icon" href="img/favicon.ico">
|
||||||
|
<meta name="theme-color" content="#FF0000">
|
||||||
|
|
||||||
|
<!-- Open Graph Meta Tags -->
|
||||||
|
<meta property="og:title" content="Soutenir <?php echo ORGANIZATION_NAME; ?>">
|
||||||
|
<meta property="og:description" content="Soutenez <?php echo ORGANIZATION_NAME; ?> par un don et aidez-nous à maintenir notre plateforme indépendante.">
|
||||||
|
<meta property="og:image" content="<?php echo 'https://' . $_SERVER['HTTP_HOST'] . '/img/logo.png'; ?>">
|
||||||
|
<meta property="og:url" content="<?php echo 'https://' . $_SERVER['HTTP_HOST'] . '/dons.php'; ?>">
|
||||||
|
<meta property="og:type" content="website">
|
||||||
|
<meta property="og:site_name" content="<?php echo SITE_NAME; ?>">
|
||||||
|
|
||||||
|
<!-- Schema.org pour les dons -->
|
||||||
|
<script type="application/ld+json">
|
||||||
|
{
|
||||||
|
"@context": "https://schema.org",
|
||||||
|
"@type": "Organization",
|
||||||
|
"name": "<?php echo SITE_NAME; ?>",
|
||||||
|
"description": "<?php echo SITE_DESCRIPTION; ?>",
|
||||||
|
"url": "<?php echo 'https://' . $_SERVER['HTTP_HOST']; ?>",
|
||||||
|
"potentialAction": {
|
||||||
|
"@type": "DonateAction"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!-- Script pour éviter le flash en mode sombre -->
|
||||||
|
<script>
|
||||||
|
(function() {
|
||||||
|
const savedTheme = localStorage.getItem('theme');
|
||||||
|
const systemPrefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
|
||||||
|
const shouldUseDark = savedTheme === 'dark' || (!savedTheme && systemPrefersDark);
|
||||||
|
if (shouldUseDark) {
|
||||||
|
document.documentElement.setAttribute('data-theme', 'dark');
|
||||||
|
}
|
||||||
|
})();
|
||||||
|
</script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<?php include 'includes/sidebar.php'; ?>
|
||||||
|
|
||||||
|
<main class="main-content">
|
||||||
|
<?php include 'includes/header.php'; ?>
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
<!-- En-tête de la page - PERSONNALISEZ -->
|
||||||
|
<section class="donation-hero">
|
||||||
|
<div class="donation-hero-content">
|
||||||
|
<h1><i class="fas fa-heart"></i> Soutenir <?php echo ORGANIZATION_NAME; ?></h1>
|
||||||
|
<p class="hero-subtitle">Votre soutien est essentiel pour maintenir notre plateforme indépendante</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Section principale de don -->
|
||||||
|
<section class="donation-main">
|
||||||
|
<div class="donation-content">
|
||||||
|
<div class="donation-message">
|
||||||
|
<!-- PERSONNALISEZ: Votre message de don -->
|
||||||
|
<h2>Pourquoi nous soutenir ?</h2>
|
||||||
|
<p><?php echo SITE_NAME; ?> est une plateforme multimédia indépendante.
|
||||||
|
Vos dons nous permettent de :</p>
|
||||||
|
<ul>
|
||||||
|
<!-- PERSONNALISEZ: Vos objectifs -->
|
||||||
|
<li><i class="fas fa-server"></i> Maintenir nos serveurs et notre infrastructure</li>
|
||||||
|
<li><i class="fas fa-shield-alt"></i> Préserver notre indépendance et notre souveraineté numérique</li>
|
||||||
|
<li><i class="fas fa-tools"></i> Développer de nouvelles fonctionnalités</li>
|
||||||
|
<li><i class="fas fa-users"></i> Soutenir la création de contenu libre et accessible</li>
|
||||||
|
</ul>
|
||||||
|
<p><strong>Chaque don, même petit, fait la différence !</strong></p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Plateformes de don externes -->
|
||||||
|
<div class="donation-platforms">
|
||||||
|
<h3>Plateformes de don</h3>
|
||||||
|
<div class="platforms-grid">
|
||||||
|
<?php if ($hasLiberaPay): ?>
|
||||||
|
<a href="<?php echo htmlspecialchars(LIBERAPAY_URL); ?>"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
class="platform-btn liberapay">
|
||||||
|
<div class="platform-icon">
|
||||||
|
<svg viewBox="0 0 80 80" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g transform="translate(-78.37-208.06)" fill="#f6c915">
|
||||||
|
<path d="m104.28 271.1c-3.571 0-6.373-0.466-8.41-1.396-2.037-0.93-3.495-2.199-4.375-3.809-0.88-1.609-1.308-3.457-1.282-5.544 0.025-2.086 0.313-4.311 0.868-6.675l9.579-40.05 11.69-1.81-10.484 43.44c-0.202 0.905-0.314 1.735-0.339 2.489-0.026 0.754 0.113 1.421 0.415 1.999 0.302 0.579 0.817 1.044 1.546 1.395 0.729 0.352 1.742 0.527 3.036 0.527 2.037 0 3.957-0.299 5.762-0.896 1.805-0.598 3.469-1.457 4.993-2.578 1.524-1.121 2.906-2.504 4.149-4.149s2.37-3.545 3.393-5.697l8.07-33.69 11.52-1.81-8.608 35.95c-1.121 4.623-2.704 8.473-4.749 11.55-2.046 3.076-4.502 5.553-7.369 7.43-2.867 1.878-6.067 3.182-9.602 3.912-3.535 0.729-7.355 1.094-11.46 1.094m43.28-33.84c-0.754 0-1.371-0.604-1.371-1.371 0-0.754 0.617-1.371 1.371-1.371s1.371 0.617 1.371 1.371c0 0.767-0.617 1.371-1.371 1.371m-33.96-19.09c-3.846 0-7.027-0.402-9.543-1.207-2.516-0.805-4.493-1.958-5.933-3.458-1.44-1.5-2.479-3.282-3.118-5.346-0.639-2.063-0.959-4.408-0.959-7.036 0-4.092 0.678-7.933 2.035-11.52 1.357-3.588 3.268-6.705 5.733-9.35 2.465-2.646 5.446-4.718 8.943-6.217s7.384-2.249 11.68-2.249c3.571 0 6.689 0.377 9.355 1.132 2.666 0.754 4.881 1.81 6.645 3.169l-3.244 8.921c-1.739-1.106-3.645-1.984-5.718-2.635-2.073-0.652-4.339-0.977-6.797-0.977-2.921 0-5.557 0.603-7.908 1.81-2.352 1.206-4.368 2.851-6.049 4.937-1.681 2.086-2.977 4.549-3.887 7.389-0.91 2.841-1.366 5.87-1.366 9.089 0 3.47 0.704 6.121 2.111 7.954 1.408 1.833 3.72 2.749 6.936 2.749 1.561 0 3.118-0.201 4.674-0.603 1.556-0.402 3.031-0.977 4.424-1.725l2.073 8.582c-1.534 1.005-3.319 1.785-5.356 2.34-2.037 0.556-4.312 0.834-6.826 0.834"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div class="platform-info">
|
||||||
|
<span class="platform-name">LiberaPay</span>
|
||||||
|
<span class="platform-desc">Don récurrent ou ponctuel</span>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<?php if ($hasKofi): ?>
|
||||||
|
<a href="<?php echo htmlspecialchars(KOFI_URL); ?>"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
class="platform-btn kofi">
|
||||||
|
<div class="platform-icon">
|
||||||
|
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path fill="#13C3FF" d="M23.881 8.948c-.773-4.085-4.859-4.593-4.859-4.593H.723c-.604 0-.679.798-.679.798s-.082 7.324-.022 11.822c.164 2.424 2.586 2.672 2.586 2.672s8.267-.023 11.966-.049c2.438-.426 2.683-2.566 2.658-3.734 4.352.24 7.422-2.831 6.649-6.916zm-11.062 3.511c-1.246 1.453-4.011 3.976-4.011 3.976s-.121.119-.31.023c-.076-.057-.108-.09-.108-.09-.443-.441-3.368-3.049-4.034-3.954-.709-.965-1.041-2.7-.091-3.71.951-1.01 3.005-1.086 4.363.407 0 0 1.565-1.782 3.468-.963 1.904.82 1.832 3.011.723 4.311zm6.173.478c-.928.116-1.682.028-1.682.028V7.284h1.77s1.971.551 1.971 2.638c0 1.913-.985 2.667-2.059 3.015z"/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div class="platform-info">
|
||||||
|
<span class="platform-name">Ko-fi</span>
|
||||||
|
<span class="platform-desc">Offrez-nous un café</span>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<?php endif; ?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Interface de don Stripe -->
|
||||||
|
<?php if ($hasStripe): ?>
|
||||||
|
<div class="donation-interface">
|
||||||
|
<h3>Don via Stripe</h3>
|
||||||
|
|
||||||
|
<!-- Onglets don ponctuel / mensuel -->
|
||||||
|
<div class="donation-tabs">
|
||||||
|
<button class="tab-btn active" onclick="switchTab('onetime')">
|
||||||
|
<i class="fas fa-hand-holding-heart"></i> Don ponctuel
|
||||||
|
</button>
|
||||||
|
<button class="tab-btn" onclick="switchTab('monthly')">
|
||||||
|
<i class="fas fa-sync-alt"></i> Don mensuel
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Don ponctuel -->
|
||||||
|
<div id="onetime-tab" class="tab-content active">
|
||||||
|
<div class="donation-amounts">
|
||||||
|
<?php foreach ($donationAmounts as $amount): ?>
|
||||||
|
<?php if (isset($stripeOneTimeLinks[$amount]) && !empty($stripeOneTimeLinks[$amount])): ?>
|
||||||
|
<a href="<?php echo htmlspecialchars($stripeOneTimeLinks[$amount]); ?>"
|
||||||
|
class="donation-btn"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer">
|
||||||
|
<?php echo $amount . $currencySymbol; ?>
|
||||||
|
</a>
|
||||||
|
<?php endif; ?>
|
||||||
|
<?php endforeach; ?>
|
||||||
|
|
||||||
|
<?php if (isset($stripeOneTimeLinks['custom']) && !empty($stripeOneTimeLinks['custom'])): ?>
|
||||||
|
<a href="<?php echo htmlspecialchars($stripeOneTimeLinks['custom']); ?>"
|
||||||
|
class="donation-btn donation-btn-custom"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer">
|
||||||
|
<i class="fas fa-euro-sign"></i> Autre montant
|
||||||
|
</a>
|
||||||
|
<?php endif; ?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Don mensuel -->
|
||||||
|
<div id="monthly-tab" class="tab-content">
|
||||||
|
<div class="donation-amounts">
|
||||||
|
<?php foreach ($donationAmounts as $amount): ?>
|
||||||
|
<?php if (isset($stripeMonthlyLinks[$amount]) && !empty($stripeMonthlyLinks[$amount])): ?>
|
||||||
|
<a href="<?php echo htmlspecialchars($stripeMonthlyLinks[$amount]); ?>"
|
||||||
|
class="donation-btn"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer">
|
||||||
|
<?php echo $amount . $currencySymbol; ?>/mois
|
||||||
|
</a>
|
||||||
|
<?php endif; ?>
|
||||||
|
<?php endforeach; ?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="donation-security">
|
||||||
|
<p><i class="fas fa-shield-alt"></i>
|
||||||
|
Paiement 100% sécurisé via Stripe. Aucune donnée bancaire n'est stockée sur ce site.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<?php endif; ?>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Informations supplémentaires - PERSONNALISEZ -->
|
||||||
|
<section class="donation-info">
|
||||||
|
<div class="info-grid">
|
||||||
|
<div class="info-card">
|
||||||
|
<i class="fas fa-server"></i>
|
||||||
|
<h4>Hébergement & Infrastructure</h4>
|
||||||
|
<p>Maintenir nos serveurs, notre plateforme et nos outils numériques représente des coûts mensuels importants.</p>
|
||||||
|
</div>
|
||||||
|
<div class="info-card">
|
||||||
|
<i class="fas fa-tools"></i>
|
||||||
|
<h4>Maintenance & Développement</h4>
|
||||||
|
<p>Assurer la sécurité, les mises à jour et l'évolution de nos outils technologiques demande un investissement constant.</p>
|
||||||
|
</div>
|
||||||
|
<div class="info-card">
|
||||||
|
<i class="fas fa-shield-alt"></i>
|
||||||
|
<h4>Indépendance Numérique</h4>
|
||||||
|
<p>Vos dons nous permettent de rester indépendants des plateformes commerciales et de préserver notre souveraineté numérique.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<?php include 'includes/footer.php'; ?>
|
||||||
|
<?php include 'includes/mobile-menu.php'; ?>
|
||||||
|
|
||||||
|
<!-- Script pour les onglets -->
|
||||||
|
<script>
|
||||||
|
function switchTab(tab) {
|
||||||
|
// Cacher tous les contenus et désactiver tous les boutons
|
||||||
|
document.querySelectorAll('.tab-content').forEach(content => {
|
||||||
|
content.classList.remove('active');
|
||||||
|
});
|
||||||
|
document.querySelectorAll('.tab-btn').forEach(btn => {
|
||||||
|
btn.classList.remove('active');
|
||||||
|
});
|
||||||
|
|
||||||
|
// Afficher le contenu sélectionné et activer le bouton
|
||||||
|
document.getElementById(tab + '-tab').classList.add('active');
|
||||||
|
event.target.classList.add('active');
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script src="js/main.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
-235
@@ -1,235 +0,0 @@
|
|||||||
<?php
|
|
||||||
/**
|
|
||||||
* Page de dons - Template d'exemple
|
|
||||||
*
|
|
||||||
* Pour personnaliser cette page :
|
|
||||||
* 1. Copiez ce fichier vers dons.php
|
|
||||||
* 2. Activez les dons dans config.local.php :
|
|
||||||
* define('DONATIONS_ENABLED', true);
|
|
||||||
* define('PAYPAL_ME_URL', 'https://www.paypal.com/paypalme/votre-compte');
|
|
||||||
* 3. Personnalisez le contenu selon vos besoins
|
|
||||||
*/
|
|
||||||
|
|
||||||
require_once 'includes/config.php';
|
|
||||||
require_once 'includes/security.php';
|
|
||||||
|
|
||||||
// Vérifier si les dons sont activés
|
|
||||||
if (!defined('DONATIONS_ENABLED') || !DONATIONS_ENABLED || empty(PAYPAL_ME_URL)) {
|
|
||||||
http_response_code(404);
|
|
||||||
include '404.php';
|
|
||||||
exit;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Définir les headers de sécurité
|
|
||||||
setSecurityHeaders();
|
|
||||||
|
|
||||||
// Validation et nettoyage de l'URL PayPal
|
|
||||||
$paypalUrl = filter_var(PAYPAL_ME_URL, FILTER_VALIDATE_URL);
|
|
||||||
if (!$paypalUrl || !str_contains($paypalUrl, 'paypal.com/paypalme/')) {
|
|
||||||
http_response_code(500);
|
|
||||||
error_log('Configuration PayPal invalide: ' . PAYPAL_ME_URL);
|
|
||||||
include '500.php';
|
|
||||||
exit;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Configuration des montants et devise
|
|
||||||
$donationAmounts = defined('DONATION_AMOUNTS') ? DONATION_AMOUNTS : [5, 10, 20, 50];
|
|
||||||
$currency = defined('DONATION_CURRENCY') ? DONATION_CURRENCY : 'EUR';
|
|
||||||
$currencySymbol = $currency === 'EUR' ? '€' : '$';
|
|
||||||
|
|
||||||
?>
|
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="fr">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
|
|
||||||
<!-- PERSONNALISEZ: Titre et description de votre page de dons -->
|
|
||||||
<title>Soutenir [VOTRE ORGANISATION] - Dons</title>
|
|
||||||
<meta name="description" content="Soutenez [VOTRE ORGANISATION] par un don. Chaque contribution compte pour [VOTRE CAUSE].">
|
|
||||||
|
|
||||||
<!-- Styles -->
|
|
||||||
<link rel="stylesheet" href="css/styles.css?v=<?php echo filemtime('css/styles.css'); ?>">
|
|
||||||
<link rel="stylesheet" href="css/donations.css?v=<?php echo filemtime('css/donations.css'); ?>">
|
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" crossorigin="anonymous">
|
|
||||||
|
|
||||||
<!-- Favicons -->
|
|
||||||
<link rel="apple-touch-icon" sizes="180x180" href="img/apple-touch-icon.png">
|
|
||||||
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon-32x32.png">
|
|
||||||
<link rel="icon" type="image/png" sizes="16x16" href="img/favicon-16x16.png">
|
|
||||||
<link rel="manifest" href="manifest.json">
|
|
||||||
|
|
||||||
<!-- Schema.org pour les dons - PERSONNALISEZ -->
|
|
||||||
<script type="application/ld+json">
|
|
||||||
{
|
|
||||||
"@context": "https://schema.org",
|
|
||||||
"@type": "Organization",
|
|
||||||
"name": "[VOTRE ORGANISATION]",
|
|
||||||
"description": "[DESCRIPTION DE VOTRE ORGANISATION]",
|
|
||||||
"url": "<?php echo htmlspecialchars($_SERVER['HTTP_HOST']); ?>",
|
|
||||||
"potentialAction": {
|
|
||||||
"@type": "DonateAction",
|
|
||||||
"target": {
|
|
||||||
"@type": "EntryPoint",
|
|
||||||
"urlTemplate": "<?php echo htmlspecialchars($paypalUrl); ?>"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<?php include 'includes/header.php'; ?>
|
|
||||||
|
|
||||||
<!-- Sidebar gauche -->
|
|
||||||
<div class="sidebar-container">
|
|
||||||
<?php include 'includes/sidebar.php'; ?>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<main class="main-content">
|
|
||||||
<div class="container">
|
|
||||||
<!-- En-tête de la page - PERSONNALISEZ -->
|
|
||||||
<section class="donation-hero">
|
|
||||||
<div class="donation-hero-content">
|
|
||||||
<h1><i class="fas fa-heart"></i> Soutenir [VOTRE ORGANISATION]</h1>
|
|
||||||
<p class="hero-subtitle">Votre soutien est essentiel pour [VOTRE CAUSE]</p>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Section principale de don -->
|
|
||||||
<section class="donation-main">
|
|
||||||
<div class="donation-content">
|
|
||||||
<div class="donation-message">
|
|
||||||
<!-- PERSONNALISEZ: Votre message de don -->
|
|
||||||
<h2>Pourquoi nous soutenir ?</h2>
|
|
||||||
<p>[VOTRE ORGANISATION] est [DESCRIPTION].
|
|
||||||
Vos dons nous permettent de :</p>
|
|
||||||
<ul>
|
|
||||||
<!-- PERSONNALISEZ: Vos objectifs -->
|
|
||||||
<li><i class="fas fa-bullhorn"></i> [OBJECTIF 1]</li>
|
|
||||||
<li><i class="fas fa-users"></i> [OBJECTIF 2]</li>
|
|
||||||
<li><i class="fas fa-laptop"></i> [OBJECTIF 3]</li>
|
|
||||||
<li><i class="fas fa-book"></i> [OBJECTIF 4]</li>
|
|
||||||
</ul>
|
|
||||||
<p><strong>Chaque don, même petit, fait la différence !</strong></p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Interface de don -->
|
|
||||||
<div class="donation-interface">
|
|
||||||
<h3>Choisissez votre montant</h3>
|
|
||||||
|
|
||||||
<div class="donation-amounts">
|
|
||||||
<?php foreach ($donationAmounts as $amount): ?>
|
|
||||||
<button class="donation-btn"
|
|
||||||
data-amount="<?php echo $amount; ?>"
|
|
||||||
onclick="redirectToPayPal(<?php echo $amount; ?>)">
|
|
||||||
<?php echo $amount . $currencySymbol; ?>
|
|
||||||
</button>
|
|
||||||
<?php endforeach; ?>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="custom-amount">
|
|
||||||
<label for="custom-amount-input">Ou entrez un montant personnalisé :</label>
|
|
||||||
<div class="custom-amount-input">
|
|
||||||
<input type="number"
|
|
||||||
id="custom-amount-input"
|
|
||||||
min="1"
|
|
||||||
max="10000"
|
|
||||||
step="1"
|
|
||||||
placeholder="Montant">
|
|
||||||
<span class="currency"><?php echo htmlspecialchars($currencySymbol); ?></span>
|
|
||||||
<button onclick="redirectToPayPalCustom()" class="btn-custom-donate">
|
|
||||||
Donner
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="donation-security">
|
|
||||||
<p><i class="fas fa-shield-alt"></i>
|
|
||||||
Paiement sécurisé via PayPal. Aucune donnée bancaire n'est stockée sur ce site.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Informations supplémentaires - PERSONNALISEZ -->
|
|
||||||
<section class="donation-info">
|
|
||||||
<div class="info-grid">
|
|
||||||
<div class="info-card">
|
|
||||||
<i class="fas fa-server"></i>
|
|
||||||
<h4>Hébergement & Infrastructure</h4>
|
|
||||||
<p>Maintenir nos serveurs, notre plateforme et nos outils numériques, représente des coûts mensuels importants.</p>
|
|
||||||
</div>
|
|
||||||
<div class="info-card">
|
|
||||||
<i class="fas fa-tools"></i>
|
|
||||||
<h4>Maintenance & Développement</h4>
|
|
||||||
<p>Assurer la sécurité, les mises à jour et l'évolution de nos outils technologiques demande un investissement constant.</p>
|
|
||||||
</div>
|
|
||||||
<div class="info-card">
|
|
||||||
<i class="fas fa-shield-alt"></i>
|
|
||||||
<h4>Indépendance Numérique</h4>
|
|
||||||
<p>Vos dons nous permettent de rester indépendants des plateformes commerciales et de préserver notre souveraineté numérique.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
|
|
||||||
<?php include 'includes/footer.php'; ?>
|
|
||||||
|
|
||||||
<!-- Script de redirection PayPal -->
|
|
||||||
<script>
|
|
||||||
const PAYPAL_BASE_URL = <?php echo json_encode($paypalUrl, JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS | JSON_HEX_QUOT); ?>;
|
|
||||||
const CURRENCY = <?php echo json_encode($currency, JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS | JSON_HEX_QUOT); ?>;
|
|
||||||
|
|
||||||
function redirectToPayPal(amount) {
|
|
||||||
if (amount && amount > 0) {
|
|
||||||
// Construction de l'URL PayPal Me avec montant
|
|
||||||
const url = `${PAYPAL_BASE_URL}/${amount}${CURRENCY}`;
|
|
||||||
window.open(url, '_blank', 'noopener,noreferrer');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function redirectToPayPalCustom() {
|
|
||||||
const input = document.getElementById('custom-amount-input');
|
|
||||||
const amount = parseFloat(input.value);
|
|
||||||
|
|
||||||
if (!amount || amount <= 0) {
|
|
||||||
alert('Veuillez entrer un montant valide.');
|
|
||||||
input.focus();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (amount > 10000) {
|
|
||||||
alert('Le montant maximum est de 10000' + <?php echo json_encode($currencySymbol); ?> + '.');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
redirectToPayPal(amount);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Permettre la validation par Entrée
|
|
||||||
document.getElementById('custom-amount-input').addEventListener('keypress', function(e) {
|
|
||||||
if (e.key === 'Enter') {
|
|
||||||
redirectToPayPalCustom();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Highlight des boutons de montant
|
|
||||||
document.querySelectorAll('.donation-btn').forEach(btn => {
|
|
||||||
btn.addEventListener('click', function() {
|
|
||||||
// Retirer la classe active de tous les boutons
|
|
||||||
document.querySelectorAll('.donation-btn').forEach(b => b.classList.remove('active'));
|
|
||||||
// Ajouter la classe active au bouton cliqué
|
|
||||||
this.classList.add('active');
|
|
||||||
// Vider le champ personnalisé
|
|
||||||
document.getElementById('custom-amount-input').value = '';
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// Réinitialiser la sélection si on tape dans le champ personnalisé
|
|
||||||
document.getElementById('custom-amount-input').addEventListener('input', function() {
|
|
||||||
document.querySelectorAll('.donation-btn').forEach(b => b.classList.remove('active'));
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
Reference in New Issue
Block a user