Make sure actions are run instantly if possible

* fix 7142 search outline in chrome like browsers

* use moz-focusring only for FF, outline-initial for Chrome

* moz-focusring remove outline-offset

* remove box-sizing from base, because it's part of reset

* remove redundant box-sizing since it is part of reset

* fix distance between search input and first button to the right

core/modules/wiki.js

@@ -164,12 +164,59 @@ exports.enqueueTiddlerEvent = function(title,isDeleted) {
 			self.eventsTriggered = false;
 			if($tw.utils.count(changes) > 0) {
 				self.dispatchEvent("change",changes);
+				self.runFilteredActions();
 			}
 		});
 		this.eventsTriggered = true;
 	}
 };
 
+exports.runFilteredActions = function() {
+	if(!$tw.browser) {
+		return;
+	}
+	var self = this;
+	var now = (new Date()).getTime();
+	// Minimum interval between runs
+	this.intervalFilteredActions = this.intervalFilteredActions || 100;
+	// Time of the last run
+	this.timestampLastRunFilteredActions = this.timestampLastRunFilteredActions || now - this.intervalFilteredActions * 2;
+	// If we've run the filtered actions recently, queue another run
+	if((this.timestampLastRunFilteredActions + this.intervalFilteredActions) > now) {
+		if(!this.filterActionTimerId) {
+			this.filterActionTimerId = setTimeout(function() {
+				self.filterActionTimerId = null;
+				self.runFilteredActions();
+			},this.intervalFilteredActions);
+		}
+		return;
+	}
+	// Record the time of this run
+	this.timestampLastRunFilteredActions = now;
+	// Get the list of filtered action tiddlers and process each one
+	var filteredActions = $tw.wiki.getTiddlersWithTag("$:/tags/FilteredActions");
+	$tw.utils.each(filteredActions,function(filteredActionTitle) {
+		var tiddler = self.getTiddler(filteredActionTitle);
+		if(tiddler && tiddler.fields.filter) {
+			var results = self.filterTiddlers(tiddler.fields.filter);
+			if(results.length > 0) {
+				console.log("Executing actions",tiddler.fields.text,results)
+				self.invokeActionString(
+					tiddler.fields.text,
+					null,
+					{
+						filteredActionTitle: filteredActionTitle,
+						results: $tw.utils.stringifyList(results),
+						jsonResults: JSON.stringify(results)
+					},{
+						parentWidget: $tw.rootWidget
+					}
+				);
+			}
+		}
+	});
+}
+
 exports.getSizeOfTiddlerEventQueue = function() {
 	return $tw.utils.count(this.changedTiddlers);
 };

core/palettes/FlexokiDark.tid

