AtlasAnalyticsLab · chengjiahao1234 · Dec 2, 2025 · Dec 2, 2025 · Dec 2, 2025
diff --git a/DEVELOPMENT.md b/DEVELOPMENT.md
@@ -195,6 +195,17 @@ git push origin feature/team-member-[name]
 # Open PR on GitHub
 ```
 
+#### Adding Gallery Photos
+```bash
+git checkout -b feature/add-gallery-photos-2025-12-02
+# Add photos to images/picpic/
+bundle exec jekyll serve  # Test locally
+git add images/picpic/
+git commit -m "content: add lab photos from [event]"
+git push origin feature/add-gallery-photos-2025-12-02
+# Open PR on GitHub
+```
+
 #### Layout/Design Changes
 ```bash
 git checkout -b feature/[component]-redesign
@@ -294,10 +305,10 @@ git push origin hotfix/critical-issue
 default.html (base template)
 ├── homelay.html (homepage with carousel + news)
 ├── textlay.html (simple text pages)
+├── gallerylay.html (gallery with masonry layout)
 ├── team.html (team member grids)
 ├── publications.html (publication list wrapper)
 ├── gridlay.html (publications grid)
-├── gridlay2.html (generic grid)
 └── bib.html (individual bibliography items)
 ```
 
@@ -323,16 +334,15 @@ default.html (base template)
 - `.github/ISSUE_TEMPLATE/` - Issue templates
 - `bin/deploy` - Manual deployment script
 
-#### Layouts (12 files)
+#### Layouts (8 files)
 1. **default.html** - Base template with `<html>`, header, footer
 2. **homelay.html** - Homepage two-column layout (main content + news sidebar)
 3. **textlay.html** - Full-width text layout for simple pages
-4. **team.html** - Team page with member grids
-5. **publications.html** - Publications page wrapper
-6. **gridlay.html** - Grid layout for publications
-7. **gridlay2.html** - Generic grid layout (available for future use)
+4. **gallerylay.html** - Gallery layout with CSS Grid masonry and optimized spacing
+5. **team.html** - Team page with member grids
+6. **publications.html** - Publications page wrapper
+7. **gridlay.html** - Grid layout for publications
 8. **bib.html** - Individual bibliography item rendering
-9. **piclay.html** - Picture gallery layout (unused, can be deleted)
 
 #### Includes (10 files)
 1. **head.html** - HTML `<head>` section with metadata, stylesheets, CDN links
@@ -364,11 +374,11 @@ default.html (base template)
 5. **funding.md** - Funding acknowledgements
 6. **contact.md** - Contact information and directions
 7. **allnews.md** - Complete news archive
-8. **gallery.md** - Lab life photo gallery
+8. **gallery.md** - Lab life photo gallery with CSS Grid masonry layout
 9. **aboutwebsite.md** - Template usage guide
 10. **404.md** - Custom error page with navigation buttons
 
-#### Stylesheets (6 files)
+#### Stylesheets (7 files)
 1. **css/main.scss** - Main stylesheet entry point (630 lines, cleaned and organized Nov 2025)
    - Imports all SASS partials
    - Defines layout system (layout-wide vs layout-fixed)
@@ -379,14 +389,15 @@ default.html (base template)
 4. **_sass/_components.scss** - Custom components (buttons, panels, cards)
 5. **_sass/_publications.scss** - Publication card styles (30% image width, top-aligned)
 6. **_sass/_themes.scss** - Light/dark theme CSS custom properties
+7. **_sass/_gallery.scss** - Gallery masonry layout styles (CSS Grid with responsive columns)
 
-#### JavaScript (2 files)
+#### JavaScript (3 files)
 1. **js/theme-toggle.js** - Three-state theme controller (light/dark/auto)
-2. **js/npm.js** - Legacy npm-related script (likely unused, can be deleted)
+2. **js/gallery-masonry.js** - Gallery masonry fallback for browsers without CSS Grid masonry support
+3. **js/external-links.js** - Automatically opens external links in new tabs
 
-#### Ruby Plugins (2 files)
-1. **_plugins/hideCustomBibtex.rb** - BibTeX keyword filter
-2. **_plugins/markdown.rb** - Markdown include tag
+#### Ruby Plugins (1 file)
+1. **_plugins/hideCustomBibtex.rb** - BibTeX keyword filter for bibliography entries
 
 #### Image Directories (5 directories, 52+ files)
 1. **images/homepic/** - Homepage carousel (auto-loaded, 4 images)
@@ -867,19 +878,12 @@ headline: "Text with [link](OPENINGS_LINK)"
 - ✅ 22 PDFs from `assets/papers/`
 - ✅ 4 PDFs from `assets/vacancies/`
 
-**Total Deleted:** 24+ items (~2-3MB freed)
-
-### Remaining Cleanup Items (1 item)
-
-1. **`_layouts/piclay.html`** - Picture gallery layout (unused)
-   ```bash
-   rm _layouts/piclay.html
-   ```
+**Total Deleted:** 28+ items (~3MB freed)
 
 ### Files to Keep
 
 **Essential Layouts (8 files):**
-- All active layouts: default, homelay, textlay, team, publications, gridlay, gridlay2, bib
+- All active layouts: default, homelay, textlay, gallerylay, team, publications, gridlay, bib
 
 **Active Data Files (8 files):**
 - All team and content data files in `_data/`
@@ -972,29 +976,6 @@ headline: "Text with [link](OPENINGS_LINK)"
    - Check for slow-loading pages
    - Review CDN performance
 
-### Next Cleanup (Immediate)
-
-```bash
-# Delete remaining unused file
-rm _layouts/piclay.html
-
-# Commit cleanup
-git add -A
-git commit -m "chore: remove unused file (piclay.html)"
-git push
-```
-
-### Next Review
-
-**Scheduled:** December 2025
-
-**Tasks:**
-- [ ] Review and update this documentation
-- [ ] Check for new unused files
-- [ ] Audit image usage
-- [ ] Review security configurations
-- [ ] Update changelog with new features
-
 ---
 
 ## Verification Commands

diff --git a/README.md b/README.md
@@ -3,7 +3,8 @@
 Official website for the **Atlas Analytics Lab** at Concordia University, Montreal. We focus on AI research in computational pathology, foundation models, and medical imaging.
 
 **🌐 Live Site:** https://atlasanalyticslab.github.io  
-**📧 Contact:** mahdi.hosseini@concordia.ca
+**📧 Contact:** mahdi.hosseini@concordia.ca  
+**📊 Site Stats:** 8 layouts · 10 includes · 3 JS modules · 10 pages · Clean codebase (Dec 2025 audit)
 
 ---
 
@@ -143,10 +144,23 @@ Simply add images to this directory - they automatically appear in the carousel.
 
 ### Lab Life Gallery
 
-**Directory:** `images/picpic/`
+**Directory:** `images/picpic/`  
+**Layout:** CSS Grid Masonry (auto-reordering for tight packing)
 
 Add photos of lab events, conferences, and activities. They automatically appear on the `/gallery/` page.
 
+**Features:**
+- **Automatic image loading** - Just drop images in `images/picpic/`
+- **Masonry layout** - Images automatically reorder to minimize gaps
+- **Responsive grid** - 1 column (mobile) → 2 (tablet) → 3 (desktop) → 4 (large screens)
+- **Respects layout_wide setting** - Adapts to site-wide layout configuration
+- **Supported formats:** JPG, JPEG, PNG
+
+**How it works:**
+- Images sorted by filename in reverse order (newest first)
+- CSS Grid masonry with JavaScript fallback for browser compatibility
+- No code changes needed when adding/removing photos
+
 ---
 
 ## Project Structure
@@ -222,6 +236,53 @@ yes | bash bin/deploy --src main --deploy gh-pages
 
 ---
 
+## Architecture & Technology
+
+### Core Technologies
+
+**Static Site Generator:**
+- Jekyll 4.4.1 (Ruby-based)
+- Liquid templating engine
+- Kramdown Markdown processor
+
+**Frontend Framework:**
+- Bootstrap 5 (Lumen theme)
+- Custom SCSS modules (5 partials)
+- Responsive design (5 breakpoints: 576px, 768px, 992px, 1200px, 1400px)
+
+**JavaScript Modules (3 files):**
+1. `theme-toggle.js` - Three-state theme switcher (light/dark/auto)
+2. `gallery-masonry.js` - CSS Grid masonry fallback
+3. `external-links.js` - Auto-opens external links in new tabs
+
+**Layout System:**
+- 8 layout templates (`_layouts/`)
+- 10 reusable components (`_includes/`)
+- Layout-wide mode: configurable full-width or fixed 1000px
+
+### File Structure Overview
+
+```
+├── _layouts/          # 8 page layouts (default, homelay, textlay, etc.)
+├── _includes/         # 10 reusable components (header, footer, etc.)
+├── _pages/            # 10 content pages (Markdown)
+├── _data/             # 8 YAML data files (team, publications, news)
+├── _sass/             # 5 SCSS modules (variables, components, themes, etc.)
+├── _plugins/          # 1 Ruby plugin (BibTeX filter)
+├── css/               # Main stylesheet entry point
+├── js/                # 3 JavaScript modules
+├── images/            # 5 subdirectories (team, publications, gallery, etc.)
+└── assets/            # Additional resources (PDFs, documents)
+```
+
+**Code Quality:**
+- Comprehensive inline documentation (all files)
+- Standardized comment headers
+- Zero unused/redundant code (Dec 2025 audit)
+- Clean, maintainable codebase
+
+---
+
 ## Support & Maintenance
 
 ### Troubleshooting
@@ -271,22 +332,34 @@ bundle install
 ## Technology Stack
 
 - **Static Site Generator:** Jekyll 4.4.1
-- **Hosting:** GitHub Pages
+- **Hosting:** GitHub Pages (automatic deployment)
 - **Frontend Framework:** Bootstrap 5 (Lumen theme via jsDelivr CDN)
-- **Template Engine:** Liquid
-- **Styling:** SCSS/SASS
-- **Theme:** Light/Dark mode with auto-detection
+- **Template Engine:** Liquid (Jekyll's templating system)
+- **Styling:** SCSS/SASS with 5 modular partials
+- **JavaScript:** 3 vanilla JS modules (theme switcher, gallery masonry, external links)
+- **Theme:** Light/Dark/Auto mode with CSS custom properties
+- **Ruby Plugin:** 1 custom Liquid filter (BibTeX keyword hiding)
+
+**Build Stats:**
+- 8 layouts, 10 includes, 10 pages
+- 8 YAML data files
+- 5+ image directories with auto-loading
+- Clean codebase (0 unused files as of Dec 2025)
 
 ---
 
 ## Contributing
 
 For lab members and collaborators, see `DEVELOPMENT.md` for detailed development documentation including:
-- Detailed file structure and design decisions
+- Git workflow and branching strategy
+- Detailed file structure and architecture
 - Comment standardization guidelines
-- Development history and changelog
-- Cleanup reports and maintenance tasks
-- URL management and configuration details
+- Development history and changelog  
+- Code cleanup reports
+- Maintenance tasks and verification commands
+- URL management and configuration
+
+Quick member instructions: `.github/Instructions_members.md`
 
 ---
 
@@ -315,4 +388,4 @@ Concordia University, Montreal, QC, Canada
 
 ---
 
-**Last Updated:** December 1, 2025
+**Last Updated:** December 2, 2025
diff --git a/_config.yml b/_config.yml
@@ -27,7 +27,7 @@ description: > # this means to ignore newlines until "baseurl:"
   Website of the Atlas Analytics Lab.
 baseurl: ""
 url: "https://atlasanalyticslab.github.io"
-layout_wide: false # Set to false to restore the previous fixed-width layout with generous side margins.
+layout_wide: true # Set to false to restore the previous fixed-width layout with generous side margins.
 
 include:
   - .htaccess

diff --git a/_data/alumni_members.yml b/_data/alumni_members.yml
@@ -37,28 +37,28 @@
 #==============================================================================
 
 - name: Ali Nasiri-Sarvi
-  info_current: Research Assistant @ Atlas Analytics Lab, Research Associate @ Huawei
+  info_current: MSc Graduate, Research Assistant @ Atlas Analytics Lab, Research Associate @ Huawei
   google_scholar: "https://scholar.google.com/citations?user=FzicxBkAAAAJ"
   linkedin: "https://ca.linkedin.com/in/ali-nasiri-sarvi"
 
 - name: Haoyu He
-  info_current: Graduated MSc, transferred to PhD @ Atlas Analytics Lab
+  info_current: MSc Graduate, transferred to PhD @ Atlas Analytics Lab
 
 - name: Damien Martins Gomes
-  info_current: AI Scientist @ Thales
+  info_current: MSc Graduate, AI Scientist @ Thales
   google_scholar: "https://scholar.google.ca/citations?user=ivIgsbMAAAAJ"
   linkedin: "https://fr.linkedin.com/in/damien-martins-gomes/fr"
 
 - name: Vasudev Sharma
-  info_current: ML Developer @ Botni.Vision
+  info_current: MSc Graduate, ML Developer @ Botni.Vision
   linkedin: "https://ca.linkedin.com/in/vasudev-sharma-341171256"
 
 - name: Cassandre Notton
-  info_current: ML Engineer @ Quandela
+  info_current: MSc Graduate, ML Engineer @ Quandela
   google_scholar: "https://scholar.google.com/citations?hl=en&user=H5zKrXcAAAAJ"
   linkedin: "https://ca.linkedin.com/in/cassandre-notton-69ba6a131"
 
 - name: Denisha Thakkar
-  info_current: ML Egnineer @ CIBC
+  info_current: MSc Graduate, ML Egnineer @ CIBC
   linkedin: "https://ca.linkedin.com/in/denisha-thakkar"
 
diff --git a/_includes/footer.html b/_includes/footer.html
@@ -25,10 +25,7 @@
     <div class="row g-4">
       <!-- Column: lab summary and modification notice (left-most). -->
       <div class="col-md-4">
-        <p class="mb-2">&copy; {{ site.time | date: '%Y' }} Atlas Analytics Lab. Site made with
-          <a href="https://jekyllrb.com">Jekyll</a>;
-          <a href="{{ site.url }}{{ site.baseurl }}/aboutwebsite.html">copy and modify it for your own research group.</a>
-        </p>
+        <p class="mb-2">&copy; {{ site.time | date: '%Y' }} Atlas Analytics Lab.</p>
         <p class="mb-0">We are part of the
           <a href="https://www.concordia.ca/ginacody/computer-science-software-eng.html">Department of Computer Science and Software Engineering (CSSE)</a> at
           <a href="https://www.concordia.ca/">Concordia University</a>.