Get the tiddler info panel fields list working properly

Now we can display the fields list as a proper table.

We've had to temporarily hack the list widget again…

core/modules/new_widgets/list.js

@@ -104,7 +104,9 @@ ListWidget.prototype.makeItemTemplate = function(title) {
 				]}];
 			}
 		}
-		templateTree = [{type: "tiddler", attributes: {title: {type: "string", value: title}}, children: templateTree}]
+		if(!this.hasAttribute("hackCurrentTiddler")) {
+			templateTree = [{type: "tiddler", attributes: {title: {type: "string", value: title}}, children: templateTree}]
+		}
 	}
 	// Return the list item
 	return {type: "listitem", itemTitle: title, children: templateTree};

core/ui/ListItemTemplate.tid

@@ -1,5 +1,4 @@
 title: $:/core/ui/ListItemTemplate
 
-<div class="tw-menu-list-item">
-<$link to={{!!title}}><$view field="title"/></$link>
-</div>
+<div class="tw-menu-list-item"><$link to={{!!title}}><$view field="title"/></$link>
+</div>

core/ui/TiddlerFieldTemplate.tid

@@ -0,0 +1,3 @@
+title: $:/core/ui/TiddlerFieldTemplate
+
+<tr class="tw-view-field"><td class="tw-view-field-name"><<listItem>></td><td class="tw-view-field-value"><$view field=<<listItem>>/></td></tr>

core/ui/TiddlerFields.tid

@@ -1,6 +1,5 @@
 title: $:/core/ui/TiddlerFields
 
-\define renderfield(title)
-<div class="tw-view-field"><span class="tw-view-field-name">//$title$//:</span> <span class="tw-view-field-value"><$view field="$title$"/></span></div>
-\end
-<$list filter="[is[current]fields[]sort[title]] -text" macro="renderfield"/>
+<table><tbody><$list filter="[is[current]fields[]sort[title]] -text" template="$:/core/ui/TiddlerFieldTemplate" hackCurrentTiddler=true/>
+</tbody>
+</table>

core/ui/TiddlerInfo.tid

@@ -5,17 +5,17 @@ title: $:/core/ui/TiddlerInfo
 </div>
 <div class="tw-tab-content">
 <$reveal type="match" state="$:/state/tiddlerDropDownTabSet" text="refTab" default="refTab" qualifyTiddlerTitles="yes">
-<$list filter="[is[current]backlinks[]sort[title]]" emptyMessage="No tiddlers link to this one">
+<$list filter="[is[current]backlinks[]sort[title]]" emptyMessage="No tiddlers link to this one" template="$:/core/ui/ListItemTemplate">
 </$list>
 </$reveal>
 <$reveal type="match" state="$:/state/tiddlerDropDownTabSet" text="taggingTab" qualifyTiddlerTitles="yes">
-<$list filter="[is[current]tagging[]]" itemClass="tw-menu-list-item" emptyMessage="No tiddlers are tagged with this one"/>
+<$list filter="[is[current]tagging[]]" itemClass="tw-menu-list-item" emptyMessage="No tiddlers are tagged with this one" template="$:/core/ui/ListItemTemplate"/>
 </$reveal>
 <$reveal type="match" state="$:/state/tiddlerDropDownTabSet" text="listTab" qualifyTiddlerTitles="yes">
-<$list filter="[list{!!title}]" itemClass="tw-menu-list-item" emptyMessage="This tiddler does not have a list"/>
+<$list filter="[list{!!title}]" itemClass="tw-menu-list-item" emptyMessage="This tiddler does not have a list" template="$:/core/ui/ListItemTemplate"/>
 </$reveal>
 <$reveal type="match" state="$:/state/tiddlerDropDownTabSet" text="listedTab" qualifyTiddlerTitles="yes">
-<$list filter="[is[current]listed[]!is[system]]" itemClass="tw-menu-list-item" emptyMessage="This tiddler is not listed by any others"/>
+<$list filter="[is[current]listed[]!is[system]]" itemClass="tw-menu-list-item" emptyMessage="This tiddler is not listed by any others" template="$:/core/ui/ListItemTemplate"/>
 </$reveal>
 <$reveal type="match" state="$:/state/tiddlerDropDownTabSet" text="fieldsTab" qualifyTiddlerTitles="yes">
 <$transclude title="$:/core/ui/TiddlerFields"/>

themes/tiddlywiki/snowwhite/base.tid

@@ -426,16 +426,10 @@ a.tw-tiddlylink-external {
 }
 
 .tw-view-field-name {
-	vertical-align: top;
-	display: inline-block;
-	width: 15%;
 	text-align: right;
 }
 
 .tw-view-field-value {
-	vertical-align: top;
-	display: inline-block;
-	width: 75%;
 }
 
 @media screen {