I've previously only seen one "headline" when using fieldsets. IMO, when
using them as tabs there's need for a more visual distinction that default
so maybe something like;
fieldset > legend > samp > button {
background:#f0f0f0 !important;
padding:0 5px !important;
}
Possibly also
fieldset > legend {
outline:1px solid silver !important
}
Note that the above will style *all* fieldsets so maybe you'll want to add
a special enwrapping class for this concept of yours.
<:-)
On Tuesday, June 15, 2021 at 4:39:24 PM UTC+2 [email protected] wrote:
> Actually, it seems that <samp> is the non-deprecated equivalent to <tt>. I
> switched to that.
>
> /Mike
>
> On Tuesday, June 15, 2021 at 11:27:10 AM UTC-3 Michael Wiktowy wrote:
>
>> Or you can wrap the legend in <tt> tags to really give that TUI feel. : ]
>>
>> I stuck it up here to share:
>> https://sextant.space/#tabs-fieldset
>>
>> /Mike
>>
>> On Saturday, June 12, 2021 at 12:12:06 AM UTC-3 [email protected] wrote:
>>
>>> Or maybe I'm thinking of something else. Not sure. Showing my age more
>>> ...
>>>
>>> On Saturday, June 12, 2021 at 12:09:56 AM UTC-3 Charlie Veniot wrote:
>>>
>>>> Not sure what it says about me: I find this way fun ! Thanks !
>>>>
>>>> For the giggles, I made a small addition:
>>>>
>>>> <fieldset style="display: block;">
>>>> <legend><$list filter="$filter$ -[<currentTiddler>]"><<menubutton
>>>> labeltid:$state$>></$list> </legend>
>>>> *<div style="height:400px;overflow:scroll;" >*
>>>> <$tiddler tiddler={{$state$}} > <$transclude tiddler={{$state$}}
>>>> mode="block"/> </$tiddler>
>>>> *</div>*
>>>> </fieldset>
>>>> \end
>>>>
>>>> Now I find this feels like fixed-size "screens", and I'm having major
>>>> flashbacks to dBase IV and Clipper. Ugh, I'm showing my age ...
>>>>
>>>> On Friday, June 11, 2021 at 11:53:13 PM UTC-3 [email protected] wrote:
>>>>
>>>>> Greetings,
>>>>>
>>>>> I saw use of the fieldset html tag in another message thread here the
>>>>> other day and thought that it would be a neat way to implement a simple
>>>>> minimalistic "tabs" option.
>>>>>
>>>>> So I hacked it together (see below).
>>>>>
>>>>> It is best with no more than a few menu options but it will wrap in a
>>>>> usable fashion with more. One might be able to modify it to only display
>>>>> a
>>>>> fixed number of options or width and put some scrolling in with some list
>>>>> filter or CSS trickery but I am not planning to tackle that soon. Just
>>>>> wanted to throw out a proof of concept.
>>>>>
>>>>> It has hints of old-school BBS text menus of yesteryear /
>>>>> terminal-based GUIs.
>>>>>
>>>>> Enjoy.
>>>>>
>>>>> /Mike
>>>>>
>>>>> \define buttonlabel() <$text text=<<currentTiddler>>/>
>>>>>
>>>>> \define selectedbuttonlabel() ''<$text text=<<currentTiddler>>/>''
>>>>>
>>>>> \define menubutton(labeltid:"")
>>>>> <$button setTitle="$labeltid$" setTo=<<currentTiddler>>
>>>>> class="tc-btn-invisible">
>>>>> <$list filter="[<currentTiddler>compare:string:eq{$labeltid$}]"
>>>>> emptyMessage=<<buttonlabel>>
>>>>> variable=avoid_changing_currentTiddler><<selectedbuttonlabel>></$list>
>>>>> </$button>
>>>>> \end
>>>>>
>>>>> \define tabs-fieldset(filter:"" state:"$:/temp/state")
>>>>>
>>>>> <fieldset style="display: block;">
>>>>> <legend><$list filter="$filter$ -[<currentTiddler>]"><<menubutton
>>>>> labeltid:$state$>></$list> </legend>
>>>>>
>>>>> <$tiddler tiddler={{$state$}} > <$transclude tiddler={{$state$}}
>>>>> mode="block"/> </$tiddler>
>>>>>
>>>>> </fieldset>
>>>>> \end
>>>>>
>>>>> Examples use to cut and paste into tiddlywiki.com to try it out.
>>>>>
>>>>> <<tabs-fieldset filter:"[tag[Videos]]">>
>>>>>
>>>>> <<tabs-fieldset filter:"[tag[Videos]]" state:"$:/temp/altstate">>
>>>>>
>>>>>
--
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/27ca1be9-fd44-462d-8ac8-b62090b4f8efn%40googlegroups.com.
