mirror of
https://github.com/R0m1k3/noteflow.git
synced 2026-10-21 22:28:18 +02:00
UX: Résumés RSS par article + Optimisation 1920x1080
Résumés RSS par article (100 mots max):
- Modifié route POST /api/rss/summarize pour générer un résumé PAR article
- Chaque résumé limité à 100 mots (max_tokens: 200)
- Format: **Titre** + Résumé + 🔗 [Lire l'article](lien)
- Résumés générés en parallèle pour meilleure performance
- Supprimé requireAdmin pour accès à tous utilisateurs authentifiés
- Timeout 30s par article au lieu de 60s global
Frontend - Affichage résumés:
- renderRssSummaries() : Détection auto ancien/nouveau format
- formatSummary() : Support liens markdown [texte](url)
- summarizeRss() : Gère tableau de résumés au lieu d'un seul
- Styles CSS pour .rss-link (hover avec underline)
- Nouveau style .rss-summary-article pour résumés individuels
Optimisation pour écran 1920x1080:
- max-width: 1400px → 1800px (utilise mieux l'espace horizontal)
- todo-box-width: 340px → 420px (+80px de largeur)
- Boxes TODO et RSS élargies de 23%
- Grille: ~960px notes + 420px todo + 420px rss = 1800px
- Layout optimisé pour grand écran
CSS - Nouveaux styles:
- .rss-link : liens cliquables avec hover effect
- .rss-summary-article : carte compacte pour résumé individuel
- Hover effects sur liens et cartes
- Responsive maintenu pour petits écrans
Impact utilisateur:
✓ Un résumé par article avec lien direct
✓ Plus concis (100 mots max vs résumé global)
✓ Interface plus large et spacieuse sur 1920x1080
✓ Boxes TODO et RSS 23% plus larges
✓ Meilleure lisibilité des contenus
Files:
- routes/rss.routes.js: Nouveau système de résumés par article
- public/js/complete-app.js: Rendu et gestion résumés
- public/css/variables.css: Dimensions optimisées 1920x1080
- public/css/layout.css: Styles liens + résumés individuels
This commit is contained in:
4 files changed
+173
-84
No files matched your search
@@ -551,6 +551,49 @@ body {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.rss-summary-content a.rss-link {
|
||||
color: var(--color-accent);
|
||||
text-decoration: none;
|
||||
font-weight: var(--font-weight-medium);
|
||||
transition: all var(--transition-fast);
|
||||
border-bottom: 1px solid transparent;
|
||||
}
|
||||
|
||||
.rss-summary-content a.rss-link:hover {
|
||||
border-bottom-color: var(--color-accent);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
/* Nouveau style pour résumés par article */
|
||||
.rss-summary-article {
|
||||
padding: var(--spacing-md);
|
||||
background: var(--color-background);
|
||||
border-radius: var(--radius-md);
|
||||
border: 1px solid var(--color-border);
|
||||
margin-bottom: var(--spacing-md);
|
||||
transition: all var(--transition-fast);
|
||||
}
|
||||
|
||||
.rss-summary-article:hover {
|
||||
border-color: var(--color-accent);
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
|
||||
.rss-summary-article .rss-summary-content {
|
||||
font-size: var(--font-size-sm);
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.rss-summary-article .rss-summary-meta {
|
||||
margin-top: var(--spacing-sm);
|
||||
padding-top: var(--spacing-sm);
|
||||
border-top: 1px solid var(--color-border);
|
||||
display: flex;
|
||||
gap: var(--spacing-md);
|
||||
font-size: var(--font-size-xs);
|
||||
color: var(--color-text-secondary);
|
||||
}
|
||||
|
||||
/* Responsive */
|
||||
@media (max-width: 1200px) {
|
||||
.content-container {
|
||||
|
||||
@@ -67,12 +67,12 @@
|
||||
--transition-base: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
--transition-slow: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
|
||||
/* Dimensions */
|
||||
/* Dimensions - Optimisé pour 1920x1080 */
|
||||
--header-height: 70px;
|
||||
--max-width: 1400px;
|
||||
--max-width: 1800px;
|
||||
--note-width: 320px;
|
||||
--note-expanded-width: 680px;
|
||||
--todo-box-width: 340px;
|
||||
--todo-box-width: 420px;
|
||||
|
||||
/* Z-index */
|
||||
--z-header: 100;
|
||||
|
||||
Reference in new issue
Block a user