mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-06-26 15:23:15 +00:00
Code Issues Releases Wiki Activity

Refactor theme tweaks as individual tiddlers

Browse Source 
The trouble with the previous approach of storing several settings in a
single data tiddler was that it made it hard to introduce new settings.
Users who already have a custom copy of the settings/metrics tiddler
wouldn’t get the default settings. The new approach uses individual
tiddlers for each setting.

This commit also introduces a new theme tweak for the cutoff width for
switching between responsive views.
This commit is contained in:
Jermolene 2014-07-06 16:55:51 +01:00
parent 241d19bef8
commit 21c137a66c
11 changed files with 43 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
editions/tw5.com/tiddlers/Release 5.0.14beta.tid
View File

@ -7,6 +7,10 @@ caption: 5.0.14-beta
//[[See GitHub for detailed change history of this release|https://github.com/Jermolene/TiddlyWiki5/compare/v5.0.13-beta...v5.0.14-beta]]//
!! Incompatible Changes
* Theme tweaks (in [[control panel|$:/ControlPanel]] under the ''Appearance'' tab) will not be upgraded from TiddlyWiki versions prior to 5.0.14-beta. You'll need to re-apply any customisations after upgrading
!! Accessibility Improvements
*

2
editions/tw5.com/tiddlers/concepts/DataTiddlers.tid
View File

@ -25,7 +25,7 @@ The tiddler dictionary format is an alternative syntax for data tiddlers:
* The ContentType field `type` is set to `application/x-tiddler-dictionary`
* The `text` field consists of one or more lines of the form `<name>:<value>`
For example, the [[metrics of the Vanilla theme|$:/themes/tiddlywiki/vanilla/metrics]] are a tiddler dictionary.
For example, palettes such as the [[default Vanilla palette|$:/palettes/Vanilla]] are tiddler dictionaries.
! Accessing data within data tiddlers

2
themes/tiddlywiki/centralised/styles.tid
View File

