# Sub Theme: Illusion - Need to put "cssclass: illusion" in the YAML. # Quotes > [!quote|author] Quote Author Here > Blockquote text here > [!quote|mark] Author > Quote with Mark > [!quote] Quote Author Here <br>New Line stuff here > Blockquote text here # Callout Adjustments ## Types | Type | Description | |:---:|:---:| | Infoboxes | Wikipedia-like infoboxes | | Captions | Displays text around an image in the style of a caption | | Kanban | Displays a (functionally limited) kanban board | | Grid | Display images in a grid/masonry style | | Recite | A D&D styled pop out | | Metadata | Styled callout that colors bold words, table headers, and inline dataview keys blue | | Cards | Style images and dataview tables like notion's gallery view | | Columns | Style inner callouts as columns | | Timeline | Style callout as a vertical Timeline | | Asides | Add asides to the side of notes | | Kith | Callouts for person/person relationship types | | Table | Prevent table from wrapping | ---- ### Infoboxes | Attribute | Description | |:-----------:|:-------:| | Wikipedia | Style inner tables like Wikipedia | | right | Move the image to the right. | | center | Move the image to the center. | --- #### Examples > [!infobox|flex center] > # Name >  > ###### Stats > > | Type | Stat | > |:-: |:-: | > | Test | Testing | > | Test | Testing | > > ##### Stats 2 > > | Type | Stat | > |:-: |:-: | > | Test | Testing | > | Test | Testing | > [!column|no-t] > >> [!infobox|flex center] >> # Name >>  >> ###### Stats >> > | Type | Stat | > |:-: |:-: | > | Test | Testing | > | Test | Testing | > > #### Stats 2 <br> Mark Elliot Zuckerberg (born May 14, 1984), also known colloquially as Zuck, is an American business magnate, computer programmer, internet entrepreneur and philanthropist. > |dgfkdfjhkdh --- > [!infobox|right] Collapsible Infobox > # Name >  > ###### Stats > > | Type | Stat | > |:-: |:-: | > | Test | Testing | > | Test | Testing | > > ###### Stats 2 > > | Type | Stat | > |:-: |:-: | > | Test | Testing | > | Test | Testing | > [!infobox|left] > # Name >  > ###### Stats > > | Type | Stat | > | ---- | ---- | > | Test | Testing | > | Test | Testing | > > ###### Stats 2 > > | Type | Stat | > | ---- | ---- | > | Test | Testing | > | Test | Testing | <br> ### Callout Image Grids | [!grid] | Best type for internally linked images | |:-:|:-:| | [!grid\|masonry] | Best type for externally linked images | #### Examples > [!grid] > ![[Pasted image 20230519054608.png]] > > ![[Pasted image 20230629234855.png]] > ![[Pasted image 20230604015731.png]] --- > [!grid|masonry] >  >  > >  >  --- ### Cards Callout | Adjustment | Description | |:-:|:-:| | 2, 4, 5 | Change number of columns; 3 is default | | dataview | Style dataview table and lists as cards | | dvl | Style dataview list | --- > [!cards] > **[[Link]]** >  >> **[[Link]]** >> Text > ![[Pasted image 20230603202841.png|wm-tl ctr]] --- > [!cards|4] > **[[Link]]** >  > > **[[Link]]** > ![[Image Link.png|sban hsmall ctr]] > > **[[Link]]** >  > > **[[Link]]** > ![[Image Link.png|sban hsmall ctr]] --- ### Callout Columns | Adjustment | Description | |:-:|:-:| | flex | Wrap column on smaller width screens | | 3, 4 | Add more columns; Default is 2 | | dataview | Styles dataview LIST & TABLE into columns <br> (column numbers work with this as well)| | list | Make bullet lists into columns | - Separated by a blank `>` - Must be the same level as the root callout to properly separate #### Examples > [!column|no-t] > > > [!info|text-center title-center no-icon] Column 1 > > Use another callout for columns > > > [!note|text-center title-center no-icon] Column 2 > > Need that singular blockquote `> ` as separation between columns > [!column|no-t flex bg-c-green]+ > >> [!info|no-icon bg-c-blue c-gray] **Wikipedia Profile** >> **Overview** >> >> Mark Elliot Zuckerberg (born May 14, 1984), also known colloquially as Zuck, is an American business magnate, computer programmer, internet entrepreneur and philanthropist. He is known for co-founding the social media website Facebook and its parent company Meta Platforms (formerly Facebook, Inc.), of which he is the executive chairman, chief executive officer, and controlling shareholder. Zuckerberg attended Harvard University, where he launched Facebook in February 2004 with his roommates Eduardo Saverin, Andrew McCollum, Dustin Moskovitz, and Chris Hughes. Originally launched to select college campuses, the site expanded rapidly and eventually beyond colleges, reaching one billion users in 2012. Zuckerberg took the company public in May 2012 with majority shares. In 2007, at age 23, he became the world's youngest self-made billionaire. He has used his funds to organize multiple philanthropic endeavors, including the establishment of the Chan Zuckerberg Initiative. > >> [!grid|masonry] >>  >>  <br> >> >  >  >  >  --- **Clean/hidden Subcallout Styling** > [!column] > >> [!info|clean no-title] Column 1 >> - Use another callout for columns > >> [!note|clean no-title] Column 2 >> - Need that singular blockquote `> ` as separation between columns > >> [!note|clean no-title] Column 3 >> - Need that singular blockquote `> ` as separation between columns --- **Flex Sizing** > [!column|no-t center flex] > >> [!expand for Definition & Context|bg-c-green c-gray no-icon] >> **Column 1, no title** >> More text about the item kjfas;dlfja lsd;jf a;dslkjfds;lf adsf asdf dsfsg dfgfgsdfgsfdgfdgsgdfgdgsdg >>> [!grid|masonry] >  >  >  >  --- **Columns for Bullet Lists** > [!column|list] Columns for regular lists only > - List Item > - Sub list item > - List Item > - List Item > - Sub list item > - Sub list item > - List Item > - List Item > - List Item > - List Item > - Sub list item > - Sub list item > - Sub list item > - List Item > - List Item > - List Item --- ### Kanban > [!kanban|no-t mid flex]+ > - [[Link|Lane 1 Title]] > - ![[Image.png]] > - Text relating to this test test does this span or does it not? <br> --- ### Callout Timeline > > [!timeline|t-l t-1] **Title** *Subtitle* > Left aligned timeline piece > > > [!timeline|t-r t-1.5] **Title** *Subtitle* > Right aligned timeline piece > > > [!timeline|t-l t-2] **Title** *Subtitle* > Spaced timeline piece # Adjustments Callout Title Adjustments |Abbr.|Full Title|Description| |:-:|:-:|:-:| |`no-t`|`no-title`|Hides callout title| |`s-t`|`show-title`|Show callout title| |`ttl-c`|`title-center`|Center callout title text| |`no-i`|`no-icon`|Hide callout icon| |`subt`|`subtitle`|Style words in italic (`* *`, `_ _`) as subtitles| Table Adjustments |Abbr.|Full Title|Description| |:-:|:-:|:-:| |`n-th`|`no-table-header`|Hides table header in callouts| |`t-w`|`table-wide`|Widen table to edges of callout| |`tbl-cln`|`table-clean`|Remove most table styling: lines, background colors| ||`table-cell-top`|Move text alignment to top of table cell| Text |Abbr.|Full Title|Description| |:-:|:-:|:-:| |`txt-c`|`text-center`|Center callout text| |`txt-r`|`txt-right`|Right align callout text| |`txt-l`|`txt-left`|Left align callout text| |`txt-s`|`text-small`|Shrink callout text size| Styling |Abbr.|Full Title|Description| |:-:|:-:|:-:| ||`embed`|Remove callout padding to expand embed| |`nmg`|`no-margin`|Remove callout margins| ||`clean`|Remove callout Styling| ||`collapse`|Remove all padding and margins for ultra compact look| |`nbrd`|`no-border`|Borderless callout| ||`clear`|Move any other floating elements near to under this callout| ||`dim`|Dim collapsible (`+`/`-`) callouts unless hovered and opened| |`dim-hvr`||Dim callout unless hovered| Alternate Styling |Abbr.|Full Title|Description| |:-:|:-:|:-:| |`alt-co`||Alternate Callout styling for individual callouts| |`alt-line`||Minimalistic callout style with only title underlined| |`co-o`|`callout-original`|Revert to pre-Obsidian v0.16 callout styling| |`co-block`|`callout-block`|Alternate callout mixing pre & post v0.16 styling| |`co-si`|`callout-side-icon`|Move icon to side of callouts <br>(callout titles won't show)| ## Sizing Sizing sames are the as the [Image Adjustment Sizing](https://publish.obsidian.md/slrvb-docs/ITS+Theme/Image+Adjustments#Sizing) names |Attributes|Callout Width `%`|Callout Width `px`| |:-:|:-:|:-:| |`wmicro`|10%|50px| |`wtiny`|20%|100px| |`wsmall`|30%|200px| |`ws-med`|40%|300px| |`wm-sm`|50%|400px| |`wmed`|60%|500px| |`wm-tl`|80%|600px| |`wtall`|95%|700px| |`wfull`|100%|| |`wfit`|Auto|Auto| Add `|static` to use fixed sizing with pixels Callout sizing uses percentages by default, `|static` switches to pixels to use static sizing. ### Callout Content Padding |Attribute|Abbr|Callout Padding Sizing| |---|---|:-:| |`content-padding-small`|`c-p-sm`|6px| |`content-padding-medium`|`c-p-med`|12px| |`content-padding-large`|`c-p-lg`|24px| ## Positions Will not wrap text around in live preview or float on mobile |Attribute|Description| |---|---| |`left`|Float callout to the left| |`right`|Float callout to the right| ## Colors # Callout Colors |Abbr.|Full Title|Description| |---|---|---| |`c-`|`color-`|Change callout title/border color| |`bg-`|`background-`|Change callout background color| |`bg-c-`|`background-color-`|Change callout title and background color| - **Colors:** - purple - blue - green - red - pink - orange - yellow - gray --- ## Examples ```markdown > [!recite|color-blue] > [!recite|background-blue] > [!recite|background-color-blue] ``` ```markdown > [!recite|c-purple] > [!recite|bg-purple] > [!recite|bg-c-purple] ``` > [!recite|warning|color-red] --- **Text Color:**  **Background Color:**  **Text & Background Colors:**  ----  ------ # Keep Digging %%Space%% ## Tags ### Footnotes & References