ajouter une fonctionnalité d'envoi de message avec options d'embed et historique des messages

2026-06-03 23:36:37 +02:00 · 2026-01-18 13:53:11 +01:00
parent 77842b3685
commit a3ebe47c24
5 changed files with 707 additions and 0 deletions
@@ -799,3 +799,168 @@ body {
  background: #d9a02a;
 }

+/* ===== Send Message Preview ===== */
+.message-preview {
+  background: var(--bg-dark);
+  border-radius: var(--radius-md);
+  padding: var(--spacing-md);
+  min-height: 100px;
+}
+
+.preview-content {
+  color: var(--text-primary);
+  margin-bottom: var(--spacing-md);
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+.preview-embed {
+  background: var(--bg-card);
+  border-left: 4px solid var(--primary-color);
+  border-radius: var(--radius-sm);
+  padding: var(--spacing-md);
+  position: relative;
+  max-width: 520px;
+}
+
+.preview-embed-author {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-xs);
+  font-size: 0.85rem;
+  color: var(--text-secondary);
+  margin-bottom: var(--spacing-xs);
+}
+
+.preview-author-icon {
+  width: 24px;
+  height: 24px;
+  border-radius: 50%;
+}
+
+.preview-embed-author a {
+  color: var(--text-secondary);
+  text-decoration: none;
+}
+
+.preview-embed-author a:hover {
+  text-decoration: underline;
+}
+
+.preview-embed-title {
+  font-weight: 600;
+  color: var(--text-primary);
+  font-size: 1rem;
+  margin-bottom: var(--spacing-xs);
+}
+
+.preview-embed-description {
+  color: var(--text-secondary);
+  font-size: 0.9rem;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+.preview-embed-thumbnail {
+  position: absolute;
+  top: var(--spacing-md);
+  right: var(--spacing-md);
+  max-width: 80px;
+  max-height: 80px;
+  border-radius: var(--radius-sm);
+}
+
+.preview-embed-fields {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--spacing-sm);
+  margin-top: var(--spacing-md);
+}
+
+.preview-embed-field {
+  flex: 1 1 100%;
+}
+
+.preview-embed-field.inline {
+  flex: 1 1 calc(33% - var(--spacing-sm));
+  min-width: 150px;
+}
+
+.preview-field-name {
+  font-weight: 600;
+  font-size: 0.85rem;
+  color: var(--text-primary);
+  margin-bottom: 2px;
+}
+
+.preview-field-value {
+  font-size: 0.85rem;
+  color: var(--text-secondary);
+}
+
+.preview-embed-image {
+  max-width: 100%;
+  max-height: 300px;
+  border-radius: var(--radius-sm);
+  margin-top: var(--spacing-md);
+}
+
+.preview-embed-footer {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-xs);
+  margin-top: var(--spacing-md);
+  font-size: 0.75rem;
+  color: var(--text-muted);
+}
+
+.preview-footer-icon {
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+}
+
+/* ===== Field Items ===== */
+.field-item {
+  background: var(--bg-card);
+  padding: var(--spacing-sm);
+  border-radius: var(--radius-sm);
+  margin-bottom: var(--spacing-sm);
+}
+
+.field-item .form-row {
+  align-items: center;
+}
+
+/* ===== Send Message History ===== */
+.history-item {
+  background: var(--bg-card);
+  border-radius: var(--radius-sm);
+  padding: var(--spacing-md);
+  margin-bottom: var(--spacing-sm);
+}
+
+.history-item-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: var(--spacing-xs);
+}
+
+.history-channel {
+  color: var(--primary-color);
+  font-weight: 500;
+}
+
+.history-time {
+  color: var(--text-muted);
+  font-size: 0.8rem;
+}
+
+.history-content {
+  color: var(--text-secondary);
+  font-size: 0.9rem;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}