@ -3,7 +3,7 @@ tags: [[$:/tags/stylesheet]]
\rules only filteredtranscludeinline transcludeinline macrodef macrocallinline
@media (min-width: 770px) {
@media (min-width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}) {
html .tw-page-container {
text-align: center;

2
themes/tiddlywiki/seamless/base.tid
View File

@ -59,7 +59,7 @@ Rules copied from Snow White
Seamless modifications
*/
@media (min-width: {{$:/themes/tiddlywiki/vanilla/metrics##storywidth}}) {
@media (min-width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}) {
/* Drop the tiddler frame padding */
body.tw-body .tw-tiddler-frame {

2
themes/tiddlywiki/snowwhite/base.tid
View File

@ -17,7 +17,7 @@ tags: [[$:/tags/stylesheet]]
}
}
@media (max-width: 770px) {
@media (max-width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}) {
.tw-tiddler-frame {
<<box-shadow none>>
}

20
themes/tiddlywiki/vanilla/ThemeTweaks.tid
View File

@ -4,19 +4,17 @@ caption: Theme Tweaks
You can tweak certain aspects of the ''Vanilla'' theme.
//Take care to preserve any backticks (&#96;) in the settings//
! Settings
* Font family: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/settings" index="fontfamily" default="" tag="input"/>
* Font family: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/settings/fontfamily" default="" tag="input"/>
! Sizes
* Font size: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics" index="fontsize" default="" tag="input"/>
* Line height: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics" index="lineheight" default="" tag="input"/>
* Story left position //(the distance between the left of the screen and the left margin of the story river or tiddler area)//: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics" index="storyleft" default="" tag="input"/>
* Story top position //(the distance between the top of the screen ad the top margin of the story river or tiddler area)//: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics" index="storytop" default="" tag="input"/>
* Story right //(the distance between the left side of the screen and the left margin of the sidebar area)//: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics" index="storyright" default="" tag="input"/>
* Story width //(the width of the story river or tiddler area)//: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics" index="storywidth" default="" tag="input"/>
* Tiddler width //(the width of individual tiddlers -- used for zoomin storyview)//: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics" index="tiddlerwidth" default="" tag="input"/>
* Font size: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/fontsize" default="" tag="input"/>
* Line height: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/lineheight" default="" tag="input"/>
* Story left position //(the distance between the left of the screen and the left margin of the story river or tiddler area)//: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/storyleft" default="" tag="input"/>
* Story top position //(the distance between the top of the screen ad the top margin of the story river or tiddler area)//: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/storytop" default="" tag="input"/>
* Story right //(the distance between the left side of the screen and the left margin of the sidebar area)//: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/storyright" default="" tag="input"/>
* Story width //(the width of the story river or tiddler area)//: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/storywidth" default="" tag="input"/>
* Tiddler width //(the width of individual tiddlers -- used for zoomin storyview)//: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/tiddlerwidth" default="" tag="input"/>
* Sidebar breakpoint //(the minimum width for the sidebar to be displayed above the story river)//: <$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint" default="" tag="input"/>

26
themes/tiddlywiki/vanilla/base.tid
View File

@ -23,7 +23,7 @@ html button {
*/
html {
font-family: {{$:/themes/tiddlywiki/vanilla/settings##fontfamily}};
font-family: {{$:/themes/tiddlywiki/vanilla/settings/fontfamily}};
text-rendering: optimizeLegibility; /* Enables kerning and ligatures etc. */
}
@ -32,8 +32,8 @@ html:-webkit-full-screen {
}
body.tw-body {
font-size: {{$:/themes/tiddlywiki/vanilla/metrics##fontsize}};
line-height: {{$:/themes/tiddlywiki/vanilla/metrics##lineheight}};
font-size: {{$:/themes/tiddlywiki/vanilla/metrics/fontsize}};
line-height: {{$:/themes/tiddlywiki/vanilla/metrics/lineheight}};
color: <<colour foreground>>;
background-color: <<colour page-background>>;
word-wrap: break-word;
@ -434,7 +434,7 @@ a.tw-tiddlylink-external:hover {
min-height: 100%;
}
@media (max-width: {{$:/themes/tiddlywiki/vanilla/metrics##storywidth}}) {
@media (max-width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}) {
.sidebar-header {
padding: 14px;
@ -447,7 +447,7 @@ a.tw-tiddlylink-external:hover {
}
}
@media (min-width: {{$:/themes/tiddlywiki/vanilla/metrics##storywidth}}) {
@media (min-width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}) {
.tw-message-box {
margin: 21px -21px 21px -21px;
@ -455,8 +455,8 @@ a.tw-tiddlylink-external:hover {
.tw-sidebar-scrollable {
position: fixed;
top: {{$:/themes/tiddlywiki/vanilla/metrics##storytop}};
left: {{$:/themes/tiddlywiki/vanilla/metrics##storyright}};
top: {{$:/themes/tiddlywiki/vanilla/metrics/storytop}};
left: {{$:/themes/tiddlywiki/vanilla/metrics/storyright}};
bottom: 0;
right: 0;
overflow-y: auto;
@ -468,9 +468,9 @@ a.tw-tiddlylink-external:hover {
.story-river {
position: relative;
left: {{$:/themes/tiddlywiki/vanilla/metrics##storyleft}};
top: {{$:/themes/tiddlywiki/vanilla/metrics##storytop}};
width: {{$:/themes/tiddlywiki/vanilla/metrics##storywidth}};
left: {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}};
top: {{$:/themes/tiddlywiki/vanilla/metrics/storytop}};
width: {{$:/themes/tiddlywiki/vanilla/metrics/storywidth}};
padding: 42px 42px 42px 42px;
}
@ -537,7 +537,7 @@ a.tw-tiddlylink-external:hover {
.tw-view-field-value {
}
@media (max-width: 770px) {
@media (max-width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}) {
.tw-tiddler-frame {
padding: 14px 14px 14px 14px;
}
@ -547,10 +547,10 @@ a.tw-tiddlylink-external:hover {
}
}
@media (min-width: 770px) {
@media (min-width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}) {
.tw-tiddler-frame {
padding: 28px 42px 42px 42px;
width: {{$:/themes/tiddlywiki/vanilla/metrics##tiddlerwidth}};
width: {{$:/themes/tiddlywiki/vanilla/metrics/tiddlerwidth}};
}
<<if-no-sidebar "

10
themes/tiddlywiki/vanilla/metrics.multids Normal file
View File

@ -0,0 +1,10 @@
title: $:/themes/tiddlywiki/vanilla/metrics/
fontsize: 14px
lineheight: 20px
storyleft: 0px
storytop: 0px
storyright: 770px
storywidth: 770px
tiddlerwidth: 686px
sidebarbreakpoint: 960px

10
themes/tiddlywiki/vanilla/metrics.tid
View File

@ -1,10 +0,0 @@
title: $:/themes/tiddlywiki/vanilla/metrics
type: application/x-tiddler-dictionary
fontsize: `14px`
lineheight: `20px`
storyleft: `0px`
storytop: `0px`
storyright: `770px`
storywidth: `770px`
tiddlerwidth: `686px`

3
themes/tiddlywiki/vanilla/settings.multids Normal file
View File

@ -0,0 +1,3 @@
title: $:/themes/tiddlywiki/vanilla/settings/
fontfamily: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif

4
themes/tiddlywiki/vanilla/settings.tid
View File

@ -1,4 +0,0 @@
title: $:/themes/tiddlywiki/vanilla/settings
type: application/x-tiddler-dictionary
fontfamily: `"Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif`