mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-11-23 10:07:19 +00:00
Add background image to Vanilla theme tweaks
Now one can choose an image tiddler from a dropdown and choose how the image is attached.
This commit is contained in:
parent
5effb3fdc3
commit
987bfcfd5b
@ -2,17 +2,46 @@ title: $:/themes/tiddlywiki/vanilla/themetweaks
|
||||
tags: $:/tags/ControlPanel/Appearance
|
||||
caption: Theme Tweaks
|
||||
|
||||
\define backgroundimage-dropdown()
|
||||
<div class="tc-drop-down-wrapper">
|
||||
<$button popup=<<qualify "$:/state/popup/themetweaks/backgroundimage">> class="tc-btn-invisible tc-btn-dropdown">{{$:/core/images/down-arrow}}</$button>
|
||||
<$reveal state=<<qualify "$:/state/popup/themetweaks/backgroundimage">> type="popup" position="belowleft" text="" default="">
|
||||
<div class="tc-drop-down">
|
||||
<$linkcatcher to="$:/themes/tiddlywiki/vanilla/settings/backgroundimage">
|
||||
<$link to="">
|
||||
(none)
|
||||
</$link>
|
||||
<hr>
|
||||
<$list filter="[all[shadows+tiddlers]is[image]] -[type[application/pdf]] +[sort[title]]">
|
||||
<$link to={{!!title}}>
|
||||
<$transclude/> <$view field="title"/>
|
||||
</$link>
|
||||
</$list>
|
||||
</$linkcatcher>
|
||||
</div>
|
||||
</$reveal>
|
||||
</div>
|
||||
\end
|
||||
|
||||
\define backgroundimageattachment-dropdown()
|
||||
<$select tiddler="$:/themes/tiddlywiki/vanilla/settings/backgroundimageattachment" default="scroll">
|
||||
<option value="scroll">Scroll with tiddlers</option>
|
||||
<option value="fixed">Fixed to window</option>
|
||||
</$select>
|
||||
\end
|
||||
|
||||
You can tweak certain aspects of the ''Vanilla'' theme.
|
||||
|
||||
! Options
|
||||
|
||||
|[[Sticky titles|$:/themes/tiddlywiki/vanilla/options/stickytitles]]<br>//Causes tiddler titles to "stick" to the top of the browser window. Does not work at all with Chrome, and causes some layout issues in Firefox// |<$select tiddler="$:/themes/tiddlywiki/vanilla/options/stickytitles"><option value="no">No</option><option value="yes">Yes</option></$select> |
|
||||
|
||||
|
||||
! Settings
|
||||
|
||||
|[[Font family|$:/themes/tiddlywiki/vanilla/settings/fontfamily]] |<$edit-text tiddler="$:/themes/tiddlywiki/vanilla/settings/fontfamily" default="" tag="input"/> |
|
||||
|[[Code font family|$:/themes/tiddlywiki/vanilla/settings/codefontfamily]] |<$edit-text tiddler="$:/themes/tiddlywiki/vanilla/settings/codefontfamily" default="" tag="input"/> |
|
||||
|[[Font family|$:/themes/tiddlywiki/vanilla/settings/fontfamily]] |<$edit-text tiddler="$:/themes/tiddlywiki/vanilla/settings/fontfamily" default="" tag="input"/> | |
|
||||
|[[Code font family|$:/themes/tiddlywiki/vanilla/settings/codefontfamily]] |<$edit-text tiddler="$:/themes/tiddlywiki/vanilla/settings/codefontfamily" default="" tag="input"/> | |
|
||||
|[[Page background image|$:/themes/tiddlywiki/vanilla/settings/backgroundimage]] |<$edit-text tiddler="$:/themes/tiddlywiki/vanilla/settings/backgroundimage" default="" tag="input"/> |<<backgroundimage-dropdown>> |
|
||||
|[[Page background image attachment |$:/themes/tiddlywiki/vanilla/settings/backgroundimageattachment]] |<<backgroundimageattachment-dropdown>> | |
|
||||
|
||||
! Sizes
|
||||
|
||||
|
@ -1,7 +1,24 @@
|
||||
title: $:/themes/tiddlywiki/vanilla/base
|
||||
tags: [[$:/tags/Stylesheet]]
|
||||
|
||||
\define custom-background-datauri()
|
||||
<$reveal state="$:/themes/tiddlywiki/vanilla/settings/backgroundimage" type="nomatch" text="">
|
||||
<$set name="background" value={{$:/themes/tiddlywiki/vanilla/settings/backgroundimage}}>
|
||||
<$list filter="[<background>is[image]]">
|
||||
<$list filter="[<background>!has[_canonical_uri]]">
|
||||
`background: url(`<$macrocall $name="datauri" title={{$:/themes/tiddlywiki/vanilla/settings/backgroundimage}}/>`);`
|
||||
</$list>
|
||||
<$list filter="[<background>has[_canonical_uri]]">
|
||||
`background: url(`<$view tiddler={{$:/themes/tiddlywiki/vanilla/settings/backgroundimage}} field="_canonical_uri"/>`);`
|
||||
</$list>
|
||||
`background-attachment: `{{$:/themes/tiddlywiki/vanilla/settings/backgroundimageattachment}}`;`
|
||||
</$list>
|
||||
</$set>
|
||||
</$reveal>
|
||||
\end
|
||||
|
||||
\rules only filteredtranscludeinline transcludeinline macrodef macrocallinline
|
||||
|
||||
/*
|
||||
** Start with the normalize CSS reset, and then belay some of its effects
|
||||
*/
|
||||
@ -39,6 +56,7 @@ body.tc-body {
|
||||
color: <<colour foreground>>;
|
||||
background-color: <<colour page-background>>;
|
||||
word-wrap: break-word;
|
||||
<<custom-background-datauri>>
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
|
Loading…
Reference in New Issue
Block a user