@@ -1,212 +0,0 @@
-color-scheme: dark
-description: An inky color scheme for prose and code from https://stephango.com/flexoki
-name: FlexokiDark
-tags: $:/tags/Palette
-title: $:/palettes/FlexokiDark
-type: application/x-tiddler-dictionary
-
-flexoki-paper: #FFFCF0
-flexoki-999: #100F0F
-flexoki-950: #1C1B1A
-flexoki-900: #282726
-flexoki-850: #343331
-flexoki-800: #403E3C
-flexoki-700: #575653
-flexoki-600: #6c6b66
-flexoki-500: #878580
-flexoki-300: #B7B5AC
-flexoki-200: #CECDC3
-flexoki-150: #DAD8CE
-flexoki-100: #E6E4D9
-flexoki-050: #F2F0E5
-flexoki-red-600: #AF3029
-flexoki-red-400: #D14D41
-flexoki-orange-600: #BC5215
-flexoki-orange-400: #DA702C
-flexoki-yellow-900: #4D3A0B
-flexoki-yellow-600: #AD8301
-flexoki-yellow-400: #D0A215
-flexoki-yellow-100: #FCEEB8
-flexoki-green-600: #66800B
-flexoki-green-400: #879A39
-flexoki-cyan-950: #142625
-flexoki-cyan-600: #227d77
-flexoki-cyan-400: #3AA99F
-flexoki-cyan-050: #EBF2E7
-flexoki-blue-600: #205EA6
-flexoki-blue-400: #4385BE
-flexoki-purple-600: #5E409D
-flexoki-purple-400: #8B7EC8
-flexoki-magenta-600: #A02F6F
-flexoki-magenta-400: #CE5D97
-
-flexoki-bg: <<colour flexoki-999>>
-flexoki-tx-2: <<colour flexoki-500>>
-flexoki-tx-3: <<colour flexoki-700>>
-flexoki-ui-3: <<colour flexoki-800>>
-flexoki-ui-2: <<colour flexoki-850>>
-flexoki-ui: <<colour flexoki-900>>
-flexoki-bg-2: <<colour flexoki-950>>
-flexoki-tx: <<colour flexoki-300>>
-flexoki-re: <<colour flexoki-red-400>>
-flexoki-or: <<colour flexoki-orange-400>>
-flexoki-ye: <<colour flexoki-yellow-400>>
-flexoki-gr: <<colour flexoki-green-400>>
-flexoki-cy: <<colour flexoki-cyan-400>>
-flexoki-bl: <<colour flexoki-blue-400>>
-flexoki-pu: <<colour flexoki-purple-400>>
-flexoki-ma: <<colour flexoki-magenta-400>>
-flexoki-re-2: <<colour flexoki-red-600>>
-flexoki-or-2: <<colour flexoki-orange-600>>
-flexoki-ye-2: <<colour flexoki-yellow-600>>
-flexoki-gr-2: <<colour flexoki-green-600>>
-flexoki-cy-2: <<colour flexoki-cyan-600>>
-flexoki-bl-2: <<colour flexoki-blue-600>>
-flexoki-pu-2: <<colour flexoki-purple-600>>
-flexoki-ma-2: <<colour flexoki-magenta-600>>
-
-alert-background: <<colour flexoki-yellow-100>>
-alert-border: <<colour flexoki-ye-2>>
-alert-highlight: <<colour flexoki-re>>
-alert-muted-foreground: <<colour flexoki-ye>>
-background: #1C1B1A
-blockquote-bar: <<colour flexoki-ma-2>>
-button-background: <<colour flexoki-bg-2>>
-button-foreground: <<colour flexoki-paper>>
-button-border: <<colour flexoki-600>>
-code-background: <<colour background>>
-code-border: <<colour flexoki-tx>>
-code-foreground: <<colour flexoki-tx>>
-diff-delete-background: <<colour flexoki-re>>
-diff-delete-foreground: <<colour flexoki-paper>>
-diff-equal-background: 
-diff-equal-foreground: inherit
-diff-insert-background: <<colour flexoki-gr>>
-diff-insert-foreground: <<colour flexoki-paper>>
-diff-invisible-background: <<colour flexoki-ye>>
-diff-invisible-foreground: <<colour flexoki-paper>>
-dirty-indicator: <<colour flexoki-re>>
-download-background: <<colour flexoki-cy-2>>
-download-foreground: <<colour background>>
-dragger-background: <<colour background>>
-dragger-foreground: <<colour foreground>>
-dropdown-background: <<colour background>>
-dropdown-border: <<colour flexoki-ui-3>>
-dropdown-tab-background-selected: <<colour flexoki-ui>>
-dropdown-tab-background: <<colour flexoki-ui-3>>
-dropzone-background: <<colour flexoki-gr>>
-external-link-background-hover: inherit
-external-link-background-visited: inherit
-external-link-background: inherit
-external-link-foreground-hover: inherit
-external-link-foreground-visited: <<colour flexoki-bl>>
-external-link-foreground: <<colour flexoki-bl>>
-footnote-target-background: <<colour flexoki-bg-2>>
-foreground: #B7B5AC
-highlight-background: #ffff00
-highlight-foreground: #000000
-menubar-background: <<colour primary>>
-menubar-foreground: <<colour flexoki-paper>>
-message-background: <<colour background>>
-message-border: <<colour foreground>>
-message-foreground: <<colour foreground>>
-modal-backdrop: <<colour foreground>>
-modal-background: <<colour background>>
-modal-border: <<colour flexoki-ui-3>>
-modal-footer-background: <<colour flexoki-ui-2>>
-modal-footer-border: <<colour flexoki-ui-3>>
-modal-header-border: <<colour flexoki-ui-3>>
-muted-foreground: <<colour flexoki-tx-2>>
-network-activity-foreground: <<colour flexoki-cy>>
-notification-background: <<colour flexoki-ui-3>>
-notification-border: <<colour flexoki-ui>>
-page-background: <<colour flexoki-bg-2>>
-pre-background: <<colour flexoki-ui-3>>
-pre-border: <<colour flexoki-ui-2>>
-primary: <<colour flexoki-cy>>
-selection-background: #2b7b73
-selection-foreground: <<colour flexoki-tx>>
-select-tag-background: <<colour flexoki-bg>>
-select-tag-foreground: <<colour flexoki-paper>>
-sidebar-button-foreground: <<colour foreground>>
-sidebar-controls-foreground-hover: <<colour flexoki-tx>>
-sidebar-controls-foreground: <<colour flexoki-tx-3>>
-sidebar-foreground-shadow: transparent
-sidebar-foreground: <<colour flexoki-tx>>
-sidebar-muted-foreground-hover: <<colour flexoki-tx>>
-sidebar-muted-foreground: <<colour flexoki-tx-3>>
-sidebar-tab-background-selected: <<colour flexoki-bg>>
-sidebar-tab-background: <<colour flexoki-ui-2>>
-sidebar-tab-border-selected: <<colour tab-border-selected>>
-sidebar-tab-border: <<colour tab-border>>
-sidebar-tab-divider: #e4e4e4
-sidebar-tab-foreground-selected: 
-sidebar-tab-foreground: <<colour tab-foreground>>
-sidebar-tiddler-link-foreground-hover: <<colour flexoki-tx>>
-sidebar-tiddler-link-foreground: <<colour flexoki-tx-2>>
-site-title-foreground: <<colour tiddler-title-foreground>>
-stability-stable: <<colour flexoki-gr>>
-stability-experimental: <<colour flexoki-ye>>
-stability-deprecated: <<colour flexoki-re>>
-stability-legacy: <<colour flexoki-bl>>
-static-alert-foreground: #aaaaaa
-tab-background-selected: <<colour background>>
-tab-background: <<colour flexoki-bg-2>>
-tab-border-selected: <<colour flexoki-ui-3>>
-tab-border: <<colour flexoki-ui>>
-tab-divider: <<colour flexoki-ui-2>>
-tab-foreground-selected: <<colour tab-foreground>>
-tab-foreground: <<colour flexoki-tx-2>>
-table-border: <<colour flexoki-ui>>
-table-footer-background: <<colour flexoki-ui>>
-table-header-background: <<colour flexoki-ui>>
-tag-background: #D0A215
-tag-foreground: #100F0F
-testcase-accent-level-1: <<colour flexoki-bl-2>>
-testcase-accent-level-2: <<colour flexoki-ye-2>>
-testcase-accent-level-3: <<colour flexoki-gr-2>>
-tiddler-background: <<colour background>>
-tiddler-border: <<colour flexoki-ui-2>>
-tiddler-controls-foreground-hover: <<colour flexoki-tx-3>>
-tiddler-controls-foreground-selected: <<colour flexoki-tx-2>>
-tiddler-controls-foreground: <<colour flexoki-ui-2>>
-tiddler-editor-background: <<colour flexoki-bg-2>>
-tiddler-editor-border-image: #ffffff
-tiddler-editor-border: <<colour flexoki-ui-2>>
-tiddler-editor-fields-even: <<colour flexoki-ui-3>>
-tiddler-editor-fields-odd: <<colour flexoki-ui-2>>
-tiddler-info-background: <<colour flexoki-ui>>
-tiddler-info-border: <<colour flexoki-ui>>
-tiddler-info-tab-background: <<colour flexoki-ui>>
-tiddler-link-background: <<colour background>>
-tiddler-link-foreground: <<colour primary>>
-tiddler-subtitle-foreground: <<colour flexoki-tx-3>>
-tiddler-title-foreground: <<colour flexoki-ma>>
-toolbar-new-button: 
-toolbar-options-button: 
-toolbar-save-button: 
-toolbar-info-button: 
-toolbar-edit-button: 
-toolbar-close-button: 
-toolbar-delete-button: 
-toolbar-cancel-button: 
-toolbar-done-button: 
-untagged-background: #999999
-very-muted-foreground: <<colour flexoki-600>>
-wikilist-background: #e5e5e5
-wikilist-item: #fff
-wikilist-info: #000
-wikilist-title: #666
-wikilist-title-svg: <<colour wikilist-title>>
-wikilist-url: #aaa
-wikilist-button-open: #4fb82b
-wikilist-button-open-hover: green
-wikilist-button-reveal: #5778d8
-wikilist-button-reveal-hover: blue
-wikilist-button-remove: #d85778
-wikilist-button-remove-hover: red
-wikilist-toolbar-background: #d3d3d3
-wikilist-toolbar-foreground: #888
-wikilist-droplink-dragover: rgba(255,192,192,0.5)
-wikilist-button-background: #acacac
-wikilist-button-foreground: #000

