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

Enhance tiddler title for system tiddlers

Now the $:/ part of the name is rendered in grey, making the main part
of the title more prominent.

@tobibeer suggested this a long time ago; good idea!
This commit is contained in:
Jermolene 2014-03-13 17:40:53 +00:00
parent 50cf9678cb
commit f48701544e
4 changed files with 70 additions and 4 deletions

View File

@ -3,3 +3,4 @@ title: $:/language/
RecentChanges/DateFormat: DDth MMM YYYY
CloseAll/Button: close all
MissingTiddler/Hint: Missing tiddler "<$text text=<<currentTiddler>>/>" - click {{$:/core/images/edit-button}} to create
SystemTiddler/Tooltip: This is a system tiddler

View File

@ -0,0 +1,40 @@
/*\
title: $:/core/modules/filters/removeprefix.js
type: application/javascript
module-type: filteroperator
Filter operator for removing a prefix from each title in the list. Titles that do not start with the prefix are removed.
\*/
(function(){
/*jslint node: true, browser: true */
/*global $tw: false */
"use strict";
/*
Export our filter function
*/
exports.removeprefix = function(source,operator,options) {
var results = [];
// Function to check an individual title
function checkTiddler(title) {
var match = title.substr(0,operator.operand.length).toLowerCase() === operator.operand.toLowerCase();
if(match) {
results.push(title.substr(operator.operand.length));
}
}
// Iterate through the source tiddlers
if($tw.utils.isArray(source)) {
$tw.utils.each(source,function(title) {
checkTiddler(title);
});
} else {
$tw.utils.each(source,function(element,title) {
checkTiddler(title);
});
}
return results;
};
})();

View File

@ -4,12 +4,33 @@ tags: $:/tags/ViewTemplate
\define title-styles()
fill:$(foregroundColor)$;
\end
<div class="tw-tiddler-title"><div class="titlebar"><span class="tw-tiddler-controls"><$list filter="[is[shadow]!has[draft.of]tag[$:/tags/ViewToolbar]] [!is[shadow]!has[draft.of]tag[$:/tags/ViewToolbar]] +[tag[$:/tags/ViewToolbar]]" variable="listItem"><$transclude tiddler=<<listItem>>/></$list>
</span><$set name="foregroundColor" value={{!!color}}><span style=<<title-styles>>><$transclude tiddler={{!!icon}}/></span></$set> <span class="title"><$view field="title"/></span></div>
<div class="tw-tiddler-title">
<div class="titlebar">
<span class="tw-tiddler-controls">
<$list filter="[is[shadow]!has[draft.of]tag[$:/tags/ViewToolbar]] [!is[shadow]!has[draft.of]tag[$:/tags/ViewToolbar]] +[tag[$:/tags/ViewToolbar]]" variable="listItem">
<$transclude tiddler=<<listItem>>/>
</$list>
</span>
<$set name="foregroundColor" value={{!!color}}>
<span style=<<title-styles>>>
<$transclude tiddler={{!!icon}}/>
</span>
</$set>
<$list filter="[is[current]removeprefix[$:/]]">
<span class="title" title={{$:/language/SystemTiddler/Tooltip}}>
<span class="tw-system-title-prefix">$:/</span><$text text=<<currentTiddler>>/>
</span>
</$list>
<$list filter="[is[current]!prefix[$:/]]">
<span class="title">
<$view field="title"/>
</span>
</$list>
</div>
<$reveal type="nomatch" text="" default="" state=<<tiddlerInfoState>> class="tw-tiddler-info tw-popup" animate="yes" retain="yes">
<$transclude tiddler="$:/core/ui/TiddlerInfo"/>
</$reveal></div>
</$reveal>
</div>

View File

@ -492,6 +492,10 @@ a.tw-tiddlylink-external:hover {
color: <<colour tiddler-title-foreground>>;
}
.tw-system-title-prefix {
color: <<colour muted-foreground>>;
}
.titlebar img {
height: 1em;
}