Fix deadcode and improve Cadence (#7)

Author: aalhour

.gitignore

@@ -18,8 +18,10 @@ vendor/
 .idea/
 *.sublime-*
 
-# Node (if using any tooling)
+# Node (dev tooling only - not part of Jekyll build)
 node_modules/
+package.json
+package-lock.json
 
 # Environment
 .env

Makefile

@@ -1,7 +1,7 @@
 # Digital Bazaar — Makefile
 # Simplifies common development tasks
 
-.PHONY: help install update assets images hero clean serve serve-drafts build setup-hooks prod-build
+.PHONY: help install update assets images hero clean serve serve-drafts build setup-hooks prod-build dev-lint dev-install-tools
 
 # Homebrew Ruby paths (macOS)
 RUBY_BIN := /opt/homebrew/opt/ruby/bin
@@ -35,6 +35,8 @@ help: ## Show this help message
 	@echo "  $(CYAN)serve-drafts$(RESET)   Start server with drafts visible"
 	@echo "  $(CYAN)build$(RESET)          Build static site to _site/"
 	@echo "  $(CYAN)setup-hooks$(RESET)    Enable git pre-commit hooks"
+	@echo "  $(CYAN)dev-install-tools$(RESET) Install PurgeCSS for dead code detection"
+	@echo "  $(CYAN)dev-lint$(RESET)       Find unused CSS (requires dev-install-tools)"
 	@echo ""
 	@echo "$(YELLOW)Production:$(RESET)"
 	@echo "  $(CYAN)prod-build$(RESET)     Build for production (minified)"
@@ -147,6 +149,45 @@ serve: ## Start local development server at http://localhost:4000
 serve-drafts: ## Start server with draft posts visible
 	$(BUNDLE) exec jekyll serve --livereload --drafts
 
+dev-lint: ## Find unused CSS using PurgeCSS (requires: make dev-install-tools)
+	@echo "🔍 Analyzing CSS for unused selectors..."
+	@echo ""
+	@if [ ! -d node_modules/purgecss ]; then \
+		echo "❌ PurgeCSS not installed. Run 'make dev-install-tools' first."; \
+		exit 1; \
+	fi
+	@# Build the site first to get all HTML
+	@$(BUNDLE) exec jekyll build --quiet
+	@mkdir -p _site/purged
+	@echo "Scanning _site/ for unused CSS..."
+	@echo ""
+	@npx purgecss \
+		--css _site/assets/css/styles.css \
+		--content '_site/**/*.html' \
+		--output _site/purged
+	@echo ""
+	@echo "$(YELLOW)Results:$(RESET)"
+	@ORIG=$$(wc -c < _site/assets/css/styles.css | tr -d ' '); \
+	PURGED=$$(wc -c < _site/purged/styles.css | tr -d ' '); \
+	SAVED=$$((ORIG - PURGED)); \
+	echo "  Original:  $$ORIG bytes"; \
+	echo "  Purged:    $$PURGED bytes"; \
+	echo "  Savings:   $$SAVED bytes ($$(( (SAVED * 100) / ORIG ))%)"
+	@echo ""
+	@echo "$(YELLOW)Purged CSS saved to:$(RESET) _site/purged/styles.css"
+	@echo ""
+	@echo "💡 Compare _site/assets/css/styles.css with _site/purged/styles.css"
+	@echo "   to identify unused selectors, then manually remove from source."
+
+dev-install-tools: ## Install dead code detection tools (PurgeCSS)
+	@echo "📦 Installing dead code detection tools..."
+	@if [ ! -f package.json ]; then \
+		echo '{"name": "digitalbazaar-dev", "private": true}' > package.json; \
+	fi
+	npm install --save-dev purgecss
+	@echo ""
+	@echo "✅ Tools installed. Run 'make dev-lint' to analyze CSS."
+
 # =============================================================================
 # PRODUCTION
 # =============================================================================

README.md

@@ -1,8 +1,8 @@
-# Digital Bazaar 🛍️
+# Digital Bazaar 💬
 
-**البازار الرقمي** — A bilingual (Arabic/English) digital magazine for the Arab tech community.
+**البازار الرقمي** — A bilingual (Arabic/English) digital community for the Arab world.
 
-> A high-signal Arabic community for builders.
+> A modern bazaar for Arab digital minds.
 
 ## Dependencies
 

_config.yml

@@ -2,7 +2,7 @@
 # A bilingual (Arabic/English) digital magazine for the Arab tech community
 
 # Site Settings
-title: Digital Bazaar
+title: Digital Bazaar 💬
 description: A modern bazaar for Arab digital minds.
 url: "https://digitalbazaarhub.github.io"
 baseurl: ""

_data/strings_ar.yml

@@ -22,12 +22,6 @@ nav:
   rules: "القواعد"
   menu: "القائمة"
 
-# Language Toggle
-language:
-  current: "العربية"
-  switch_to: "English"
-  switch_url: "/en/"
-
 # Buttons
 buttons:
   join_whatsapp: "انضم إلى واتساب"
@@ -45,12 +39,6 @@ arrow_left: "→"
 arrow_external: "↖"
 arrow_external_rtl: "↗"
 
-# 404 Page
-error_404:
-  title: "الصفحة غير موجودة"
-  message: "عذراً، الصفحة التي تبحث عنها غير موجودة."
-  back: "العودة للرئيسية"
-
 # Months (for archive) — KEEP AS-IS
 months:
   January: "يناير"
@@ -404,20 +392,23 @@ cadence_page:
   hero_alt: "تجمّع أناس في بازار رقمي دافئ"
   keep_up:
     label: "كيف تتابع؟"
-    text: "نعلن المواعيد والتذكيرات في مجموعة «الإعلانات» على الواتساب. قد تختلف الأوقات — ونحاول المداورة بين المناطق الزمنية."
+    text: "نعلن المواعيد والتذكيرات في قروب «الإعلانات» على الواتساب. قد تختلف الأوقات — ونحاول المداورة بين المناطق الزمنية."
 
   rhythms:
     heading: "📅 جلسات متكرّرة"
     items:
-      - title: "سبت البازار"
+      - title: "📱 بازار السبت"
         description: "جلسة كتابية خفيفة يوم السبت عبر المجموعات: شارك ما تبنيه/تتعلمه، اطرح أسئلة، وشارك في النقاش."
         how: "أفضل طريقة للمشاركة: تحديث قصير (سطران–ثلاثة) + سؤال واحد واضح."
-      - title: "جلسات Firesides الشهرية"
+      - title: "🔥 جلسات Firesides الشهرية"
         description: "جلسة يقودها ضيف (أو حلقة نقاش) حول موضوع واحد مع أسئلة وأجوبة مباشرة. نعلن الشكل والموعد مسبقًا."
         how: "أفضل طريقة للمشاركة: اقرأ تمهيد الجلسة، جهّز سؤالًا واحدًا جيدًا، ثم تابع بعد الجلسة."
-      - title: "خيوط الأسئلة والأجوبة الدورية"
+      - title: "🤔 خيوط الأسئلة والأجوبة الدورية"
         description: "خيوط «اسألني أي شيء» غير متزامنة مع خبراء من المجتمع. ممتازة للأسئلة العميقة دون الالتزام بموعد."
         how: "أفضل طريقة للمشاركة: سياق + قيود + ماذا جرّبت."
+      - title: "🤝 الإرشاد"
+        description: "إرشاد مُنظّم مع ساعات مكتب محددة المدة وطلبات واضحة. لا وعود مبهمة — فقط عمل حقيقي وحلقات ملاحظات. توجّه إلى قروب «النصائح والإرشاد»."
+        how: "أفضل طريقة للمشاركة: تعال بسؤال أو تحدٍّ محدد، وليس طلب عام «أريد أسألك»."
 
   participation:
     heading: "✅ كيف تشارك دون أن تُرهق"
@@ -455,9 +446,9 @@ cadence_page:
       - question: "هل الجلسات بالعربية فقط؟"
         answer: "لا. بعضها عربي، بعضها إنجليزي، وكثير منها خليط. الاثنين مرحّب بهما."
       - question: "هل تنشرون ملخصات؟"
-        answer: "أحيانًا. وعندها نضع الرابط في المجموعة ذات الصلة (ولاحقًا على الموقع)."
+        answer: "أحيانًا. وعندها نضع الرابط في القروب ذات الصلة (ولاحقًا على الموقع)."
       - question: "كيف أعرف ما القادم؟"
-        answer: "مجموعة «الإعلانات» على الواتساب - هي مصدر الحقيقة."
+        answer: "قروب «الإعلانات» على الواتساب - هي مصدر الحقيقة."
 
 #####################################
 #                                   #

_data/strings_en.yml

@@ -20,24 +20,12 @@ nav:
   rules: "Rules"
   menu: "Menu"
 
-# Language Toggle
-language:
-  current: "English"
-  switch_to: "العربية"
-  switch_url: "/ar/"
-
 # Directional arrows (flip for RTL)
 arrow_right: "→"
 arrow_left: "←"
 arrow_external: "↗"
 arrow_external_rtl: "↖"
 
-# 404 Page
-error_404:
-  title: "Page Not Found"
-  message: "Sorry, the page you're looking for doesn't exist."
-  back: "Back to Home"
-
 #############################
 #                           #
 #       "Home" Page         #
@@ -373,20 +361,23 @@ cadence_page:
   hero_alt: "People gathering in a warm digital bazaar"
   keep_up:
     label: "How to keep up:"
-    text: "Dates and reminders are posted in the Announcements group on WhatsApp. Times vary — we try to rotate for different time zones."
+    text: "Dates and reminders are posted in the WhatsApp <i>\"Announcements\"</i> group. Times vary — we try to rotate for different time zones."
 
   rhythms:
     heading: "📅 Recurring sessions"
     items:
-      - title: "Bazaar Saturdays"
-        description: "A casual text-based Saturday session across the groups: share what you’re building/learning, ask questions, and join the conversation."
+      - title: "📱 Bazaar Saturdays"
+        description: "A casual text-based Saturday session across the groups: share what you're building/learning, ask questions, and join the conversation."
         how: "Best way to join: post a 2–3 line update + one clear question."
-      - title: "Monthly Firesides"
+      - title: "🔥 Monthly Firesides"
         description: "A guest-led session (or panel) on one topic, with live Q&A. Format + time are announced in advance."
         how: "Best way to join: read the prompt, bring one thoughtful question, and follow up after."
-      - title: "Periodic Q&A threads"
-        description: "Async “ask me anything” threads with community experts. Great for deep questions without meeting times."
+      - title: "🤔 Periodic Q&A threads"
+        description: "Async ask me anything threads with community experts. Great for deep questions without meeting times."
         how: "Best way to join: give context + constraints + what you tried."
+      - title: "🤝 Mentorship"
+        description: "Structured mentorship with time-boxed office hours and clear asks. No vague promises — just proof-of-work and real feedback loops. Head to the <i>\"Advice & Mentorship\"</i> group."
+        how: "Best way to join: come with a specific question or challenge, not a general 'pick your brain' request."
 
   participation:
     heading: "✅ How to participate (without getting overwhelmed)"
@@ -426,7 +417,7 @@ cadence_page:
       - question: "Do you post recaps?"
         answer: "Sometimes. If we do, we’ll link them from the relevant group (and later, on the website)."
       - question: "How do I know what’s next?"
-        answer: "Announcements group on WhatsApp — that’s the source of truth."
+        answer: "<i>\"Announcements\"</i> group on WhatsApp — that’s the source of truth."
 
 #####################################
 #                                   #

assets/css/styles.scss

@@ -2601,23 +2601,30 @@ code:not(pre code) {
   margin-bottom: 16px;
 }
 
-/* Rhythm cards grid */
+/* Rhythm cards grid - 2x2 on all breakpoints above mobile */
 .cadence-rhythms {
   display: grid;
-  gap: 16px;
+  gap: 18px;
 }
 
 @media (min-width: 640px) {
   .cadence-rhythms {
-    grid-template-columns: repeat(3, 1fr);
+    grid-template-columns: repeat(2, 1fr);
   }
 }
 
 .rhythm-card {
-  background: var(--surface-elevated);
+  background: var(--card-bg);
   border: 1px solid var(--border);
-  border-radius: var(--radius-md);
-  padding: 18px;
+  border-radius: var(--radius-lg);
+  padding: 18px 20px 20px;
+  box-shadow: var(--card-shadow);
+  transition: transform 0.12s ease, box-shadow 0.18s ease;
+}
+
+.rhythm-card:hover {
+  transform: translateY(-3px);
+  box-shadow: 0 12px 28px rgba(0,0,0,0.12);
 }
 
 .rhythm-card h3 {
@@ -2667,14 +2674,8 @@ code:not(pre code) {
    Helper classes for common styling needs.
    Uses logical properties where applicable for RTL support.
    -------------------------------------------------------------------------- */
-.text-center { text-align: center; }
-.text-start { text-align: start; }
-.text-end { text-align: end; }
 
-.mt-0 { margin-top: 0; }
-.mb-0 { margin-bottom: 0; }
 
-.hidden { display: none !important; }
 
 /* --------------------------------------------------------------------------
    21. PRINT STYLES