core/palettes/FlexokiLight.tid

@@ -1,214 +0,0 @@
-title: $:/palettes/FlexokiLight
-name: FlexokiLight
-description: An inky color scheme for prose and code from https://stephango.com/flexoki
-tags: $:/tags/Palette
-type: application/x-tiddler-dictionary
-color-scheme: light
-
-flexoki-black:       #100F0F
-flexoki-paper:       #FFFCF0
-flexoki-950:         #1C1B1A
-flexoki-900:         #282726
-flexoki-850:         #343331
-flexoki-800:         #403E3C
-flexoki-700:         #575653
-flexoki-600:         #6F6E69
-flexoki-500:         #878580
-flexoki-300:         #B7B5AC
-flexoki-200:         #CECDC3
-flexoki-150:         #DAD8CE
-flexoki-100:         #E6E4D9
-flexoki-050:          #F2F0E5
-flexoki-red-600:     #AF3029
-flexoki-red-400:     #D14D41
-flexoki-orange-600:  #BC5215
-flexoki-orange-400:  #DA702C
-flexoki-yellow-900:  #4D3A0B
-flexoki-yellow-600:  #AD8301
-flexoki-yellow-400:  #D0A215
-flexoki-yellow-100:  #FCEEB8
-flexoki-green-600:   #66800B
-flexoki-green-400:   #879A39
-flexoki-cyan-950:    #142625
-flexoki-cyan-600:    #24837B
-flexoki-cyan-400:    #3AA99F
-flexoki-cyan-050:     #EBF2E7
-flexoki-blue-600:    #205EA6
-flexoki-blue-400:    #4385BE
-flexoki-purple-600:  #5E409D
-flexoki-purple-400:  #8B7EC8
-flexoki-magenta-600: #A02F6F
-flexoki-magenta-400: #CE5D97
-
-flexoki-tx: <<colour flexoki-black>>
-flexoki-tx-2: <<colour flexoki-600>>
-flexoki-tx-3: <<colour flexoki-300>>
-flexoki-ui-3: <<colour flexoki-200>>
-flexoki-ui-2: <<colour flexoki-150>>
-flexoki-ui: <<colour flexoki-100>>
-flexoki-bg-2: <<colour flexoki-050>>
-flexoki-bg: <<colour flexoki-paper>>
-
-flexoki-re: <<colour flexoki-red-400>>
-flexoki-or: <<colour flexoki-orange-400>>
-flexoki-ye: <<colour flexoki-yellow-400>>
-flexoki-gr: <<colour flexoki-green-400>>
-flexoki-cy: <<colour flexoki-cyan-400>>
-flexoki-bl: <<colour flexoki-blue-400>>
-flexoki-pu: <<colour flexoki-purple-400>>
-flexoki-ma: <<colour flexoki-magenta-400>>
-
-flexoki-re-2: <<colour flexoki-red-600>>
-flexoki-or-2: <<colour flexoki-orange-600>>
-flexoki-ye-2: <<colour flexoki-yellow-600>>
-flexoki-gr-2: <<colour flexoki-green-600>>
-flexoki-cy-2: <<colour flexoki-cyan-600>>
-flexoki-bl-2: <<colour flexoki-blue-600>>
-flexoki-pu-2: <<colour flexoki-purple-600>>
-flexoki-ma-2: <<colour flexoki-magenta-600>>
-
-alert-background: <<colour flexoki-yellow-100>>
-alert-border: <<colour flexoki-ye-2>>
-alert-highlight: <<colour flexoki-re-2>>
-alert-muted-foreground: <<colour flexoki-tx-2>>
-background: #FFFCF0
-blockquote-bar: <<colour flexoki-magenta-600>>
-button-background: <<colour flexoki-bg-2>>
-button-foreground: <<colour flexoki-black>>
-button-border: <<colour flexoki-500>>
-code-background: <<colour flexoki-bg>>
-code-border: <<colour flexoki-tx>>
-code-foreground: <<colour flexoki-tx>>
-diff-delete-background: <<colour flexoki-re-2>>
-diff-delete-foreground: <<colour flexoki-paper>>
-diff-equal-background: 
-diff-equal-foreground: <<colour foreground>>
-diff-insert-background: <<colour flexoki-gr-2>>
-diff-insert-foreground: <<colour flexoki-paper>>
-diff-invisible-background: <<colour flexoki-ye-2>>
-diff-invisible-foreground: <<colour flexoki-paper>>
-dirty-indicator: <<colour flexoki-red-600>>
-download-background: <<colour flexoki-gr>>
-download-foreground: <<colour background>>
-dragger-background: <<colour foreground>>
-dragger-foreground: <<colour background>>
-dropdown-background: <<colour background>>
-dropdown-border: <<colour muted-foreground>>
-dropdown-tab-background-selected: #fff
-dropdown-tab-background: #ececec
-dropzone-background: <<colour flexoki-gr>>
-external-link-background-hover: inherit
-external-link-background-visited: inherit
-external-link-background: inherit
-external-link-foreground-hover: inherit
-external-link-foreground-visited: <<colour flexoki-bl>>
-external-link-foreground: <<colour flexoki-bl>>
-footnote-target-background: <<colour flexoki-bg-2>>
-foreground: #100F0F
-highlight-background: #ffff00
-highlight-foreground: #000000
-menubar-background: <<colour primary>>
-menubar-foreground: <<colour flexoki-paper>>
-message-background: <<colour flexoki-bg>>
-message-border: <<colour flexoki-black>>
-message-foreground: <<colour flexoki-black>>
-modal-backdrop: <<colour foreground>>
-modal-background: <<colour background>>
-modal-border: #999999
-modal-footer-background: #f5f5f5
-modal-footer-border: #dddddd
-modal-header-border: #eeeeee
-muted-foreground: <<colour flexoki-500>>
-network-activity-foreground: <<colour flexoki-cy-2>>
-notification-background: <<colour flexoki-bg>>
-notification-border: <<color flexoki-black>>
-page-background: <<colour flexoki-bg-2>>
-pre-background: <<colour flexoki-bg>>
-pre-border: <<colour flexoki-ui-2>>
-primary: <<colour flexoki-cy>>
-selection-background: 
-selection-foreground: 
-select-tag-background: <<colour flexoki-bg>>
-select-tag-foreground: <<color flexoki-black>>
-sidebar-button-foreground: <<colour foreground>>
-sidebar-controls-foreground-hover: <<colour flexoki-tx>>
-sidebar-controls-foreground: <<colour flexoki-tx-3>>
-sidebar-foreground-shadow: rgba(255,255,255, 0.8)
-sidebar-foreground: <<colour flexoki-300>>
-sidebar-muted-foreground-hover: <<colour flexoki-700>>
-sidebar-muted-foreground: <<colour flexoki-200>>
-sidebar-tab-background-selected: <<colour flexoki-bg-2>>
-sidebar-tab-background: <<colour flexoki-ui>>
-sidebar-tab-border-selected: <<colour tab-border-selected>>
-sidebar-tab-border: <<colour tab-border>>
-sidebar-tab-divider: <<colour flexoki-100>>
-sidebar-tab-foreground-selected: 
-sidebar-tab-foreground: <<colour tab-foreground>>
-sidebar-tiddler-link-foreground-hover: <<colour flexoki-500>>
-sidebar-tiddler-link-foreground: <<colour flexoki-700>>
-site-title-foreground: <<colour tiddler-title-foreground>>
-stability-stable: <<colour flexoki-green-600>>
-stability-experimental: <<colour flexoki-yellow-600>>
-stability-deprecated: <<colour flexoki-red-600>>
-stability-legacy: <<colour flexoki-blue-600>>
-static-alert-foreground: <<colour flexoki-tx-3>>
-tab-background-selected: <<colour background>>
-tab-background: <<colour flexoki-bg-2>>
-tab-border-selected: <<colour flexoki-ui-3>>
-tab-border: <<colour flexoki-ui>>
-tab-divider: <<colour flexoki-ui-2>>
-tab-foreground-selected: <<colour tab-foreground>>
-tab-foreground: <<colour flexoki-tx>>
-table-border: <<colour flexoki-ui-2>>
-table-footer-background: <<colour flexoki-tx-3>>
-table-header-background: <<colour flexoki-bg-2>>
-tag-background: #AD8301
-tag-foreground: #FFFCF0
-testcase-accent-level-1: <<colour flexoki-blue-400>>
-testcase-accent-level-2: <<colour flexoki-yellow-400>>
-testcase-accent-level-3: <<colour flexoki-green-400>>
-tiddler-background: <<colour background>>
-tiddler-border: <<colour background>>
-tiddler-controls-foreground-hover: <<colour flexoki-tx-3>>
-tiddler-controls-foreground-selected: <<colour  flexoki-tx-2>>
-tiddler-controls-foreground: <<colour flexoki-ui-3>>
-tiddler-editor-background: <<colour flexoki-bg-2>>
-tiddler-editor-border-image: #ffffff
-tiddler-editor-border: <<colour flexoki-ui-2>>
-tiddler-editor-fields-even: <<colour flexoki-ui-3>>
-tiddler-editor-fields-odd: <<colour flexoki-ui-2>>
-tiddler-info-background: <<colour flexoki-bg-2>>
-tiddler-info-border: <<colour flexoki-200>>
-tiddler-info-tab-background: <<colour flexoki-bg>>
-tiddler-link-background: <<colour background>>
-tiddler-link-foreground: <<colour primary>>
-tiddler-subtitle-foreground: <<colour flexoki-black>>
-tiddler-title-foreground: <<colour flexoki-magenta-600>>
-toolbar-new-button: 
-toolbar-options-button: 
-toolbar-save-button: 
-toolbar-info-button: 
-toolbar-edit-button: 
-toolbar-close-button: 
-toolbar-delete-button: 
-toolbar-cancel-button: 
-toolbar-done-button: 
-untagged-background: #999999
-very-muted-foreground: #888888
-wikilist-background: <<colour flexoki-ui>>
-wikilist-item: #fff
-wikilist-info: #000
-wikilist-title: #666
-wikilist-title-svg: <<colour wikilist-title>>
-wikilist-url: #aaa
-wikilist-button-open: #4fb82b
-wikilist-button-open-hover: green
-wikilist-button-reveal: #5778d8
-wikilist-button-reveal-hover: blue
-wikilist-button-remove: #d85778
-wikilist-button-remove-hover: red
-wikilist-toolbar-background: #d3d3d3
-wikilist-toolbar-foreground: #888
-wikilist-droplink-dragover: rgba(255,192,192,0.5)
-wikilist-button-background: #acacac
-wikilist-button-foreground: #000

