Gallery View Dashboard

by Kawê Cezar
5
4
3
2
1
Score: 36/100

Description

A powerful, visual gallery plugin for Obsidian that transforms your vault folders into a beautiful, navigable dashboard. Organize your resources, courses, and media with custom banners and intuitive folder structures.

Reviews

No reviews yet.

Stats

0
stars
1,610
downloads
1
forks
70
days
31
days
31
days
1
total PRs
1
open PRs
0
closed PRs
0
merged PRs
0
total issues
0
open issues
0
closed issues
46
commits

Latest Version

a month ago

Changelog

✨ New Features

  • Typed property picker in the "Create Note" modal. Instead of freeform key/value text inputs, each property row now has a type dropdown — Text, Checkbox, Tags, Number, or Date — and the value field swaps to match: a real checkbox toggle, a native date picker, a number input, etc. Values are converted to their final YAML-ready form (true/false for checkboxes, [tag1, tag2] arrays for tags) before the note is created.
  • "Hide Properties in Read Mode" setting. New toggle in plugin settings that hides the frontmatter/properties block at the top of a note whenever it's displayed in Read Mode. Switching back to Edit Mode shows it again automatically — no extra clicks needed. Applies to pop-out gallery windows as well as the main window.

🎨 UI & Animation Overhaul

  • Full pass on card, checkbox, toolbar, and tree-view animations: consistent easing curves across the whole UI (a "settle" curve for entrances, a "snap" curve for interactive feedback, a "glide" curve for hovers) instead of ad hoc timing values, for a more deliberate, fluid feel.
  • Softened card hover lift and shimmer timing so interactions read as smooth rather than bouncy.
  • Merged a duplicate .gallery-view-checkbox-wrapper / .gallery-view-custom-checkbox CSS block that had silently been overriding the first — checkbox sizing and color are now consistent everywhere.
  • Removed all !important usage from the stylesheet (previously needed to beat a JS-injected style tag on mobile) in favor of proper CSS specificity, so the plugin passes automated reviewer checks cleanly.

🖼️ Banner Rendering Fixes

  • Portrait covers no longer get cropped. Movie posters, book covers, and other tall/narrow banners are now detected on load and switched to a full-height contain fit instead of being force-cropped into a landscape-shaped frame. YouTube thumbnails are unaffected and keep their original 16:9 cropped-to-fill look.
  • Mobile banner sizing is now independent of the desktop size slider. On small screens, banners size themselves from each cover's own natural aspect ratio at full card width, instead of inheriting a fixed pixel height range meant for desktop card sizes.
  • Mobile grid now reliably stacks to full-width cards. Fixed a CSS specificity conflict where a JS-injected style tag was silently overriding the mobile grid layout, causing cards to stay in a cropped, slider-driven two-column layout on narrow screens.

🐛 Bug Fixes

  • Checkbox state bug: Boolean(frontmatter.checkbox) treated the string "false" as truthy, so a checkbox property saved as text (e.g. via Obsidian's native Properties panel) could show as checked even when its label correctly said "Pending." Replaced with a single shared isCheckboxChecked() helper used everywhere a checkbox value is read (rendering, sorting, folder progress bars), so this can't drift out of sync again.
  • Checkbox checkmark missing / not drawing in: restored the animated SVG checkmark (stroke-dasharray draw-in) and click ripple effect, along with the whole-card dim/desaturate treatment for completed items, which had regressed to a bare class toggle with no visual marker.

🛠️ Developer / Build

  • Local test-vault output path (OUT_DIR) is now loaded from a .env file via dotenv instead of being hardcoded in esbuild.config.mjs. Added .env.example for contributors and a clear startup error if OUT_DIR isn't set, so the real filesystem path never needs to be committed to the repo.

Upgrade notes

No settings migration needed — all new settings (hidePropertiesInReadMode) default to their previous/off behavior. If you maintain a fork or custom CSS overrides, note that the checkbox CSS block was consolidated into a single canonical definition; remove any duplicate overrides you may have layered on top.

README file from

Github

A powerful, visual gallery plugin for Obsidian that transforms your vault folders into a beautiful, navigable dashboard. Organize your resources, courses, and media with custom banners and intuitive folder structures.

Preview

Gallery Plugin Demo

🚀 Features

  • Dynamic Dashboard View: Browse your vault as a visual library with custom banners.
  • Hierarchical Navigation: Seamlessly move between subfolders and files with an integrated navigation system.
  • Customizable Banners: Set unique banner images for folders and individual notes.
  • Metadata Integration: Display file metadata (like status or tags) directly on library cards.
  • Quick Action Checkboxes: Manage task statuses directly from the library view.
  • Live Settings Sync: Instant updates to your library structure without needing to reload.
  • Smart Folder Suggestion: Auto-complete path selection for easy configuration.

⚙️ Setup

  1. Open Settings > Gallery Dashboard.
  2. Set your Library Root Target Path (e.g., conteudo/cursos).
  3. Configure your Visible Metadata Keys to see your frontmatter properties.
  4. Use the Live Library Vault Tree section to assign custom banners to specific folders.
  5. Add Manual Customizations for specific overrides.

🖼️ How to use

  • Browsing: Click any folder card to enter it, or click a file card to open the note.
  • Navigation: Use the "Back" button in the gallery toolbar to return to the parent folder.
  • Customization: Edit banners via the plugin settings to match your vault's theme.

🛠️ Development

This plugin was built using the Obsidian Plugin API.

Build

npm install
npm run build