mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2025-01-11 09:50:27 +00:00
parent
8b10994cfe
commit
f8b9471549
@ -19,7 +19,7 @@ type: text/vnd.tiddlywiki-html
|
||||
{{$:/core/ui/PageStylesheet||$:/core/templates/wikified-tiddler}}
|
||||
</style>
|
||||
</head>
|
||||
<body class="tw-body">
|
||||
<body class="tc-body">
|
||||
{{$:/StaticBanner||$:/core/templates/html-tiddler}}
|
||||
<section class="tc-story-river">
|
||||
{{$:/core/templates/alltiddlers.content||$:/core/templates/html-tiddler}}
|
||||
|
@ -19,7 +19,7 @@ type: text/vnd.tiddlywiki-html
|
||||
{{$:/core/ui/PageStylesheet||$:/core/templates/wikified-tiddler}}
|
||||
</style>
|
||||
</head>
|
||||
<body class="tw-body">
|
||||
<body class="tc-body">
|
||||
{{$:/StaticBanner||$:/core/templates/html-tiddler}}
|
||||
{{$:/core/ui/PageTemplate||$:/core/templates/html-tiddler}}
|
||||
</body>
|
||||
|
@ -12,7 +12,7 @@ title: $:/core/templates/static.tiddler.html
|
||||
<link rel="stylesheet" href="static.css">
|
||||
<title>`{{$:/core/wiki/title}}`</title>
|
||||
</head>
|
||||
<body class="tw-body">
|
||||
<body class="tc-body">
|
||||
`{{$:/StaticBanner||$:/core/templates/html-tiddler}}`
|
||||
<section class="tc-story-river">
|
||||
`<$importvariables filter="[[$:/core/ui/PageMacros]] [all[shadows+tiddlers]tag[$:/tags/Macro]!has[draft.of]]">
|
||||
|
@ -21,7 +21,7 @@ title: $:/core/templates/tiddlywiki5.html
|
||||
<!--~~ Raw markup ~~-->
|
||||
{{{ [all[shadows+tiddlers]tag[$:/core/wiki/rawmarkup]] [all[shadows+tiddlers]tag[$:/tags/RawMarkup]] ||$:/core/templates/plain-text-tiddler}}}
|
||||
</head>
|
||||
<body class="tw-body">
|
||||
<body class="tc-body">
|
||||
<!--~~ Static styles ~~-->
|
||||
<div id="styleArea">
|
||||
{{$:/boot/boot.css||$:/core/templates/css-tiddler}}
|
||||
|
@ -9,14 +9,14 @@ The usual way of modifying the appearance of a TiddlyWiki is to use one of the a
|
||||
You can also use custom CSS stylesheets by tagging tiddlers with `$:/tags/stylesheet`. For example, create a tiddler with the tag `$:/tags/stylesheet` and the following content in order to change the page background colour to red:
|
||||
|
||||
```
|
||||
html body.tw-body {
|
||||
html body.tc-body {
|
||||
background: red;
|
||||
}
|
||||
```
|
||||
|
||||
! Overriding Theme Settings
|
||||
|
||||
Note that custom stylesheets are applied independently to the theme stylesheets. This means that it is frequently necessary to use CSS specificity to reliably override settings within the theme. This means ensuring that the CSS rule in your custom stylesheet is more specific than the theme rule that you are overriding. "More specific" generally means using more CSS rules. So, `html body.tw-body` is more specific than `body.tw-body`.
|
||||
Note that custom stylesheets are applied independently to the theme stylesheets. This means that it is frequently necessary to use CSS specificity to reliably override settings within the theme. This means ensuring that the CSS rule in your custom stylesheet is more specific than the theme rule that you are overriding. "More specific" generally means using more CSS rules. So, `html body.tc-body` is more specific than `body.tc-body`.
|
||||
|
||||
! Stylesheet Types
|
||||
|
||||
@ -27,7 +27,7 @@ If you wish to use macros and transclusions in your stylesheets you should inste
|
||||
```
|
||||
\rules only filteredtranscludeinline transcludeinline macrodef macrocallinline
|
||||
|
||||
body.tw-body pre {
|
||||
body.tc-body pre {
|
||||
<<box-shadow "inset 0 1px 0 #fff">>
|
||||
}
|
||||
```
|
||||
|
@ -62,29 +62,29 @@ Seamless modifications
|
||||
@media (min-width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}) {
|
||||
|
||||
/* Drop the tiddler frame padding */
|
||||
body.tw-body .tc-tiddler-frame {
|
||||
body.tc-body .tc-tiddler-frame {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* Move the sidebar up so that the title lines up */
|
||||
body.tw-body .tw-sidebar-scrollable {
|
||||
body.tc-body .tw-sidebar-scrollable {
|
||||
padding: 43px 0 28px 42px;
|
||||
}
|
||||
|
||||
/* Stop the tiddler info panel from bleeding into the tiddler frame padding */
|
||||
body.tw-body .tc-tiddler-info {
|
||||
body.tc-body .tc-tiddler-info {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Stop message boxes from bleeding into the tiddler frame padding */
|
||||
body.tw-body .tw-message-box {
|
||||
body.tc-body .tw-message-box {
|
||||
margin: 21px 0 21px 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* Use the tiddler background colour for the page background */
|
||||
html body.tw-body {
|
||||
html body.tc-body {
|
||||
background-color: <<colour background>>;
|
||||
}
|
||||
|
||||
@ -93,11 +93,11 @@ html:-webkit-full-screen {
|
||||
}
|
||||
|
||||
/* Adjust the colour of the page controls */
|
||||
body.tw-body .tw-page-controls svg {
|
||||
body.tc-body .tw-page-controls svg {
|
||||
fill: <<colour muted-foreground>>;
|
||||
}
|
||||
|
||||
/* Adjust the colour of the sidebar selected tabs */
|
||||
body.tw-body .tw-sidebar-lists .tw-tab-buttons button.tw-tab-selected {
|
||||
body.tc-body .tw-sidebar-lists .tw-tab-buttons button.tw-tab-selected {
|
||||
background-color: <<colour background>>;
|
||||
}
|
||||
|
@ -31,7 +31,7 @@ html:-webkit-full-screen {
|
||||
background-color: <<colour page-background>>;
|
||||
}
|
||||
|
||||
body.tw-body {
|
||||
body.tc-body {
|
||||
font-size: {{$:/themes/tiddlywiki/vanilla/metrics/fontsize}};
|
||||
line-height: {{$:/themes/tiddlywiki/vanilla/metrics/lineheight}};
|
||||
color: <<colour foreground>>;
|
||||
@ -503,7 +503,7 @@ button.tw-tag-label, span.tw-tag-label {
|
||||
|
||||
@media print {
|
||||
|
||||
body.tw-body {
|
||||
body.tc-body {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user