init: Vite+React+Tailwind v2 site with HTML content from WP, RSS feed, external feed aggregator, prerender

src/components/Sidebar.jsx

@@ -0,0 +1,67 @@
+import React from 'react';
+import { transport, partners, ads } from '../content';
+
+function Box({ title, children }) {
+  return (
+    <section className="border border-rule bg-white/40 p-4">
+      <h3 className="font-serif text-base font-bold mb-2 pb-2 border-b border-rule">
+        {title}
+      </h3>
+      {children}
+    </section>
+  );
+}
+
+export default function Sidebar() {
+  return (
+    <aside className="space-y-6 text-sm">
+      <Box title="Транспорт">
+        <ul className="space-y-2">
+          {transport.trains.map((t) => (
+            <li key={t.url}>
+              <a href={t.url} target="_blank" rel="noopener noreferrer">{t.label}</a>
+            </li>
+          ))}
+          {transport.buses.map((b) => (
+            <li key={b.url}>
+              <a href={b.url} target="_blank" rel="noopener noreferrer">{b.label}</a>
+            </li>
+          ))}
+        </ul>
+      </Box>
+
+      {partners.length > 0 && (
+        <Box title="Наши партнёры">
+          <ul className="space-y-2">
+            {partners.map((p) => (
+              <li key={p.name}>
+                {p.url ? (
+                  <a href={p.url} target="_blank" rel="noopener noreferrer">{p.name}</a>
+                ) : (
+                  <span>{p.name}</span>
+                )}
+                {p.note && <span className="text-muted"> — {p.note}</span>}
+              </li>
+            ))}
+          </ul>
+        </Box>
+      )}
+
+      {ads.length > 0 && (
+        <Box title="Объявления">
+          <ul className="space-y-2">
+            {ads.map((a, i) => (
+              <li key={i}>
+                {a.url ? (
+                  <a href={a.url} target="_blank" rel="noopener noreferrer">{a.text}</a>
+                ) : (
+                  <span>{a.text}</span>
+                )}
+              </li>
+            ))}
+          </ul>
+        </Box>
+      )}
+    </aside>
+  );
+}