1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-12-27 18:40:28 +00:00

Add tc-table-wrapper class to fix overflow (#8652)

* Add tc-table-wrapper class to fix overflow

* Apply class in tag manager body
This commit is contained in:
Leilei332 2024-10-02 20:06:40 +08:00 committed by GitHub
parent d981e45e15
commit c82761a600
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 77 additions and 58 deletions

View File

@ -62,6 +62,7 @@ color: #bbb
\end
\whitespace trim
<div class="tc-table-wrapper">
<table class="tc-tag-manager-table">
<tbody>
<tr>
@ -116,3 +117,4 @@ color: #bbb
</tr>
</tbody>
</table>
</div>

View File

@ -11,6 +11,7 @@ title: $:/editions/tw5.com/systemtag-template
The following tiddlers are tagged with <<tag $(thisTag)$ >>
<div class="tc-table-wrapper">
<table>
<tr><th></th><th>caption</th></tr>
<$list filter='[all[tiddlers+shadows]tag<thisTag>sort[]]'>
@ -18,4 +19,9 @@ The following tiddlers are tagged with <<tag $(thisTag)$ >>
<td><$link/></td>
<td><$transclude field="caption"><$transclude field="description"><$view field="title"/></$transclude></$transclude></td>
</tr>
</$list></table></$list></$let></$list>
</$list>
</table>
</div>
</$list>
</$let>
</$list>

View File

@ -18,3 +18,4 @@ type: text/vnd.tiddlywiki
|`tc-table-no-border` |Removes the borders of a table |
|`tc-first-col-min-width` |The first column of a table will take up minimal possible width. It adapts to the content |
|`tc-table-wrapper` |<<.from-version "5.3.6">> A class to be applied to a `div` element outside the table to prevent table from overflowing |

View File

@ -51,48 +51,50 @@ Select a tour:
currentTour={{{ [<stateCurrentTour>get[text]] :else[<defaultTour>] }}}
currentTourTag={{{ [<currentTour>get[tour-tag]] }}}
>
<table class="tc-tour-settings-tour-details">
<tbody>
<tr>
<th>
Tour title
</th>
<td>
<$link to=<<currentTour>>><$text text=<<currentTour>>/></$link>
</td>
</tr>
<tr>
<th>
Tour description
</th>
<td>
<div class="tc-tour-settings-tour-details-description">
<$transclude $tiddler=<<currentTour>>>
(No description available)
</$transclude>
</div>
</td>
</tr>
<tr>
<th>
Tour logo
</th>
<td>
<div class="tc-tour-settings-tour-details-logo">
<$image source={{{ [<currentTour>get[logo]] }}}/>
</div>
</td>
</tr>
<tr>
<th>
Tour step tag
</th>
<td>
<$transclude $variable="tag" tag=<<currentTourTag>>/>
</td>
</tr>
</tbody>
</table>
<div class="tc-table-wrapper">
<table class="tc-tour-settings-tour-details">
<tbody>
<tr>
<th>
Tour title
</th>
<td>
<$link to=<<currentTour>>><$text text=<<currentTour>>/></$link>
</td>
</tr>
<tr>
<th>
Tour description
</th>
<td>
<div class="tc-tour-settings-tour-details-description">
<$transclude $tiddler=<<currentTour>>>
(No description available)
</$transclude>
</div>
</td>
</tr>
<tr>
<th>
Tour logo
</th>
<td>
<div class="tc-tour-settings-tour-details-logo">
<$image source={{{ [<currentTour>get[logo]] }}}/>
</div>
</td>
</tr>
<tr>
<th>
Tour step tag
</th>
<td>
<$transclude $variable="tag" tag=<<currentTourTag>>/>
</td>
</tr>
</tbody>
</table>
</div>
<$list filter="[<currentTour>has[settings]]" variable="ignore">
<p>
Custom tour settings:
@ -129,21 +131,23 @@ Select a tour:
</$button>
</div>
<$reveal state=<<collapseState>> text="show" type="match" default="hide" animate="yes">
<table class="tc-tour-settings-tour-step-details">
<tbody>
<<display-tour-step-field-text "title" "Title">>
<<display-tour-step-field-text "caption" "Caption">>
<<display-tour-step-field-text "step-success-filter" "step-success-filter">>
<<display-tour-step-field-text "step-success-filter-var" "step-success-filter Variable">>
<<display-tour-step-field-text "display-mode" "Display Mode">>
<<display-tour-step-field-text "enter-actions" "Enter Actions">>
<<display-tour-step-field-text "hint-text" "Hint text">>
<<display-tour-step-field-text "hint-selector" "Hint selector">>
<<display-tour-step-field-text "hint-selector-fallback-1" "Hint selector Fallback 1">>
<<display-tour-step-field-text "hint-selector-fallback-2" "Hint selector Fallback 2">>
<<display-tour-step-field-text "condition" "Condition">>
</tbody>
</table>
<div class="tc-table-wrapper">
<table class="tc-tour-settings-tour-step-details">
<tbody>
<<display-tour-step-field-text "title" "Title">>
<<display-tour-step-field-text "caption" "Caption">>
<<display-tour-step-field-text "step-success-filter" "step-success-filter">>
<<display-tour-step-field-text "step-success-filter-var" "step-success-filter Variable">>
<<display-tour-step-field-text "display-mode" "Display Mode">>
<<display-tour-step-field-text "enter-actions" "Enter Actions">>
<<display-tour-step-field-text "hint-text" "Hint text">>
<<display-tour-step-field-text "hint-selector" "Hint selector">>
<<display-tour-step-field-text "hint-selector-fallback-1" "Hint selector Fallback 1">>
<<display-tour-step-field-text "hint-selector-fallback-2" "Hint selector Fallback 2">>
<<display-tour-step-field-text "condition" "Condition">>
</tbody>
</table>
</div>
<div class="tc-tour-settings-tour-step-body">
<$transclude $tiddler=<<currentStep>> $mode="block"/>
</div>

View File

@ -2807,6 +2807,12 @@ a.tc-tiddlylink.tc-plugin-info:hover > .tc-plugin-info-chunk .tc-plugin-info-sta
width: 100%;
}
/* A wrapper to fix table overflow */
.tc-table-wrapper {
overflow-x: auto;
}
/*
** Chooser
*/