ajouter un système de messages programmés avec options de planification et interface utilisateur

2026-06-08 15:18:33 +02:00 · 2026-01-18 13:40:38 +01:00
parent c3ee18c7d9
commit 77842b3685
7 changed files with 1069 additions and 0 deletions
@@ -626,3 +626,176 @@ body {
    gap: var(--spacing-md);
  }
 }
+
+/* ===== Scheduled Messages ===== */
+.checkbox-group {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--spacing-sm);
+}
+
+.checkbox-item {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-xs);
+  padding: var(--spacing-xs) var(--spacing-sm);
+  background: var(--bg-secondary);
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  user-select: none;
+}
+
+.checkbox-item:hover {
+  background: var(--bg-card);
+}
+
+.checkbox-item input {
+  cursor: pointer;
+}
+
+.checkbox-group-vertical {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-sm);
+}
+
+.checkbox-group-vertical .checkbox-item {
+  width: fit-content;
+}
+
+.times-input-container {
+  display: flex;
+  gap: var(--spacing-sm);
+  align-items: center;
+  margin-bottom: var(--spacing-sm);
+}
+
+.times-list {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--spacing-xs);
+  min-height: 32px;
+}
+
+.time-tag {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--spacing-xs);
+  padding: 4px 10px;
+  background: var(--primary-color);
+  color: white;
+  border-radius: var(--radius-sm);
+  font-size: 0.85rem;
+}
+
+.time-remove {
+  background: none;
+  border: none;
+  color: white;
+  cursor: pointer;
+  font-size: 1.1rem;
+  line-height: 1;
+  opacity: 0.7;
+}
+
+.time-remove:hover {
+  opacity: 1;
+}
+
+.form-actions {
+  display: flex;
+  gap: var(--spacing-sm);
+  margin-top: var(--spacing-md);
+}
+
+.scheduled-message-item {
+  background: var(--bg-secondary);
+  border-radius: var(--radius-md);
+  padding: var(--spacing-md);
+  margin-bottom: var(--spacing-sm);
+}
+
+.scheduled-message-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  margin-bottom: var(--spacing-sm);
+}
+
+.scheduled-message-info strong {
+  color: var(--text-primary);
+  display: block;
+}
+
+.scheduled-message-schedule {
+  font-size: 0.85rem;
+  color: var(--text-muted);
+}
+
+.status-badge {
+  padding: 2px 8px;
+  border-radius: var(--radius-sm);
+  font-size: 0.75rem;
+  font-weight: 600;
+}
+
+.status-active {
+  background: rgba(87, 242, 135, 0.2);
+  color: #57F287;
+}
+
+.status-inactive {
+  background: rgba(237, 66, 69, 0.2);
+  color: #ED4245;
+}
+
+.scheduled-message-preview {
+  background: var(--bg-card);
+  padding: var(--spacing-sm);
+  border-radius: var(--radius-sm);
+  font-size: 0.9rem;
+  color: var(--text-secondary);
+  margin-bottom: var(--spacing-sm);
+  word-break: break-word;
+}
+
+.embed-badge {
+  display: inline-block;
+  padding: 2px 6px;
+  background: var(--primary-color);
+  color: white;
+  border-radius: var(--radius-sm);
+  font-size: 0.75rem;
+  margin-left: var(--spacing-xs);
+}
+
+.scheduled-message-options {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--spacing-xs);
+  margin-bottom: var(--spacing-sm);
+}
+
+.option-tag {
+  padding: 2px 8px;
+  background: var(--bg-card);
+  border-radius: var(--radius-sm);
+  font-size: 0.75rem;
+  color: var(--text-muted);
+}
+
+.scheduled-message-actions {
+  display: flex;
+  gap: var(--spacing-sm);
+  flex-wrap: wrap;
+}
+
+.btn-warning {
+  background: #F0B232;
+  color: #000;
+}
+
+.btn-warning:hover {
+  background: #d9a02a;
+}
+