BloomFeed Upgrade v0.21

public/css/app.css

@@ -1008,10 +1008,35 @@ h1, h2, h3 {
     flex-wrap: wrap;
 }
 
+.market-toolbar {
+    display: flex;
+    gap: var(--space-2);
+    align-items: stretch;
+}
+
 .market-search {
     font-size: var(--font-base);
     padding: 13px 18px;
     border-radius: var(--radius);
+    flex: 1;
+}
+
+.market-lang-select {
+    width: auto;
+    min-width: 170px;
+    border-radius: var(--radius);
+    font-size: var(--font-sm);
+    cursor: pointer;
+}
+
+@media (max-width: 720px) {
+    .market-toolbar {
+        flex-direction: column;
+    }
+
+    .market-lang-select {
+        width: 100%;
+    }
 }
 
 .market-chips {
@@ -1129,6 +1154,41 @@ h1, h2, h3 {
     font-weight: 700;
 }
 
+/* ---------- Sélecteur de langue ---------- */
+
+.locale-form {
+    display: flex;
+    align-items: center;
+}
+
+.locale-select {
+    background: transparent;
+    border: 1.5px solid var(--border);
+    border-radius: var(--radius-sm);
+    padding: 6px 10px;
+    font-size: var(--font-xs);
+    font-weight: 600;
+    color: var(--text-muted);
+    cursor: pointer;
+    font-family: inherit;
+    transition: border-color var(--t-fast), color var(--t-fast);
+}
+
+.locale-select:hover {
+    border-color: var(--accent);
+    color: var(--text);
+}
+
+.guest-topbar {
+    position: fixed;
+    top: 16px;
+    right: 20px;
+    display: flex;
+    align-items: center;
+    gap: var(--space-2);
+    z-index: 30;
+}
+
 /* ---------- Responsive ---------- */
 
 @media (max-width: 720px) {

public/js/app.js

@@ -40,18 +40,21 @@
         }
 
         var search = document.getElementById('market-search');
+        var langSelect = document.getElementById('market-lang');
         var chips = document.getElementById('market-chips');
         var emptyNotice = document.getElementById('market-empty');
         var activeCategory = '';
 
         function applyFilters() {
             var query = (search.value || '').toLowerCase().trim();
+            var activeLang = langSelect ? langSelect.value : '';
             var visible = 0;
 
             grid.querySelectorAll('.market-card').forEach(function (card) {
                 var matchesCategory = !activeCategory || card.getAttribute('data-category') === activeCategory;
+                var matchesLang = !activeLang || card.getAttribute('data-lang') === activeLang;
                 var matchesQuery = !query || card.getAttribute('data-search').indexOf(query) !== -1;
-                var show = matchesCategory && matchesQuery;
+                var show = matchesCategory && matchesLang && matchesQuery;
                 card.hidden = !show;
                 if (show) {
                     visible++;
@@ -63,6 +66,10 @@
 
         search.addEventListener('input', applyFilters);
 
+        if (langSelect) {
+            langSelect.addEventListener('change', applyFilters);
+        }
+
         chips.addEventListener('click', function (event) {
             var chip = event.target.closest('.chip');
             if (!chip) {