core/ui/AdvancedSearch/Standard.tid

@@ -39,6 +39,7 @@ caption: {{$:/language/Search/Standard/Caption}}
 </$keyboard>
 </$keyboard>
 </$keyboard>
+&#32;
 <$reveal state="$:/temp/advancedsearch" type="nomatch" text="">
 <$button class="tc-btn-invisible">
 <<cancel-search-actions>>

core/ui/SideBarSegments/search.tid

@@ -55,7 +55,7 @@ tags: $:/tags/SideBarSegment
 <$macrocall $name="keyboard-driven-input" tiddler=<<editTiddler>> storeTitle=<<searchTiddler>> 
 		selectionStateTitle=<<searchListState>> refreshTitle="$:/temp/search/refresh" type="search" 
 		tag="input" focus={{$:/config/Search/AutoFocus}} focusPopup=<<qualify "$:/state/popup/search-dropdown">> 
-		class="tc-popup-handle" filterMinLength={{$:/config/Search/MinLength}} inputCancelActions=<<cancel-search-actions>> 
+		class="tc-tiny-gap-right tc-popup-handle" filterMinLength={{$:/config/Search/MinLength}} inputCancelActions=<<cancel-search-actions>> 
 		inputAcceptActions=<<input-accept-actions>> inputAcceptVariantActions=<<input-accept-variant-actions>> cancelPopups="yes" 
 		configTiddlerFilter="[[$:/state/search/currentTab]!is[missing]get[text]] ~[{$:/config/SearchResults/Default}]"/>
 </form>

