1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-11-29 12:59:56 +00:00

Make flexbox or grid layouts possible (#7690)

Both flexbox and grid layouts need the container div to be the direct
parent of the children it lays out. To enable that, we need a class that
can select the direct parent of the list widget in PageTemplate.tid so
that that class can have `display: flex` or `display: grid` applied to
it. The `tc-page-container` div is not suitable, because it contains
a `<$dropzone>` inside it, and the dropzone widget creates a div so
tc-page-container is no longer the direct parent of the list. Instead,
a tc-page-container-inner class is added to the dropzone widget in
addition to its existing tc-dropzone class, so that grid or flexbox
layouts can target tc-page-container-inner for setting the appropriate
CSS `display` property.
This commit is contained in:
Robin Munn 2023-09-30 22:33:40 +07:00 committed by GitHub
parent bbaa0890b5
commit bb2973fc29
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -20,7 +20,7 @@ code-body: yes
<$navigator story="$:/StoryList" history="$:/HistoryList" openLinkFromInsideRiver={{$:/config/Navigation/openLinkFromInsideRiver}} openLinkFromOutsideRiver={{$:/config/Navigation/openLinkFromOutsideRiver}} relinkOnRename={{$:/config/RelinkOnRename}}> <$navigator story="$:/StoryList" history="$:/HistoryList" openLinkFromInsideRiver={{$:/config/Navigation/openLinkFromInsideRiver}} openLinkFromOutsideRiver={{$:/config/Navigation/openLinkFromOutsideRiver}} relinkOnRename={{$:/config/RelinkOnRename}}>
<$dropzone enable=<<tv-enable-drag-and-drop>>> <$dropzone enable=<<tv-enable-drag-and-drop>> class="tc-dropzone tc-page-container-inner">
<$list filter="[all[shadows+tiddlers]tag[$:/tags/PageTemplate]!has[draft.of]]" variable="listItem"> <$list filter="[all[shadows+tiddlers]tag[$:/tags/PageTemplate]!has[draft.of]]" variable="listItem">