mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-11-23 10:07:19 +00:00
Improve plugin tab layout
It’s still a bit of a mess, and the vertical alignment isn’t working properly
This commit is contained in:
parent
d01efe8698
commit
bd92dc3692
@ -14,23 +14,10 @@ $(currentTiddler)$/icon
|
||||
\end
|
||||
\define plugin-table(type)
|
||||
<$set name="qualified-state" value=<<qualify "$:/state/plugin-info">>>
|
||||
<table>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>
|
||||
|
||||
</th>
|
||||
<th>
|
||||
<<lingo Fields/Description>>
|
||||
</th>
|
||||
<th>
|
||||
<<lingo Fields/Version>>
|
||||
</th>
|
||||
</tr>
|
||||
<$list filter="[!has[draft.of]plugin-type[$type$]sort[description]]">
|
||||
<$set name="popup-state" value=<<popup-state-macro>>>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="tw-plugin-info">
|
||||
<div class="tw-plugin-info-dropdown-button">
|
||||
<$reveal type="nomatch" state=<<popup-state>> text="yes">
|
||||
<$button class="btn-invisible btn-dropdown" set=<<popup-state>> setTo="yes">
|
||||
{{$:/core/images/right-arrow}}
|
||||
@ -41,34 +28,42 @@ $(currentTiddler)$/icon
|
||||
{{$:/core/images/down-arrow}}
|
||||
</$button>
|
||||
</$reveal>
|
||||
</td>
|
||||
<td>
|
||||
<$link to={{!!title}}>
|
||||
<$transclude tiddler=<<currentTiddler>> subtiddler=<<plugin-icon-title>>/>
|
||||
''<$view field="description"><$view field="title"/></$view>''<br>
|
||||
<$view field="title"/>
|
||||
</$link>
|
||||
</td>
|
||||
<td>
|
||||
</div>
|
||||
<$link to={{!!title}} class="tw-plugin-info-link">
|
||||
<div>
|
||||
<div style="display:inline-block;">
|
||||
<$transclude tiddler=<<currentTiddler>> subtiddler=<<plugin-icon-title>>>
|
||||
<$transclude tiddler="$:/core/images/plugin-generic-$type$"/>
|
||||
</$transclude>
|
||||
</div>
|
||||
<div style="display:inline-block;">
|
||||
<div>
|
||||
''<$view field="description"><$view field="title"/></$view>''
|
||||
</div>
|
||||
<div>
|
||||
<$view field="title"/><br>
|
||||
</div>
|
||||
<div>
|
||||
<$view field="version"/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</$link>
|
||||
<$reveal type="match" text="yes" state=<<popup-state>>>
|
||||
<$reveal type="nomatch" text="" state="!!list">
|
||||
<div class="tw-plugin-info-dropdown">
|
||||
<$macrocall $name="tabs" state=<<tabs-state-macro>> tabsList={{!!list}} default="readme" template="$:/core/ui/PluginInfo"/>
|
||||
</div>
|
||||
</$reveal>
|
||||
<$reveal type="match" text="" state="!!list">
|
||||
<$transclude tiddler="$:/core/ui/TiddlerInfo/Advanced/PluginInfo"/>
|
||||
<div class="tw-plugin-info-dropdown">
|
||||
No information provided
|
||||
</div>
|
||||
</$reveal>
|
||||
</$reveal>
|
||||
</td>
|
||||
</tr>
|
||||
</div>
|
||||
</$set>
|
||||
</$list>
|
||||
</tbody>
|
||||
</table>
|
||||
</$set>
|
||||
\end
|
||||
|
||||
|
@ -1238,6 +1238,23 @@ canvas.tw-edit-bitmapeditor {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.tw-plugin-info {
|
||||
vertical-align: middle;
|
||||
border: 1px solid <<colour muted-foreground>>;
|
||||
margin: 1em 0 1em 0;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.tw-plugin-info img, .tw-plugin-info svg {
|
||||
width: 3em;
|
||||
height: 3em;
|
||||
}
|
||||
|
||||
.tw-plugin-info .tw-plugin-info-dropdown-button,
|
||||
.tw-plugin-info .tw-tiddlylink {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/*
|
||||
** Message boxes
|
||||
*/
|
||||
|
Loading…
Reference in New Issue
Block a user