editions/tw5.com/tiddlers/Sample Filtered Action.tid

@@ -0,0 +1,5 @@
+title: Sample Filtered Action
+tags: $:/tags/FilteredActions
+filter: [list[$:/StoryList]match[Sample Filtered Action]]
+
+<$action-setfield $tiddler="$:/SiteTitle" text={{{ [{$:/SiteTitle}addsuffix[!]] }}}/>

editions/tw5.com/tiddlers/concepts/Railroad Diagrams.tid

@@ -15,4 +15,6 @@ In the example above, a comma appears between each occurrence of the `repeated`
 
 Characters in round boxes are literal, i.e. they denote themselves. A name in a rectangular box denotes a further railroad diagram.
 
+The TW [[Filter Syntax]] documentation makes extensive use of railroad diagrams.
+
 The railroad diagrams in ~TiddlyWiki's documentation are generated with the [[Railroad Plugin]].

editions/tw5.com/tiddlers/plugins/Railroad Plugin.tid

@@ -5,6 +5,12 @@ tags: OfficialPlugins [[Plugin Editions]]
 title: Railroad Plugin
 type: text/vnd.tiddlywiki
 
+!! Railroad Diagrams
+
+{{Railroad Diagrams}}
+
+!! Plugin
+
 {{$:/plugins/tiddlywiki/railroad/readme}}
 
