1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-11-15 22:34:51 +00:00

More custom colours

This commit is contained in:
Jeremy Ruston 2023-10-19 08:59:07 +01:00
parent 518c23d06d
commit e40b83f141
3 changed files with 32 additions and 3 deletions

View File

@ -16,9 +16,16 @@ tour-chooser-item-start-hover-background: <<colour primary>>
tour-chooser-item-start-hover-foreground: <<colour background>>
tour-fullscreen-background: <<colour page-background>>
tour-fullscreen-controls-foreground: <<colour muted-foreground>>
tour-navigation-buttons-back-background: red
tour-navigation-buttons-back-foreground: white
tour-navigation-buttons-hint-background: purple
tour-navigation-buttons-hint-foreground: white
tour-navigation-buttons-hover-background: <<colour foreground>>
tour-navigation-buttons-hover-foreground: <<colour background>>
tour-navigation-buttons-next-background: purple
tour-navigation-buttons-next-foreground: white
tour-overlay-background: #cbfff8
tour-overlay-border: #228877
tour-step-heading-background: none
tour-step-task-background: <<colour download-background>>
tour-step-task-foreground: <<colour download-foreground>>

View File

@ -25,6 +25,21 @@ tags: $:/tags/Stylesheet
margin: 0 1em 0 0;
}
.tc-tour-panel-navigation .tc-btn-big-green.tc-tour-panel-navigation-back {
background: <<colour tour-navigation-buttons-back-background>>;
color: <<colour tour-navigation-buttons-back-foreground>>;
}
.tc-tour-panel-navigation .tc-btn-big-green.tc-tour-panel-navigation-next {
background: <<colour tour-navigation-buttons-next-background>>;
color: <<colour tour-navigation-buttons-next-foreground>>;
}
.tc-tour-panel-navigation .tc-btn-big-green.tc-tour-panel-navigation-hint {
background: <<colour tour-navigation-buttons-hint-background>>;
color: <<colour tour-navigation-buttons-hint-foreground>>;
}
.tc-tour-panel-navigation .tc-btn-big-green:hover {
color: <<colour tour-navigation-buttons-hover-foreground>>;
background: <<colour tour-navigation-buttons-hover-background>>;
@ -98,6 +113,13 @@ tags: $:/tags/Stylesheet
color: <<colour tour-chooser-item-start-hover-foreground>>;
}
.tc-tour-panel-fullscreen h1 {
background: <<colour tour-step-heading-background>>;
padding: 0.25em;
margin: -0.25em;
border-radius: 4px;
}
.tc-tour-panel-fullscreen .tc-tour-panel-controls {
/* display: none; */
position: fixed;

View File

@ -7,13 +7,13 @@ tags: $:/tags/PageTemplate
\procedure tv-action-refresh-policy() always
<div class="tc-tour-panel-navigation">
<%if [function[tour-is-not-first-step]] %>
<$button class="tc-btn-big-green" style="background-color: red;">
<$button class="tc-btn-big-green tc-tour-panel-navigation-back">
<<tour-previous-step>>
back
</$button>
<%endif%>
<%if [function[tour-is-not-last-step]] %>
<$button class="tc-btn-big-green" style="background-color: purple;">
<$button class="tc-btn-big-green tc-tour-panel-navigation-next">
<<tour-next-step>>
next
</$button>
@ -38,7 +38,7 @@ tags: $:/tags/PageTemplate
<$transclude tiddler=<<currentTourStep>> mode="block"/>
<%if [{$:/state/tour/step}has[selector]] %>
<div class="tc-tour-panel-navigation">
<$button class="tc-btn-big-green" style="background-color: red;">
<$button class="tc-btn-big-green tc-tour-panel-navigation-hint">
<$action-sendmessage $message="tm-spotlight-element" selector={{{ [{$:/state/tour/step}get[selector]] }}} selector-fallback-1={{{ [{$:/state/tour/step}get[selector-fallback-1]] }}} selector-fallback-2={{{ [{$:/state/tour/step}get[selector-fallback-2]] }}}/>
show me a hint
</$button>