Card View Mode

by yo-goto
5
4
3
2
1
Score: 38/100

Description

The Obsidian Card View Mode plugin turns open notes into cards so their visual shape and size can reflect how developed each note is. Instead of treating every pane the same, it lets note content stretch or compress the card, which makes rough notes and more mature notes easier to distinguish at a glance. It also adds an Attention Pane mode that highlights the active card and grays out the rest, so focus stays on the current note when many panes are open. Visual settings cover card colors, background color, corner radius, shadows and other design details, and the whole mode can be toggled with a command. The plugin is designed to work alongside Sliding Panes and also accounts for Embedded Note Title and Banners compatibility.

Reviews

No reviews yet.

Stats

stars
19,969
downloads
0
forks
34
days
NaN
days
NaN
days
0
total PRs
0
open PRs
0
closed PRs
0
merged PRs
0
total issues
0
open issues
0
closed issues
0
commits

Latest Version

Invalid date

Changelog

README file from

Github

Obsidian Card View Mode

GitHub release (latest SemVer) GitHub All Releases

main screen shot

Feature.1 Card View

This plugin is inspired by Scrapbox (a web-based wiki tool) & Zettelkasten method (Slip box) by Niklas Luhmann.

I found all of the notes are not in the same stage while developing. We need some ways to distinguish the stages. The card view feature is one way to weigh notes and express them. You can assess whether your notes are atomic, then, if you feel your note is longer and not atomic, you can divide or extract the contents.

The vertical size of each note (a.k.a card) can be extended or reduced based on the amount of content on them. At a glance, you can easily find how mature your note is at the early stage of note-taking, note-making, or eventually note-developing.

I highly recommend you to use this plugin with the Sliding Pane plugin. I made this to be compatible with that and the Embedded Note Titles plugin.

Feature.2 Attention Pane

Another feature is “Attention Pane”. An active pane card is highlighted and the others are grayed out. This enables you to find an active pane easily and focus on the note. You can pay attention to the specific pane among many notes!!

Active and non-active cards are rendered with different RGB color values. You can set the value difference in the setting tab. Set the value 0 if you want to disable this feature.

Demo

Screenshot

Settings

Card colors, background color, card shapes are configurable in the settings tab.

setting 1

setting 2

  • You can globally turn on/off this plugin with a command at any time.
  • You can customize the card design(colors, corner radius, drop shadow).

Compatibility

Development

Roadmap

How to install manually

  • Clone this repo
  • npm i or yarn to install dependencies
  • npm run dev to compile
  • Copy manifiest.json, main.js and styles.css to a subfolder of your plugins folder
  • Reload obsidian to see changes

Special Thanks

Special thanks to these amazing plugins! I used these plugins as a reference for developing my first public plugin. The plugin basic structure is mainly based on the Sliding Pane. I referred to other plugins to build the color configuration system.

Original CSS

I've developed this plugin from a custom CSS snippet but I changed it into an SCSS file. If you get interested in the CSS style, you can see the original snippet linked below.

Gist Link

Similar Plugins

info
• Similar plugins are suggested based on the common tags between the plugins.
Card View Switcher
4 years ago by qawatake
An Obsidian plugin to provide a quick switcher with card view
Auto Card Link
4 years ago by Nekoshita Yuki
Auto Hide
4 years ago by skelato1
This Obsidian plugin enables you to collapse (and expand) the sidebar easier.
Nifty Links
3 years ago by x-Ai
Generating elegant, Notion-styled rich link cards to enhance your note-taking experience.
Metadata Hider
3 years ago by Benature
Hide metadata property if its value is empty
Hugo codeblock highlight
2 years ago by aarol
Highlights lines in code blocks using Hugo's hl_lines syntax
Vault Name
2 years ago by @gapmiss
An Obsidian.md plugin for customizing and displaying the vault name (title) in the side navigation file explorer, similar to pre 1.6.0 versions of Obsidian.
Explorer Hider
2 years ago by Mara-Li
Hide folder & files from the explorer using a plugin and a bit of CSS :>
Quick Cards
2 years ago by Camus Qiu
Pane Relief
5 years ago by PJ Eby
Obsidian plugin for per-pane history, pane movement/navigation hotkeys, and more
Style Settings
5 years ago by mgmeyers
A dynamic user interface for adjusting theme, plugin, and snippet CSS variables within Obsidian
Icon Swapper
5 years ago by mgmeyers
Allows swapping out Obsidian's icons
Electron Window Tweaker
5 years ago by mgmeyers
Hide Sidebars on Window Resize
5 years ago by NomarCub, Michael Hanson
A simple Obsidian plugin to hide the sidebars when the window gets narrow.
Beautiful Contact Cards
2 years ago by Seth Tenembaum
A plugin for the Obsidian text editor which renders "contact" code blocks with tappable links for phone, social media, etc.
Color Folders and Files
2 years ago by Mithadon
Obsidian plugin to customize the appearance of folders and files through a context menu with color picker and style options.
Image Preview on Icon Hover
2 years ago by rama1997
Plugin for Obsidian that add image popups when hovering over various icons in the user interface
Content Cards
a year ago by leo
Insert content cards in Markdown, such as timeline, highlightblock, target card, book information card, music information card, movie information card, photoes ablum, business card, content subfield, countdown, SWOT,BCG.
Quick Peek Sidebar
a year ago by Bradley Wyatt
Open and close the Obsidian sidebars on hover.
Notes Explorer
a year ago by Atmanand Gauns
Plugin for Obsidian.md. Explore your notes as cards in gallery or masonry view. A new way to revise your content.
Banyan
a year ago by ratiger
A card-based homepage for Obsidian —— browse, organize, and navigate notes effortlessly with multi-tag filtering.
UnLime
a year ago by shandyba
Obsidian Unmentioned Links toggle
Ignore Filters Boost
10 months ago by lavton
Card Viewer
9 months ago by vsme
一个用于在 Obsidian 中解析和查看电影、电视剧、书籍、音乐和 HTML 内容卡片的插件。
Scroller
9 months ago by René Coignard
Adds typewriter mode, unfocused text dimming and commands to quickly scroll to the top or bottom of note.
Disable Tabs
7 months ago by David V. Kimball
Disables having more than one tab open at a time Obsidian.
Card Forge
5 months ago by Carl Sverre
Convert notes into printable cards.
Side-Notes
11 days ago by Fried Fishsticks
Adds ability to create sidenotes in Obsidian with incrementing numbers. - This plugin has not been manually reviewed by Obsidian staff.
Pinned Tabs
3 days ago by NameIsKyro
Chrome-style compact pinned tabs with custom icons, smooth movement, and accidental-close protection. - This plugin has not been manually reviewed by Obsidian staff.