-{{$:/plugins/tiddlywiki/railroad/syntax}}
+Learn more about the [[Railroad Plguin Syntax Description|$:/plugins/tiddlywiki/railroad/syntax]]

plugins/tiddlywiki/tour/tour-filtered-action.tid

@@ -0,0 +1,7 @@
+title: $:/plugins/tiddlywiki/tour/filtered-action
+tags: $:/tags/FilteredActions
+filter: [{$:/config/ShowTour}!is[blank]else[show]match[show]then[$:/state/tour/step]get[text]get[step-success-filter]] :map[subfilter<currentTiddler>] :filter[<currentTiddler>!match[]]
+
+\import [[$:/plugins/tiddlywiki/tour/variables]]
+<$action-sendmessage $message="tm-confetti-launch"/>
+<<tour-next-step>>

plugins/tiddlywiki/tour/tour-panel.tid

@@ -48,7 +48,6 @@ tags: $:/tags/PageTemplate
 <$let tour-task="">
 	<$transclude tiddler=<<currentTourStep>> mode="block"/>
 </$let>
-<$confetti/>
 <p>
 	Congratulations, you may proceed
 </p>

themes/tiddlywiki/vanilla/base.tid

@@ -71,10 +71,16 @@ $else$
 
 {{$:/themes/tiddlywiki/vanilla/reset}}
 
