Update doc && main page

Author: YuWei-CH

README.md

@@ -7,7 +7,7 @@ EasyRelocate is an open-source, non-commercial decision-support tool for housing
 
 When relocating for an internship, research visit, or new job, housing information is often fragmented across multiple platforms, making comparison slow and error-prone. EasyRelocate helps users organize and compare housing options by focusing on what matters most: where to live, not where to book.
 
-Users collect listings while browsing platforms such as Airbnb, Blueground, facebook group using a lightweight browser extension. EasyRelocate then aggregates the minimal, user-authorized information needed to visualize listings on a single map and compare them by price, location, and commute time to a chosen workplace.
+Users collect listings while browsing platforms such as Airbnb, Blueground, Facebook Group using a lightweight browser extension (only support Google Chrom now). EasyRelocate then aggregates the minimal, user-authorized information needed to visualize listings on a single map and compare them by price, location, and commute time to a chosen workplace.
 
 EasyRelocate does not scrape platforms server-side, host listings, process payments, or replace original marketplaces. It exists solely to help users make better relocation decisions, while respecting platform boundaries and directing all final actions back to the original sources.
 
@@ -42,11 +42,11 @@ VITE_API_BASE_URL="http://127.0.0.1:8000"
 ### Backend (FastAPI / server)
 Backend reads standard env vars (auto-loads repo-root `.env` on startup):
 ```bash
-# Optional (server key; used for /api/geocode and /api/reverse_geocode)
+# Server key; used for /api/geocode and /api/reverse_geocode
 GOOGLE_MAPS_API_KEY="YOUR_SERVER_KEY"
 GEOCODING_PROVIDER="google"
 
-# Optional (required for the extension’s “Add selected post” feature)
+# Rrequired for the extension’s “Add selected post” feature
 OPENROUTER_API_KEY="YOUR_OPENROUTER_KEY"
 OPENROUTER_MODEL="z-ai/glm-4.5-air:free"
 
@@ -55,11 +55,11 @@ ENABLE_GEOCODING="1"
 DATABASE_URL="sqlite:///easyrelocate.db"
 ```
 
-### Extension (Chrome)
+### Chrome Extension (for developer)
 The extension does not read `.env` files. Configure its API base URL in Chrome:
 Extension → **Details** → **Extension options** → “API base URL” (default: `http://127.0.0.1:8000`).
 
