feat: add Bing daily background image

extension/app.js

@@ -1476,6 +1476,47 @@ document.addEventListener('input', async (e) => {
 });
 
 
+/* ----------------------------------------------------------------
+   BING DAILY BACKGROUND
+   ---------------------------------------------------------------- */
+
+async function fetchBingBackground() {
+  const today = new Date().toISOString().slice(0, 10);
+  const stored = await chrome.storage.local.get('bingBackground');
+  const cached = stored.bingBackground;
+
+  if (cached && cached.date === today) return cached;
+
+  try {
+    const res = await fetch('https://www.bing.com/HPImageArchive.aspx?format=js&idx=0&n=1&mkt=zh-CN');
+    const data = await res.json();
+    const img = data.images[0];
+    const result = {
+      date: today,
+      url: 'https://www.bing.com' + img.url,
+      copyright: img.copyright || '',
+    };
+    await chrome.storage.local.set({ bingBackground: result });
+    return result;
+  } catch {
+    return cached || null;
+  }
+}
+
+async function applyBingBackground() {
+  const bg = await fetchBingBackground();
+  if (!bg) return;
+
+  document.body.style.backgroundImage = `url('${bg.url}')`;
+  document.body.classList.add('has-bing-bg');
+
+  const creditEl = document.getElementById('bingCredit');
+  if (creditEl && bg.copyright) creditEl.textContent = '© ' + bg.copyright;
+}
+
+applyBingBackground();
+
+
 /* ----------------------------------------------------------------
    INITIALIZE
    ---------------------------------------------------------------- */

extension/index.html

@@ -108,6 +108,7 @@ <h2>Saved for later</h2>
     </div>
     <div class="last-refresh">
       <span style="color: var(--muted); font-size: 11px;"><a href="https://github.com/zarazhangrui/tab-out" target="_top" style="color: var(--muted); text-decoration: underline; text-underline-offset: 2px;">Tab Out</a> by <a href="https://x.com/zarazhangrui" target="_top" style="color: var(--muted); text-decoration: underline; text-underline-offset: 2px;">Zara</a></span>
+      <span id="bingCredit" class="bing-credit"></span>
     </div>
   </footer>
 

extension/manifest.json

@@ -4,6 +4,7 @@
   "version": "1.0.0",
   "description": "Keep tabs on your tabs. New tab page that groups your open tabs by domain and lets you close them with style.",
   "permissions": ["tabs", "activeTab", "storage"],
+  "host_permissions": ["https://www.bing.com/*"],
   "chrome_url_overrides": { "newtab": "index.html" },
   "background": { "service_worker": "background.js" },
   "action": {

extension/style.css

@@ -40,6 +40,25 @@ body::before {
   z-index: 0;
 }
 
+/* Bing daily background */
+body.has-bing-bg {
+  background-size: cover;
+  background-position: center;
+  background-attachment: fixed;
+}
+
+body.has-bing-bg::before {
+  background-image: none;
+  background-color: rgba(248, 245, 240, 0.68);
+}
+
+.bing-credit {
+  font-size: 10px;
+  color: var(--muted);
+  margin-top: 4px;
+  display: block;
+}
+
 .container {
   position: relative;
   z-index: 1;