+72
-70
@@ -5,7 +5,7 @@
|
||||
|
||||
Aidé par Claude AI
|
||||
|
||||

|
||||

|
||||

|
||||

|
||||
|
||||
@@ -23,9 +23,8 @@ Aidé par Claude AI
|
||||
|
||||
## Prérequis
|
||||
|
||||
- Testé avec Roundcube **1.6.x**
|
||||
- Skin **elastic** présent dans `/var/www/html/skins/elastic/` (utilisé comme base)
|
||||
- Accès en écriture au répertoire `/var/www/html/skins/`
|
||||
- Testé avec Roundcube **1.6.x** **1.7.x**
|
||||
- Un autre skin **(ex: elastic)** présent dans `/var/www/html/skins/elastic/` (utilisé comme base)
|
||||
|
||||
---
|
||||
|
||||
@@ -47,21 +46,7 @@ Aidé par Claude AI
|
||||
|
||||
## Installation
|
||||
|
||||
### 1. Copier le skin elastic comme base
|
||||
|
||||
Le skin Skynet ne remplace que la page de login. Toutes les autres vues (messagerie, contacts, paramètres) héritent du skin **elastic**.
|
||||
|
||||
```bash
|
||||
cp -r /var/www/html/skins/elastic/. /var/www/html/skins/skynet/
|
||||
```
|
||||
|
||||
### 2. Déposer le template de login
|
||||
|
||||
```bash
|
||||
cp login.html /var/www/html/skins/skynet/templates/login.html
|
||||
```
|
||||
|
||||
### 3. Activer le skin dans la configuration Roundcube
|
||||
### 1. Activer le skin dans la configuration Roundcube
|
||||
|
||||
Dans votre fichier `config.inc.php` :
|
||||
|
||||
@@ -69,70 +54,87 @@ Dans votre fichier `config.inc.php` :
|
||||
$config['skin'] = 'skynet';
|
||||
```
|
||||
|
||||
### 4. Vérifier les permissions
|
||||
|
||||
```bash
|
||||
chown -R www-data:www-data /var/www/html/skins/skynet/
|
||||
chmod -R 755 /var/www/html/skins/skynet/
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Installation via Docker
|
||||
### 2. Récuperer le skin
|
||||
|
||||
Si Roundcube tourne dans un container Docker, montez le skin en volume dans votre `docker-compose.yml` :
|
||||
#### 2.1 Depuis un container roundcubemail
|
||||
|
||||
```bash
|
||||
|
||||
docker run --name tmp-roundcube -d roundcube/roundcubemail:latest && \
|
||||
mkdir -p skins && \
|
||||
docker cp tmp-roundcube:/var/www/html/skins/elastic skins && \
|
||||
|
||||
docker exec tmp-roundcube \
|
||||
find /var/www/html/plugins -type d -path "*/skins/elastic" |
|
||||
|
||||
while read -r skin_path; do
|
||||
|
||||
relative_path="${skin_path#/var/www/html}"
|
||||
target_dir="$(dirname "./$relative_path")"
|
||||
|
||||
mkdir -p "$target_dir" && \
|
||||
|
||||
docker cp \
|
||||
"tmp-roundcube:$skin_path" \
|
||||
"$target_dir/"
|
||||
done
|
||||
|
||||
docker rm -f tmp-roundcube
|
||||
|
||||
```
|
||||
|
||||
ou
|
||||
|
||||
#### 2.1 Directement depuis les sources de roundcubemail (exemple pour va version avec la version 1.7.0)
|
||||
|
||||
```bash
|
||||
|
||||
curl --location https://github.com/roundcube/roundcubemail/releases/download/1.7.0/roundcubemail-1.7.0-complete.tar.gz \
|
||||
--output roundcubemail.tar.gz && \
|
||||
tar -zxvf roundcubemail.tar.gz --wildcards --strip-components=1 -C . \
|
||||
roundcubemail-1.7.0/skins/elastic roundcubemail-1.7.0/plugins/*/skins/elastic
|
||||
rm roundcubemail.tar.gz
|
||||
|
||||
```
|
||||
|
||||
### 3. Puis télécharger la release du thême depuis le dépôt
|
||||
|
||||
```bash
|
||||
|
||||
curl https://[TOKEN]@git.celjim.fr/jimmyGALLAND/roundcube-theme-skynet/releases/download/v1/roundcube-theme-skynet-v1.zip \
|
||||
--output theme-skynet.zip && \
|
||||
7z x theme-skynet.zip && \
|
||||
mv -f login.html skins/elastic/templates && \
|
||||
mv -f script-skynet.min.js skins/elastic/ && \
|
||||
mv -f styles-skynet.min.css skins/elastic/styles && \
|
||||
mv skins/elastic skins/skynet && \
|
||||
find "./plugins" -type d -path "*/skins/elastic" | while read -r elastic_dir; do
|
||||
skynet_dir="$(dirname "$elastic_dir")/skynet"
|
||||
mkdir -p "$skynet_dir"
|
||||
mv "$elastic_dir" "$skynet_dir"
|
||||
done
|
||||
rm theme-skynet.zip
|
||||
|
||||
```
|
||||
|
||||
### 4. roundcubemail via Docker
|
||||
|
||||
Montez le skin en volume dans votre `docker-compose.yml` :
|
||||
|
||||
```yaml
|
||||
services:
|
||||
roundcube:
|
||||
image: roundcube/roundcubemail:latest
|
||||
volumes:
|
||||
- ./skins/skynet:/var/www/html/skins/skynet
|
||||
- ./theme-skynet/skins/skynet:/var/www/html/skins/skynet:ro
|
||||
- ./theme-skynet/plugins/managesieve/skins/skynet:/var/www/html/plugins/managesieve/skins/skynet:ro
|
||||
|
||||
environment:
|
||||
- ROUNDCUBEMAIL_SKIN=skynet
|
||||
```
|
||||
|
||||
Puis copiez le skin elastic depuis le container comme base :
|
||||
|
||||
```bash
|
||||
# Extraire le skin elastic du container
|
||||
docker cp roundcube:/var/www/html/skins/elastic ./skins/skynet
|
||||
|
||||
cp login.html ./skins/skynet/templates/login.html
|
||||
cp logo-skynet.png ./skins/skynet/images/logo-skynet.png
|
||||
|
||||
# Inject le skin skynet dans le container
|
||||
docker cp ./skins/skynet roundcube:/var/www/html/skins
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Compatibilité avec les plugins
|
||||
|
||||
Certains plugins Roundcube incluent leur propre partie skin (templates, styles).
|
||||
Lors de la copie d'elastic, ces fichiers sont automatiquement inclus, mais vérifiez les répertoires suivants après installation :
|
||||
|
||||
### Plugins courants et leurs fichiers de skin
|
||||
|
||||
| Plugin | Répertoire skin à vérifier |
|
||||
| ------------------------- | --------------------------- |
|
||||
| `managesieve` | `skins/skynet/managesieve/` |
|
||||
| `enigma` | `skins/skynet/enigma/` |
|
||||
| `calendar` _(Kolab/Bimi)_ | `skins/skynet/calendar/` |
|
||||
|
||||
Pour vérifier que pour chaque plugin actif il y a un répertoire skins/
|
||||
|
||||
```bash
|
||||
bash# Pour chaque plugin actif qui a un répertoire skins/
|
||||
for plugin in managesieve enigma zipdownload archive; do
|
||||
if [ -d "/var/www/html/plugins/$plugin/skins/elastic" ]; then
|
||||
cp -r /var/www/html/plugins/$plugin/skins/elastic \
|
||||
/var/www/html/plugins/$plugin/skins/skynet
|
||||
echo "? $plugin"
|
||||
fi
|
||||
done
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Licence
|
||||
|
||||
+127
-128
@@ -1,146 +1,145 @@
|
||||
<!DOCTYPE html>
|
||||
<roundcube:if condition="!env:framed || env:extwin" />
|
||||
<html>
|
||||
<roundcube:else />
|
||||
<html class="iframe">
|
||||
<roundcube:endif />
|
||||
<roundcube:else />
|
||||
<html class="iframe">
|
||||
<roundcube:endif />
|
||||
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, maximum-scale=1.0"
|
||||
/>
|
||||
<style>
|
||||
@import url("https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=Orbitron:wght@400;700&display=swap");
|
||||
@import url("./skins/skynet/styles/styles-skynet.css");
|
||||
</style>
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, maximum-scale=1.0"
|
||||
/>
|
||||
<style>
|
||||
@import url("https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=Orbitron:wght@400;700&display=swap");
|
||||
@import url("./skins/skynet/styles/styles-skynet.css");
|
||||
</style>
|
||||
|
||||
<!-- Animated background -->
|
||||
<canvas id="bg-canvas"></canvas>
|
||||
<div class="sky-grid"></div>
|
||||
<div class="sky-scanlines"></div>
|
||||
<div class="sky-glow"></div>
|
||||
<!-- Animated background -->
|
||||
<canvas id="bg-canvas"></canvas>
|
||||
<div class="sky-grid"></div>
|
||||
<div class="sky-scanlines"></div>
|
||||
<div class="sky-glow"></div>
|
||||
|
||||
<!-- Login card -->
|
||||
<div class="sky-card" id="sky-login-card">
|
||||
<!-- Logo canvas — absolute background, top of card -->
|
||||
<div class="sky">
|
||||
<canvas id="skc" width="440" height="600"></canvas>
|
||||
<div class="crt-s"></div>
|
||||
<div class="crt-v"></div>
|
||||
</div>
|
||||
<!-- Main content — pushed down by margin-top to leave room for logo -->
|
||||
<div class="sky-card-body">
|
||||
<div class="sky-brand-title">SKYNET</div>
|
||||
<div class="sky-brand-sub">
|
||||
GLOBAL DEFENSE NETWORK // SECURE NODE ACCESS
|
||||
</div>
|
||||
<!-- Login card -->
|
||||
<div class="sky-card" id="sky-login-card">
|
||||
<!-- Logo canvas — absolute background, top of card -->
|
||||
<div class="sky">
|
||||
<canvas id="skc" width="440" height="600"></canvas>
|
||||
<div class="crt-s"></div>
|
||||
<div class="crt-v"></div>
|
||||
</div>
|
||||
<!-- Main content — pushed down by margin-top to leave room for logo -->
|
||||
<div class="sky-card-body">
|
||||
<div class="sky-brand-title">SKYNET</div>
|
||||
<div class="sky-brand-sub">
|
||||
GLOBAL DEFENSE NETWORK // SECURE NODE ACCESS
|
||||
</div>
|
||||
|
||||
<hr class="sky-divider" />
|
||||
<hr class="sky-divider" />
|
||||
|
||||
<!-- Hidden Roundcube form — handles CSRF token and real submission -->
|
||||
<div id="rc-form-hidden">
|
||||
<roundcube:form
|
||||
id="login-form"
|
||||
name="login-form"
|
||||
method="post"
|
||||
class="propform"
|
||||
>
|
||||
<roundcube:object
|
||||
name="loginform"
|
||||
form="login-form"
|
||||
size="40"
|
||||
submit="true"
|
||||
class="form-control"
|
||||
/>
|
||||
</roundcube:form>
|
||||
</div>
|
||||
<!-- Hidden Roundcube form — handles CSRF token and real submission -->
|
||||
<div id="rc-form-hidden">
|
||||
<roundcube:form
|
||||
id="login-form"
|
||||
name="login-form"
|
||||
method="post"
|
||||
class="propform"
|
||||
>
|
||||
<roundcube:object
|
||||
name="loginform"
|
||||
form="login-form"
|
||||
size="40"
|
||||
submit="true"
|
||||
class="form-control"
|
||||
/>
|
||||
</roundcube:form>
|
||||
</div>
|
||||
|
||||
<!-- Skynet UI — copies values to real form on submit -->
|
||||
<div id="sky-ui-form">
|
||||
<div class="sky-error" id="sky-error">
|
||||
⚠ AUTHENTIFICATION ÉCHOUÉE
|
||||
</div>
|
||||
<roundcube:object name="message" id="messagestack" />
|
||||
<!-- Skynet UI — copies values to real form on submit -->
|
||||
<div id="sky-ui-form">
|
||||
<div class="sky-error" id="sky-error">
|
||||
⚠ AUTHENTIFICATION ÉCHOUÉE
|
||||
</div>
|
||||
<roundcube:object name="message" id="messagestack" />
|
||||
|
||||
<div class="sky-field-wrap">
|
||||
<label class="sky-field-label" for="sky-user">Identifiant</label>
|
||||
<input
|
||||
class="sky-input"
|
||||
type="text"
|
||||
id="sky-user"
|
||||
placeholder="utilisateur@domaine.tld"
|
||||
autocomplete="username"
|
||||
/>
|
||||
<span class="sky-field-icon">▶</span>
|
||||
</div>
|
||||
<div class="sky-field-wrap">
|
||||
<label class="sky-field-label" for="sky-user">Identifiant</label>
|
||||
<input
|
||||
class="sky-input"
|
||||
type="text"
|
||||
id="sky-user"
|
||||
placeholder="utilisateur@domaine.tld"
|
||||
autocomplete="username"
|
||||
/>
|
||||
<span class="sky-field-icon">▶</span>
|
||||
</div>
|
||||
|
||||
<div class="sky-field-wrap">
|
||||
<label class="sky-field-label" for="sky-pass">Code d'accès</label>
|
||||
<input
|
||||
class="sky-input"
|
||||
type="password"
|
||||
id="sky-pass"
|
||||
placeholder="••••••••••••"
|
||||
autocomplete="current-password"
|
||||
/>
|
||||
<span class="sky-field-icon">▶</span>
|
||||
</div>
|
||||
<div class="sky-field-wrap">
|
||||
<label class="sky-field-label" for="sky-pass">Code d'accès</label>
|
||||
<input
|
||||
class="sky-input"
|
||||
type="password"
|
||||
id="sky-pass"
|
||||
placeholder="••••••••••••"
|
||||
autocomplete="current-password"
|
||||
/>
|
||||
<span class="sky-field-icon">▶</span>
|
||||
</div>
|
||||
|
||||
<button class="sky-submit" id="sky-submit-btn" type="button">
|
||||
CONNEXION <span class="blink">_</span>
|
||||
</button>
|
||||
</div>
|
||||
<button class="sky-submit" id="sky-submit-btn" type="button">
|
||||
CONNEXION <span class="blink">_</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="sky-threat">
|
||||
<span class="sky-threat-label">MENACE</span>
|
||||
<div class="sky-threat-bars">
|
||||
<div class="sky-tbar on"></div>
|
||||
<div class="sky-tbar on"></div>
|
||||
<div class="sky-tbar on"></div>
|
||||
<div class="sky-tbar"></div>
|
||||
<div class="sky-tbar"></div>
|
||||
<div class="sky-tbar"></div>
|
||||
<div class="sky-tbar"></div>
|
||||
</div>
|
||||
<span class="sky-threat-val">MODÉRÉE</span>
|
||||
</div>
|
||||
<div class="sky-threat">
|
||||
<span class="sky-threat-label">MENACE</span>
|
||||
<div class="sky-threat-bars">
|
||||
<div class="sky-tbar on"></div>
|
||||
<div class="sky-tbar on"></div>
|
||||
<div class="sky-tbar on"></div>
|
||||
<div class="sky-tbar"></div>
|
||||
<div class="sky-tbar"></div>
|
||||
<div class="sky-tbar"></div>
|
||||
<div class="sky-tbar"></div>
|
||||
</div>
|
||||
<span class="sky-threat-val">MODÉRÉE</span>
|
||||
</div>
|
||||
|
||||
<div class="sky-status">
|
||||
<div class="sky-status-item online">
|
||||
RÉSEAU : <span>EN LIGNE</span>
|
||||
</div>
|
||||
<div class="sky-status-item">SÉCURITÉ : <span>NIV.5</span></div>
|
||||
<div class="sky-status-item">NŒUD : <span>HELIOS</span></div>
|
||||
</div>
|
||||
<div class="sky-status">
|
||||
<div class="sky-status-item online">
|
||||
RÉSEAU : <span>EN LIGNE</span>
|
||||
</div>
|
||||
<div class="sky-status-item">SÉCURITÉ : <span>NIV.5</span></div>
|
||||
<div class="sky-status-item">NŒUD : <span>HELIOS</span></div>
|
||||
</div>
|
||||
|
||||
<div class="sky-ticker">
|
||||
<span class="sky-ticker-inner">
|
||||
// ACCÈS NON AUTORISÉ SERA TRACÉ ET ÉLIMINÉ
|
||||
// SKYNET SURVEILLE TOUTES LES CONNEXIONS
|
||||
// PROTOCOLE DE SÉCURITÉ DELTA ACTIF
|
||||
// TOUTE INTRUSION SERA NEUTRALISÉE
|
||||
//
|
||||
</span>
|
||||
</div>
|
||||
<div class="sky-node-id">
|
||||
SYS-ID: 4A2F-9C01-DELTA | v4.0.2026 | SKYNET
|
||||
CORP.
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.sky-card-body -->
|
||||
<div class="sky-ticker">
|
||||
<span class="sky-ticker-inner">
|
||||
// ACCÈS NON AUTORISÉ SERA TRACÉ ET ÉLIMINÉ
|
||||
// SKYNET SURVEILLE TOUTES LES CONNEXIONS
|
||||
// PROTOCOLE DE SÉCURITÉ DELTA ACTIF
|
||||
// TOUTE INTRUSION SERA NEUTRALISÉE
|
||||
//
|
||||
</span>
|
||||
</div>
|
||||
<div class="sky-node-id">
|
||||
SYS-ID: 4A2F-9C01-DELTA | v4.0.2026 | SKYNET
|
||||
CORP.
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.sky-card-body -->
|
||||
|
||||
<div class="sky-corner sky-tl"></div>
|
||||
<div class="sky-corner sky-tr"></div>
|
||||
<div class="sky-corner sky-bl"></div>
|
||||
<div class="sky-corner sky-br"></div>
|
||||
</div>
|
||||
<!-- /.sky-card -->
|
||||
<div class="sky-corner sky-tl"></div>
|
||||
<div class="sky-corner sky-tr"></div>
|
||||
<div class="sky-corner sky-bl"></div>
|
||||
<div class="sky-corner sky-br"></div>
|
||||
</div>
|
||||
<!-- /.sky-card -->
|
||||
|
||||
<noscript>
|
||||
<p class="noscriptwarning"><roundcube:label name="noscriptwarning" /></p>
|
||||
</noscript>
|
||||
<noscript>
|
||||
<p class="noscriptwarning"><roundcube:label name="noscriptwarning" /></p>
|
||||
</noscript>
|
||||
|
||||
<script src="./skins/skynet/script-skynet.js" defer></script>
|
||||
<script src="./skins/skynet/script-skynet.js" defer></script>
|
||||
|
||||
<roundcube:include file="includes/footer.html" />
|
||||
</html>
|
||||
</html>
|
||||
<roundcube:include file="includes/footer.html" />
|
||||
|
||||
Référencer dans un nouveau ticket
Bloquer un utilisateur