-## Local dev (MVP)
+## Local dev
 
 ### 1) Backend API
 ```bash

docs/OPENROUTER_LLM_EXTRACTION.md

@@ -36,7 +36,7 @@ Put these in the **repo-root** `.env`:
 - `OPENROUTER_APP_URL` / `OPENROUTER_APP_NAME` (optional; attribution headers)
 
 ## Model choice
-Default is `z-ai/glm-4.5-air:free` to keep costs low while we iterate on the MVP.
+Default is `z-ai/glm-4.5-air:free` to keep costs low while we iterate.
 
 If extraction quality isn’t good enough, switch to a paid model by setting `OPENROUTER_MODEL`
 in `.env` (restart backend after changes).
@@ -51,4 +51,3 @@ The backend prompt is designed to:
   - Example: `US-101 & McLaughlin Ave, San Jose, CA 95121, USA`
 
 Implementation reference: `backend/app/openrouter.py`.
-

frontend/public/easyrelocate-logo.svg

@@ -22,10 +22,24 @@
 .brandLink {
   color: inherit;
   text-decoration: none;
+  display: inline-flex;
+  align-items: center;
+  gap: 10px;
+  padding: 6px 10px;
+  border-radius: 999px;
+  border: 1px solid rgba(226, 232, 240, 0.9);
+  background: rgba(248, 250, 252, 0.9);
 }
 
 .brandLink:hover {
-  text-decoration: underline;
+  background: rgba(241, 245, 249, 1);
+  border-color: rgba(203, 213, 225, 0.9);
+}
+
+.brandLogo {
+  width: 22px;
+  height: 22px;
+  display: block;
 }
 
 .header .hint {
@@ -274,7 +288,7 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: 14px 16px;
+  padding: 12px 0;
   border-bottom: 1px solid #e2e8f0;
   background: rgba(255, 255, 255, 0.75);
   backdrop-filter: blur(10px);
@@ -283,28 +297,49 @@
   z-index: 10;
 }
 
-.landingBrand {
-  font-weight: 800;
-  letter-spacing: 0.2px;
-  color: #0f172a;
+.landingHeaderInner {
+  width: min(1120px, 100%);
+  margin: 0 auto;
+  padding: 0 16px;
   display: flex;
   align-items: center;
-  gap: 10px;
+  justify-content: space-between;
 }
 
-.landingBrandTag {
-  font-size: 11px;
-  font-weight: 700;
-  padding: 4px 8px;
+.landingBrandButton {
+  font-weight: 850;
+  letter-spacing: 0.2px;
+  color: #0f172a;
+  display: inline-flex;
+  align-items: center;
+  gap: 10px;
+  text-decoration: none;
+  padding: 7px 11px;
   border-radius: 999px;
-  color: #334155;
-  background: rgba(226, 232, 240, 0.7);
   border: 1px solid rgba(226, 232, 240, 0.9);
+  background: rgba(248, 250, 252, 0.9);
+}
+
+.landingBrandButton:hover {
+  background: rgba(241, 245, 249, 1);
+  border-color: rgba(203, 213, 225, 0.9);
+}
+
+.landingBrandLogo {
+  width: 24px;
+  height: 24px;
+  display: block;
+}
+
+.landingHeaderActions {
+  display: flex;
+  align-items: center;
+  gap: 10px;
 }
 
 .landingMain {
   flex: 1;
-  width: min(1040px, 100%);
+  width: min(1120px, 100%);
   margin: 0 auto;
   padding: 24px 16px 40px 16px;
 }

frontend/src/App.css

@@ -547,11 +547,17 @@ function App() {
         <div>
           <h1>
             <Link className="brandLink" to="/">
+              <img
+                className="brandLogo"
+                src="/easyrelocate-logo.svg"
+                alt=""
+                aria-hidden="true"
+              />
               EasyRelocate
             </Link>
           </h1>
           <div className="hint">
-            US-only MVP: save listings via the extension, then compare here.
+            Save listings via the extension, then compare here.
           </div>
         </div>
         <div className="actions">

frontend/src/pages/ComparePage.tsx

@@ -6,8 +6,21 @@ export default function LandingPage() {
   return (
     <div className="landing">
       <header className="landingHeader">
-        <div className="landingBrand">
-          EasyRelocate <span className="landingBrandTag">US-only MVP</span>
+        <div className="landingHeaderInner">
+          <Link className="landingBrandButton" to="/">
+            <img
+              className="landingBrandLogo"
+              src="/easyrelocate-logo.svg"
+              alt=""
+              aria-hidden="true"
+            />
+            EasyRelocate
+          </Link>
+          <div className="landingHeaderActions">
+            <Link className="button secondary" to="/compare">
+              Start comparing
+            </Link>
+          </div>
         </div>
       </header>
 
@@ -24,8 +37,8 @@ export default function LandingPage() {
               <p>
                 EasyRelocate is a non-commercial decision-support tool for interns/students
                 relocating to a new city. Save listings while you browse (starting with
-                Airbnb, Blueground and LLM extraction method), then compare them on one map with price + distance
-                filters.
+                Airbnb, Blueground, and selected posts via LLM), then compare them on one map with
+                price + distance filters.
               </p>
               <div className="landingCtas">
                 <Link className="button" to="/compare">
@@ -41,7 +54,7 @@ export default function LandingPage() {
                 </a>
               </div>
               <div className="landingNote">
-                US-only MVP for now. Listing locations may be approximate.
+                Listing locations may be approximate. Verify details on the original source.
               </div>
             </div>