first commit
This commit is contained in:
@@ -0,0 +1,7 @@
|
|||||||
|
node_modules/
|
||||||
|
_site/
|
||||||
|
.DS_Store
|
||||||
|
*.log
|
||||||
|
.env
|
||||||
|
.vscode/
|
||||||
|
.idea/
|
||||||
@@ -0,0 +1,89 @@
|
|||||||
|
# Changelog
|
||||||
|
|
||||||
|
## Version 2.0.0 - Migration vers 11ty (2025-11-05)
|
||||||
|
|
||||||
|
### Nouvelle architecture
|
||||||
|
- ✅ Migration complète de PHP vers 11ty (Eleventy)
|
||||||
|
- ✅ Structure modulaire avec templates Nunjucks
|
||||||
|
- ✅ Données centralisées en fichiers JSON
|
||||||
|
- ✅ Build statique optimisé
|
||||||
|
|
||||||
|
### Nouvelle charte graphique
|
||||||
|
- ✅ Charte basée sur les couleurs officielles du logo OKI
|
||||||
|
- ✅ Palette de couleurs :
|
||||||
|
- Or OKI (#E8A625) - couleur principale
|
||||||
|
- Vert OKI (#00A854) - services Fédiverse
|
||||||
|
- Rouge OKI (#ED1C4C) - accents
|
||||||
|
- Noir OKI (#000000) - arrière-plans
|
||||||
|
- ✅ Logo intégré dans la navigation
|
||||||
|
- ✅ Favicon ajouté
|
||||||
|
|
||||||
|
### Design & UX
|
||||||
|
- ✅ Fond noir élégant au lieu du bleu
|
||||||
|
- ✅ Accents or pour les titres et boutons
|
||||||
|
- ✅ Bordures et effets or pour cohérence visuelle
|
||||||
|
- ✅ Cartes de services avec bordures vertes
|
||||||
|
- ✅ Projets web avec accents rouges
|
||||||
|
- ✅ Footer avec bordure dorée
|
||||||
|
|
||||||
|
### Fonctionnalités conservées
|
||||||
|
- ✅ Toutes les sections de la V1
|
||||||
|
- ✅ Animations et effets interactifs
|
||||||
|
- ✅ Navigation responsive
|
||||||
|
- ✅ Easter egg Konami Code
|
||||||
|
- ✅ Support des dons (Stripe)
|
||||||
|
- ✅ Services d'hébergement
|
||||||
|
|
||||||
|
### Améliorations techniques
|
||||||
|
- ✅ Temps de build ultra-rapide (~60ms)
|
||||||
|
- ✅ Hot reload pour le développement
|
||||||
|
- ✅ SEO optimisé
|
||||||
|
- ✅ Performance améliorée
|
||||||
|
- ✅ Code maintenable et modulaire
|
||||||
|
- ✅ Licence libre AGPL-V3
|
||||||
|
|
||||||
|
### Fichiers principaux
|
||||||
|
- `eleventy.config.js` - Configuration 11ty
|
||||||
|
- `src/_data/` - Données du site (services, projets, valeurs, etc.)
|
||||||
|
- `src/_includes/layouts/` - Templates de mise en page
|
||||||
|
- `src/_includes/partials/` - Composants réutilisables
|
||||||
|
- `src/assets/` - CSS, JS, images
|
||||||
|
|
||||||
|
### Migration depuis V1
|
||||||
|
La V1 utilisait PHP et Bootstrap. La V2 utilise 11ty avec :
|
||||||
|
- CSS personnalisé (pas de framework)
|
||||||
|
- JavaScript Vanilla
|
||||||
|
- Structure de fichiers organisée
|
||||||
|
- Build statique déployable partout
|
||||||
|
|
||||||
|
### Services Fédiverse
|
||||||
|
- ✅ GADE (PeerTube) - Alternative libre à YouTube
|
||||||
|
- ✅ BOKANTAJ (Pleroma + Soapbox) - Alternative libre à X/Twitter
|
||||||
|
- ✅ MIZIK (Funkwhale) - Alternative libre à SoundCloud
|
||||||
|
- ✅ KUTE (Castopod) - Plateforme libre de podcasting
|
||||||
|
|
||||||
|
### Projets Web
|
||||||
|
- ✅ FEDIVERSE OKI - Portail d'accès à tous nos services Fédiverse
|
||||||
|
- ✅ OKI.RE - Transcriptions et traductions de productions musicales
|
||||||
|
- ✅ NUVEL.NU - Actualités multilingues de nos régions
|
||||||
|
- ✅ JWE.OVH - Jeu cartographique éducatif et ludique
|
||||||
|
- ✅ GONG.GP - Documents historiques du GONG
|
||||||
|
- ✅ Tous les projets sont cliquables avec liens directs
|
||||||
|
|
||||||
|
### Partenaires
|
||||||
|
- ✅ Joukawouvè - Créateur de contenu sur GADE
|
||||||
|
- ✅ Aktivist Vybz #AKV - Émission engagée sur GADE
|
||||||
|
- ✅ Section dédiée avec logos et descriptions
|
||||||
|
- ✅ Lien dans la navigation
|
||||||
|
- ✅ Appel à devenir partenaire
|
||||||
|
|
||||||
|
### Contenu juridique
|
||||||
|
- ✅ Page de mentions légales complète
|
||||||
|
- ✅ Conformité RGPD
|
||||||
|
- ✅ Licence AGPL-V3 intégrée
|
||||||
|
- ✅ Liens Stripe configurés (dons ponctuels et mensuels)
|
||||||
|
- ✅ Liens Liberapay et Ko-fi ajoutés
|
||||||
|
|
||||||
|
### TODO
|
||||||
|
- [ ] Ajouter plus d'images si nécessaire
|
||||||
|
- [ ] Configurer le déploiement automatique
|
||||||
+179
@@ -0,0 +1,179 @@
|
|||||||
|
# Guide de contribution
|
||||||
|
|
||||||
|
Merci de votre intérêt pour contribuer au site de l'Organisation Ka Internationale !
|
||||||
|
|
||||||
|
## Ajouter du contenu
|
||||||
|
|
||||||
|
### Ajouter un service Fédiverse
|
||||||
|
|
||||||
|
Éditez `src/_data/services.json` :
|
||||||
|
|
||||||
|
```json
|
||||||
|
{
|
||||||
|
"name": "NOM_DU_SERVICE",
|
||||||
|
"icon": "🎯",
|
||||||
|
"platform": "Nom de la plateforme",
|
||||||
|
"description": "Description du service",
|
||||||
|
"url": "https://service.o-k-i.net/",
|
||||||
|
"linkText": "Accéder à SERVICE"
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Ajouter un projet web
|
||||||
|
|
||||||
|
Éditez `src/_data/projects.json` :
|
||||||
|
|
||||||
|
```json
|
||||||
|
{
|
||||||
|
"name": "NOM.PROJET",
|
||||||
|
"icon": "📱",
|
||||||
|
"domain": "nom.projet",
|
||||||
|
"description": "Description du projet"
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Ajouter une valeur
|
||||||
|
|
||||||
|
Éditez `src/_data/values.json` :
|
||||||
|
|
||||||
|
```json
|
||||||
|
{
|
||||||
|
"icon": "🌟",
|
||||||
|
"title": "Titre",
|
||||||
|
"description": "Description de la valeur"
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Modifier la navigation
|
||||||
|
|
||||||
|
Éditez `src/_data/navigation.json` :
|
||||||
|
|
||||||
|
```json
|
||||||
|
{
|
||||||
|
"text": "Texte du lien",
|
||||||
|
"url": "#section",
|
||||||
|
"external": false
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
Pour un lien externe, mettez `"external": true`.
|
||||||
|
|
||||||
|
### Ajouter une section de contact
|
||||||
|
|
||||||
|
Éditez `src/_data/contact.json` :
|
||||||
|
|
||||||
|
```json
|
||||||
|
{
|
||||||
|
"title": "🔗 Titre de la section",
|
||||||
|
"links": [
|
||||||
|
{
|
||||||
|
"text": "Nom du lien",
|
||||||
|
"url": "https://example.com"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
## Modifier les styles
|
||||||
|
|
||||||
|
Les styles sont dans `src/assets/css/styles.css`.
|
||||||
|
|
||||||
|
### Variables CSS disponibles
|
||||||
|
|
||||||
|
```css
|
||||||
|
--bleu-ocean: #003566;
|
||||||
|
--jaune-soleil: #FFB700;
|
||||||
|
--rouge-resistance: #D62828;
|
||||||
|
--vert-terre: #2A9134;
|
||||||
|
--orange-communaute: #FB8500;
|
||||||
|
--noir-profond: #0A0908;
|
||||||
|
--blanc-lumiere: #F7F7F2;
|
||||||
|
--violet-fedi: #6364FF;
|
||||||
|
```
|
||||||
|
|
||||||
|
## Créer une nouvelle page
|
||||||
|
|
||||||
|
1. Créez un fichier `.njk` dans `src/` :
|
||||||
|
|
||||||
|
```njk
|
||||||
|
---
|
||||||
|
layout: layouts/base.njk
|
||||||
|
title: Titre de la page
|
||||||
|
description: Description pour le SEO
|
||||||
|
---
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<h1>{{ title }}</h1>
|
||||||
|
<p>Contenu de votre page</p>
|
||||||
|
</section>
|
||||||
|
```
|
||||||
|
|
||||||
|
2. Ajoutez le lien dans `src/_data/navigation.json` si nécessaire
|
||||||
|
|
||||||
|
3. Reconstruisez le site : `npm run build`
|
||||||
|
|
||||||
|
## Modifier un partial
|
||||||
|
|
||||||
|
Les partials sont dans `src/_includes/partials/` :
|
||||||
|
|
||||||
|
- `nav.njk` - Navigation
|
||||||
|
- `hero.njk` - Section hero (accueil)
|
||||||
|
- `fediverse.njk` - Services Fédiverse
|
||||||
|
- `projects.njk` - Projets web
|
||||||
|
- `mission.njk` - Mission et valeurs
|
||||||
|
- `hosting.njk` - Services d'hébergement
|
||||||
|
- `support.njk` - Section dons
|
||||||
|
- `contact.njk` - Informations de contact
|
||||||
|
- `footer.njk` - Pied de page
|
||||||
|
|
||||||
|
## Workflow de développement
|
||||||
|
|
||||||
|
1. Créez une branche pour votre fonctionnalité :
|
||||||
|
```bash
|
||||||
|
git checkout -b feature/ma-fonctionnalite
|
||||||
|
```
|
||||||
|
|
||||||
|
2. Faites vos modifications
|
||||||
|
|
||||||
|
3. Testez localement :
|
||||||
|
```bash
|
||||||
|
npm start
|
||||||
|
```
|
||||||
|
|
||||||
|
4. Buildez pour vérifier :
|
||||||
|
```bash
|
||||||
|
npm run build
|
||||||
|
```
|
||||||
|
|
||||||
|
5. Commitez vos changements :
|
||||||
|
```bash
|
||||||
|
git add .
|
||||||
|
git commit -m "Description de vos changements"
|
||||||
|
```
|
||||||
|
|
||||||
|
6. Poussez et créez une pull request :
|
||||||
|
```bash
|
||||||
|
git push origin feature/ma-fonctionnalite
|
||||||
|
```
|
||||||
|
|
||||||
|
## Standards de code
|
||||||
|
|
||||||
|
### HTML/Nunjucks
|
||||||
|
- Indentation : 4 espaces
|
||||||
|
- Toujours fermer les balises
|
||||||
|
- Attributs entre guillemets doubles
|
||||||
|
|
||||||
|
### CSS
|
||||||
|
- Indentation : 4 espaces
|
||||||
|
- Utiliser les variables CSS quand possible
|
||||||
|
- Mobile-first pour le responsive
|
||||||
|
|
||||||
|
### JavaScript
|
||||||
|
- Indentation : 4 espaces
|
||||||
|
- Vanilla JS (pas de framework)
|
||||||
|
- Commentaires en français
|
||||||
|
- Gestion des erreurs
|
||||||
|
|
||||||
|
## Questions ?
|
||||||
|
|
||||||
|
Contactez-nous à kontak@o-k-i.net ou ouvrez une issue sur Codeberg.
|
||||||
@@ -0,0 +1,661 @@
|
|||||||
|
GNU AFFERO GENERAL PUBLIC LICENSE
|
||||||
|
Version 3, 19 November 2007
|
||||||
|
|
||||||
|
Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
|
||||||
|
Everyone is permitted to copy and distribute verbatim copies
|
||||||
|
of this license document, but changing it is not allowed.
|
||||||
|
|
||||||
|
Preamble
|
||||||
|
|
||||||
|
The GNU Affero General Public License is a free, copyleft license for
|
||||||
|
software and other kinds of works, specifically designed to ensure
|
||||||
|
cooperation with the community in the case of network server software.
|
||||||
|
|
||||||
|
The licenses for most software and other practical works are designed
|
||||||
|
to take away your freedom to share and change the works. By contrast,
|
||||||
|
our General Public Licenses are intended to guarantee your freedom to
|
||||||
|
share and change all versions of a program--to make sure it remains free
|
||||||
|
software for all its users.
|
||||||
|
|
||||||
|
When we speak of free software, we are referring to freedom, not
|
||||||
|
price. Our General Public Licenses are designed to make sure that you
|
||||||
|
have the freedom to distribute copies of free software (and charge for
|
||||||
|
them if you wish), that you receive source code or can get it if you
|
||||||
|
want it, that you can change the software or use pieces of it in new
|
||||||
|
free programs, and that you know you can do these things.
|
||||||
|
|
||||||
|
Developers that use our General Public Licenses protect your rights
|
||||||
|
with two steps: (1) assert copyright on the software, and (2) offer
|
||||||
|
you this License which gives you legal permission to copy, distribute
|
||||||
|
and/or modify the software.
|
||||||
|
|
||||||
|
A secondary benefit of defending all users' freedom is that
|
||||||
|
improvements made in alternate versions of the program, if they
|
||||||
|
receive widespread use, become available for other developers to
|
||||||
|
incorporate. Many developers of free software are heartened and
|
||||||
|
encouraged by the resulting cooperation. However, in the case of
|
||||||
|
software used on network servers, this result may fail to come about.
|
||||||
|
The GNU General Public License permits making a modified version and
|
||||||
|
letting the public access it on a server without ever releasing its
|
||||||
|
source code to the public.
|
||||||
|
|
||||||
|
The GNU Affero General Public License is designed specifically to
|
||||||
|
ensure that, in such cases, the modified source code becomes available
|
||||||
|
to the community. It requires the operator of a network server to
|
||||||
|
provide the source code of the modified version running there to the
|
||||||
|
users of that server. Therefore, public use of a modified version, on
|
||||||
|
a publicly accessible server, gives the public access to the source
|
||||||
|
code of the modified version.
|
||||||
|
|
||||||
|
An older license, called the Affero General Public License and
|
||||||
|
published by Affero, was designed to accomplish similar goals. This is
|
||||||
|
a different license, not a version of the Affero GPL, but Affero has
|
||||||
|
released a new version of the Affero GPL which permits relicensing under
|
||||||
|
this license.
|
||||||
|
|
||||||
|
The precise terms and conditions for copying, distribution and
|
||||||
|
modification follow.
|
||||||
|
|
||||||
|
TERMS AND CONDITIONS
|
||||||
|
|
||||||
|
0. Definitions.
|
||||||
|
|
||||||
|
"This License" refers to version 3 of the GNU Affero General Public License.
|
||||||
|
|
||||||
|
"Copyright" also means copyright-like laws that apply to other kinds of
|
||||||
|
works, such as semiconductor masks.
|
||||||
|
|
||||||
|
"The Program" refers to any copyrightable work licensed under this
|
||||||
|
License. Each licensee is addressed as "you". "Licensees" and
|
||||||
|
"recipients" may be individuals or organizations.
|
||||||
|
|
||||||
|
To "modify" a work means to copy from or adapt all or part of the work
|
||||||
|
in a fashion requiring copyright permission, other than the making of an
|
||||||
|
exact copy. The resulting work is called a "modified version" of the
|
||||||
|
earlier work or a work "based on" the earlier work.
|
||||||
|
|
||||||
|
A "covered work" means either the unmodified Program or a work based
|
||||||
|
on the Program.
|
||||||
|
|
||||||
|
To "propagate" a work means to do anything with it that, without
|
||||||
|
permission, would make you directly or secondarily liable for
|
||||||
|
infringement under applicable copyright law, except executing it on a
|
||||||
|
computer or modifying a private copy. Propagation includes copying,
|
||||||
|
distribution (with or without modification), making available to the
|
||||||
|
public, and in some countries other activities as well.
|
||||||
|
|
||||||
|
To "convey" a work means any kind of propagation that enables other
|
||||||
|
parties to make or receive copies. Mere interaction with a user through
|
||||||
|
a computer network, with no transfer of a copy, is not conveying.
|
||||||
|
|
||||||
|
An interactive user interface displays "Appropriate Legal Notices"
|
||||||
|
to the extent that it includes a convenient and prominently visible
|
||||||
|
feature that (1) displays an appropriate copyright notice, and (2)
|
||||||
|
tells the user that there is no warranty for the work (except to the
|
||||||
|
extent that warranties are provided), that licensees may convey the
|
||||||
|
work under this License, and how to view a copy of this License. If
|
||||||
|
the interface presents a list of user commands or options, such as a
|
||||||
|
menu, a prominent item in the list meets this criterion.
|
||||||
|
|
||||||
|
1. Source Code.
|
||||||
|
|
||||||
|
The "source code" for a work means the preferred form of the work
|
||||||
|
for making modifications to it. "Object code" means any non-source
|
||||||
|
form of a work.
|
||||||
|
|
||||||
|
A "Standard Interface" means an interface that either is an official
|
||||||
|
standard defined by a recognized standards body, or, in the case of
|
||||||
|
interfaces specified for a particular programming language, one that
|
||||||
|
is widely used among developers working in that language.
|
||||||
|
|
||||||
|
The "System Libraries" of an executable work include anything, other
|
||||||
|
than the work as a whole, that (a) is included in the normal form of
|
||||||
|
packaging a Major Component, but which is not part of that Major
|
||||||
|
Component, and (b) serves only to enable use of the work with that
|
||||||
|
Major Component, or to implement a Standard Interface for which an
|
||||||
|
implementation is available to the public in source code form. A
|
||||||
|
"Major Component", in this context, means a major essential component
|
||||||
|
(kernel, window system, and so on) of the specific operating system
|
||||||
|
(if any) on which the executable work runs, or a compiler used to
|
||||||
|
produce the work, or an object code interpreter used to run it.
|
||||||
|
|
||||||
|
The "Corresponding Source" for a work in object code form means all
|
||||||
|
the source code needed to generate, install, and (for an executable
|
||||||
|
work) run the object code and to modify the work, including scripts to
|
||||||
|
control those activities. However, it does not include the work's
|
||||||
|
System Libraries, or general-purpose tools or generally available free
|
||||||
|
programs which are used unmodified in performing those activities but
|
||||||
|
which are not part of the work. For example, Corresponding Source
|
||||||
|
includes interface definition files associated with source files for
|
||||||
|
the work, and the source code for shared libraries and dynamically
|
||||||
|
linked subprograms that the work is specifically designed to require,
|
||||||
|
such as by intimate data communication or control flow between those
|
||||||
|
subprograms and other parts of the work.
|
||||||
|
|
||||||
|
The Corresponding Source need not include anything that users
|
||||||
|
can regenerate automatically from other parts of the Corresponding
|
||||||
|
Source.
|
||||||
|
|
||||||
|
The Corresponding Source for a work in source code form is that
|
||||||
|
same work.
|
||||||
|
|
||||||
|
2. Basic Permissions.
|
||||||
|
|
||||||
|
All rights granted under this License are granted for the term of
|
||||||
|
copyright on the Program, and are irrevocable provided the stated
|
||||||
|
conditions are met. This License explicitly affirms your unlimited
|
||||||
|
permission to run the unmodified Program. The output from running a
|
||||||
|
covered work is covered by this License only if the output, given its
|
||||||
|
content, constitutes a covered work. This License acknowledges your
|
||||||
|
rights of fair use or other equivalent, as provided by copyright law.
|
||||||
|
|
||||||
|
You may make, run and propagate covered works that you do not
|
||||||
|
convey, without conditions so long as your license otherwise remains
|
||||||
|
in force. You may convey covered works to others for the sole purpose
|
||||||
|
of having them make modifications exclusively for you, or provide you
|
||||||
|
with facilities for running those works, provided that you comply with
|
||||||
|
the terms of this License in conveying all material for which you do
|
||||||
|
not control copyright. Those thus making or running the covered works
|
||||||
|
for you must do so exclusively on your behalf, under your direction
|
||||||
|
and control, on terms that prohibit them from making any copies of
|
||||||
|
your copyrighted material outside their relationship with you.
|
||||||
|
|
||||||
|
Conveying under any other circumstances is permitted solely under
|
||||||
|
the conditions stated below. Sublicensing is not allowed; section 10
|
||||||
|
makes it unnecessary.
|
||||||
|
|
||||||
|
3. Protecting Users' Legal Rights From Anti-Circumvention Law.
|
||||||
|
|
||||||
|
No covered work shall be deemed part of an effective technological
|
||||||
|
measure under any applicable law fulfilling obligations under article
|
||||||
|
11 of the WIPO copyright treaty adopted on 20 December 1996, or
|
||||||
|
similar laws prohibiting or restricting circumvention of such
|
||||||
|
measures.
|
||||||
|
|
||||||
|
When you convey a covered work, you waive any legal power to forbid
|
||||||
|
circumvention of technological measures to the extent such circumvention
|
||||||
|
is effected by exercising rights under this License with respect to
|
||||||
|
the covered work, and you disclaim any intention to limit operation or
|
||||||
|
modification of the work as a means of enforcing, against the work's
|
||||||
|
users, your or third parties' legal rights to forbid circumvention of
|
||||||
|
technological measures.
|
||||||
|
|
||||||
|
4. Conveying Verbatim Copies.
|
||||||
|
|
||||||
|
You may convey verbatim copies of the Program's source code as you
|
||||||
|
receive it, in any medium, provided that you conspicuously and
|
||||||
|
appropriately publish on each copy an appropriate copyright notice;
|
||||||
|
keep intact all notices stating that this License and any
|
||||||
|
non-permissive terms added in accord with section 7 apply to the code;
|
||||||
|
keep intact all notices of the absence of any warranty; and give all
|
||||||
|
recipients a copy of this License along with the Program.
|
||||||
|
|
||||||
|
You may charge any price or no price for each copy that you convey,
|
||||||
|
and you may offer support or warranty protection for a fee.
|
||||||
|
|
||||||
|
5. Conveying Modified Source Versions.
|
||||||
|
|
||||||
|
You may convey a work based on the Program, or the modifications to
|
||||||
|
produce it from the Program, in the form of source code under the
|
||||||
|
terms of section 4, provided that you also meet all of these conditions:
|
||||||
|
|
||||||
|
a) The work must carry prominent notices stating that you modified
|
||||||
|
it, and giving a relevant date.
|
||||||
|
|
||||||
|
b) The work must carry prominent notices stating that it is
|
||||||
|
released under this License and any conditions added under section
|
||||||
|
7. This requirement modifies the requirement in section 4 to
|
||||||
|
"keep intact all notices".
|
||||||
|
|
||||||
|
c) You must license the entire work, as a whole, under this
|
||||||
|
License to anyone who comes into possession of a copy. This
|
||||||
|
License will therefore apply, along with any applicable section 7
|
||||||
|
additional terms, to the whole of the work, and all its parts,
|
||||||
|
regardless of how they are packaged. This License gives no
|
||||||
|
permission to license the work in any other way, but it does not
|
||||||
|
invalidate such permission if you have separately received it.
|
||||||
|
|
||||||
|
d) If the work has interactive user interfaces, each must display
|
||||||
|
Appropriate Legal Notices; however, if the Program has interactive
|
||||||
|
interfaces that do not display Appropriate Legal Notices, your
|
||||||
|
work need not make them do so.
|
||||||
|
|
||||||
|
A compilation of a covered work with other separate and independent
|
||||||
|
works, which are not by their nature extensions of the covered work,
|
||||||
|
and which are not combined with it such as to form a larger program,
|
||||||
|
in or on a volume of a storage or distribution medium, is called an
|
||||||
|
"aggregate" if the compilation and its resulting copyright are not
|
||||||
|
used to limit the access or legal rights of the compilation's users
|
||||||
|
beyond what the individual works permit. Inclusion of a covered work
|
||||||
|
in an aggregate does not cause this License to apply to the other
|
||||||
|
parts of the aggregate.
|
||||||
|
|
||||||
|
6. Conveying Non-Source Forms.
|
||||||
|
|
||||||
|
You may convey a covered work in object code form under the terms
|
||||||
|
of sections 4 and 5, provided that you also convey the
|
||||||
|
machine-readable Corresponding Source under the terms of this License,
|
||||||
|
in one of these ways:
|
||||||
|
|
||||||
|
a) Convey the object code in, or embodied in, a physical product
|
||||||
|
(including a physical distribution medium), accompanied by the
|
||||||
|
Corresponding Source fixed on a durable physical medium
|
||||||
|
customarily used for software interchange.
|
||||||
|
|
||||||
|
b) Convey the object code in, or embodied in, a physical product
|
||||||
|
(including a physical distribution medium), accompanied by a
|
||||||
|
written offer, valid for at least three years and valid for as
|
||||||
|
long as you offer spare parts or customer support for that product
|
||||||
|
model, to give anyone who possesses the object code either (1) a
|
||||||
|
copy of the Corresponding Source for all the software in the
|
||||||
|
product that is covered by this License, on a durable physical
|
||||||
|
medium customarily used for software interchange, for a price no
|
||||||
|
more than your reasonable cost of physically performing this
|
||||||
|
conveying of source, or (2) access to copy the
|
||||||
|
Corresponding Source from a network server at no charge.
|
||||||
|
|
||||||
|
c) Convey individual copies of the object code with a copy of the
|
||||||
|
written offer to provide the Corresponding Source. This
|
||||||
|
alternative is allowed only occasionally and noncommercially, and
|
||||||
|
only if you received the object code with such an offer, in accord
|
||||||
|
with subsection 6b.
|
||||||
|
|
||||||
|
d) Convey the object code by offering access from a designated
|
||||||
|
place (gratis or for a charge), and offer equivalent access to the
|
||||||
|
Corresponding Source in the same way through the same place at no
|
||||||
|
further charge. You need not require recipients to copy the
|
||||||
|
Corresponding Source along with the object code. If the place to
|
||||||
|
copy the object code is a network server, the Corresponding Source
|
||||||
|
may be on a different server (operated by you or a third party)
|
||||||
|
that supports equivalent copying facilities, provided you maintain
|
||||||
|
clear directions next to the object code saying where to find the
|
||||||
|
Corresponding Source. Regardless of what server hosts the
|
||||||
|
Corresponding Source, you remain obligated to ensure that it is
|
||||||
|
available for as long as needed to satisfy these requirements.
|
||||||
|
|
||||||
|
e) Convey the object code using peer-to-peer transmission, provided
|
||||||
|
you inform other peers where the object code and Corresponding
|
||||||
|
Source of the work are being offered to the general public at no
|
||||||
|
charge under subsection 6d.
|
||||||
|
|
||||||
|
A separable portion of the object code, whose source code is excluded
|
||||||
|
from the Corresponding Source as a System Library, need not be
|
||||||
|
included in conveying the object code work.
|
||||||
|
|
||||||
|
A "User Product" is either (1) a "consumer product", which means any
|
||||||
|
tangible personal property which is normally used for personal, family,
|
||||||
|
or household purposes, or (2) anything designed or sold for incorporation
|
||||||
|
into a dwelling. In determining whether a product is a consumer product,
|
||||||
|
doubtful cases shall be resolved in favor of coverage. For a particular
|
||||||
|
product received by a particular user, "normally used" refers to a
|
||||||
|
typical or common use of that class of product, regardless of the status
|
||||||
|
of the particular user or of the way in which the particular user
|
||||||
|
actually uses, or expects or is expected to use, the product. A product
|
||||||
|
is a consumer product regardless of whether the product has substantial
|
||||||
|
commercial, industrial or non-consumer uses, unless such uses represent
|
||||||
|
the only significant mode of use of the product.
|
||||||
|
|
||||||
|
"Installation Information" for a User Product means any methods,
|
||||||
|
procedures, authorization keys, or other information required to install
|
||||||
|
and execute modified versions of a covered work in that User Product from
|
||||||
|
a modified version of its Corresponding Source. The information must
|
||||||
|
suffice to ensure that the continued functioning of the modified object
|
||||||
|
code is in no case prevented or interfered with solely because
|
||||||
|
modification has been made.
|
||||||
|
|
||||||
|
If you convey an object code work under this section in, or with, or
|
||||||
|
specifically for use in, a User Product, and the conveying occurs as
|
||||||
|
part of a transaction in which the right of possession and use of the
|
||||||
|
User Product is transferred to the recipient in perpetuity or for a
|
||||||
|
fixed term (regardless of how the transaction is characterized), the
|
||||||
|
Corresponding Source conveyed under this section must be accompanied
|
||||||
|
by the Installation Information. But this requirement does not apply
|
||||||
|
if neither you nor any third party retains the ability to install
|
||||||
|
modified object code on the User Product (for example, the work has
|
||||||
|
been installed in ROM).
|
||||||
|
|
||||||
|
The requirement to provide Installation Information does not include a
|
||||||
|
requirement to continue to provide support service, warranty, or updates
|
||||||
|
for a work that has been modified or installed by the recipient, or for
|
||||||
|
the User Product in which it has been modified or installed. Access to a
|
||||||
|
network may be denied when the modification itself materially and
|
||||||
|
adversely affects the operation of the network or violates the rules and
|
||||||
|
protocols for communication across the network.
|
||||||
|
|
||||||
|
Corresponding Source conveyed, and Installation Information provided,
|
||||||
|
in accord with this section must be in a format that is publicly
|
||||||
|
documented (and with an implementation available to the public in
|
||||||
|
source code form), and must require no special password or key for
|
||||||
|
unpacking, reading or copying.
|
||||||
|
|
||||||
|
7. Additional Terms.
|
||||||
|
|
||||||
|
"Additional permissions" are terms that supplement the terms of this
|
||||||
|
License by making exceptions from one or more of its conditions.
|
||||||
|
Additional permissions that are applicable to the entire Program shall
|
||||||
|
be treated as though they were included in this License, to the extent
|
||||||
|
that they are valid under applicable law. If additional permissions
|
||||||
|
apply only to part of the Program, that part may be used separately
|
||||||
|
under those permissions, but the entire Program remains governed by
|
||||||
|
this License without regard to the additional permissions.
|
||||||
|
|
||||||
|
When you convey a copy of a covered work, you may at your option
|
||||||
|
remove any additional permissions from that copy, or from any part of
|
||||||
|
it. (Additional permissions may be written to require their own
|
||||||
|
removal in certain cases when you modify the work.) You may place
|
||||||
|
additional permissions on material, added by you to a covered work,
|
||||||
|
for which you have or can give appropriate copyright permission.
|
||||||
|
|
||||||
|
Notwithstanding any other provision of this License, for material you
|
||||||
|
add to a covered work, you may (if authorized by the copyright holders of
|
||||||
|
that material) supplement the terms of this License with terms:
|
||||||
|
|
||||||
|
a) Disclaiming warranty or limiting liability differently from the
|
||||||
|
terms of sections 15 and 16 of this License; or
|
||||||
|
|
||||||
|
b) Requiring preservation of specified reasonable legal notices or
|
||||||
|
author attributions in that material or in the Appropriate Legal
|
||||||
|
Notices displayed by works containing it; or
|
||||||
|
|
||||||
|
c) Prohibiting misrepresentation of the origin of that material, or
|
||||||
|
requiring that modified versions of such material be marked in
|
||||||
|
reasonable ways as different from the original version; or
|
||||||
|
|
||||||
|
d) Limiting the use for publicity purposes of names of licensors or
|
||||||
|
authors of the material; or
|
||||||
|
|
||||||
|
e) Declining to grant rights under trademark law for use of some
|
||||||
|
trade names, trademarks, or service marks; or
|
||||||
|
|
||||||
|
f) Requiring indemnification of licensors and authors of that
|
||||||
|
material by anyone who conveys the material (or modified versions of
|
||||||
|
it) with contractual assumptions of liability to the recipient, for
|
||||||
|
any liability that these contractual assumptions directly impose on
|
||||||
|
those licensors and authors.
|
||||||
|
|
||||||
|
All other non-permissive additional terms are considered "further
|
||||||
|
restrictions" within the meaning of section 10. If the Program as you
|
||||||
|
received it, or any part of it, contains a notice stating that it is
|
||||||
|
governed by this License along with a term that is a further
|
||||||
|
restriction, you may remove that term. If a license document contains
|
||||||
|
a further restriction but permits relicensing or conveying under this
|
||||||
|
License, you may add to a covered work material governed by the terms
|
||||||
|
of that license document, provided that the further restriction does
|
||||||
|
not survive such relicensing or conveying.
|
||||||
|
|
||||||
|
If you add terms to a covered work in accord with this section, you
|
||||||
|
must place, in the relevant source files, a statement of the
|
||||||
|
additional terms that apply to those files, or a notice indicating
|
||||||
|
where to find the applicable terms.
|
||||||
|
|
||||||
|
Additional terms, permissive or non-permissive, may be stated in the
|
||||||
|
form of a separately written license, or stated as exceptions;
|
||||||
|
the above requirements apply either way.
|
||||||
|
|
||||||
|
8. Termination.
|
||||||
|
|
||||||
|
You may not propagate or modify a covered work except as expressly
|
||||||
|
provided under this License. Any attempt otherwise to propagate or
|
||||||
|
modify it is void, and will automatically terminate your rights under
|
||||||
|
this License (including any patent licenses granted under the third
|
||||||
|
paragraph of section 11).
|
||||||
|
|
||||||
|
However, if you cease all violation of this License, then your
|
||||||
|
license from a particular copyright holder is reinstated (a)
|
||||||
|
provisionally, unless and until the copyright holder explicitly and
|
||||||
|
finally terminates your license, and (b) permanently, if the copyright
|
||||||
|
holder fails to notify you of the violation by some reasonable means
|
||||||
|
prior to 60 days after the cessation.
|
||||||
|
|
||||||
|
Moreover, your license from a particular copyright holder is
|
||||||
|
reinstated permanently if the copyright holder notifies you of the
|
||||||
|
violation by some reasonable means, this is the first time you have
|
||||||
|
received notice of violation of this License (for any work) from that
|
||||||
|
copyright holder, and you cure the violation prior to 30 days after
|
||||||
|
your receipt of the notice.
|
||||||
|
|
||||||
|
Termination of your rights under this section does not terminate the
|
||||||
|
licenses of parties who have received copies or rights from you under
|
||||||
|
this License. If your rights have been terminated and not permanently
|
||||||
|
reinstated, you do not qualify to receive new licenses for the same
|
||||||
|
material under section 10.
|
||||||
|
|
||||||
|
9. Acceptance Not Required for Having Copies.
|
||||||
|
|
||||||
|
You are not required to accept this License in order to receive or
|
||||||
|
run a copy of the Program. Ancillary propagation of a covered work
|
||||||
|
occurring solely as a consequence of using peer-to-peer transmission
|
||||||
|
to receive a copy likewise does not require acceptance. However,
|
||||||
|
nothing other than this License grants you permission to propagate or
|
||||||
|
modify any covered work. These actions infringe copyright if you do
|
||||||
|
not accept this License. Therefore, by modifying or propagating a
|
||||||
|
covered work, you indicate your acceptance of this License to do so.
|
||||||
|
|
||||||
|
10. Automatic Licensing of Downstream Recipients.
|
||||||
|
|
||||||
|
Each time you convey a covered work, the recipient automatically
|
||||||
|
receives a license from the original licensors, to run, modify and
|
||||||
|
propagate that work, subject to this License. You are not responsible
|
||||||
|
for enforcing compliance by third parties with this License.
|
||||||
|
|
||||||
|
An "entity transaction" is a transaction transferring control of an
|
||||||
|
organization, or substantially all assets of one, or subdividing an
|
||||||
|
organization, or merging organizations. If propagation of a covered
|
||||||
|
work results from an entity transaction, each party to that
|
||||||
|
transaction who receives a copy of the work also receives whatever
|
||||||
|
licenses to the work the party's predecessor in interest had or could
|
||||||
|
give under the previous paragraph, plus a right to possession of the
|
||||||
|
Corresponding Source of the work from the predecessor in interest, if
|
||||||
|
the predecessor has it or can get it with reasonable efforts.
|
||||||
|
|
||||||
|
You may not impose any further restrictions on the exercise of the
|
||||||
|
rights granted or affirmed under this License. For example, you may
|
||||||
|
not impose a license fee, royalty, or other charge for exercise of
|
||||||
|
rights granted under this License, and you may not initiate litigation
|
||||||
|
(including a cross-claim or counterclaim in a lawsuit) alleging that
|
||||||
|
any patent claim is infringed by making, using, selling, offering for
|
||||||
|
sale, or importing the Program or any portion of it.
|
||||||
|
|
||||||
|
11. Patents.
|
||||||
|
|
||||||
|
A "contributor" is a copyright holder who authorizes use under this
|
||||||
|
License of the Program or a work on which the Program is based. The
|
||||||
|
work thus licensed is called the contributor's "contributor version".
|
||||||
|
|
||||||
|
A contributor's "essential patent claims" are all patent claims
|
||||||
|
owned or controlled by the contributor, whether already acquired or
|
||||||
|
hereafter acquired, that would be infringed by some manner, permitted
|
||||||
|
by this License, of making, using, or selling its contributor version,
|
||||||
|
but do not include claims that would be infringed only as a
|
||||||
|
consequence of further modification of the contributor version. For
|
||||||
|
purposes of this definition, "control" includes the right to grant
|
||||||
|
patent sublicenses in a manner consistent with the requirements of
|
||||||
|
this License.
|
||||||
|
|
||||||
|
Each contributor grants you a non-exclusive, worldwide, royalty-free
|
||||||
|
patent license under the contributor's essential patent claims, to
|
||||||
|
make, use, sell, offer for sale, import and otherwise run, modify and
|
||||||
|
propagate the contents of its contributor version.
|
||||||
|
|
||||||
|
In the following three paragraphs, a "patent license" is any express
|
||||||
|
agreement or commitment, however denominated, not to enforce a patent
|
||||||
|
(such as an express permission to practice a patent or covenant not to
|
||||||
|
sue for patent infringement). To "grant" such a patent license to a
|
||||||
|
party means to make such an agreement or commitment not to enforce a
|
||||||
|
patent against the party.
|
||||||
|
|
||||||
|
If you convey a covered work, knowingly relying on a patent license,
|
||||||
|
and the Corresponding Source of the work is not available for anyone
|
||||||
|
to copy, free of charge and under the terms of this License, through a
|
||||||
|
publicly available network server or other readily accessible means,
|
||||||
|
then you must either (1) cause the Corresponding Source to be so
|
||||||
|
available, or (2) arrange to deprive yourself of the benefit of the
|
||||||
|
patent license for this particular work, or (3) arrange, in a manner
|
||||||
|
consistent with the requirements of this License, to extend the patent
|
||||||
|
license to downstream recipients. "Knowingly relying" means you have
|
||||||
|
actual knowledge that, but for the patent license, your conveying the
|
||||||
|
covered work in a country, or your recipient's use of the covered work
|
||||||
|
in a country, would infringe one or more identifiable patents in that
|
||||||
|
country that you have reason to believe are valid.
|
||||||
|
|
||||||
|
If, pursuant to or in connection with a single transaction or
|
||||||
|
arrangement, you convey, or propagate by procuring conveyance of, a
|
||||||
|
covered work, and grant a patent license to some of the parties
|
||||||
|
receiving the covered work authorizing them to use, propagate, modify
|
||||||
|
or convey a specific copy of the covered work, then the patent license
|
||||||
|
you grant is automatically extended to all recipients of the covered
|
||||||
|
work and works based on it.
|
||||||
|
|
||||||
|
A patent license is "discriminatory" if it does not include within
|
||||||
|
the scope of its coverage, prohibits the exercise of, or is
|
||||||
|
conditioned on the non-exercise of one or more of the rights that are
|
||||||
|
specifically granted under this License. You may not convey a covered
|
||||||
|
work if you are a party to an arrangement with a third party that is
|
||||||
|
in the business of distributing software, under which you make payment
|
||||||
|
to the third party based on the extent of your activity of conveying
|
||||||
|
the work, and under which the third party grants, to any of the
|
||||||
|
parties who would receive the covered work from you, a discriminatory
|
||||||
|
patent license (a) in connection with copies of the covered work
|
||||||
|
conveyed by you (or copies made from those copies), or (b) primarily
|
||||||
|
for and in connection with specific products or compilations that
|
||||||
|
contain the covered work, unless you entered into that arrangement,
|
||||||
|
or that patent license was granted, prior to 28 March 2007.
|
||||||
|
|
||||||
|
Nothing in this License shall be construed as excluding or limiting
|
||||||
|
any implied license or other defenses to infringement that may
|
||||||
|
otherwise be available to you under applicable patent law.
|
||||||
|
|
||||||
|
12. No Surrender of Others' Freedom.
|
||||||
|
|
||||||
|
If conditions are imposed on you (whether by court order, agreement or
|
||||||
|
otherwise) that contradict the conditions of this License, they do not
|
||||||
|
excuse you from the conditions of this License. If you cannot convey a
|
||||||
|
covered work so as to satisfy simultaneously your obligations under this
|
||||||
|
License and any other pertinent obligations, then as a consequence you may
|
||||||
|
not convey it at all. For example, if you agree to terms that obligate you
|
||||||
|
to collect a royalty for further conveying from those to whom you convey
|
||||||
|
the Program, the only way you could satisfy both those terms and this
|
||||||
|
License would be to refrain entirely from conveying the Program.
|
||||||
|
|
||||||
|
13. Remote Network Interaction; Use with the GNU General Public License.
|
||||||
|
|
||||||
|
Notwithstanding any other provision of this License, if you modify the
|
||||||
|
Program, your modified version must prominently offer all users
|
||||||
|
interacting with it remotely through a computer network (if your version
|
||||||
|
supports such interaction) an opportunity to receive the Corresponding
|
||||||
|
Source of your version by providing access to the Corresponding Source
|
||||||
|
from a network server at no charge, through some standard or customary
|
||||||
|
means of facilitating copying of software. This Corresponding Source
|
||||||
|
shall include the Corresponding Source for any work covered by version 3
|
||||||
|
of the GNU General Public License that is incorporated pursuant to the
|
||||||
|
following paragraph.
|
||||||
|
|
||||||
|
Notwithstanding any other provision of this License, you have
|
||||||
|
permission to link or combine any covered work with a work licensed
|
||||||
|
under version 3 of the GNU General Public License into a single
|
||||||
|
combined work, and to convey the resulting work. The terms of this
|
||||||
|
License will continue to apply to the part which is the covered work,
|
||||||
|
but the work with which it is combined will remain governed by version
|
||||||
|
3 of the GNU General Public License.
|
||||||
|
|
||||||
|
14. Revised Versions of this License.
|
||||||
|
|
||||||
|
The Free Software Foundation may publish revised and/or new versions of
|
||||||
|
the GNU Affero General Public License from time to time. Such new versions
|
||||||
|
will be similar in spirit to the present version, but may differ in detail to
|
||||||
|
address new problems or concerns.
|
||||||
|
|
||||||
|
Each version is given a distinguishing version number. If the
|
||||||
|
Program specifies that a certain numbered version of the GNU Affero General
|
||||||
|
Public License "or any later version" applies to it, you have the
|
||||||
|
option of following the terms and conditions either of that numbered
|
||||||
|
version or of any later version published by the Free Software
|
||||||
|
Foundation. If the Program does not specify a version number of the
|
||||||
|
GNU Affero General Public License, you may choose any version ever published
|
||||||
|
by the Free Software Foundation.
|
||||||
|
|
||||||
|
If the Program specifies that a proxy can decide which future
|
||||||
|
versions of the GNU Affero General Public License can be used, that proxy's
|
||||||
|
public statement of acceptance of a version permanently authorizes you
|
||||||
|
to choose that version for the Program.
|
||||||
|
|
||||||
|
Later license versions may give you additional or different
|
||||||
|
permissions. However, no additional obligations are imposed on any
|
||||||
|
author or copyright holder as a result of your choosing to follow a
|
||||||
|
later version.
|
||||||
|
|
||||||
|
15. Disclaimer of Warranty.
|
||||||
|
|
||||||
|
THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
|
||||||
|
APPLICABLE LAW. EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
|
||||||
|
HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
|
||||||
|
OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
|
||||||
|
THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
|
||||||
|
PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
|
||||||
|
IS WITH YOU. SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
|
||||||
|
ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
|
||||||
|
|
||||||
|
16. Limitation of Liability.
|
||||||
|
|
||||||
|
IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
|
||||||
|
WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
|
||||||
|
THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
|
||||||
|
GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
|
||||||
|
USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
|
||||||
|
DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
|
||||||
|
PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
|
||||||
|
EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
|
||||||
|
SUCH DAMAGES.
|
||||||
|
|
||||||
|
17. Interpretation of Sections 15 and 16.
|
||||||
|
|
||||||
|
If the disclaimer of warranty and limitation of liability provided
|
||||||
|
above cannot be given local legal effect according to their terms,
|
||||||
|
reviewing courts shall apply local law that most closely approximates
|
||||||
|
an absolute waiver of all civil liability in connection with the
|
||||||
|
Program, unless a warranty or assumption of liability accompanies a
|
||||||
|
copy of the Program in return for a fee.
|
||||||
|
|
||||||
|
END OF TERMS AND CONDITIONS
|
||||||
|
|
||||||
|
How to Apply These Terms to Your New Programs
|
||||||
|
|
||||||
|
If you develop a new program, and you want it to be of the greatest
|
||||||
|
possible use to the public, the best way to achieve this is to make it
|
||||||
|
free software which everyone can redistribute and change under these terms.
|
||||||
|
|
||||||
|
To do so, attach the following notices to the program. It is safest
|
||||||
|
to attach them to the start of each source file to most effectively
|
||||||
|
state the exclusion of warranty; and each file should have at least
|
||||||
|
the "copyright" line and a pointer to where the full notice is found.
|
||||||
|
|
||||||
|
<one line to give the program's name and a brief idea of what it does.>
|
||||||
|
Copyright (C) <year> <name of author>
|
||||||
|
|
||||||
|
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/>.
|
||||||
|
|
||||||
|
Also add information on how to contact you by electronic and paper mail.
|
||||||
|
|
||||||
|
If your software can interact with users remotely through a computer
|
||||||
|
network, you should also make sure that it provides a way for users to
|
||||||
|
get its source. For example, if your program is a web application, its
|
||||||
|
interface could display a "Source" link that leads users to an archive
|
||||||
|
of the code. There are many ways you could offer source, and different
|
||||||
|
solutions will be better for different programs; see section 13 for the
|
||||||
|
specific requirements.
|
||||||
|
|
||||||
|
You should also get your employer (if you work as a programmer) or school,
|
||||||
|
if any, to sign a "copyright disclaimer" for the program, if necessary.
|
||||||
|
For more information on this, and how to apply and follow the GNU AGPL, see
|
||||||
|
<https://www.gnu.org/licenses/>.
|
||||||
@@ -0,0 +1,151 @@
|
|||||||
|
# o-k-i.net V2
|
||||||
|
|
||||||
|
Site web officiel de ** ORGANISATION KA INTERNATIONALE (OKI)** - Version 2 construite avec 11ty (Eleventy).
|
||||||
|
|
||||||
|
## À propos
|
||||||
|
|
||||||
|
ORGANISATION KA INTERNATIONALE est une association à but non lucratif dédiée à la promotion de nos langues et au traitement de l'actualité, proposant des alternatives libres aux GAFAM.
|
||||||
|
|
||||||
|
## Technologies
|
||||||
|
|
||||||
|
- **11ty (Eleventy)** - Générateur de site statique
|
||||||
|
- **Nunjucks** - Moteur de templates
|
||||||
|
- **CSS personnalisé** - Sans framework
|
||||||
|
- **JavaScript Vanilla** - Interactions et animations
|
||||||
|
|
||||||
|
## Structure du projet
|
||||||
|
|
||||||
|
```
|
||||||
|
o-k-i.net-V2/
|
||||||
|
├── src/
|
||||||
|
│ ├── _data/ # Données JSON (services, projets, valeurs, etc.)
|
||||||
|
│ ├── _includes/
|
||||||
|
│ │ ├── layouts/ # Layouts de base
|
||||||
|
│ │ └── partials/ # Composants réutilisables
|
||||||
|
│ ├── assets/
|
||||||
|
│ │ ├── css/ # Feuilles de style
|
||||||
|
│ │ ├── js/ # Scripts JavaScript
|
||||||
|
│ │ └── images/ # Images
|
||||||
|
│ └── index.njk # Page d'accueil
|
||||||
|
├── _site/ # Site généré (git ignoré)
|
||||||
|
├── eleventy.config.js # Configuration 11ty
|
||||||
|
└── package.json
|
||||||
|
```
|
||||||
|
|
||||||
|
## Installation
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Cloner le dépôt
|
||||||
|
git clone https://codeberg.org/OKI/o-k-i.net-V2.git
|
||||||
|
cd o-k-i.net-V2
|
||||||
|
|
||||||
|
# Installer les dépendances
|
||||||
|
npm install
|
||||||
|
```
|
||||||
|
|
||||||
|
## Développement
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Lancer le serveur de développement avec hot reload
|
||||||
|
npm start
|
||||||
|
|
||||||
|
# Le site sera disponible sur http://localhost:8080
|
||||||
|
```
|
||||||
|
|
||||||
|
## Build de production
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Générer le site statique
|
||||||
|
npm run build
|
||||||
|
|
||||||
|
# Les fichiers seront dans le dossier _site/
|
||||||
|
```
|
||||||
|
|
||||||
|
## Personnalisation
|
||||||
|
|
||||||
|
### Modifier les données
|
||||||
|
|
||||||
|
Les données du site sont organisées dans `src/_data/` :
|
||||||
|
|
||||||
|
- `site.json` - Informations générales du site
|
||||||
|
- `services.json` - Services Fédiverse (KUTE, GADE, BOKANTAJ, MIZIK)
|
||||||
|
- `projects.json` - Projets web (FEDIVERSE OKI, OKI.RE, NUVEL.NU, JWE.OVH, GONG.GP)
|
||||||
|
- `partners.json` - Partenaires (Joukawouvè, Aktivist Vybz #AKV)
|
||||||
|
- `values.json` - Valeurs de l'organisation
|
||||||
|
- `contact.json` - Informations de contact
|
||||||
|
- `navigation.json` - Liens de navigation
|
||||||
|
|
||||||
|
### Modifier les styles
|
||||||
|
|
||||||
|
Les styles sont dans `src/assets/css/styles.css`. La charte graphique est basée sur les couleurs du logo officiel d'OKI :
|
||||||
|
|
||||||
|
```css
|
||||||
|
:root {
|
||||||
|
/* Couleurs du logo OKI */
|
||||||
|
--or-oki: #E8A625; /* Orange/Or du logo */
|
||||||
|
--noir-oki: #000000; /* Noir du logo */
|
||||||
|
--vert-oki: #00A854; /* Vert émeraude du logo */
|
||||||
|
--rouge-oki: #ED1C4C; /* Rouge/Rose du logo */
|
||||||
|
--blanc-creme: #F7F7F2; /* Blanc crème */
|
||||||
|
|
||||||
|
/* Couleurs dérivées pour le design */
|
||||||
|
--noir-profond: #1A1A1A;
|
||||||
|
--gris-sombre: #2A2A2A;
|
||||||
|
--or-clair: #F5BD4F;
|
||||||
|
--vert-clair: #00C569;
|
||||||
|
--rouge-clair: #FF2D5F;
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
## Fonctionnalités
|
||||||
|
|
||||||
|
- ✅ Design responsive et moderne
|
||||||
|
- ✅ Animations fluides
|
||||||
|
- ✅ Navigation mobile
|
||||||
|
- ✅ Scroll smooth
|
||||||
|
- ✅ Effets hover interactifs
|
||||||
|
- ✅ Easter egg Konami Code
|
||||||
|
- ✅ Performance optimisée
|
||||||
|
- ✅ SEO friendly
|
||||||
|
- ✅ Logo et favicon intégrés
|
||||||
|
- ✅ Charte graphique basée sur le logo officiel
|
||||||
|
|
||||||
|
## Sections du site
|
||||||
|
|
||||||
|
1. **Hero** - Présentation de l'organisation
|
||||||
|
2. **Fédiverse** - Services alternatifs (PeerTube, Pleroma, Funkwhale, Castopod)
|
||||||
|
3. **Projets Web** - Projets de l'organisation
|
||||||
|
4. **Mission** - Valeurs et objectifs
|
||||||
|
5. **Hébergement** - Services d'hébergement proposés
|
||||||
|
6. **Support** - Options de dons
|
||||||
|
7. **Partenaires** - Nos partenaires médias et créateurs
|
||||||
|
8. **Contact** - Liens vers réseaux sociaux et plateformes
|
||||||
|
|
||||||
|
## Contribution
|
||||||
|
|
||||||
|
Les contributions sont les bienvenues ! N'hésitez pas à ouvrir une issue ou une pull request sur [Codeberg](https://codeberg.org/OKI/o-k-i.net-V2).
|
||||||
|
|
||||||
|
## Licence
|
||||||
|
|
||||||
|
Ce projet est sous licence **GNU Affero General Public License v3.0 (AGPL-V3)**.
|
||||||
|
|
||||||
|
La licence AGPL-V3 est une licence de logiciel libre qui garantit :
|
||||||
|
- La liberté d'utiliser le logiciel à toute fin
|
||||||
|
- La liberté d'étudier et de modifier le code source
|
||||||
|
- La liberté de redistribuer des copies
|
||||||
|
- L'obligation de partager les modifications sous la même licence
|
||||||
|
- L'obligation de fournir le code source aux utilisateurs du service en ligne
|
||||||
|
|
||||||
|
Voir le fichier [LICENSE](LICENSE) pour plus de détails ou consultez : https://www.gnu.org/licenses/agpl-3.0.html
|
||||||
|
|
||||||
|
© 2024 ORGANISATION KA INTERNATIONALE
|
||||||
|
|
||||||
|
## Liens
|
||||||
|
|
||||||
|
- 🌐 [Site web](https://o-k-i.net)
|
||||||
|
- 📺 [GADE (PeerTube)](https://gade.o-k-i.net/)
|
||||||
|
- 🐦 [BOKANTAJ (Pleroma)](https://bokantaj.o-k-i.net/)
|
||||||
|
- 🎵 [MIZIK (Funkwhale)](https://mizik.o-k-i.net/library)
|
||||||
|
- 🎙️ [KUTE (Castopod)](https://kute.o-k-i.net/)
|
||||||
|
- 💻 [Codeberg](https://codeberg.org/OKI)
|
||||||
|
- 📧 kontak@o-k-i.net
|
||||||
@@ -0,0 +1,27 @@
|
|||||||
|
module.exports = function(eleventyConfig) {
|
||||||
|
// Copy assets folders to output
|
||||||
|
eleventyConfig.addPassthroughCopy("src/assets");
|
||||||
|
|
||||||
|
// Watch CSS files for changes
|
||||||
|
eleventyConfig.addWatchTarget("src/assets/css/");
|
||||||
|
|
||||||
|
// Watch JS files for changes
|
||||||
|
eleventyConfig.addWatchTarget("src/assets/js/");
|
||||||
|
|
||||||
|
// Configure browser sync to reload on CSS changes
|
||||||
|
eleventyConfig.setBrowserSyncConfig({
|
||||||
|
files: ['_site/assets/css/**/*.css', '_site/assets/js/**/*.js']
|
||||||
|
});
|
||||||
|
|
||||||
|
return {
|
||||||
|
dir: {
|
||||||
|
input: "src",
|
||||||
|
output: "_site",
|
||||||
|
includes: "_includes",
|
||||||
|
data: "_data"
|
||||||
|
},
|
||||||
|
templateFormats: ["html", "md", "njk", "liquid"],
|
||||||
|
htmlTemplateEngine: "njk",
|
||||||
|
markdownTemplateEngine: "njk"
|
||||||
|
};
|
||||||
|
};
|
||||||
Generated
+1700
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,16 @@
|
|||||||
|
{
|
||||||
|
"name": "o-k-i.net-v2",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "Site web de l'Organisation Ka Internationale (OKI) - V2",
|
||||||
|
"scripts": {
|
||||||
|
"start": "eleventy --serve",
|
||||||
|
"build": "eleventy",
|
||||||
|
"clean": "rm -rf _site"
|
||||||
|
},
|
||||||
|
"keywords": [],
|
||||||
|
"author": "Organisation Ka Internationale",
|
||||||
|
"license": "AGPL-3.0",
|
||||||
|
"devDependencies": {
|
||||||
|
"@11ty/eleventy": "^3.1.2"
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,60 @@
|
|||||||
|
{
|
||||||
|
"sections": [
|
||||||
|
{
|
||||||
|
"title": "🌐 Web & Contact",
|
||||||
|
"links": [
|
||||||
|
{
|
||||||
|
"text": "o-k-i.net",
|
||||||
|
"url": "https://o-k-i.net"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "kontak@o-k-i.net",
|
||||||
|
"url": "mailto:kontak@o-k-i.net"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "💬 Réseaux sociaux",
|
||||||
|
"links": [
|
||||||
|
{
|
||||||
|
"text": "Telegram",
|
||||||
|
"url": "https://t.me/OrganisationKA"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "X (Twitter)",
|
||||||
|
"url": "https://x.com/OrganisationKA"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "Pleroma",
|
||||||
|
"url": "https://bokantaj.o-k-i.net/@admin"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "🎥 Médias",
|
||||||
|
"links": [
|
||||||
|
{
|
||||||
|
"text": "Chaîne PeerTube",
|
||||||
|
"url": "https://gade.o-k-i.net/a/oki/video-channels"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "Discord",
|
||||||
|
"url": "https://discord.gg/a2r9NYNM"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "Revolt",
|
||||||
|
"url": "https://rvlt.gg/e1zJrg3p"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "💻 Code & Développement",
|
||||||
|
"links": [
|
||||||
|
{
|
||||||
|
"text": "Codeberg",
|
||||||
|
"url": "https://codeberg.org/OKI"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
@@ -0,0 +1,27 @@
|
|||||||
|
[
|
||||||
|
{
|
||||||
|
"text": "Fédiverse",
|
||||||
|
"url": "#fediverse"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "Projets Web",
|
||||||
|
"url": "#projets"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "Mission",
|
||||||
|
"url": "#mission"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "Hébergement",
|
||||||
|
"url": "#hebergement"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "Partenaires",
|
||||||
|
"url": "#partenaires"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "Codeberg",
|
||||||
|
"url": "https://codeberg.org/OKI",
|
||||||
|
"external": true
|
||||||
|
}
|
||||||
|
]
|
||||||
@@ -0,0 +1,14 @@
|
|||||||
|
[
|
||||||
|
{
|
||||||
|
"name": "Joukawouvè",
|
||||||
|
"logo": "/assets/images/joukawouve.png",
|
||||||
|
"description": "Partage de l'actualité guadeloupéenne et internationale.",
|
||||||
|
"url": "https://gade.o-k-i.net/accounts/joukawouve"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Aktivist Vybz #AKV",
|
||||||
|
"logo": "/assets/images/akv.png",
|
||||||
|
"description": "Sélecteurs et DJs engagés, avec un contenu axé sur l'activisme et l'expression culturelle.",
|
||||||
|
"url": "https://gade.o-k-i.net/accounts/aktivist_vybz_akv"
|
||||||
|
}
|
||||||
|
]
|
||||||
@@ -0,0 +1,37 @@
|
|||||||
|
[
|
||||||
|
{
|
||||||
|
"name": "FEDIVERSE OKI",
|
||||||
|
"icon": "🌐",
|
||||||
|
"domain": "fediverse.o-k-i.net",
|
||||||
|
"description": "Portail d'accès à tous nos services Fédiverse",
|
||||||
|
"url": "https://fediverse.o-k-i.net/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "OKI.RE",
|
||||||
|
"icon": "🎶",
|
||||||
|
"domain": "oki.re",
|
||||||
|
"description": "Transcriptions et traductions de productions musicales",
|
||||||
|
"url": "https://oki.re/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "NUVEL.NU",
|
||||||
|
"icon": "📰",
|
||||||
|
"domain": "nuvel.nu",
|
||||||
|
"description": "Actualités multilingues de nos régions",
|
||||||
|
"url": "https://nuvel.nu/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "JWE.OVH",
|
||||||
|
"icon": "🎮",
|
||||||
|
"domain": "jwe.ovh",
|
||||||
|
"description": "Jeu cartographique éducatif et ludique",
|
||||||
|
"url": "https://jwe.ovh/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "GONG.GP",
|
||||||
|
"icon": "📚",
|
||||||
|
"domain": "gong.gp",
|
||||||
|
"description": "Documents historiques du GONG",
|
||||||
|
"url": "https://gong.gp/"
|
||||||
|
}
|
||||||
|
]
|
||||||
@@ -0,0 +1,34 @@
|
|||||||
|
[
|
||||||
|
{
|
||||||
|
"name": "KUTE",
|
||||||
|
"icon": "🎙️",
|
||||||
|
"platform": "Castopod",
|
||||||
|
"description": "Alternative libre pour le podcasting. Créez, hébergez et diffusez vos podcasts en toute autonomie.",
|
||||||
|
"url": "https://kute.o-k-i.net/",
|
||||||
|
"linkText": "Découvrir KUTE"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "GADE",
|
||||||
|
"icon": "📺",
|
||||||
|
"platform": "PeerTube",
|
||||||
|
"description": "Alternative libre à YouTube pour le partage de vidéos. Hébergez et partagez vos contenus vidéo en toute liberté.",
|
||||||
|
"url": "https://gade.o-k-i.net/",
|
||||||
|
"linkText": "Accéder à GADE"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "BOKANTAJ",
|
||||||
|
"icon": "🐦",
|
||||||
|
"platform": "Pleroma + Soapbox",
|
||||||
|
"description": "Alternative libre à X (Twitter) pour les réseaux sociaux. Communiquez librement dans un espace respectueux.",
|
||||||
|
"url": "https://bokantaj.o-k-i.net/",
|
||||||
|
"linkText": "Rejoindre BOKANTAJ"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "MIZIK",
|
||||||
|
"icon": "🎵",
|
||||||
|
"platform": "Funkwhale",
|
||||||
|
"description": "Alternative libre à SoundCloud pour la musique. Partagez et découvrez de la musique sans limites.",
|
||||||
|
"url": "https://mizik.o-k-i.net/library",
|
||||||
|
"linkText": "Écouter sur MIZIK"
|
||||||
|
}
|
||||||
|
]
|
||||||
@@ -0,0 +1,9 @@
|
|||||||
|
{
|
||||||
|
"name": "ORGANISATION KA INTERNATIONALE",
|
||||||
|
"shortName": "OKI",
|
||||||
|
"description": "Association à but non lucratif dédiée à la promotion de nos langues et au traitement de l'actualité, proposant des alternatives libres aux GAFAM.",
|
||||||
|
"url": "https://o-k-i.net",
|
||||||
|
"email": "kontak@o-k-i.net",
|
||||||
|
"copyright": "© 2025 ORGANISATION KA INTERNATIONALE",
|
||||||
|
"tagline": "Hébergé avec 💛"
|
||||||
|
}
|
||||||
@@ -0,0 +1,22 @@
|
|||||||
|
[
|
||||||
|
{
|
||||||
|
"icon": "🌍",
|
||||||
|
"title": "Langues",
|
||||||
|
"description": "Promotion et préservation de nos langues"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon": "🔓",
|
||||||
|
"title": "Liberté",
|
||||||
|
"description": "Logiciels libres et données ouvertes"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon": "🤝",
|
||||||
|
"title": "Communauté",
|
||||||
|
"description": "Ensemble pour un internet éthique"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon": "🛡️",
|
||||||
|
"title": "Souveraineté",
|
||||||
|
"description": "Contrôle de nos données et infrastructures"
|
||||||
|
}
|
||||||
|
]
|
||||||
@@ -0,0 +1,22 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>{% if title %}{{ title }} | {{ site.name }}{% else %}{{ site.name }} | {{ site.shortName }}{% endif %}</title>
|
||||||
|
<meta name="description" content="{{ description or site.description }}">
|
||||||
|
<link rel="icon" type="image/x-icon" href="/assets/images/favicon.ico">
|
||||||
|
<link rel="icon" type="image/png" sizes="512x512" href="/assets/images/logo-512x512.png">
|
||||||
|
<link rel="apple-touch-icon" href="/assets/images/logo-512x512.png">
|
||||||
|
<link rel="stylesheet" href="/assets/css/styles.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
{% include "partials/nav.njk" %}
|
||||||
|
|
||||||
|
{{ content | safe }}
|
||||||
|
|
||||||
|
{% include "partials/footer.njk" %}
|
||||||
|
|
||||||
|
<script src="/assets/js/main.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
<section class="contact" id="contact">
|
||||||
|
<div class="contact-grid">
|
||||||
|
{% for section in contact.sections %}
|
||||||
|
<div class="contact-card">
|
||||||
|
<h3>{{ section.title }}</h3>
|
||||||
|
<div class="contact-links">
|
||||||
|
{% for link in section.links %}
|
||||||
|
<a href="{{ link.url }}"{% if link.url.startsWith('http') %} target="_blank"{% endif %}>
|
||||||
|
{{ link.text }}
|
||||||
|
</a>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@@ -0,0 +1,22 @@
|
|||||||
|
<section id="fediverse" class="fediverse">
|
||||||
|
<div class="section-container">
|
||||||
|
<h2>Nos Services <span class="accent-text">Fédiverse</span></h2>
|
||||||
|
<p class="section-subtitle">Alternatives libres et éthiques aux géants du numérique</p>
|
||||||
|
|
||||||
|
<div class="services-grid">
|
||||||
|
{% for service in services %}
|
||||||
|
<div class="service-card">
|
||||||
|
<div class="service-icon">{{ service.icon }}</div>
|
||||||
|
<h3>{{ service.name }}</h3>
|
||||||
|
<div class="service-platform">{{ service.platform }}</div>
|
||||||
|
<p class="service-description">
|
||||||
|
{{ service.description }}
|
||||||
|
</p>
|
||||||
|
<a href="{{ service.url }}" target="_blank" class="service-link">
|
||||||
|
{{ service.linkText }} →
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@@ -0,0 +1,18 @@
|
|||||||
|
<footer>
|
||||||
|
<div class="footer-content">
|
||||||
|
<p style="font-size: 1.2rem; font-weight: 600; margin-bottom: 1rem;">
|
||||||
|
{{ site.name }}
|
||||||
|
</p>
|
||||||
|
<p style="opacity: 0.8;">
|
||||||
|
Association à but non lucratif | Promotion des langues et cultures | Alternatives libres aux GAFAM
|
||||||
|
</p>
|
||||||
|
<p style="margin-top: 1rem; font-size: 0.9rem; opacity: 0.7;">
|
||||||
|
{{ site.copyright }} | {{ site.tagline }}
|
||||||
|
</p>
|
||||||
|
<p style="margin-top: 1rem;">
|
||||||
|
<a href="/mentions-legales/" style="color: var(--or-oki); text-decoration: none; transition: opacity 0.3s;" onmouseover="this.style.opacity='0.7'" onmouseout="this.style.opacity='1'">
|
||||||
|
Mentions Légales
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
@@ -0,0 +1,24 @@
|
|||||||
|
<section class="hero">
|
||||||
|
<div class="network-bg">
|
||||||
|
<div class="node" style="top: 20%; left: 10%;"></div>
|
||||||
|
<div class="node" style="top: 50%; left: 80%; animation-delay: 1s;"></div>
|
||||||
|
<div class="node" style="top: 70%; left: 30%; animation-delay: 2s;"></div>
|
||||||
|
<div class="node" style="top: 30%; left: 60%; animation-delay: 0.5s;"></div>
|
||||||
|
<div class="node" style="top: 80%; left: 70%; animation-delay: 1.5s;"></div>
|
||||||
|
</div>
|
||||||
|
<div class="hero-content">
|
||||||
|
<h1>ORGANISATION KA</h1>
|
||||||
|
<h2 class="hero-subtitle">INTERNATIONALE</h2>
|
||||||
|
<div class="hero-tags">
|
||||||
|
<span class="tag">🌍 Traductions</span>
|
||||||
|
<span class="tag">🎭 Cultures</span>
|
||||||
|
<span class="tag">📰 Actualités</span>
|
||||||
|
<span class="tag">🌐 Fédiverse</span>
|
||||||
|
</div>
|
||||||
|
<p>{{ site.description }}</p>
|
||||||
|
<div class="cta-buttons">
|
||||||
|
<a href="#fediverse" class="btn btn-primary">Découvrir nos Services</a>
|
||||||
|
<a href="#mission" class="btn btn-secondary">Notre Mission</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@@ -0,0 +1,84 @@
|
|||||||
|
<section id="hebergement" class="hosting">
|
||||||
|
<div class="section-container">
|
||||||
|
<h2 style="text-align: center; margin-bottom: 3rem;">Services <span class="accent-text">d'Hébergement & Infrastructure</span></h2>
|
||||||
|
|
||||||
|
<div class="hosting-banner">
|
||||||
|
<h3>🚀 Solutions complètes pour votre souveraineté numérique</h3>
|
||||||
|
<p>OKI administre et sécurise les outils informatiques pour associations, collectifs et initiatives citoyennes.</p>
|
||||||
|
|
||||||
|
<div class="hosting-features">
|
||||||
|
<div class="hosting-feature">
|
||||||
|
<span>✓</span> Hébergement mutualisé sécurisé
|
||||||
|
</div>
|
||||||
|
<div class="hosting-feature">
|
||||||
|
<span>✓</span> Gestion de noms de domaine
|
||||||
|
</div>
|
||||||
|
<div class="hosting-feature">
|
||||||
|
<span>✓</span> Instances Fédiverse clé en main
|
||||||
|
</div>
|
||||||
|
<div class="hosting-feature">
|
||||||
|
<span>✓</span> Sauvegardes automatiques quotidiennes
|
||||||
|
</div>
|
||||||
|
<div class="hosting-feature">
|
||||||
|
<span>✓</span> Serveur mail inclus
|
||||||
|
</div>
|
||||||
|
<div class="hosting-feature">
|
||||||
|
<span>✓</span> Support technique
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="services-offerings">
|
||||||
|
<h3 style="text-align: center; color: var(--or-oki); margin: 3rem 0 2rem;">Nos offres de services</h3>
|
||||||
|
|
||||||
|
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem; margin-bottom: 3rem;">
|
||||||
|
|
||||||
|
<div class="service-offering-card" style="background: rgba(0, 168, 84, 0.1); border: 2px solid var(--vert-oki); border-radius: 20px; padding: 2rem;">
|
||||||
|
<h4 style="color: var(--vert-oki); margin-bottom: 1rem;">📦 Hébergement Web</h4>
|
||||||
|
<ul style="list-style: none; padding: 0; margin-bottom: 1.5rem;">
|
||||||
|
<li style="margin-bottom: 0.5rem;">• WordPress, Sites statiques</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">• Base de données MySQL/PostgreSQL</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">• Certificat SSL gratuit</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">• Stockage évolutif</li>
|
||||||
|
</ul>
|
||||||
|
<p style="color: var(--or-oki); font-weight: bold;">Mutualisé</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="service-offering-card" style="background: rgba(237, 28, 76, 0.1); border: 2px solid var(--rouge-oki); border-radius: 20px; padding: 2rem;">
|
||||||
|
<h4 style="color: var(--rouge-oki); margin-bottom: 1rem;">🌐 Instances Fédiverse</h4>
|
||||||
|
<ul style="list-style: none; padding: 0; margin-bottom: 1.5rem;">
|
||||||
|
<li style="margin-bottom: 0.5rem;">• PeerTube (vidéo)</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">• Mastodon/Pleroma (social)</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">• Funkwhale (audio)</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">• Pixelfed (photos)</li>
|
||||||
|
</ul>
|
||||||
|
<p style="color: var(--or-oki); font-weight: bold;">Installation & maintenance</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="background: rgba(232, 166, 37, 0.1); border-radius: 15px; padding: 2rem; margin-bottom: 2rem;">
|
||||||
|
<h4 style="color: var(--or-oki); margin-bottom: 1rem;">🔐 Services de gestion sécurisée</h4>
|
||||||
|
<p style="margin-bottom: 1rem;">OKI peut assurer la gestion complète de vos propriétés numériques :</p>
|
||||||
|
<ul style="list-style: none; padding-left: 1rem;">
|
||||||
|
<li style="margin-bottom: 0.5rem;">✅ Propriété et gestion de noms de domaine</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">✅ Administration de comptes web (réseaux sociaux, emails)</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">✅ Gestion sécurisée des accès et mots de passe</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">✅ Protection contre les prises de contrôle internes</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">✅ Médiation en cas de conflits sur les outils numériques</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="text-align: center; margin-top: 3rem;">
|
||||||
|
<h4 style="color: var(--or-oki); margin-bottom: 1rem;">💡 Pourquoi choisir OKI ?</h4>
|
||||||
|
<p style="max-width: 800px; margin: 0 auto 2rem; line-height: 1.6;">
|
||||||
|
Notre équipe technique, composée d'experts engagés, garantit l'impartialité,
|
||||||
|
la sécurité et la pérennité de vos outils numériques. Nous mutualisons les coûts entre
|
||||||
|
projets solidaires pour des tarifs justes et accessibles.
|
||||||
|
</p>
|
||||||
|
<a href="#contact" class="btn btn-primary">
|
||||||
|
Contactez-nous →
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@@ -0,0 +1,19 @@
|
|||||||
|
<section id="mission" class="mission">
|
||||||
|
<div class="section-container">
|
||||||
|
<h2>Notre <span class="accent-text">Mission</span></h2>
|
||||||
|
<p class="mission-text">
|
||||||
|
Soutenez notre mission de promotion de nos langues tout en contribuant à la diffusion d'une information libre et indépendante.
|
||||||
|
Votre soutien nous aide à maintenir des alternatives aux géants du numérique et à financer nos coûts de serveur.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div class="values-grid">
|
||||||
|
{% for value in values %}
|
||||||
|
<div class="value-card">
|
||||||
|
<div class="value-icon">{{ value.icon }}</div>
|
||||||
|
<h3>{{ value.title }}</h3>
|
||||||
|
<p>{{ value.description }}</p>
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@@ -0,0 +1,22 @@
|
|||||||
|
<nav>
|
||||||
|
<div class="nav-container">
|
||||||
|
<a href="/" class="logo logo-with-glow" style="display: flex; align-items: center; gap: 0.5rem;">
|
||||||
|
<img src="/assets/images/logo-512x512.png" alt="{{ site.shortName }} Logo" class="logo-image" style="height: 2.5rem; width: auto;">
|
||||||
|
<span>{{ site.shortName }}</span>
|
||||||
|
</a>
|
||||||
|
<ul class="nav-links">
|
||||||
|
{% for item in navigation %}
|
||||||
|
<li>
|
||||||
|
<a href="{{ item.url }}"{% if item.external %} target="_blank"{% endif %}>
|
||||||
|
{{ item.text }}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
{% endfor %}
|
||||||
|
</ul>
|
||||||
|
<div class="menu-toggle">
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
@@ -0,0 +1,23 @@
|
|||||||
|
<section id="partenaires" class="partners">
|
||||||
|
<div class="section-container">
|
||||||
|
<h2 style="text-align: center; margin-bottom: 1rem;">Nos <span class="accent-text">Partenaires</span></h2>
|
||||||
|
<p class="section-subtitle">
|
||||||
|
Ils partagent nos valeurs et contribuent à enrichir notre écosystème numérique libre
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div class="partners-grid">
|
||||||
|
{% for partner in partners %}
|
||||||
|
<a href="{{ partner.url }}" target="_blank" rel="noopener noreferrer" class="partner-card">
|
||||||
|
<div class="partner-logo-container">
|
||||||
|
<img src="{{ partner.logo }}" alt="Logo {{ partner.name }}" class="partner-logo">
|
||||||
|
</div>
|
||||||
|
<h3>{{ partner.name }}</h3>
|
||||||
|
<p class="partner-description">{{ partner.description }}</p>
|
||||||
|
<span class="partner-link">
|
||||||
|
Découvrir sur GADE →
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@@ -0,0 +1,19 @@
|
|||||||
|
<section id="projets" class="projects">
|
||||||
|
<div class="section-container">
|
||||||
|
<h2>Nos <span class="accent-text">Projets Web</span></h2>
|
||||||
|
|
||||||
|
<div class="project-cards">
|
||||||
|
{% for project in projects %}
|
||||||
|
<a href="{{ project.url }}" target="_blank" rel="noopener noreferrer" class="project-card" style="text-decoration: none; color: inherit;">
|
||||||
|
<div class="project-icon">{{ project.icon }}</div>
|
||||||
|
<h3>{{ project.name }}</h3>
|
||||||
|
<p class="project-domain">{{ project.domain }}</p>
|
||||||
|
<p>{{ project.description }}</p>
|
||||||
|
<span class="service-link" style="margin-top: 1rem;">
|
||||||
|
Visiter le site →
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@@ -0,0 +1,149 @@
|
|||||||
|
<section class="support">
|
||||||
|
<div class="section-container">
|
||||||
|
<h2>Nous <span class="accent-text">Soutenir</span></h2>
|
||||||
|
<p style="font-size: 1.3rem; margin-bottom: 1rem;">
|
||||||
|
Soutenez notre mission de promotion de nos langues et d'alternatives libres aux GAFAM
|
||||||
|
</p>
|
||||||
|
<p style="font-size: 1.1rem; margin-bottom: 3rem; opacity: 0.9;">
|
||||||
|
Votre don nous aide à maintenir nos services et à financer nos coûts de serveur.<br>
|
||||||
|
Chaque contribution renforce notre engagement envers la diversité linguistique, technologique et médiatique.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<!-- Donation Options Container -->
|
||||||
|
<div style="max-width: 900px; margin: 0 auto;">
|
||||||
|
|
||||||
|
<!-- One-time Donations -->
|
||||||
|
<div style="background: rgba(232, 166, 37, 0.1); border-radius: 20px; padding: 2rem; margin-bottom: 2rem;">
|
||||||
|
<h3 style="color: var(--or-oki); margin-bottom: 1.5rem; text-align: center;">
|
||||||
|
💸 Don ponctuel
|
||||||
|
</h3>
|
||||||
|
|
||||||
|
<div class="donation-grid" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 1rem; margin-bottom: 1.5rem;">
|
||||||
|
<a href="https://don.o-k-i.net/b/aEUdTw5SD3SH7m0bII" class="donation-amount" target="_blank" rel="noopener noreferrer">
|
||||||
|
1€
|
||||||
|
</a>
|
||||||
|
<a href="https://don.o-k-i.net/b/4gw6r480L1Kz5dScMO" class="donation-amount" target="_blank" rel="noopener noreferrer">
|
||||||
|
5€
|
||||||
|
</a>
|
||||||
|
<a href="https://don.o-k-i.net/b/5kA02G1Cn4WLbCgeUV" class="donation-amount" target="_blank" rel="noopener noreferrer">
|
||||||
|
10€
|
||||||
|
</a>
|
||||||
|
<a href="https://don.o-k-i.net/b/fZebLo94PfBpayc5kn" class="donation-amount" target="_blank" rel="noopener noreferrer">
|
||||||
|
20€
|
||||||
|
</a>
|
||||||
|
<a href="https://don.o-k-i.net/b/6oE5n05SDdth49O004" class="donation-amount" target="_blank" rel="noopener noreferrer">
|
||||||
|
50€
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="text-align: center;">
|
||||||
|
<label style="display: block; margin-bottom: 1rem; color: var(--blanc-creme);">Montant personnalisé :</label>
|
||||||
|
<div class="custom-donation-form">
|
||||||
|
<input type="number" id="customAmountOneTime" placeholder="Montant" min="1" class="custom-amount-input">
|
||||||
|
<span class="currency-symbol">€</span>
|
||||||
|
<button onclick="handleCustomDonation('oneTime')" class="custom-donation-btn custom-donation-btn-primary" onmouseover="this.style.transform='translateY(-2px)'" onmouseout="this.style.transform=''">
|
||||||
|
Donner
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Monthly Donations -->
|
||||||
|
<div style="background: rgba(0, 168, 84, 0.1); border-radius: 20px; padding: 2rem;">
|
||||||
|
<h3 style="color: var(--vert-oki); margin-bottom: 1.5rem; text-align: center;">
|
||||||
|
⭐ Don mensuel
|
||||||
|
</h3>
|
||||||
|
|
||||||
|
<div class="donation-grid" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 1rem; margin-bottom: 1.5rem;">
|
||||||
|
<a href="https://don.o-k-i.net/b/7sI9Dgch14WL7m0fZ3" class="donation-amount monthly" target="_blank" rel="noopener noreferrer">
|
||||||
|
1€/mois
|
||||||
|
</a>
|
||||||
|
<a href="https://don.o-k-i.net/b/8wM4iW4Ozbl95dS6ow" class="donation-amount monthly" target="_blank" rel="noopener noreferrer">
|
||||||
|
5€/mois
|
||||||
|
</a>
|
||||||
|
<a href="https://don.o-k-i.net/b/8wM2aO80L74TcGk3ci" class="donation-amount monthly" target="_blank" rel="noopener noreferrer">
|
||||||
|
10€/mois
|
||||||
|
</a>
|
||||||
|
<a href="https://don.o-k-i.net/b/00g7v894P88XgWAfZ7" class="donation-amount monthly" target="_blank" rel="noopener noreferrer">
|
||||||
|
20€/mois
|
||||||
|
</a>
|
||||||
|
<a href="https://don.o-k-i.net/b/4gw8zc6WHgFtcGkbIP" class="donation-amount monthly" target="_blank" rel="noopener noreferrer">
|
||||||
|
50€/mois
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="text-align: center;">
|
||||||
|
<label style="display: block; margin-bottom: 1rem; color: var(--blanc-creme);">Montant mensuel personnalisé :</label>
|
||||||
|
<div class="custom-donation-form">
|
||||||
|
<input type="number" id="customAmountMonthly" placeholder="Montant" min="1" class="custom-amount-input custom-amount-input-monthly">
|
||||||
|
<span class="currency-symbol">€/mois</span>
|
||||||
|
<button onclick="handleCustomDonation('monthly')" class="custom-donation-btn custom-donation-btn-secondary" onmouseover="this.style.transform='translateY(-2px)'" onmouseout="this.style.transform=''">
|
||||||
|
S'abonner
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Alternative Donation Methods -->
|
||||||
|
<div style="margin-top: 3rem;">
|
||||||
|
<h3 style="text-align: center; color: var(--or-oki); margin-bottom: 2rem; font-size: 1.5rem;">
|
||||||
|
Autres moyens de nous soutenir
|
||||||
|
</h3>
|
||||||
|
|
||||||
|
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem; max-width: 700px; margin: 0 auto;">
|
||||||
|
|
||||||
|
<!-- Liberapay -->
|
||||||
|
<a href="https://liberapay.com/OKI/donate" target="_blank" rel="noopener noreferrer" style="
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 1rem;
|
||||||
|
padding: 2rem;
|
||||||
|
background: rgba(242, 179, 54, 0.1);
|
||||||
|
border: 2px solid #F2B336;
|
||||||
|
border-radius: 15px;
|
||||||
|
text-decoration: none;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
" onmouseover="this.style.transform='translateY(-5px)'; this.style.boxShadow='0 10px 30px rgba(242, 179, 54, 0.3)'" onmouseout="this.style.transform=''; this.style.boxShadow=''">
|
||||||
|
<div style="font-size: 3rem;">💛</div>
|
||||||
|
<h4 style="color: #F2B336; font-size: 1.3rem; margin: 0;">Liberapay</h4>
|
||||||
|
<p style="color: var(--blanc-creme); text-align: center; margin: 0; font-size: 0.95rem;">
|
||||||
|
Soutenez-nous via Liberapay, une plateforme libre et éthique
|
||||||
|
</p>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<!-- Ko-fi -->
|
||||||
|
<a href="https://ko-fi.com/J3J5TOZPI" target="_blank" rel="noopener noreferrer" style="
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 1rem;
|
||||||
|
padding: 2rem;
|
||||||
|
background: rgba(255, 93, 93, 0.1);
|
||||||
|
border: 2px solid #FF5E5B;
|
||||||
|
border-radius: 15px;
|
||||||
|
text-decoration: none;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
" onmouseover="this.style.transform='translateY(-5px)'; this.style.boxShadow='0 10px 30px rgba(255, 93, 93, 0.3)'" onmouseout="this.style.transform=''; this.style.boxShadow=''">
|
||||||
|
<div style="font-size: 3rem;">☕</div>
|
||||||
|
<h4 style="color: #FF5E5B; font-size: 1.3rem; margin: 0;">Ko-fi</h4>
|
||||||
|
<p style="color: var(--blanc-creme); text-align: center; margin: 0; font-size: 0.95rem;">
|
||||||
|
Offrez-nous un café sur Ko-fi pour nous encourager
|
||||||
|
</p>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="text-align: center; margin-top: 3rem; padding: 1.5rem; background: rgba(0, 0, 0, 0.3); border-radius: 15px;">
|
||||||
|
<p style="font-size: 0.95rem; margin-bottom: 0.5rem;">
|
||||||
|
🔒 Vos paiements sont sécurisés et traités de manière fiable par <a href="https://stripe.com/" target="_blank" style="color: var(--or-oki); text-decoration: none;">Stripe</a>.
|
||||||
|
</p>
|
||||||
|
<p style="font-size: 0.9rem; opacity: 0.8;">
|
||||||
|
Aucune information de paiement n'est stockée sur notre site.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@@ -0,0 +1,829 @@
|
|||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root {
|
||||||
|
/* Couleurs du logo OKI */
|
||||||
|
--or-oki: #E8A625;
|
||||||
|
--noir-oki: #000000;
|
||||||
|
--vert-oki: #00A854;
|
||||||
|
--rouge-oki: #ED1C4C;
|
||||||
|
--blanc-creme: #F7F7F2;
|
||||||
|
|
||||||
|
/* Couleurs dérivées pour le design */
|
||||||
|
--noir-profond: #1A1A1A;
|
||||||
|
--gris-sombre: #2A2A2A;
|
||||||
|
--or-clair: #F5BD4F;
|
||||||
|
--vert-clair: #00C569;
|
||||||
|
--rouge-clair: #FF2D5F;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
|
||||||
|
background: linear-gradient(135deg, var(--noir-oki) 0%, var(--gris-sombre) 100%);
|
||||||
|
color: var(--blanc-creme);
|
||||||
|
min-height: 100vh;
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Navigation */
|
||||||
|
nav {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
padding: 1rem 2rem;
|
||||||
|
background: rgba(0, 0, 0, 0.95);
|
||||||
|
backdrop-filter: blur(10px);
|
||||||
|
z-index: 1000;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
border-bottom: 2px solid var(--or-oki);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-container {
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
font-size: 1.8rem;
|
||||||
|
font-weight: 900;
|
||||||
|
background: linear-gradient(135deg, var(--or-oki), var(--or-clair));
|
||||||
|
-webkit-background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo-image {
|
||||||
|
filter: drop-shadow(0 0 8px rgba(232, 166, 37, 0.6))
|
||||||
|
drop-shadow(0 0 15px rgba(232, 166, 37, 0.4))
|
||||||
|
drop-shadow(0 0 25px rgba(232, 166, 37, 0.2));
|
||||||
|
transition: filter 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo-with-glow:hover .logo-image {
|
||||||
|
filter: drop-shadow(0 0 12px rgba(232, 166, 37, 0.8))
|
||||||
|
drop-shadow(0 0 20px rgba(232, 166, 37, 0.6))
|
||||||
|
drop-shadow(0 0 35px rgba(232, 166, 37, 0.4));
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links {
|
||||||
|
display: flex;
|
||||||
|
gap: 2rem;
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links a {
|
||||||
|
color: var(--blanc-creme);
|
||||||
|
text-decoration: none;
|
||||||
|
transition: color 0.3s;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links a:hover {
|
||||||
|
color: var(--or-oki);
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-toggle {
|
||||||
|
display: none;
|
||||||
|
flex-direction: column;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-toggle span {
|
||||||
|
width: 25px;
|
||||||
|
height: 3px;
|
||||||
|
background: var(--or-oki);
|
||||||
|
margin: 3px 0;
|
||||||
|
transition: 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hero Section */
|
||||||
|
.hero {
|
||||||
|
padding: 8rem 2rem 4rem;
|
||||||
|
min-height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-content {
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
z-index: 2;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero h1 {
|
||||||
|
font-size: clamp(2rem, 6vw, 4rem);
|
||||||
|
font-weight: 900;
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
line-height: 1.1;
|
||||||
|
animation: fadeInUp 0.8s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-subtitle {
|
||||||
|
font-size: clamp(1.5rem, 4vw, 2.5rem);
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
color: var(--or-oki);
|
||||||
|
animation: fadeInUp 0.8s ease 0.1s both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.accent-text {
|
||||||
|
background: linear-gradient(135deg, var(--or-oki), var(--rouge-oki));
|
||||||
|
-webkit-background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero p {
|
||||||
|
font-size: 1.3rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
opacity: 0.9;
|
||||||
|
max-width: 700px;
|
||||||
|
animation: fadeInUp 0.8s ease 0.2s both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-tags {
|
||||||
|
display: flex;
|
||||||
|
gap: 1rem;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
animation: fadeInUp 0.8s ease 0.3s both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tag {
|
||||||
|
padding: 0.5rem 1rem;
|
||||||
|
background: rgba(232, 166, 37, 0.2);
|
||||||
|
border-radius: 20px;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
border: 1px solid var(--or-oki);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cta-buttons {
|
||||||
|
display: flex;
|
||||||
|
gap: 1rem;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
animation: fadeInUp 0.8s ease 0.4s both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
padding: 1rem 2rem;
|
||||||
|
border: none;
|
||||||
|
border-radius: 50px;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
font-weight: 600;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
text-decoration: none;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary {
|
||||||
|
background: linear-gradient(135deg, var(--or-oki), var(--or-clair));
|
||||||
|
color: var(--noir-oki);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary:hover {
|
||||||
|
transform: translateY(-3px);
|
||||||
|
box-shadow: 0 10px 30px rgba(232, 166, 37, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-secondary {
|
||||||
|
background: transparent;
|
||||||
|
color: var(--or-oki);
|
||||||
|
border: 2px solid var(--or-oki);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-secondary:hover {
|
||||||
|
background: var(--or-oki);
|
||||||
|
color: var(--noir-oki);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Network Animation */
|
||||||
|
.network-bg {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
opacity: 0.1;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.node {
|
||||||
|
position: absolute;
|
||||||
|
width: 4px;
|
||||||
|
height: 4px;
|
||||||
|
background: var(--or-oki);
|
||||||
|
border-radius: 50%;
|
||||||
|
animation: pulse 3s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Fediverse Services Section */
|
||||||
|
.fediverse {
|
||||||
|
padding: 4rem 2rem;
|
||||||
|
background: var(--noir-profond);
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-container {
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fediverse h2 {
|
||||||
|
font-size: 3rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-subtitle {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
opacity: 0.9;
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.services-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-card {
|
||||||
|
background: rgba(0, 168, 84, 0.1);
|
||||||
|
border: 2px solid var(--vert-oki);
|
||||||
|
border-radius: 20px;
|
||||||
|
padding: 2rem;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-card::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
height: 4px;
|
||||||
|
background: linear-gradient(90deg, var(--vert-oki), var(--or-oki));
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-card:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
box-shadow: 0 20px 40px rgba(0, 168, 84, 0.3);
|
||||||
|
background: rgba(0, 168, 84, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-icon {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-card h3 {
|
||||||
|
color: var(--or-oki);
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
font-size: 1.8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-platform {
|
||||||
|
color: var(--vert-oki);
|
||||||
|
font-size: 0.9rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-description {
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-link {
|
||||||
|
color: var(--or-oki);
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: 600;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.5rem;
|
||||||
|
transition: gap 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-link:hover {
|
||||||
|
gap: 1rem;
|
||||||
|
color: var(--or-clair);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Web Projects Section */
|
||||||
|
.projects {
|
||||||
|
padding: 4rem 2rem;
|
||||||
|
background: linear-gradient(135deg, var(--noir-profond) 0%, var(--gris-sombre) 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.projects h2 {
|
||||||
|
font-size: 3rem;
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-cards {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
margin-top: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-card {
|
||||||
|
background: rgba(0, 0, 0, 0.3);
|
||||||
|
border-radius: 20px;
|
||||||
|
padding: 1.5rem;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
border: 2px solid transparent;
|
||||||
|
text-align: center;
|
||||||
|
display: block;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-card:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
border-color: var(--or-oki);
|
||||||
|
box-shadow: 0 20px 40px rgba(232, 166, 37, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-card h3 {
|
||||||
|
color: var(--or-oki);
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
font-size: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-domain {
|
||||||
|
color: var(--rouge-oki);
|
||||||
|
font-size: 0.9rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
font-family: monospace;
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-icon {
|
||||||
|
font-size: 3rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Mission Section */
|
||||||
|
.mission {
|
||||||
|
padding: 4rem 2rem;
|
||||||
|
background: var(--noir-profond);
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mission h2 {
|
||||||
|
font-size: 3rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mission-text {
|
||||||
|
font-size: 1.3rem;
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 0 auto 3rem;
|
||||||
|
line-height: 1.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.values-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
margin-top: 3rem;
|
||||||
|
max-width: 1000px;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.value-card {
|
||||||
|
background: rgba(255, 255, 255, 0.05);
|
||||||
|
padding: 2rem;
|
||||||
|
border-radius: 15px;
|
||||||
|
text-align: center;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
border: 1px solid rgba(232, 166, 37, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.value-card:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
background: rgba(232, 166, 37, 0.1);
|
||||||
|
border-color: var(--or-oki);
|
||||||
|
}
|
||||||
|
|
||||||
|
.value-icon {
|
||||||
|
font-size: 3rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.value-card h3 {
|
||||||
|
color: var(--or-oki);
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
font-size: 1.3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hosting Services Section */
|
||||||
|
.hosting {
|
||||||
|
padding: 4rem 2rem;
|
||||||
|
background: linear-gradient(135deg, var(--gris-sombre) 0%, var(--noir-profond) 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hosting-banner {
|
||||||
|
background: rgba(232, 166, 37, 0.1);
|
||||||
|
border: 2px solid var(--or-oki);
|
||||||
|
border-radius: 20px;
|
||||||
|
padding: 2rem;
|
||||||
|
max-width: 900px;
|
||||||
|
margin: 0 auto 3rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hosting-banner h3 {
|
||||||
|
color: var(--or-oki);
|
||||||
|
font-size: 1.8rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hosting-features {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||||||
|
gap: 1.5rem;
|
||||||
|
margin: 2rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hosting-feature {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hosting-feature span {
|
||||||
|
color: var(--vert-oki);
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Partners Section */
|
||||||
|
.partners {
|
||||||
|
padding: 4rem 2rem;
|
||||||
|
background: linear-gradient(135deg, var(--gris-sombre) 0%, var(--noir-profond) 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.partners h2 {
|
||||||
|
font-size: 3rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.partners-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
margin-top: 3rem;
|
||||||
|
max-width: 900px;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.partner-card {
|
||||||
|
background: rgba(0, 0, 0, 0.3);
|
||||||
|
border: 2px solid transparent;
|
||||||
|
border-radius: 20px;
|
||||||
|
padding: 2rem;
|
||||||
|
text-align: center;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
text-decoration: none;
|
||||||
|
color: inherit;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.partner-card:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
border-color: var(--or-oki);
|
||||||
|
box-shadow: 0 20px 40px rgba(232, 166, 37, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.partner-logo-container {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
background: rgba(255, 255, 255, 0.05);
|
||||||
|
border-radius: 50%;
|
||||||
|
padding: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.partner-logo {
|
||||||
|
max-width: 100%;
|
||||||
|
max-height: 100%;
|
||||||
|
object-fit: contain;
|
||||||
|
}
|
||||||
|
|
||||||
|
.partner-card h3 {
|
||||||
|
color: var(--or-oki);
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
font-size: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.partner-description {
|
||||||
|
line-height: 1.6;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.partner-link {
|
||||||
|
color: var(--or-oki);
|
||||||
|
font-weight: 600;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.5rem;
|
||||||
|
transition: gap 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.partner-card:hover .partner-link {
|
||||||
|
gap: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Support Section */
|
||||||
|
.support {
|
||||||
|
padding: 4rem 2rem;
|
||||||
|
background: var(--noir-profond);
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.support h2 {
|
||||||
|
font-size: 3rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.support-options {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 2rem;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
margin-top: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Contact Section */
|
||||||
|
.contact {
|
||||||
|
padding: 3rem 2rem;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-card {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-card h3 {
|
||||||
|
color: var(--or-oki);
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-links {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-links a {
|
||||||
|
color: var(--blanc-creme);
|
||||||
|
text-decoration: none;
|
||||||
|
transition: color 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-links a:hover {
|
||||||
|
color: var(--or-oki);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Footer */
|
||||||
|
footer {
|
||||||
|
padding: 2rem;
|
||||||
|
background: var(--noir-oki);
|
||||||
|
text-align: center;
|
||||||
|
border-top: 2px solid var(--or-oki);
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-content {
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Donation Styles */
|
||||||
|
.donation-amount {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 1rem;
|
||||||
|
background: rgba(232, 166, 37, 0.2);
|
||||||
|
border: 2px solid var(--or-oki);
|
||||||
|
color: var(--blanc-creme);
|
||||||
|
text-decoration: none;
|
||||||
|
border-radius: 12px;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.donation-amount:hover {
|
||||||
|
background: var(--or-oki);
|
||||||
|
color: var(--noir-oki);
|
||||||
|
transform: translateY(-3px);
|
||||||
|
box-shadow: 0 5px 15px rgba(232, 166, 37, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.donation-amount.monthly {
|
||||||
|
background: rgba(0, 168, 84, 0.2);
|
||||||
|
border-color: var(--vert-oki);
|
||||||
|
}
|
||||||
|
|
||||||
|
.donation-amount.monthly:hover {
|
||||||
|
background: var(--vert-oki);
|
||||||
|
color: var(--blanc-creme);
|
||||||
|
box-shadow: 0 5px 15px rgba(0, 168, 84, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="number"]::-webkit-inner-spin-button,
|
||||||
|
input[type="number"]::-webkit-outer-spin-button {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="number"] {
|
||||||
|
-moz-appearance: textfield;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="number"]:focus {
|
||||||
|
outline: none;
|
||||||
|
border-color: var(--or-oki);
|
||||||
|
background: rgba(255, 255, 255, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Custom Donation Form */
|
||||||
|
.custom-donation-form {
|
||||||
|
display: flex;
|
||||||
|
gap: 0.5rem;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
max-width: 350px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-amount-input {
|
||||||
|
padding: 0.8rem;
|
||||||
|
border: 2px solid var(--or-oki);
|
||||||
|
background: rgba(255, 255, 255, 0.1);
|
||||||
|
color: var(--blanc-creme);
|
||||||
|
border-radius: 10px;
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-amount-input-monthly {
|
||||||
|
border-color: var(--vert-oki);
|
||||||
|
}
|
||||||
|
|
||||||
|
.currency-symbol {
|
||||||
|
color: var(--blanc-creme);
|
||||||
|
font-size: 1rem;
|
||||||
|
white-space: nowrap;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-donation-btn {
|
||||||
|
padding: 0.8rem 1.2rem;
|
||||||
|
border: none;
|
||||||
|
border-radius: 10px;
|
||||||
|
font-weight: 600;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s;
|
||||||
|
white-space: nowrap;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-donation-btn-primary {
|
||||||
|
background: var(--or-oki);
|
||||||
|
color: var(--noir-oki);
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-donation-btn-secondary {
|
||||||
|
background: var(--vert-oki);
|
||||||
|
color: var(--blanc-creme);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Animations */
|
||||||
|
@keyframes fadeInUp {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(30px);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulse {
|
||||||
|
0%, 100% {
|
||||||
|
opacity: 0.3;
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: scale(1.5);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Responsive */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.nav-links {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-toggle {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero h1 {
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-subtitle {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero p {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cta-buttons {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.services-grid,
|
||||||
|
.project-cards {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Custom Donation Form Mobile */
|
||||||
|
.custom-donation-form {
|
||||||
|
gap: 0.4rem;
|
||||||
|
padding: 0 0.5rem;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-amount-input {
|
||||||
|
padding: 0.6rem 0.5rem;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
min-width: 70px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.currency-symbol {
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-donation-btn {
|
||||||
|
padding: 0.6rem 0.8rem;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 380px) {
|
||||||
|
/* Very small screens */
|
||||||
|
.custom-donation-form {
|
||||||
|
gap: 0.3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-amount-input {
|
||||||
|
padding: 0.5rem;
|
||||||
|
font-size: 0.85rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-donation-btn {
|
||||||
|
padding: 0.5rem 0.6rem;
|
||||||
|
font-size: 0.85rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 341 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 152 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
@@ -0,0 +1,229 @@
|
|||||||
|
// Smooth scrolling
|
||||||
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||||||
|
anchor.addEventListener('click', function (e) {
|
||||||
|
e.preventDefault();
|
||||||
|
const target = document.querySelector(this.getAttribute('href'));
|
||||||
|
if (target) {
|
||||||
|
target.scrollIntoView({
|
||||||
|
behavior: 'smooth',
|
||||||
|
block: 'start'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Mobile menu toggle
|
||||||
|
const menuToggle = document.querySelector('.menu-toggle');
|
||||||
|
const navLinks = document.querySelector('.nav-links');
|
||||||
|
let menuOpen = false;
|
||||||
|
|
||||||
|
menuToggle?.addEventListener('click', () => {
|
||||||
|
menuOpen = !menuOpen;
|
||||||
|
if (menuOpen) {
|
||||||
|
navLinks.style.display = 'flex';
|
||||||
|
navLinks.style.position = 'absolute';
|
||||||
|
navLinks.style.top = '100%';
|
||||||
|
navLinks.style.left = '0';
|
||||||
|
navLinks.style.right = '0';
|
||||||
|
navLinks.style.background = 'rgba(0, 0, 0, 0.98)';
|
||||||
|
navLinks.style.flexDirection = 'column';
|
||||||
|
navLinks.style.padding = '1rem';
|
||||||
|
navLinks.style.borderTop = '2px solid #E8A625';
|
||||||
|
|
||||||
|
// Animate menu toggle
|
||||||
|
menuToggle.children[0].style.transform = 'rotate(45deg) translateY(8px)';
|
||||||
|
menuToggle.children[1].style.opacity = '0';
|
||||||
|
menuToggle.children[2].style.transform = 'rotate(-45deg) translateY(-8px)';
|
||||||
|
} else {
|
||||||
|
navLinks.style.display = 'none';
|
||||||
|
|
||||||
|
// Reset menu toggle
|
||||||
|
menuToggle.children[0].style.transform = '';
|
||||||
|
menuToggle.children[1].style.opacity = '1';
|
||||||
|
menuToggle.children[2].style.transform = '';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Close mobile menu when clicking outside
|
||||||
|
document.addEventListener('click', (e) => {
|
||||||
|
if (menuOpen && !menuToggle.contains(e.target) && !navLinks.contains(e.target)) {
|
||||||
|
menuOpen = false;
|
||||||
|
navLinks.style.display = 'none';
|
||||||
|
menuToggle.children[0].style.transform = '';
|
||||||
|
menuToggle.children[1].style.opacity = '1';
|
||||||
|
menuToggle.children[2].style.transform = '';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Scroll animations
|
||||||
|
const observerOptions = {
|
||||||
|
threshold: 0.1,
|
||||||
|
rootMargin: '0px 0px -100px 0px'
|
||||||
|
};
|
||||||
|
|
||||||
|
const observer = new IntersectionObserver((entries) => {
|
||||||
|
entries.forEach(entry => {
|
||||||
|
if (entry.isIntersecting) {
|
||||||
|
entry.target.style.animation = 'fadeInUp 0.8s ease both';
|
||||||
|
observer.unobserve(entry.target);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}, observerOptions);
|
||||||
|
|
||||||
|
// Observe all cards
|
||||||
|
document.querySelectorAll('.service-card, .project-card, .value-card').forEach(el => {
|
||||||
|
observer.observe(el);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Navbar scroll effect
|
||||||
|
let lastScroll = 0;
|
||||||
|
const nav = document.querySelector('nav');
|
||||||
|
|
||||||
|
window.addEventListener('scroll', () => {
|
||||||
|
const currentScroll = window.pageYOffset;
|
||||||
|
|
||||||
|
if (currentScroll > 100) {
|
||||||
|
nav.style.background = 'rgba(0, 0, 0, 0.98)';
|
||||||
|
nav.style.boxShadow = '0 2px 20px rgba(232, 166, 37, 0.3)';
|
||||||
|
} else {
|
||||||
|
nav.style.background = 'rgba(0, 0, 0, 0.95)';
|
||||||
|
nav.style.boxShadow = '';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Hide/show navbar on scroll
|
||||||
|
if (currentScroll > lastScroll && currentScroll > 500) {
|
||||||
|
nav.style.transform = 'translateY(-100%)';
|
||||||
|
} else {
|
||||||
|
nav.style.transform = 'translateY(0)';
|
||||||
|
}
|
||||||
|
|
||||||
|
lastScroll = currentScroll;
|
||||||
|
});
|
||||||
|
|
||||||
|
// Network animation enhancement
|
||||||
|
function createNetworkLine() {
|
||||||
|
const nodes = document.querySelectorAll('.node');
|
||||||
|
const networkBg = document.querySelector('.network-bg');
|
||||||
|
|
||||||
|
if (nodes.length > 1 && networkBg) {
|
||||||
|
for (let i = 0; i < nodes.length - 1; i++) {
|
||||||
|
const line = document.createElement('div');
|
||||||
|
line.style.position = 'absolute';
|
||||||
|
line.style.height = '1px';
|
||||||
|
line.style.background = 'linear-gradient(90deg, transparent, #E8A625, transparent)';
|
||||||
|
line.style.opacity = '0.2';
|
||||||
|
line.style.animation = `pulse 4s infinite ${i * 0.5}s`;
|
||||||
|
|
||||||
|
const node1 = nodes[i];
|
||||||
|
const node2 = nodes[i + 1];
|
||||||
|
|
||||||
|
// Calculate line position and angle
|
||||||
|
const x1 = parseFloat(node1.style.left);
|
||||||
|
const y1 = parseFloat(node1.style.top);
|
||||||
|
const x2 = parseFloat(node2.style.left);
|
||||||
|
const y2 = parseFloat(node2.style.top);
|
||||||
|
|
||||||
|
const distance = Math.sqrt(Math.pow(x2 - x1, 2) + Math.pow(y2 - y1, 2));
|
||||||
|
const angle = Math.atan2(y2 - y1, x2 - x1) * 180 / Math.PI;
|
||||||
|
|
||||||
|
line.style.width = distance + '%';
|
||||||
|
line.style.left = x1 + '%';
|
||||||
|
line.style.top = y1 + '%';
|
||||||
|
line.style.transform = `rotate(${angle}deg)`;
|
||||||
|
line.style.transformOrigin = '0 0';
|
||||||
|
|
||||||
|
networkBg.appendChild(line);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initialize network lines
|
||||||
|
createNetworkLine();
|
||||||
|
|
||||||
|
// Dynamic typing effect for hero subtitle
|
||||||
|
const subtitle = document.querySelector('.hero-subtitle');
|
||||||
|
if (subtitle) {
|
||||||
|
const text = subtitle.textContent;
|
||||||
|
subtitle.textContent = '';
|
||||||
|
let index = 0;
|
||||||
|
|
||||||
|
function typeWriter() {
|
||||||
|
if (index < text.length) {
|
||||||
|
subtitle.textContent += text.charAt(index);
|
||||||
|
index++;
|
||||||
|
setTimeout(typeWriter, 100);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
setTimeout(typeWriter, 800);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add hover effect to project cards with tilt
|
||||||
|
document.querySelectorAll('.project-card, .service-card').forEach(card => {
|
||||||
|
card.addEventListener('mousemove', (e) => {
|
||||||
|
const rect = card.getBoundingClientRect();
|
||||||
|
const x = e.clientX - rect.left;
|
||||||
|
const y = e.clientY - rect.top;
|
||||||
|
|
||||||
|
const centerX = rect.width / 2;
|
||||||
|
const centerY = rect.height / 2;
|
||||||
|
|
||||||
|
const rotateX = (y - centerY) / 20;
|
||||||
|
const rotateY = (centerX - x) / 20;
|
||||||
|
|
||||||
|
card.style.transform = `perspective(1000px) rotateX(${rotateX}deg) rotateY(${rotateY}deg) translateY(-5px)`;
|
||||||
|
});
|
||||||
|
|
||||||
|
card.addEventListener('mouseleave', () => {
|
||||||
|
card.style.transform = '';
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Easter egg: Konami code
|
||||||
|
const konamiCode = ['ArrowUp', 'ArrowUp', 'ArrowDown', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'ArrowLeft', 'ArrowRight', 'b', 'a'];
|
||||||
|
let konamiIndex = 0;
|
||||||
|
|
||||||
|
document.addEventListener('keydown', (e) => {
|
||||||
|
if (e.key === konamiCode[konamiIndex]) {
|
||||||
|
konamiIndex++;
|
||||||
|
if (konamiIndex === konamiCode.length) {
|
||||||
|
document.body.style.animation = 'pulse 1s';
|
||||||
|
setTimeout(() => {
|
||||||
|
alert('🎮 Félicitations! Vous avez trouvé le code secret! Bienvenue dans la résistance numérique!');
|
||||||
|
document.body.style.animation = '';
|
||||||
|
}, 1000);
|
||||||
|
konamiIndex = 0;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
konamiIndex = 0;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Progressive enhancement: Add loading states
|
||||||
|
// Disabled - not needed for external links
|
||||||
|
// document.querySelectorAll('.service-link, .project-card').forEach(link => {
|
||||||
|
// link.addEventListener('click', function(e) {
|
||||||
|
// if (this.href && this.href !== '#') {
|
||||||
|
// this.style.opacity = '0.6';
|
||||||
|
// this.innerHTML += ' ⌛';
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
// });
|
||||||
|
|
||||||
|
// Custom donation handler
|
||||||
|
function handleCustomDonation(type) {
|
||||||
|
const input = document.getElementById(type === 'oneTime' ? 'customAmountOneTime' : 'customAmountMonthly');
|
||||||
|
const amount = input.value;
|
||||||
|
|
||||||
|
if (!amount || amount < 1) {
|
||||||
|
alert('Veuillez entrer un montant valide');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Redirect to custom amount Stripe URL
|
||||||
|
const stripeUrl = type === 'oneTime'
|
||||||
|
? 'https://don.o-k-i.net/b/6oE2aO94P88X9u8eV4' // Custom one-time donation
|
||||||
|
: 'https://don.o-k-i.net/b/6oE2aO94P88X9u8eV4'; // Uses same link for custom amounts
|
||||||
|
|
||||||
|
window.location.href = stripeUrl;
|
||||||
|
}
|
||||||
@@ -0,0 +1,12 @@
|
|||||||
|
---
|
||||||
|
layout: layouts/base.njk
|
||||||
|
---
|
||||||
|
|
||||||
|
{% include "partials/hero.njk" %}
|
||||||
|
{% include "partials/fediverse.njk" %}
|
||||||
|
{% include "partials/projects.njk" %}
|
||||||
|
{% include "partials/mission.njk" %}
|
||||||
|
{% include "partials/hosting.njk" %}
|
||||||
|
{% include "partials/support.njk" %}
|
||||||
|
{% include "partials/partners.njk" %}
|
||||||
|
{% include "partials/contact.njk" %}
|
||||||
@@ -0,0 +1,227 @@
|
|||||||
|
---
|
||||||
|
layout: layouts/base.njk
|
||||||
|
title: Mentions Légales
|
||||||
|
---
|
||||||
|
|
||||||
|
<section style="padding: 8rem 2rem 4rem; min-height: 100vh; background: linear-gradient(135deg, var(--noir-profond) 0%, var(--gris-sombre) 100%);">
|
||||||
|
<div class="section-container" style="max-width: 900px;">
|
||||||
|
<h1 style="font-size: 2.5rem; margin-bottom: 3rem; text-align: center;">
|
||||||
|
<span class="accent-text">Mentions Légales</span>
|
||||||
|
</h1>
|
||||||
|
|
||||||
|
<!-- Présentation du site -->
|
||||||
|
<div style="background: rgba(232, 166, 37, 0.1); border-left: 4px solid var(--or-oki); padding: 2rem; margin-bottom: 2rem; border-radius: 10px;">
|
||||||
|
<h2 style="color: var(--or-oki); margin-bottom: 1.5rem; font-size: 1.8rem;">
|
||||||
|
1. Présentation du site
|
||||||
|
</h2>
|
||||||
|
<p style="margin-bottom: 1rem; line-height: 1.6;">
|
||||||
|
En vertu de l'article 6 de la loi n° 2004-575 du 21 juin 2004 pour la confiance dans l'économie numérique,
|
||||||
|
il est précisé aux utilisateurs du site internet <strong>o-k-i.net</strong> l'identité des différents intervenants
|
||||||
|
dans le cadre de sa réalisation et de son suivi :
|
||||||
|
</p>
|
||||||
|
<ul style="list-style: none; padding: 0; margin: 1.5rem 0;">
|
||||||
|
<li style="margin-bottom: 1rem;">
|
||||||
|
<strong style="color: var(--or-oki);">Propriétaire :</strong><br>
|
||||||
|
ORGANISATION KA INTERNATIONALE<br>
|
||||||
|
36 Rue Lethière, 97100 Basse-Terre
|
||||||
|
</li>
|
||||||
|
<li style="margin-bottom: 1rem;">
|
||||||
|
<strong style="color: var(--or-oki);">Responsable publication :</strong><br>
|
||||||
|
ORGANISATION KA INTERNATIONALE<br>
|
||||||
|
Contact : <a href="mailto:kontak@o-k-i.net" style="color: var(--or-oki); text-decoration: none;">kontak@o-k-i.net</a>
|
||||||
|
</li>
|
||||||
|
<li style="margin-bottom: 1rem;">
|
||||||
|
<strong style="color: var(--or-oki);">Webmaster :</strong><br>
|
||||||
|
Cédric FAMIBELLE-PRONZOLA<br>
|
||||||
|
Contact : <a href="mailto:contact@cedric-pronzola.re" style="color: var(--or-oki); text-decoration: none;">contact@cedric-pronzola.re</a>
|
||||||
|
</li>
|
||||||
|
<li style="margin-bottom: 1rem;">
|
||||||
|
<strong style="color: var(--or-oki);">Hébergeur :</strong><br>
|
||||||
|
OVH<br>
|
||||||
|
2 rue Kellermann, 59100 Roubaix
|
||||||
|
</li>
|
||||||
|
<li style="margin-bottom: 1rem;">
|
||||||
|
<strong style="color: var(--or-oki);">Délégué à la protection des données :</strong><br>
|
||||||
|
ORGANISATION KA INTERNATIONALE<br>
|
||||||
|
Contact : <a href="mailto:kontak@o-k-i.net" style="color: var(--or-oki); text-decoration: none;">kontak@o-k-i.net</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Conditions générales d'utilisation -->
|
||||||
|
<div style="background: rgba(0, 168, 84, 0.1); border-left: 4px solid var(--vert-oki); padding: 2rem; margin-bottom: 2rem; border-radius: 10px;">
|
||||||
|
<h2 style="color: var(--vert-oki); margin-bottom: 1.5rem; font-size: 1.8rem;">
|
||||||
|
2. Conditions générales d'utilisation du site et des services proposés
|
||||||
|
</h2>
|
||||||
|
<p style="line-height: 1.6;">
|
||||||
|
Le site est protégé par les dispositions relatives à la propriété intellectuelle.
|
||||||
|
L'utilisation du site implique l'acceptation pleine et entière des conditions générales d'utilisation ci-après décrites.
|
||||||
|
Ces conditions d'utilisation sont susceptibles d'être modifiées ou complétées à tout moment.
|
||||||
|
</p>
|
||||||
|
<p style="margin-top: 1rem; line-height: 1.6;">
|
||||||
|
Les utilisateurs du site ne peuvent pas réutiliser ou exploiter les éléments du site sans autorisation préalable.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Description des services -->
|
||||||
|
<div style="background: rgba(237, 28, 76, 0.1); border-left: 4px solid var(--rouge-oki); padding: 2rem; margin-bottom: 2rem; border-radius: 10px;">
|
||||||
|
<h2 style="color: var(--rouge-oki); margin-bottom: 1.5rem; font-size: 1.8rem;">
|
||||||
|
3. Description des services fournis
|
||||||
|
</h2>
|
||||||
|
<p style="line-height: 1.6;">
|
||||||
|
Le site <strong>o-k-i.net</strong> a pour objet de fournir une information concernant l'ensemble des activités de l'Organisation Ka Internationale.
|
||||||
|
</p>
|
||||||
|
<p style="margin-top: 1rem; line-height: 1.6;">
|
||||||
|
ORGANISATION KA INTERNATIONALE s'efforce de fournir des informations aussi précises que possible.
|
||||||
|
Toutefois, il ne pourra être tenu responsable des oublis, des inexactitudes et des carences dans la mise à jour,
|
||||||
|
qu'elles soient de son fait ou du fait des tiers partenaires qui lui fournissent ces informations.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Limitations techniques -->
|
||||||
|
<div style="background: rgba(232, 166, 37, 0.1); border-left: 4px solid var(--or-oki); padding: 2rem; margin-bottom: 2rem; border-radius: 10px;">
|
||||||
|
<h2 style="color: var(--or-oki); margin-bottom: 1.5rem; font-size: 1.8rem;">
|
||||||
|
4. Limitations techniques
|
||||||
|
</h2>
|
||||||
|
<p style="line-height: 1.6;">
|
||||||
|
Le site utilise la technologie JavaScript. Le site est hébergé dans l'Union Européenne conformément au RGPD.
|
||||||
|
</p>
|
||||||
|
<p style="margin-top: 1rem; line-height: 1.6;">
|
||||||
|
ORGANISATION KA INTERNATIONALE ne pourra être tenue responsable de dommages matériels liés à l'utilisation du site.
|
||||||
|
De plus, l'utilisateur du site s'engage à accéder au site en utilisant un matériel récent, ne contenant pas de virus
|
||||||
|
et avec un navigateur de dernière génération mis à jour.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Propriété intellectuelle et licences -->
|
||||||
|
<div style="background: rgba(0, 168, 84, 0.1); border-left: 4px solid var(--vert-oki); padding: 2rem; margin-bottom: 2rem; border-radius: 10px;">
|
||||||
|
<h2 style="color: var(--vert-oki); margin-bottom: 1.5rem; font-size: 1.8rem;">
|
||||||
|
5. Propriété intellectuelle et licences
|
||||||
|
</h2>
|
||||||
|
<p style="line-height: 1.6;">
|
||||||
|
Le code source du site <strong>o-k-i.net</strong> est distribué sous licence <strong>GNU Affero General Public License v3.0 (AGPL-V3)</strong>,
|
||||||
|
une licence libre qui garantit les libertés suivantes :
|
||||||
|
</p>
|
||||||
|
<ul style="list-style: disc; padding-left: 2rem; margin: 1rem 0;">
|
||||||
|
<li style="margin-bottom: 0.5rem;">La liberté d'utiliser le logiciel à toute fin</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">La liberté d'étudier le fonctionnement du programme et de l'adapter</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">La liberté de redistribuer des copies</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">La liberté d'améliorer le programme et de publier ces améliorations</li>
|
||||||
|
</ul>
|
||||||
|
<p style="margin-top: 1rem; line-height: 1.6;">
|
||||||
|
Cette licence garantit que toute modification du code source doit être publiée sous la même licence AGPL-V3.
|
||||||
|
Si vous utilisez ce code pour fournir un service en ligne, vous devez également rendre le code source modifié
|
||||||
|
disponible aux utilisateurs de ce service.
|
||||||
|
</p>
|
||||||
|
<p style="margin-top: 1rem; line-height: 1.6;">
|
||||||
|
Le texte complet de la licence est disponible sur :
|
||||||
|
<a href="https://www.gnu.org/licenses/agpl-3.0.html" target="_blank" style="color: var(--or-oki); text-decoration: none;">
|
||||||
|
https://www.gnu.org/licenses/agpl-3.0.html
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<p style="margin-top: 1rem; line-height: 1.6;">
|
||||||
|
Les contenus textuels et visuels originaux du site (hors code source) restent la propriété de
|
||||||
|
ORGANISATION KA INTERNATIONALE. Leur utilisation est soumise aux conditions de la licence AGPL-V3 pour
|
||||||
|
les éléments techniques, et requiert une autorisation pour les autres usages.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Limitations de responsabilité -->
|
||||||
|
<div style="background: rgba(237, 28, 76, 0.1); border-left: 4px solid var(--rouge-oki); padding: 2rem; margin-bottom: 2rem; border-radius: 10px;">
|
||||||
|
<h2 style="color: var(--rouge-oki); margin-bottom: 1.5rem; font-size: 1.8rem;">
|
||||||
|
6. Limitations de responsabilité
|
||||||
|
</h2>
|
||||||
|
<p style="line-height: 1.6;">
|
||||||
|
ORGANISATION KA INTERNATIONALE ne pourra être tenue responsable des dommages directs et indirects causés au
|
||||||
|
matériel de l'utilisateur, lors de l'accès au site o-k-i.net, et résultant soit de l'utilisation d'un matériel
|
||||||
|
ne répondant pas aux spécifications indiquées au point 4, soit de l'apparition d'un bug ou d'une incompatibilité.
|
||||||
|
</p>
|
||||||
|
<p style="margin-top: 1rem; line-height: 1.6;">
|
||||||
|
ORGANISATION KA INTERNATIONALE ne pourra également être tenue responsable des dommages indirects (tels par exemple
|
||||||
|
qu'une perte de marché ou perte d'une chance) consécutifs à l'utilisation du site o-k-i.net.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Gestion des données personnelles -->
|
||||||
|
<div style="background: rgba(232, 166, 37, 0.1); border-left: 4px solid var(--or-oki); padding: 2rem; margin-bottom: 2rem; border-radius: 10px;">
|
||||||
|
<h2 style="color: var(--or-oki); margin-bottom: 1.5rem; font-size: 1.8rem;">
|
||||||
|
7. Gestion des données personnelles
|
||||||
|
</h2>
|
||||||
|
<p style="line-height: 1.6;">
|
||||||
|
En France, les données personnelles sont notamment protégées par le Règlement européen 2016/679 du 27 avril 2016
|
||||||
|
relatif à la protection des personnes physiques à l'égard du traitement des données à caractère personnel (RGPD).
|
||||||
|
</p>
|
||||||
|
<p style="margin-top: 1rem; line-height: 1.6;">
|
||||||
|
Les données à caractère personnel recueillies sur le site o-k-i.net sont traitées pour les finalités suivantes :
|
||||||
|
</p>
|
||||||
|
<ul style="list-style: disc; padding-left: 2rem; margin: 1rem 0;">
|
||||||
|
<li style="margin-bottom: 0.5rem;">Navigation sur le site</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">Prévention de la fraude informatique</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">Amélioration et optimisation de la navigation</li>
|
||||||
|
<li style="margin-bottom: 0.5rem;">Mesure d'audience et statistiques</li>
|
||||||
|
</ul>
|
||||||
|
<p style="margin-top: 1rem; line-height: 1.6;">
|
||||||
|
En application de ces dispositions, vous disposez d'un droit d'accès, de rectification, d'effacement et de
|
||||||
|
portabilité de vos données personnelles. Vous pouvez exercer ces droits en contactant :
|
||||||
|
<a href="mailto:kontak@o-k-i.net" style="color: var(--or-oki); text-decoration: none;">kontak@o-k-i.net</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Notification d'incident -->
|
||||||
|
<div style="background: rgba(0, 168, 84, 0.1); border-left: 4px solid var(--vert-oki); padding: 2rem; margin-bottom: 2rem; border-radius: 10px;">
|
||||||
|
<h2 style="color: var(--vert-oki); margin-bottom: 1.5rem; font-size: 1.8rem;">
|
||||||
|
8. Notification d'incident
|
||||||
|
</h2>
|
||||||
|
<p style="line-height: 1.6;">
|
||||||
|
Quels que soient les efforts fournis, aucune méthode de transmission sur Internet et aucune méthode de stockage
|
||||||
|
électronique n'est complètement sûre. Nous ne pouvons en conséquence pas garantir une sécurité absolue.
|
||||||
|
</p>
|
||||||
|
<p style="margin-top: 1rem; line-height: 1.6;">
|
||||||
|
Si nous prenions connaissance d'une brèche de la sécurité, nous avertirions les utilisateurs concernés afin
|
||||||
|
qu'ils puissent prendre les mesures appropriées. Nos procédures de notification d'incident tiennent compte de
|
||||||
|
nos obligations légales, qu'elles se situent au niveau national ou européen. Nous nous engageons à informer
|
||||||
|
pleinement nos clients de toutes les questions relevant de la sécurité de leur compte et à leur fournir toutes
|
||||||
|
les informations nécessaires pour les aider à respecter leurs propres obligations réglementaires en matière
|
||||||
|
de reporting.
|
||||||
|
</p>
|
||||||
|
<p style="margin-top: 1rem; line-height: 1.6;">
|
||||||
|
Les systèmes de sécurité mis en place comprennent : pare-feu, chiffrement, pseudonymisation et mesures de
|
||||||
|
sécurité physiques.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Cookies -->
|
||||||
|
<div style="background: rgba(237, 28, 76, 0.1); border-left: 4px solid var(--rouge-oki); padding: 2rem; margin-bottom: 2rem; border-radius: 10px;">
|
||||||
|
<h2 style="color: var(--rouge-oki); margin-bottom: 1.5rem; font-size: 1.8rem;">
|
||||||
|
9. Cookies et balises web
|
||||||
|
</h2>
|
||||||
|
<p style="line-height: 1.6;">
|
||||||
|
Le site peut utiliser des cookies pour améliorer l'expérience utilisateur. L'utilisateur peut désactiver
|
||||||
|
les cookies dans les paramètres de son navigateur.
|
||||||
|
</p>
|
||||||
|
<p style="margin-top: 1rem; line-height: 1.6;">
|
||||||
|
Certaines pages peuvent contenir des balises web (pixels invisibles) permettant notamment de mesurer
|
||||||
|
l'audience et la performance du site.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Droit applicable et juridiction -->
|
||||||
|
<div style="background: rgba(232, 166, 37, 0.1); border-left: 4px solid var(--or-oki); padding: 2rem; margin-bottom: 2rem; border-radius: 10px;">
|
||||||
|
<h2 style="color: var(--or-oki); margin-bottom: 1.5rem; font-size: 1.8rem;">
|
||||||
|
10. Droit applicable et juridiction compétente
|
||||||
|
</h2>
|
||||||
|
<p style="line-height: 1.6;">
|
||||||
|
Tout litige en relation avec l'utilisation du site o-k-i.net est soumis au droit français.
|
||||||
|
En dehors des cas où la loi ne le permet pas, il est fait attribution exclusive de juridiction
|
||||||
|
aux tribunaux compétents de Guadeloupe.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Retour à l'accueil -->
|
||||||
|
<div style="text-align: center; margin-top: 3rem;">
|
||||||
|
<a href="/" class="btn btn-primary">
|
||||||
|
← Retour à l'accueil
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
Reference in New Issue
Block a user