Two tiddlers which pass a create argument to the fieldmangler widget. They are designed for use in a topmenu in TW5.

$:_Arlen22_toggle-centered-button

\define createStateTiddler()
tags: $:/tags/stylesheet

$(default)$
\end
\define state-1-css()

\end
\define state-2-css()
@media (min-width: 770px) { .story-river { margin: 0 auto; } .sidebar-header { left: 50%; right: 0; padding-left: 413px; } }
\end
<$set name="default" value=<<state-1-css>> >
<span title="Toggle width/sidebar">
<$fieldmangler tiddler="$:/temp/toggle-centered" create=<<createStateTiddler>>>
<$reveal type="match" state="$:/temp/toggle-centered" text=<<state-1-css>>>
<$button message="tw-add-tag" param="$:/tags/stylesheet" set="$:/temp/toggle-centered" setTo=<<state-2-css>>  class="centered-toggle-1">{{$:/_images/right-arrow-button}}</$button>
</$reveal><$reveal type="match" state="$:/temp/toggle-centered" text=<<state-2-css>> >
<$button message="tw-add-tag" param="$:/tags/stylesheet" set="$:/temp/toggle-centered" setTo=<<state-1-css>> class="centered-toggle-2">{{$:/_images/left-arrow-button}}</$button>
</$reveal></$fieldmangler>
</span>
</$set>

$:_Arlen22_toggle-width-button

\define createStateTiddler()
tags: $:/tags/stylesheet

$(default)$
\end
\define state-1-css()

\end
\define state-2-css()
.story-river { position: absolute; width: calc(100% - 28em); } .tw-tiddler-frame { width: 100%; } header.sidebar-header { float: right; width: 30em; left: auto;  }
\end
\define state-3-css()
.story-river { width: 100%; } .tw-tiddler-frame { width: 100%; } .sidebar-header { display: none; }
\end
@@float:right;
<$set name="default" value=<<state-1-css>>>
<span title="Toggle width/sidebar">
<$fieldmangler tiddler="$:/temp/toggle-width" create=<<createStateTiddler>> >
<$reveal type="match" state="$:/temp/toggle-width" text=<<state-1-css>>>
<$button message="tw-add-tag" param="$:/tags/stylesheet" set="$:/temp/toggle-width" setTo=<<state-2-css>> class="btn-invisible sidebar-toggle-1">{{$:/_images/right-arrow-button}}</$button>
</$reveal>
<$reveal type="match" state="$:/temp/toggle-width" text=<<state-2-css>>>
<$button message="tw-add-tag" param="$:/tags/stylesheet" set="$:/temp/toggle-width" setTo=<<state-3-css>> class="btn-invisible sidebar-toggle-2">{{$:/_images/right-arrow-button}}</$button>
</$reveal>
<$reveal type="match" state="$:/temp/toggle-width" text=<<state-3-css>>>
<$button message="tw-add-tag" param="$:/tags/stylesheet" set="$:/temp/toggle-width" setTo=<<state-1-css>> class="btn-invisible sidebar-toggle-3">{{$:/_images/left-arrow-button}}</$button>
</$reveal>
</$fieldmangler>
</span>
</$set>
@@