-*, input[type="search"] {
-	box-sizing: border-box;
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
+input[type="search"] {
+	outline-offset: initial;
+}
+
+button, textarea, input, select {
+	outline-color: <<colour primary>>;
+}
+
+:-moz-focusring {
+	outline: 2px solid <<colour primary>>;
 }
 
 /*
@@ -157,7 +163,7 @@ code {
 	color: <<colour code-foreground>>;
 	background-color: <<colour code-background>>;
 	border: 1px solid <<colour code-border>>;
-	white-space: {{$:/themes/tiddlywiki/vanilla/options/codewrapping}};
+	white-space: pre-wrap;
 	padding: 0 3px 2px;
 	border-radius: 3px;
 	font-family: {{$:/themes/tiddlywiki/vanilla/settings/codefontfamily}};
@@ -293,10 +299,13 @@ form.tc-form-inline {
 Markdown likes putting code elements inside pre elements
 */
 pre > code {
-	padding: 0;
+	display: block;
+	padding: 0.5em;
 	border: none;
+	white-space: {{$:/themes/tiddlywiki/vanilla/options/codewrapping}};
 	background-color: inherit;
 	color: inherit;
+	overflow-x: auto;
 }
 
 /*
@@ -707,7 +716,7 @@ html body.tc-body .tc-btn-rounded:hover svg {
 }
 
 button svg.tc-image-button, button .tc-image-button img {
-	height: 1em;
+	height: auto;
 	width: 1em;
 }
 
@@ -2819,7 +2828,7 @@ a.tc-tiddlylink.tc-plugin-info:hover > .tc-plugin-info-chunk .tc-plugin-info-sta
 }
 
 .tc-language-chooser .tc-image-button img {
-	width: 2em;
+	width: auto;
 	vertical-align: -0.15em;
 }