tnichols217 / obsidian-columns

GNU General Public License v3.0
200 stars 9 forks source link

Vertical text alignment within the column[FR] #71

Open AucklandIO opened 2 months ago

AucklandIO commented 2 months ago

Feature Request

In addition to the horizontal text alignment within a column, I would like vertical text positioning within a column as well.

Details / Ideas / Implementation

I would like to centre the text between both horizontal and vertical constraints within a column. Specifically, I would like to specify auto centring both vertically and horizontally, set specific pixel/em spacing designations, and top/bottom alignment (in the same way as we can start/centre/end align along the horizontal axis).

Specific use example: When creating UI elements from the Columns plugin, I would like to centre the text in the following image:

image

Here is the current code I am using to create this element (/* delineated comments are obviously removed from my vault code as col codeblocks don't recognize them as comment elements):

``````col
>[!blank-container]
/* Empty container to change the styling from the enclosed callout, to one where the title is overlaid
>`````col-md
>>[!example] Navigation
/* Navigation Callout styling with title overlay
>>````col
/* col element for grouping the [!blank-container] elements within the 
>>```col-md
/* individual first col-md element 
>>textAlign=center
>>flexGrow=0.75
>>===
>>>[!blank-container|txt-l]
/* [!blank-container] element to show link
>>[[General/Journal/Daily/<%tp.date.now("[Daily Journal] YYYY-MM-DD",-1,tp.file.title,"YYYY-MM-DD")%>| ⬅️ Yesterday]]
>>```
>>```col-md
/* individual second col-md element
>>textAlign=center
>>flexGrow=2
>>===
>>>[!blank-container|txt-c]
/* [!blank-container] element to show link
>>[[General/Journal/Weekly/<%moment(tp.file.title).format("[Weekly Review] GGGG-[W]W")%>| - Weekly Review - ]]
>>```
>>```col-md
/* individual third col-md element
>>textAlign=end
>>flexGrow=0.75
>>===
>>>[!blank-container|txt-r]
/* [!blank-container] element to show link
>>[[General/Journal/Daily/<%tp.date.now("[Daily Journal] YYYY-MM-DD",tp.file.title,"YYYY-MM-DD")%>|Tomorrow ➡️]]
>>```
>>````
>````` 

The text should be lower (centred to the [!blank-container] column element they reside within. I don't know how to do this otherwise.

Additional Reference: Callout Styling Without Overlay: image

Callout Styling With Overlay: image