[tw.com] Improve the saver cards - PR included

[twMat]

Edit - Resulting PR from this thread:

https://pr-tw5com-card-template.tiddlyhost.com/

I hope @Jermolene will accept this as a PR.

---

For tiddlywiki.com and the GettingStarted tiddler which transcludes the tiddler titled Saving, that shows the many saving "cards", I propose some modifications. This is a default tiddler, i.e it is very important. Here is a sample card as it appears now when hovered:

There are two problems:

1. In the stylesheet the .tc-card-author should state text-align: center instead of right. This is evident when watching a group of cards and where the titles and autor names are of various lengths. If we wish to visually distinguish the title from the author, then I propose making the "by xxx" italicized.

2. Link confusion: The image shows a hovered card; the whole card is (intended to be) a link to the saver tiddler. But only a part of the card title indicates that the card is hovered (blue color on link) - and/but the "TidGi" is not blue. This is because "TidGi", and also "LinOneTwo", are autocreated links that take precedence. Clicking them navigates away to non-existing tiddlers.

I propose disabling internal linking in this context because this behaviour is self evidently confusing for users. Ironically, the normally blue autolinks are explicitly colored (.tc-card a { color: #222; }) which indicates that we are aware of the problem but have only taken half measures.

This autolinking should probably be dealt with programmatically but here is a CSS solution;

.tc-card .tc-card-title a,
.tc-card .tc-card-author a {
  color: currentcolor;
  font-style: normal;
  pointer-events: none;
}

Note how beautifully the clicks instead fall back onto the surrounding link instead.

With that said, here are arguments against this CSS solution. I'm not qualified to tell how valid these arguments are for our specific case but I do think this CSS solution would be a significant improvement regardless.

[pmario]

The "offending" code is in https://tiddlywiki.com/prerelease/#%24%3A%2F_tw5.com-card-template and it can probably be fixed with adding the following line at line 1

I did test it and there is no wikilinking anymore. .. BUT I didn't test if there are any other side effects.

\define tv-wikilinks() no

[Jermolene]

Hi @twMat I'd welcome these improvements.

[twMat]

@pmario

\define tv-wikilinks() no I did test it and there is no wikilinking anymore. .. BUT I didn't test if there are any other side effects.

Right... unfortunately it kills all the linking there so one cannot click the (full) card to access its tiddler at all. Is there a way to limit the no-linkification to only parts of the code?

[pmario]

That's funny. I did test it and it seemed to work. Try this:

\define tw-card-template(bordercolor:"")
\whitespace trim
<div class="tc-card" style="border-top: 5px solid $bordercolor$;">
    <$link>
        <$let tv-wikilinks=no>
            <div class="tc-card-title"><$transclude field="caption"><$view field="title"/></$transclude></div>
            <div class="tc-card-author">
                <$list filter="[is[current]has[community-author]]">by {{!!community-author}}</$list>
            </div>
            <p><$view field="description"/></p>
        </$let>
    </$link>
</div>
\end

<$macrocall $name="tw-card-template" bordercolor={{!!color}}/>

[twMat]

Thanks, that does seem to work but it has one seeming side effect: The space between by and {{!!community-author}} disappears. Maybe the space is intentionally trimmed in https://tiddlywiki.com/prerelease/#%24%3A%2Fcore%2Fmodules%2Fwidgets%2Flink.js

It is not a styling matter, so I can only come up with   to resolve it.

[pmario]

It is not a styling matter, so I can only come up with   to resolve it.

Should be fine

[twMat]

Thanks @pmario . I've modified the OP to include a link to a PR (an external wiki, as explained elsewhere). I hope @Jermolene will accept it.

[pmario]

@twMat ... That's the same thing as the other issue. It's also a docs only change. I think the "pr-maker" shoudl work fine for that one too.

[twMat]

@pmario - thanks for your help. It is merged now.