pierre/SimpleClient-releases
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 7 Wiki Activity

checkbox clickable et modification des textes

Browse Source
This commit is contained in:
Pierre Marx
2025-09-04 14:34:54 -04:00
parent 5bfdb286db
commit ec0ea73e35
3 changed files with 148 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
index.html
View File

@@ -1,11 +1,11 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>SimpleConnect - Gestion Centralisée des Plannings</title>
<link rel="stylesheet" href="choices.min.css">
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="choices.min.css" />
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<!-- Page de connexion -->
@@ -14,12 +14,24 @@
<h1>SimpleConnect</h1>
<div class="signalr-status">
<span class="signalr-indicator" id="signalrIndicator"></span>
<span class="signalr-text" id="signalrText">Connexion au serveur...</span>
<span class="signalr-text" id="signalrText"
>Connexion au serveur...</span
>
</div>
<h2>Connexion Agent</h2>
<form id="loginForm">
<input type="text" id="accessCode" placeholder="Code d'accès" required>
<input type="password" id="password" placeholder="Mot de passe" required>
<input
type="text"
id="accessCode"
placeholder="Code d'accès"
required
/>
<input
type="password"
id="password"
placeholder="Mot de passe"
required
/>
<select id="terminal" required>
<option value="" placeholder>Chargement des postes...</option>
</select>
@@ -27,10 +39,13 @@
<!-- Option de déconnexion forcée -->
<div class="force-disconnect-container">
<label class="checkbox-label">
<input type="checkbox" id="forceDisconnect">
<input type="checkbox" id="forceDisconnect" />
<span>Déconnexion</span>
</label>
<small class="checkbox-hint">Cochez si vous rencontrez des problèmes de connexion ou si votre session est bloquée</small>
<small class="checkbox-hint"
>À cocher en cas de problème de connexion ou de session
bloquée.</small
>
</div>
<button type="submit">Se connecter</button>
@@ -54,7 +69,9 @@
</div>
</div>
<div class="header-right">
<button id="simulateCallBtn" class="btn-secondary">Simuler un appel</button>
<button id="simulateCallBtn" class="btn-secondary">
Simuler un appel
</button>
<button id="logoutBtn" class="btn-secondary">Déconnexion</button>
</div>
</header>
@@ -106,7 +123,10 @@
<!-- Zone de notes rapides -->
<div class="notes-section">
<h4>Notes rapides</h4>
<textarea id="quickNotes" placeholder="Prenez des notes ici..."></textarea>
<textarea
id="quickNotes"
placeholder="Prenez des notes ici..."
></textarea>
<button id="saveNotesBtn" class="btn-small">Sauvegarder</button>
</div>
</main>
@@ -119,7 +139,9 @@
<span class="close">&times;</span>
<h2>Simuler un appel entrant</h2>
<div id="simulatedCallsList" class="simulated-calls-list"></div>
<button id="customCallBtn" class="btn-secondary">Appel personnalisé</button>
<button id="customCallBtn" class="btn-secondary">
Appel personnalisé
</button>
</div>
</div>

2
renderer.js
View File

@@ -127,7 +127,7 @@ async function handleLogin(e) {
// Désactiver le bouton pendant la connexion
loginBtn.disabled = true;
loginBtn.textContent = forceDisconnect ? 'Déconnexion forcée et reconnexion...' : 'Connexion en cours...';
loginBtn.textContent = forceDisconnect ? 'Reconnexion...' : 'Connexion en cours...';
errorDiv.textContent = '';
try {

22
styles.css
View File

@@ -408,8 +408,11 @@ body {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
height: 18px;
width: 18px;
left: 0;
top: 1px;
z-index: 1;
}
/* Checkbox personnalisée */
@@ -427,14 +430,21 @@ body {
flex-shrink: 0;
}
/* Checkbox cochée */
.checkbox-label input[type="checkbox"]:checked ~ ::before {
/* Checkbox cochée - fond violet */
.checkbox-label input[type="checkbox"]:checked + span::before {
content: '';
position: absolute;
left: 0;
top: 1px;
width: 18px;
height: 18px;
background: #667eea;
border-color: #667eea;
border: 2px solid #667eea;
border-radius: 4px;
}
/* Icône de check */
.checkbox-label input[type="checkbox"]:checked ~ ::after {
.checkbox-label input[type="checkbox"]:checked + span::after {
content: '';
position: absolute;
left: 6px;