On the
tiddlywiki.com website, if I make a tabbed internal Table of Contents as follows:
<$macrocall
  $name="toc-tabbed-internal-nav"
  tag="Learning"
  selectedTiddler="$:/temp/toc/selectedTiddler"
  unselectedText="<p>Select a topic in the table of contents. Click the arrow to expand a topic.</p>"
  missingText="<p>Missing tiddler.</p>"
/>
Some long titles cause the left side to take up half the width of the tiddler, leaving too little space to display tiddler contents on the right side.
I want to change (reduce) the width allowed on the left-side index of links.
I found the place in the CSS tiddler
$:/themes/tiddlywiki/vanilla/base that allows the width to be changed:
.tc-tabbed-table-of-contents .tc-table-of-contents {
    z-index: 100;
    display: inline-block;
    padding-left: 1em;
    max-width: 50%;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    background: <<colour tab-background>>;
    border-left: 1px solid <<colour tab-border>>;
    border-top: 1px solid <<colour tab-border>>;
    border-bottom: 1px solid <<colour tab-border>>;
}
I want to change the value
max-width: 50%; by perhaps using a field value in a ToC tiddler, like
width with a value of: 30%
or using a
class field
I do
not want to modify the
$:/themes/tiddlywiki/vanilla/base tiddler , nor the ToC Macros in
$:/core/macros/tocHow might I accomplish this?
Wishing all a dynamic, productive, rewarding year ahead!