1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-12-12 11:10:27 +00:00
TiddlyWiki5/themes/tiddlywiki/vanilla/base.tid

3315 lines
61 KiB
Plaintext
Raw Normal View History

title: $:/themes/tiddlywiki/vanilla/base
tags: [[$:/tags/Stylesheet]]
list-before:
code-body: yes
\define custom-background-datauri()
<$set name="background" value={{$:/themes/tiddlywiki/vanilla/settings/backgroundimage}}>
<$list filter="[<background>is[image]]">
`background: url(`
<$list filter="[<background>!has[_canonical_uri]]">
`"`<$macrocall $name="datauri" title={{$:/themes/tiddlywiki/vanilla/settings/backgroundimage}}/>`"`
</$list>
<$list filter="[<background>has[_canonical_uri]]">
`"`<$view tiddler={{$:/themes/tiddlywiki/vanilla/settings/backgroundimage}} field="_canonical_uri"/>`"`
</$list>
`) center center;`
`background-attachment: `{{$:/themes/tiddlywiki/vanilla/settings/backgroundimageattachment}}`;
-webkit-background-size:` {{$:/themes/tiddlywiki/vanilla/settings/backgroundimagesize}}`;
-moz-background-size:` {{$:/themes/tiddlywiki/vanilla/settings/backgroundimagesize}}`;
-o-background-size:` {{$:/themes/tiddlywiki/vanilla/settings/backgroundimagesize}}`;
background-size:` {{$:/themes/tiddlywiki/vanilla/settings/backgroundimagesize}}`;`
</$list>
</$set>
\end
\define sidebarbreakpoint()
<$text text={{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}/>
\end
\define sidebarbreakpoint-minus-one()
<$text text={{{ [{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}removesuffix[px]subtract[1]addsuffix[px]] ~[{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}] }}}/>
\end
\define if-fluid-fixed(text,hiddenSidebarText)
<$reveal state="$:/themes/tiddlywiki/vanilla/options/sidebarlayout" type="match" text="fluid-fixed">
$text$
<$reveal state="$:/state/sidebar" type="nomatch" text="yes" default="yes">
$hiddenSidebarText$
</$reveal>
</$reveal>
\end
\define if-editor-height-fixed(then,else)
<$reveal state="$:/config/TextEditor/EditorHeight/Mode" type="match" text="fixed">
$then$
</$reveal>
<$reveal state="$:/config/TextEditor/EditorHeight/Mode" type="match" text="auto">
$else$
</$reveal>
\end
\define set-type-selector-min-width()
<$set name="typeLength" value={{{ [all[shadows+tiddlers]prefix[$:/language/Docs/Types/]get[name]length[]maxall[]] }}}>
.tc-type-selector-dropdown-wrapper {
min-width: calc(<<typeLength>>ch + 4em);
}
.tc-type-selector-dropdown-wrapper input.tc-edit-typeeditor {
min-width: <<typeLength>>ch;
}
</$set>
\end
\rules only filteredtranscludeinline transcludeinline macrodef macrocallinline macrocallblock
/*
** Start with the normalize CSS reset, and then belay some of its effects
*/
{{$:/themes/tiddlywiki/vanilla/reset}}
*, input[type="search"] {
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
/*
** Button default styles. Makes them look consistent for all browsers
*/
html button {
line-height: 1.2;
color: <<colour button-foreground>>;
fill: <<colour button-foreground>>;
background: <<colour button-background>>;
border-color: <<colour button-border>>;
}
button:disabled svg {
fill: <<colour muted-foreground>>;
}
/*
** Basic element styles
*/
html, body {
font-family: {{$:/themes/tiddlywiki/vanilla/settings/fontfamily}};
text-rendering: optimizeLegibility; /* Enables kerning and ligatures etc. */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
2014-04-14 20:30:42 +00:00
html:-webkit-full-screen {
background-color: <<colour page-background>>;
}
body.tc-body {
font-size: {{$:/themes/tiddlywiki/vanilla/metrics/fontsize}};
line-height: {{$:/themes/tiddlywiki/vanilla/metrics/lineheight}};
word-wrap: break-word;
<<custom-background-datauri>>
color: <<colour foreground>>;
background-color: <<colour page-background>>;
fill: <<colour foreground>>;
}
<<if-background-attachment """
body.tc-body {
2021-05-19 13:12:12 +00:00
background-color: transparent;
}
""">>
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
}
h1, h2, h3, h4, h5, h6 {
line-height: 1.2;
font-weight: normal;
}
pre {
display: block;
2014-03-11 08:29:11 +00:00
margin-top: 1em;
margin-bottom: 1em;
word-break: normal;
word-wrap: break-word;
white-space: {{$:/themes/tiddlywiki/vanilla/options/codewrapping}};
background-color: <<colour pre-background>>;
border: 1px solid <<colour pre-border>>;
padding: 0 3px 2px;
border-radius: 3px;
font-family: {{$:/themes/tiddlywiki/vanilla/settings/codefontfamily}};
}
code {
color: <<colour code-foreground>>;
background-color: <<colour code-background>>;
border: 1px solid <<colour code-border>>;
white-space: {{$:/themes/tiddlywiki/vanilla/options/codewrapping}};
padding: 0 3px 2px;
border-radius: 3px;
font-family: {{$:/themes/tiddlywiki/vanilla/settings/codefontfamily}};
}
2013-12-05 16:20:37 +00:00
blockquote {
border-left: 5px solid <<colour blockquote-bar>>;
2013-12-05 16:20:37 +00:00
margin-left: 25px;
padding-left: 10px;
2017-04-17 16:53:19 +00:00
quotes: "\201C""\201D""\2018""\2019";
}
blockquote > div {
margin-top: 1em;
margin-bottom: 1em;
}
2017-04-17 16:53:19 +00:00
blockquote.tc-big-quote {
font-family: Georgia, serif;
position: relative;
background: <<colour pre-background>>;
border-left: none;
margin-left: 50px;
margin-right: 50px;
padding: 10px;
2021-05-19 13:12:12 +00:00
border-radius: 8px;
2017-04-17 16:53:19 +00:00
}
blockquote.tc-big-quote cite:before {
content: "\2014 \2009";
}
blockquote.tc-big-quote:before {
font-family: Georgia, serif;
color: <<colour blockquote-bar>>;
content: open-quote;
font-size: 8em;
line-height: 0.1em;
margin-right: 0.25em;
vertical-align: -0.4em;
position: absolute;
2021-05-19 13:12:12 +00:00
left: -50px;
top: 42px;
2017-04-17 16:53:19 +00:00
}
blockquote.tc-big-quote:after {
font-family: Georgia, serif;
color: <<colour blockquote-bar>>;
content: close-quote;
font-size: 8em;
line-height: 0.1em;
margin-right: 0.25em;
vertical-align: -0.4em;
position: absolute;
2021-05-19 13:12:12 +00:00
right: -80px;
bottom: -20px;
2013-12-05 16:20:37 +00:00
}
2013-12-11 13:12:56 +00:00
dl dt {
font-weight: bold;
margin-top: 6px;
}
textarea,
input[type=text],
2015-04-28 08:12:04 +00:00
input[type=search],
input[type=""],
input:not([type]) {
color: <<colour foreground>>;
background: <<colour background>>;
}
input[type="checkbox"] {
2021-05-19 13:12:12 +00:00
vertical-align: middle;
}
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
-webkit-appearance:none;
}
.tc-muted {
2014-07-31 08:28:46 +00:00
color: <<colour muted-foreground>>;
2015-04-28 08:12:04 +00:00
}
svg.tc-image-button {
padding: 0px 1px 1px 0px;
}
.tc-icon-wrapper > svg {
width: 1em;
height: 1em;
}
2015-05-14 09:16:29 +00:00
kbd {
display: inline-block;
padding: 3px 5px;
font-size: 0.8em;
line-height: 1.2;
color: <<colour foreground>>;
vertical-align: middle;
background-color: <<colour background>>;
border: solid 1px <<colour muted-foreground>>;
border-bottom-color: <<colour muted-foreground>>;
border-radius: 3px;
box-shadow: inset 0 -1px 0 <<colour muted-foreground>>;
}
::selection {
background-color: Highlight;
color: HighlightText;
background-color: <<colour selection-background>>;
color: <<colour selection-foreground>>;
}
.tc-inline-style {
background: <<colour highlight-background>>;
color: <<colour highlight-foreground>>;
}
form.tc-form-inline {
display: inline;
}
/*
Markdown likes putting code elements inside pre elements
*/
pre > code {
padding: 0;
border: none;
background-color: inherit;
color: inherit;
}
/*
Table defaults
*/
table {
border: 1px solid <<colour table-border>>;
width: auto;
max-width: 100%;
caption-side: bottom;
2014-03-11 08:29:11 +00:00
margin-top: 1em;
margin-bottom: 1em;
/* next 2 elements needed, since normalize 8.0.1 */
border-collapse: collapse;
border-spacing: 0;
}
table th, table td {
padding: 0 7px 0 7px;
border-top: 1px solid <<colour table-border>>;
border-left: 1px solid <<colour table-border>>;
}
table thead tr td, table th {
background-color: <<colour table-header-background>>;
font-weight: bold;
}
table tfoot tr td {
background-color: <<colour table-footer-background>>;
}
/*
Table utility classes
*/
/* Remove borders from table as used in eg: GettingStarted*/
.tc-table-no-border,
.tc-table-no-border th,
.tc-table-no-border td {
border: initial;
}
/* First column in table width will fit to text.*/
/* This rule makes most sense with tc-first-link-nowrap*/
.tc-first-col-min-width td:nth-child(1) {
width: 1%;
}
/*
** Utility classes work well with tables but also for other containers
*/
/* First link A element will not wrap */
.tc-first-link-nowrap:first-of-type a {
white-space: nowrap;
}
/* Move the table to the center of the container */
.tc-center {
margin-left: auto;
margin-right: auto;
}
.tc-max-width {
width: 100%;
}
.tc-max-width-80 {
max-width: 80%;
}
/* Allow input and textarea to look like the ControlPanel inputs */
.tc-edit-max-width input,
.tc-edit-max-width textarea {
width: 100%;
padding: 3px;
}
/* Labeled text input, where input is max width */
.tc-labeled-input-wrapper {
display: flex;
padding: 6px 0;
}
.tc-align-right {
text-align: right;
}
.tc-fixed-label {
flex: auto;
}
.tc-fluid-input {
flex: 20;
}
/*
CSV parser plugin
*/
.tc-csv-table {
2014-03-31 11:41:02 +00:00
white-space: nowrap;
}
2022-11-20 17:51:01 +00:00
.tc-csv-table th,
.tc-csv-table td {
white-space: pre-line;
}
/*
Tiddler frame in story river
*/
.tc-tiddler-frame img,
.tc-tiddler-frame svg,
.tc-tiddler-frame canvas,
.tc-tiddler-frame embed,
.tc-tiddler-frame iframe {
max-width: 100%;
}
.tc-tiddler-body > embed,
.tc-tiddler-body > iframe {
width: 100%;
height: 600px;
}
:root {
color-scheme: {{{ [{$:/palette}get[color-scheme]] ~light }}};
}
/*
** Links
*/
button.tc-tiddlylink,
a.tc-tiddlylink {
text-decoration: none;
font-weight: 500;
color: <<colour tiddler-link-foreground>>;
-webkit-user-select: inherit; /* Otherwise the draggable attribute makes links impossible to select */
-webkit-touch-callout: none; /* Prevents long presses from bringing up a link preview */
}
2014-08-28 18:41:29 +00:00
.tc-sidebar-lists a.tc-tiddlylink {
color: <<colour sidebar-tiddler-link-foreground>>;
}
2014-08-28 18:41:29 +00:00
.tc-sidebar-lists a.tc-tiddlylink:hover {
color: <<colour sidebar-tiddler-link-foreground-hover>>;
}
button.tc-tiddlylink:hover,
a.tc-tiddlylink:hover {
text-decoration: underline;
}
a.tc-tiddlylink-resolves {
}
a.tc-tiddlylink-shadow {
font-weight: bold;
}
a.tc-tiddlylink-shadow.tc-tiddlylink-resolves {
font-weight: normal;
}
a.tc-tiddlylink-missing {
font-style: italic;
}
a.tc-tiddlylink-external {
text-decoration: underline;
color: <<colour external-link-foreground>>;
background-color: <<colour external-link-background>>;
}
a.tc-tiddlylink-external:visited {
color: <<colour external-link-foreground-visited>>;
background-color: <<colour external-link-background-visited>>;
}
a.tc-tiddlylink-external:hover {
color: <<colour external-link-foreground-hover>>;
background-color: <<colour external-link-background-hover>>;
}
.tc-drop-down a.tc-tiddlylink:hover {
color: <<colour tiddler-link-background>>;
}
/*
** Drag and drop styles
*/
.tc-tiddler-dragger {
position: relative;
z-index: -10000;
}
.tc-tiddler-dragger-inner {
position: absolute;
top: -1000px;
left: -1000px;
display: inline-block;
padding: 8px 20px;
font-size: 16.9px;
font-weight: bold;
line-height: 20px;
color: <<colour dragger-foreground>>;
text-shadow: 0 1px 0 rgba(0, 0, 0, 1);
white-space: nowrap;
vertical-align: baseline;
background-color: <<colour dragger-background>>;
border-radius: 20px;
}
.tc-tiddler-dragger-cover {
position: absolute;
background-color: <<colour page-background>>;
}
.tc-page-container > .tc-dropzone {
min-height: 100vh;
}
.tc-dropzone {
position: relative;
}
.tc-dropzone.tc-dragover:before {
z-index: 10000;
display: block;
position: fixed;
top: 0;
left: 0;
right: 0;
background: <<colour dropzone-background>>;
text-align: center;
content: "<<lingo DropMessage>>";
}
.tc-droppable > .tc-droppable-placeholder {
display: none;
}
.tc-droppable.tc-dragover > .tc-droppable-placeholder {
display: block;
border: 2px dashed <<colour dropzone-background>>;
}
.tc-draggable {
cursor: move;
}
.tc-sidebar-tab-open .tc-droppable-placeholder, .tc-tagged-draggable-list .tc-droppable-placeholder,
.tc-links-draggable-list .tc-droppable-placeholder {
line-height: 2em;
height: 2em;
}
.tc-sidebar-tab-open-item {
position: relative;
}
.tc-sidebar-tab-open .tc-btn-invisible.tc-btn-mini svg {
font-size: 0.7em;
fill: <<colour muted-foreground>>;
}
/*
** Plugin reload warning
*/
.tc-plugin-reload-warning {
z-index: 1000;
display: block;
position: fixed;
top: 0;
left: 0;
right: 0;
background: <<colour alert-background>>;
text-align: center;
}
/*
** Buttons
*/
button svg, button img, label svg, label img {
vertical-align: middle;
}
.tc-btn-invisible {
padding: 0;
margin: 0;
background: none;
border: none;
cursor: pointer;
color: <<colour foreground>>;
fill: <<colour foreground>>;
}
button:disabled.tc-btn-invisible {
cursor: default;
color: <<colour muted-foreground>>;
}
.tc-btn-boxed {
font-size: 0.6em;
padding: 0.2em;
margin: 1px;
background: none;
border: 1px solid <<colour tiddler-controls-foreground>>;
border-radius: 0.25em;
}
html body.tc-body .tc-btn-boxed svg {
font-size: 1.6666em;
}
.tc-btn-boxed:hover {
2015-07-02 15:59:35 +00:00
background: <<colour muted-foreground>>;
color: <<colour background>>;
}
html body.tc-body .tc-btn-boxed:hover svg {
2015-07-02 15:59:35 +00:00
fill: <<colour background>>;
}
.tc-btn-rounded {
2015-07-02 15:59:35 +00:00
font-size: 0.5em;
line-height: 2;
padding: 0em 0.3em 0.2em 0.4em;
margin: 1px;
2015-07-02 15:59:35 +00:00
border: 1px solid <<colour muted-foreground>>;
background: <<colour muted-foreground>>;
color: <<colour background>>;
border-radius: 2em;
}
html body.tc-body .tc-btn-rounded svg {
font-size: 1.6666em;
2015-07-02 15:59:35 +00:00
fill: <<colour background>>;
}
.tc-btn-rounded:hover {
2015-07-02 15:59:35 +00:00
border: 1px solid <<colour muted-foreground>>;
background: <<colour background>>;
2015-07-02 15:59:35 +00:00
color: <<colour muted-foreground>>;
}
html body.tc-body .tc-btn-rounded:hover svg {
2015-07-02 15:59:35 +00:00
fill: <<colour muted-foreground>>;
}
.tc-btn-icon svg {
height: 1em;
width: 1em;
fill: <<colour muted-foreground>>;
}
.tc-btn-text {
margin-left: 7px;
}
/* used for documentation "fake" buttons */
.tc-btn-standard {
line-height: 1.8;
color: #667;
background-color: #e0e0e0;
border: 1px solid #888;
padding: 2px 1px 2px 1px;
margin: 1px 4px 1px 4px;
}
.tc-btn-big-green {
display: inline-block;
padding: 8px;
2013-12-05 16:20:37 +00:00
margin: 4px 8px 4px 8px;
background: <<colour download-background>>;
color: <<colour download-foreground>>;
fill: <<colour download-foreground>>;
border: none;
border-radius: 2px;
font-size: 1.2em;
line-height: 1.4em;
2015-03-25 08:38:06 +00:00
text-decoration: none;
}
.tc-btn-big-green svg,
.tc-btn-big-green img {
height: 2em;
width: 2em;
2015-03-25 08:38:06 +00:00
vertical-align: middle;
fill: <<colour download-foreground>>;
}
.tc-primary-btn {
2021-05-19 13:12:12 +00:00
background: <<colour primary>>;
}
2014-08-28 18:41:29 +00:00
.tc-sidebar-lists input {
2014-03-25 21:53:18 +00:00
color: <<colour foreground>>;
}
2014-08-28 18:41:29 +00:00
.tc-sidebar-lists button {
color: <<colour sidebar-button-foreground>>;
2014-08-02 11:16:14 +00:00
fill: <<colour sidebar-button-foreground>>;
}
2014-08-28 18:41:29 +00:00
.tc-sidebar-lists button.tc-btn-mini {
color: <<colour sidebar-muted-foreground>>;
}
2014-08-28 18:41:29 +00:00
.tc-sidebar-lists button.tc-btn-mini:hover {
color: <<colour sidebar-muted-foreground-hover>>;
}
.tc-sidebar-lists button small {
color: <<colour foreground>>;
}
button svg.tc-image-button, button .tc-image-button img {
height: 1em;
2014-07-28 10:29:06 +00:00
width: 1em;
}
2015-09-18 16:29:52 +00:00
.tc-unfold-banner {
position: absolute;
2015-09-18 16:29:52 +00:00
padding: 0;
margin: 0;
background: none;
border: none;
width: 100%;
2016-04-29 16:02:05 +00:00
width: calc(100% + 2px);
margin-left: -43px;
2015-09-18 16:29:52 +00:00
text-align: center;
border-top: 2px solid <<colour tiddler-info-background>>;
margin-top: 4px;
2015-09-18 16:29:52 +00:00
}
.tc-unfold-banner:hover {
background: <<colour tiddler-info-background>>;
border-top: 2px solid <<colour tiddler-info-border>>;
2015-09-18 16:29:52 +00:00
}
.tc-unfold-banner svg, .tc-fold-banner svg {
2015-09-18 16:29:52 +00:00
height: 0.75em;
fill: <<colour tiddler-controls-foreground>>;
}
.tc-unfold-banner:hover svg, .tc-fold-banner:hover svg {
2015-09-18 16:29:52 +00:00
fill: <<colour tiddler-controls-foreground-hover>>;
}
.tc-fold-banner {
position: absolute;
padding: 0;
margin: 0;
background: none;
border: none;
width: 23px;
text-align: center;
margin-left: -35px;
2016-04-29 16:02:05 +00:00
top: 6px;
bottom: 6px;
}
.tc-fold-banner:hover {
background: <<colour tiddler-info-background>>;
}
@media (max-width: <<sidebarbreakpoint-minus-one>>) {
.tc-unfold-banner {
position: static;
2016-04-29 16:02:05 +00:00
width: calc(100% + 59px);
}
.tc-fold-banner {
width: 16px;
margin-left: -16px;
2016-04-29 16:02:05 +00:00
font-size: 0.75em;
}
}
/*
** Tags and missing tiddlers
*/
2014-08-28 18:41:29 +00:00
.tc-tag-list-item {
position: relative;
display: inline-block;
}
2014-08-28 18:41:29 +00:00
.tc-tags-wrapper {
margin: 4px 0 14px 0;
}
.tc-tags-wrapper .tc-tag-list-item {
margin-right: 7px;
}
2014-08-28 18:41:29 +00:00
.tc-missing-tiddler-label {
font-style: italic;
font-weight: normal;
display: inline-block;
font-size: 11.844px;
line-height: 14px;
white-space: nowrap;
vertical-align: baseline;
}
.tc-block-tags-dropdown > .tc-btn-invisible:hover {
background-color: <<colour primary>>;
}
2014-08-28 18:41:29 +00:00
button.tc-tag-label, span.tc-tag-label {
display: inline-block;
2014-11-02 21:22:45 +00:00
padding: 0.16em 0.7em;
font-size: 0.9em;
font-weight: normal;
line-height: 1.2em;
color: <<colour tag-foreground>>;
white-space: break-spaces;
vertical-align: baseline;
background-color: <<colour tag-background>>;
border-radius: 1em;
}
.tc-sidebar-scrollable .tc-tag-label {
text-shadow: none;
}
.tc-untagged-separator {
border: 0;
height: 1px;
background: <<colour tab-divider>>;
}
button.tc-untagged-label {
background-color: <<colour untagged-background>>;
}
2014-08-28 18:41:29 +00:00
.tc-tag-label svg, .tc-tag-label img {
height: 1em;
width: 1em;
2021-05-19 13:12:12 +00:00
margin-right: 3px;
margin-bottom: 1px;
vertical-align: bottom;
}
.tc-edit-tags button.tc-remove-tag-button svg {
font-size: 0.7em;
vertical-align: middle;
}
.tc-tag-manager-table .tc-tag-label {
}
.tc-tag-manager-tag {
width: 100%;
}
button.tc-btn-invisible.tc-remove-tag-button {
outline: none;
}
.tc-tag-button-selected,
.tc-list-item-selected a.tc-tiddlylink, a.tc-list-item-selected {
background-color: <<colour primary>>;
color: <<colour tiddler-background>>;
}
/*
** Page layout
*/
2014-08-28 18:41:29 +00:00
.tc-topbar {
2014-03-25 21:54:06 +00:00
position: fixed;
z-index: 1200;
}
2014-08-28 18:41:29 +00:00
.tc-topbar-left {
left: 29px;
top: 5px;
2014-03-25 21:54:06 +00:00
}
2014-08-28 18:41:29 +00:00
.tc-topbar-right {
top: 5px;
right: 29px;
2014-03-25 21:54:06 +00:00
}
2020-11-20 14:00:56 +00:00
@media (max-width: <<sidebarbreakpoint-minus-one>>) {
.tc-topbar-right {
right: 10px;
}
}
2014-08-28 18:41:29 +00:00
.tc-topbar button {
2014-03-25 21:54:06 +00:00
padding: 8px;
}
2014-08-28 18:41:29 +00:00
.tc-topbar svg {
2014-03-25 21:54:06 +00:00
fill: <<colour muted-foreground>>;
}
2014-08-28 18:41:29 +00:00
.tc-topbar button:hover svg {
2014-03-25 21:54:06 +00:00
fill: <<colour foreground>>;
}
@media (max-width: <<sidebarbreakpoint-minus-one>>) {
.tc-show-sidebar-btn svg.tc-image-chevron-left, .tc-hide-sidebar-btn svg.tc-image-chevron-right {
transform: rotate(-90deg);
}
}
.tc-sidebar-header {
color: <<colour sidebar-foreground>>;
2014-06-21 10:49:42 +00:00
fill: <<colour sidebar-foreground>>;
}
.tc-sidebar-header .tc-title a.tc-tiddlylink-resolves {
font-weight: normal;
}
2014-08-28 18:41:29 +00:00
.tc-sidebar-header .tc-sidebar-lists p {
margin-top: 3px;
margin-bottom: 3px;
}
2014-08-28 18:41:29 +00:00
.tc-sidebar-header .tc-missing-tiddler-label {
color: <<colour sidebar-foreground>>;
}
.tc-advanced-search input {
width: 60%;
}
.tc-search a svg {
2014-10-07 21:11:43 +00:00
width: 1.2em;
height: 1.2em;
vertical-align: middle;
}
2014-08-28 18:41:29 +00:00
.tc-page-controls {
margin-top: 14px;
2014-07-28 10:29:06 +00:00
font-size: 1.5em;
}
.tc-page-controls .tc-drop-down {
2021-05-19 13:12:12 +00:00
font-size: 1rem;
}
2014-08-28 18:41:29 +00:00
.tc-page-controls button {
2014-07-28 10:29:06 +00:00
margin-right: 0.5em;
}
2014-08-28 18:41:29 +00:00
.tc-page-controls a.tc-tiddlylink:hover {
text-decoration: none;
}
2014-08-28 18:41:29 +00:00
.tc-page-controls img {
width: 1em;
}
.tc-page-controls svg {
fill: <<colour sidebar-controls-foreground>>;
}
.tc-page-controls button:hover svg, .tc-page-controls a:hover svg {
2014-02-23 23:09:58 +00:00
fill: <<colour sidebar-controls-foreground-hover>>;
}
.tc-sidebar-lists .tc-menu-list-item {
white-space: nowrap;
}
2014-08-28 18:41:29 +00:00
.tc-menu-list-count {
font-weight: bold;
}
2014-08-28 18:41:29 +00:00
.tc-menu-list-subitem {
padding-left: 7px;
}
.tc-story-river {
position: relative;
}
@media (max-width: <<sidebarbreakpoint-minus-one>>) {
.tc-sidebar-header {
padding: 14px;
min-height: 32px;
margin-top: {{$:/themes/tiddlywiki/vanilla/metrics/storytop}};
transition: min-height {{$:/config/AnimationDuration}}ms ease-in-out, padding-top {{$:/config/AnimationDuration}}ms ease-in-out, padding-bottom {{$:/config/AnimationDuration}}ms ease-in-out;
}
<<if-no-sidebar """
.tc-sidebar-header {
min-height: 0;
padding-top: 0;
padding-bottom: 0;
}
""">>
.tc-story-river {
position: relative;
padding: 0;
}
}
@media (min-width: <<sidebarbreakpoint>>) {
.tc-message-box {
margin: 21px -21px 21px -21px;
}
2014-08-28 18:41:29 +00:00
.tc-sidebar-scrollable {
position: fixed;
top: {{$:/themes/tiddlywiki/vanilla/metrics/storytop}};
left: {{$:/themes/tiddlywiki/vanilla/metrics/storyright}};
bottom: 0;
right: 0;
overflow-y: auto;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
margin: 0 0 0 -42px;
padding: 71px 0 28px 42px;
}
html[dir="rtl"] .tc-sidebar-scrollable {
left: auto;
right: {{$:/themes/tiddlywiki/vanilla/metrics/storyright}};
}
.tc-story-river {
position: relative;
left: {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}};
top: {{$:/themes/tiddlywiki/vanilla/metrics/storytop}};
width: {{$:/themes/tiddlywiki/vanilla/metrics/storywidth}};
padding: 42px 42px 42px 42px;
}
<<if-no-sidebar "
.tc-story-river {
2016-04-29 16:02:05 +00:00
width: calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}});
}
">>
.tc-story-river.tc-static-story-river {
margin-right: 0;
padding-right: 42px;
}
}
@media print {
2014-07-09 14:22:53 +00:00
body.tc-body {
2014-07-09 14:22:53 +00:00
background-color: transparent;
}
2014-08-28 18:41:29 +00:00
.tc-sidebar-header, .tc-topbar {
display: none;
}
.tc-story-river {
margin: 0;
padding: 0;
}
.tc-story-river .tc-tiddler-frame {
margin: 0;
border: none;
padding: 0;
}
}
/*
** Tiddler styles
*/
.tc-tiddler-frame {
position: relative;
margin-bottom: 28px;
background-color: <<colour tiddler-background>>;
border: 1px solid <<colour tiddler-border>>;
}
{{$:/themes/tiddlywiki/vanilla/sticky}}
.tc-tiddler-info {
overflow: hidden;
padding: 14px 42px 14px 42px;
background-color: <<colour tiddler-info-background>>;
border-top: 1px solid <<colour tiddler-info-border>>;
border-bottom: 1px solid <<colour tiddler-info-border>>;
}
.tc-tiddler-info p {
2014-08-02 11:16:14 +00:00
margin-top: 3px;
margin-bottom: 3px;
}
2014-08-28 18:41:29 +00:00
.tc-tiddler-info .tc-tab-buttons button.tc-tab-selected {
background-color: <<colour tiddler-info-tab-background>>;
border-bottom: 1px solid <<colour tiddler-info-tab-background>>;
}
2020-11-20 14:00:56 +00:00
@media (max-width: <<sidebarbreakpoint-minus-one>>) {
.tc-tiddler-info {
padding: 14px 14px 14px 14px;
}
}
2014-08-28 18:41:29 +00:00
.tc-view-field-table {
width: 100%;
}
2014-08-28 18:41:29 +00:00
.tc-view-field-name {
width: 1%; /* Makes this column be as narrow as possible */
white-space: nowrap;
vertical-align: top;
text-align: right;
font-style: italic;
font-weight: normal;
}
2014-08-28 18:41:29 +00:00
.tc-view-field-value {
word-break: break-all;
}
@media (max-width: <<sidebarbreakpoint-minus-one>>) {
.tc-tiddler-frame {
padding: 14px 14px 14px 14px;
2020-11-20 14:00:56 +00:00
margin-bottom: .5em;
}
.tc-tiddler-info {
margin: 0 -14px 0 -14px;
}
}
@media (min-width: <<sidebarbreakpoint>>) {
.tc-tiddler-frame {
padding: 28px 42px 42px 42px;
width: {{$:/themes/tiddlywiki/vanilla/metrics/tiddlerwidth}};
border-radius: 2px;
}
<<if-no-sidebar "
.tc-tiddler-frame {
width: 100%;
}
">>
.tc-tiddler-info {
margin: 0 -42px 0 -42px;
}
}
2014-08-28 18:41:29 +00:00
.tc-site-title,
.tc-titlebar {
font-weight: normal;
font-size: 2.35em;
line-height: 1.35em;
color: <<colour tiddler-title-foreground>>;
2014-06-15 07:37:58 +00:00
margin: 0;
}
.tc-site-title {
color: <<colour site-title-foreground>>;
}
2014-11-22 09:43:01 +00:00
.tc-tiddler-title-icon {
vertical-align: middle;
margin-right: .1em;
2014-11-22 09:43:01 +00:00
}
.tc-tiddler-title-icon svg {
width: 0.9em;
height: 0.9em;
}
2014-08-28 18:41:29 +00:00
.tc-system-title-prefix {
color: <<colour muted-foreground>>;
}
.tc-titlebar h2 {
font-size: 1em;
display: inline;
}
.tc-titlebar img {
height: 1em;
}
2014-08-28 18:41:29 +00:00
.tc-subtitle {
font-size: 0.9em;
color: <<colour tiddler-subtitle-foreground>>;
font-weight: normal;
}
.tc-subtitle .tc-tiddlylink {
margin-right: .3em;
}
.tc-tiddler-missing .tc-title {
2021-05-19 13:12:12 +00:00
font-style: italic;
font-weight: normal;
}
.tc-tiddler-frame .tc-tiddler-controls {
float: right;
padding: 3px; /* make space for outline */
}
.tc-tiddler-controls .tc-drop-down {
2014-07-28 10:29:06 +00:00
font-size: 0.6em;
}
.tc-tiddler-controls .tc-drop-down .tc-drop-down {
font-size: 1em;
}
.tc-tiddler-controls > span > button,
.tc-tiddler-controls > span > span > button,
.tc-tiddler-controls > span > span > span > button {
vertical-align: baseline;
margin-left:5px;
}
.tc-tiddler-controls button svg, .tc-tiddler-controls button img,
.tc-search button svg, .tc-search a svg {
fill: <<colour tiddler-controls-foreground>>;
}
.tc-tiddler-controls button svg, .tc-tiddler-controls button img {
height: 0.75em;
}
.tc-search button svg, .tc-search a svg {
2021-05-19 13:12:12 +00:00
height: 1.2em;
width: 1.2em;
margin: 0 0.25em;
}
.tc-tiddler-controls button.tc-selected svg,
.tc-page-controls button.tc-selected svg {
fill: <<colour tiddler-controls-foreground-selected>>;
}
.tc-tiddler-controls button.tc-btn-invisible:hover svg,
.tc-search button:hover svg, .tc-search a:hover svg {
fill: <<colour tiddler-controls-foreground-hover>>;
}
@media print {
.tc-tiddler-controls {
display: none;
}
}
.tc-tiddler-help { /* Help prompts within tiddler template */
color: <<colour muted-foreground>>;
margin-top: 14px;
}
.tc-tiddler-help a.tc-tiddlylink {
color: <<colour very-muted-foreground>>;
}
.tc-tiddler-frame .tc-edit-texteditor {
width: 100%;
margin: 4px 0 4px 0;
}
.tc-tiddler-frame input.tc-edit-texteditor,
.tc-tiddler-frame textarea.tc-edit-texteditor,
.tc-tiddler-frame iframe.tc-edit-texteditor,
.tc-tiddler-frame select.tc-edit-texteditor {
padding: 3px 3px 3px 3px;
border: 1px solid <<colour tiddler-editor-border>>;
line-height: 1.3em;
font-family: {{$:/themes/tiddlywiki/vanilla/settings/editorfontfamily}};
}
.tc-tiddler-frame input.tc-edit-texteditor,
.tc-tiddler-frame textarea.tc-edit-texteditor,
.tc-tiddler-frame iframe.tc-edit-texteditor {
-webkit-appearance: none;
}
.tc-tiddler-frame input.tc-edit-texteditor,
.tc-tiddler-frame select.tc-edit-texteditor,
.tc-tiddler-frame textarea.tc-edit-texteditor {
background-color: <<colour tiddler-editor-background>>;
}
.tc-tiddler-frame iframe.tc-edit-texteditor {
2020-11-28 21:13:18 +00:00
background-color: <<colour tiddler-background>>;
}
.tc-tiddler-frame .tc-edit-fields input.tc-edit-fieldeditor,
.tc-tiddler-frame .tc-edit-fields select.tc-edit-fieldeditor,
.tc-tiddler-frame .tc-edit-fields textarea.tc-edit-fieldeditor {
margin: 0;
padding: 2px 3px;
}
.tc-tiddler-frame .tc-binary-warning {
width: 100%;
height: 5em;
text-align: center;
padding: 3em 3em 6em 3em;
background: <<colour alert-background>>;
border: 1px solid <<colour alert-border>>;
}
2014-08-28 17:47:21 +00:00
canvas.tc-edit-bitmapeditor {
border: 6px solid <<colour tiddler-editor-border-image>>;
cursor: crosshair;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
margin-top: 6px;
margin-bottom: 6px;
}
2014-08-28 17:47:21 +00:00
.tc-edit-bitmapeditor-width {
display: block;
}
2014-08-28 17:47:21 +00:00
.tc-edit-bitmapeditor-height {
display: block;
}
.tc-tiddler-body {
clear: both;
}
.tc-tiddler-frame .tc-tiddler-body {
font-size: {{$:/themes/tiddlywiki/vanilla/metrics/bodyfontsize}};
line-height: {{$:/themes/tiddlywiki/vanilla/metrics/bodylineheight}};
}
.tc-titlebar, .tc-tiddler-edit-title {
overflow: hidden; /* https://github.com/Jermolene/TiddlyWiki5/issues/282 */
}
html body.tc-body.tc-single-tiddler-window {
margin: 1em;
background: <<colour tiddler-background>>;
}
.tc-single-tiddler-window img,
.tc-single-tiddler-window svg,
.tc-single-tiddler-window canvas,
.tc-single-tiddler-window embed,
.tc-single-tiddler-window iframe {
max-width: 100%;
}
/*
** Editor
*/
.tc-editor-toolbar {
margin-top: 8px;
}
.tc-tiddler-frame .tc-tiddler-editor.tc-tiddler-preview .tc-editor-toolbar,
.tc-tiddler-frame .tc-tiddler-editor.tc-tiddler-preview-hidden .tc-editor-toolbar {
grid-area: toolbar;
}
.tc-editor-toolbar button {
vertical-align: middle;
background-color: <<colour tiddler-controls-foreground>>;
color: <<colour tiddler-controls-foreground-selected>>;
fill: <<colour tiddler-controls-foreground-selected>>;
2016-04-29 16:02:05 +00:00
border-radius: 4px;
padding: 3px;
margin: 2px 0 2px 4px;
}
.tc-editor-toolbar button.tc-text-editor-toolbar-item-adjunct {
margin-left: 1px;
2016-04-29 16:02:05 +00:00
width: 1em;
border-radius: 8px;
}
2016-04-29 16:18:58 +00:00
.tc-editor-toolbar button.tc-text-editor-toolbar-item-start-group {
margin-left: 11px;
2016-04-29 16:18:58 +00:00
}
.tc-editor-toolbar button.tc-selected {
background-color: <<colour primary>>;
}
.tc-editor-toolbar button svg {
2016-04-29 16:02:05 +00:00
width: 1.6em;
height: 1.2em;
}
.tc-editor-toolbar .tc-drop-down button.tc-btn-mini {
padding: 2px 4px;
}
.tc-editor-toolbar button:hover {
background-color: <<colour tiddler-controls-foreground-selected>>;
fill: <<colour background>>;
color: <<colour background>>;
}
.tc-editor-toolbar .tc-text-editor-toolbar-more {
white-space: normal;
}
.tc-editor-toolbar .tc-text-editor-toolbar-more button {
display: inline-block;
padding: 3px;
width: auto;
}
.tc-editor-toolbar .tc-search-results {
padding: 0;
}
.tc-editor-toolbar button.tc-editortoolbar-stamp-button + .tc-popup .tc-drop-down > p {
margin: 0;
padding: 0;
}
.tc-editor-toolbar button.tc-editortoolbar-stamp-button + .tc-popup .tc-drop-down a.tc-tiddlylink {
font-weight: normal;
}
/*
** Adjustments for fluid-fixed mode
*/
@media (min-width: <<sidebarbreakpoint>>) {
<<if-fluid-fixed text:"""
.tc-story-river {
padding-right: 0;
position: relative;
width: auto;
left: 0;
margin-left: {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}};
margin-right: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}};
}
.tc-tiddler-frame {
width: 100%;
}
.tc-sidebar-scrollable {
left: auto;
bottom: 0;
right: 0;
width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}};
}
body.tc-body .tc-page-container.tc-page-view-zoomin .tc-tiddler-frame {
width: 100%;
width: calc(100% - 42px);
}
""" hiddenSidebarText:"""
.tc-story-river {
padding-right: 3em;
margin-right: 0;
}
body.tc-body .tc-page-container.tc-page-view-zoomin .tc-tiddler-frame {
width: 100%;
width: calc(100% - 84px);
}
""">>
}
/*
** Toolbar buttons
*/
2014-08-28 18:41:29 +00:00
.tc-page-controls svg.tc-image-new-button {
2021-05-19 13:12:12 +00:00
fill: <<colour toolbar-new-button>>;
}
2014-08-28 18:41:29 +00:00
.tc-page-controls svg.tc-image-options-button {
2021-05-19 13:12:12 +00:00
fill: <<colour toolbar-options-button>>;
}
2014-08-28 18:41:29 +00:00
.tc-page-controls svg.tc-image-save-button {
2021-05-19 13:12:12 +00:00
fill: <<colour toolbar-save-button>>;
}
.tc-tiddler-controls button svg.tc-image-info-button {
2021-05-19 13:12:12 +00:00
fill: <<colour toolbar-info-button>>;
}
.tc-tiddler-controls button svg.tc-image-edit-button {
2021-05-19 13:12:12 +00:00
fill: <<colour toolbar-edit-button>>;
}
.tc-tiddler-controls button svg.tc-image-close-button {
2021-05-19 13:12:12 +00:00
fill: <<colour toolbar-close-button>>;
}
.tc-tiddler-controls button svg.tc-image-delete-button {
2021-05-19 13:12:12 +00:00
fill: <<colour toolbar-delete-button>>;
}
.tc-tiddler-controls button svg.tc-image-cancel-button {
2021-05-19 13:12:12 +00:00
fill: <<colour toolbar-cancel-button>>;
}
.tc-tiddler-controls button svg.tc-image-done-button {
2021-05-19 13:12:12 +00:00
fill: <<colour toolbar-done-button>>;
}
.tc-page-controls svg.tc-image-layout-button {
fill: <<colour toolbar-options-button>>;
}
/*
** Tiddler edit mode
*/
.tc-tiddler-edit-frame em.tc-edit {
color: <<colour muted-foreground>>;
font-style: normal;
}
2014-08-28 17:47:21 +00:00
.tc-edit-type-dropdown a.tc-tiddlylink-missing {
font-style: normal;
}
.tc-type-selector .tc-edit-typeeditor {
width: auto;
}
.tc-type-selector-dropdown-wrapper {
display: inline-block;
}
<<set-type-selector-min-width>>
2014-08-28 17:47:21 +00:00
.tc-edit-tags {
border: 1px solid <<colour tiddler-editor-border>>;
padding: 4px 8px 4px 8px;
}
2014-08-28 17:47:21 +00:00
.tc-edit-add-tag {
display: inline-block;
}
2014-08-28 18:41:29 +00:00
.tc-edit-add-tag .tc-add-tag-name input {
width: 50%;
}
.tc-edit-add-tag .tc-keyboard {
display:inline;
}
2014-08-28 18:41:29 +00:00
.tc-edit-tags .tc-tag-label {
display: inline-block;
}
2014-08-28 17:47:21 +00:00
.tc-edit-tags-list {
margin: 14px 0 14px 0;
}
.tc-remove-tag-button {
padding-left: 4px;
}
.tc-tiddler-editor {
display: grid;
}
.tc-tiddler-frame .tc-tiddler-editor.tc-tiddler-preview {
grid-template-areas:
"toolbar toolbar"
"editor preview";
2024-01-24 11:40:05 +00:00
grid-template-columns: repeat(2, minmax(0px, 1fr));
grid-template-rows: auto 1fr;
}
.tc-tiddler-frame .tc-tiddler-editor.tc-tiddler-preview-hidden {
grid-template-areas:
"toolbar"
"editor";
grid-template-columns: 1fr;
grid-template-rows: auto 1fr;
}
.tc-tiddler-frame .tc-tiddler-editor.tc-tiddler-preview .tc-tiddler-preview-preview {
grid-area: preview;
overflow-wrap: anywhere;
word-break: normal;
border: 1px solid <<colour tiddler-editor-border>>;
margin: 4px 0 3px 3px;
padding: 3px 3px 3px 3px;
}
<<if-editor-height-fixed then:"""
.tc-tiddler-preview-preview {
overflow-y: scroll;
height: {{$:/config/TextEditor/EditorHeight/Height}};
}
""">>
.tc-tiddler-frame .tc-tiddler-editor.tc-tiddler-preview .tc-edit-texteditor,
.tc-tiddler-frame .tc-tiddler-editor.tc-tiddler-preview-hidden .tc-edit-texteditor {
grid-area: editor;
}
.tc-tiddler-frame .tc-tiddler-editor.tc-tiddler-preview canvas.tc-edit-bitmapeditor,
.tc-tiddler-frame .tc-tiddler-editor.tc-tiddler-preview-hidden canvas.tc-edit-bitmapeditor {
grid-area: editor;
max-width: 100%;
}
2014-08-28 17:47:21 +00:00
.tc-edit-fields {
width: 100%;
}
.tc-edit-fields.tc-edit-fields-small {
margin-top: 0;
margin-bottom: 0;
}
2014-08-28 17:47:21 +00:00
.tc-edit-fields table, .tc-edit-fields tr, .tc-edit-fields td {
border: none;
padding: 4px;
}
2014-08-28 17:47:21 +00:00
.tc-edit-fields > tbody > .tc-edit-field:nth-child(odd) {
background-color: <<colour tiddler-editor-fields-odd>>;
}
2014-08-28 17:47:21 +00:00
.tc-edit-fields > tbody > .tc-edit-field:nth-child(even) {
background-color: <<colour tiddler-editor-fields-even>>;
}
2014-08-28 17:47:21 +00:00
.tc-edit-field-name {
text-align: right;
}
2014-08-28 17:47:21 +00:00
.tc-edit-field-value input {
width: 100%;
}
2014-08-28 17:47:21 +00:00
.tc-edit-field-remove {
}
2014-08-28 17:47:21 +00:00
.tc-edit-field-remove svg {
height: 1em;
width: 1em;
fill: <<colour muted-foreground>>;
vertical-align: middle;
}
.tc-edit-field-add-name-wrapper input.tc-edit-texteditor {
width: auto;
}
.tc-edit-field-add-name-wrapper {
display: inline-block;
}
.tc-edit-field-add-value {
display: inline-block;
}
@media (min-width: <<sidebarbreakpoint>>) {
.tc-edit-field-add-value {
width: 35%;
}
}
2014-08-28 17:47:21 +00:00
.tc-edit-field-add-button {
display: inline-block;
width: 10%;
}
/*
** Tiddler editor dropzone
*/
.tc-dropzone-editor {
position:relative;
}
.tc-dropzone-editor.tc-dragover .tc-editor-toolbar::after{
z-index: 10000;
top:0;
left:0;
right:0;
height: 100%;
background: <<colour dropzone-background>>;
content: "<<lingo DropMessage>>";
pointer-events: none;
position: absolute;
display: flex;
align-items: center;
justify-content: center;
background-color: <<color background>>;
border: 4px dashed <<color modal-border>>;
font-weight: bold;
font-size: 150%;
opacity: 0.8;
color: <<color foreground>>;
}
.tc-editor-importpopup {
width: 100%;
height: 100%;
}
.tc-editor-import {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: <<color pre-background>>;
box-shadow: 2px 2px 10px <<colour foreground>>;
padding: 10px;
width: 96%;
border: 1px solid <<color tiddler-controls-foreground>>;
text-align:center;
}
.tc-editor-import img {
max-height: 500px;
}
/*
** Storyview Classes
*/
.tc-viewswitcher .tc-image-button {
margin-right: .3em;
}
.tc-page-container.tc-page-view-zoomin .tc-tiddler-frame {
position: absolute;
display: block;
width: 100%;
}
@media (min-width: <<sidebarbreakpoint>>) {
.tc-page-container.tc-page-view-zoomin .tc-tiddler-frame {
width: calc(100% - 84px);
}
}
/*
** Dropdowns
*/
2014-08-28 21:22:40 +00:00
.tc-btn-dropdown {
text-align: left;
}
2014-08-28 21:22:40 +00:00
.tc-btn-dropdown svg, .tc-btn-dropdown img {
height: 1em;
width: 1em;
fill: <<colour muted-foreground>>;
}
.tc-drop-down-wrapper {
2014-08-09 12:12:23 +00:00
position: relative;
}
.tc-drop-down {
min-width: 380px;
border: 1px solid <<colour dropdown-border>>;
background-color: <<colour dropdown-background>>;
padding: 7px 0 7px 0;
margin: 4px 0 0 0;
white-space: nowrap;
text-shadow: none;
line-height: 1.4;
}
.tc-drop-down .tc-drop-down {
margin-left: 14px;
}
.tc-drop-down button svg, .tc-drop-down a svg {
2014-07-28 10:29:06 +00:00
fill: <<colour foreground>>;
}
.tc-drop-down button:disabled svg {
fill: <<colour muted-foreground>>;
}
.tc-drop-down button.tc-btn-invisible:hover svg {
fill: <<colour background>>;
2014-07-28 10:29:06 +00:00
}
Fix syncer to handler errors properly (#4373) * First commit * Add throttling of saves Now we refuse to save a tiddler more often than once per second. * Wait for a timeout before trying again after an error * Modest optimisations of isDirty() method * Synchronise system tiddlers and deletions from the server Fixes two long-standing issues: * Changes to system tiddlers are not synchronised from the server to the browser * Deletions of tiddlers on the server are not propagated to browser clients * Make sure we update the dirty status even if there isn't a task to perform * Replace save-wiki button with popup sync menu * Remove the "Server" control panel tab We don't need it with the enhanced sync dropdown * Add indentation to the save-wiki button * Fix spacing in dropdown menu items * Switch between cloud icons according to dirty status * Add a menu item to copy syncer logs to the clipboard * Improve animated icon * Remove indentation from save-wiki button @pmario the annoying thing is that using `\trim whitespace` trims significant whitespace too, so it means we have to use <$text text=" "/> when we need a space that won't be trimmed. For the moment, I've removed the indentation but will keep thinking about it. * Further icon, UI and copy text tweaks Move the icons and styles from the core into the TiddlyWeb plugin * Clean up PR diff * Tweak animation durations * Break the actions from the syncer dropdown into separate tiddlers @pmario I think this makes things a bit easier to follow * Refactor syncadaptor creation and logging The goal is for the syncadaptor to be able to log to the same logger as the syncer, so that the "copy syncer logs to clipboard" data is more useful. * Don't transition the dirty indicator container colour, just the SVG's colour * Only trigger a sync for changes to tiddlers we're interested in Otherwise it is triggered by the creation of the alert tiddlers used to display errors. * Restore deleting local tiddlers removed from the server (I had commented it out for some testing and accidentally commited it). * Guard against missing adaptor info * We still need to trigger a timeout when there was no task to process * Avoid repeatedly polling for changes Instead we only trigger a timeout call at if there is a pending task (ie a tiddler that has changed but isn't yet old enough to save). * Lazy loading: include skinny versions of lazily loaded tiddlers in the index.html * Introduce _is_skinny field for indicating that a tiddler is subject to lazy loading * Remove savetrail plugin from prerelease It doesn't yet work with the new syncer * Make the savetrail plugin work again * Clear outstanding alerts when synchronisation is restored * Logger: only remove alerts from the same component Missed off 9f5c0de07 * Make the saving throttle interval configurable (#4385) After switching Bob to use the core syncer the throttle interval makes saving feel very sluggish compared to the message queue setup that I had before. The editing lock that I use to prevent conflicts with multiple users doesn't go away until the save is completed, and with the 1 second delay it means that if you edit a tiddler and save it than you have to wait one second before you can edit it again. * Tweaks to appearance of alerts * Exclude temp tiddlers from offline snapshots Otherwise alerts will persist * Tweak appearance of status line in dropdown * Update release note * Web server: Don't include full path in error messages Fixes #3724 * In change event handler check for deletions * Disable the official plugin library when the tiddlyweb plugin is loaded * Hide error details from browser for /files/ route See https://github.com/Jermolene/TiddlyWiki5/issues/3724#issuecomment-565702492 -- thanks @pmario * Revert all the changes to the relationship between the syncer and the syncadaptor Previously we had some major rearrangements to make it possible for the syncadaptor to route it's logging to the logger used by the syncer. The motivation is so that the "copy logs to clipboard" button is more useful. On reflection, changing the interface this drastically is undesirable from a backwards compatibility perspective, so I'm going to investigate other ways to achieve the logger sharing * Make the tiddlyweb adaptor use the syncer's logger So that both are availavble when copying the syncer logs to the clipboard * Update release note * Support setting port=0 to get an OS assigned port Quite useful * Update code comment * UI: Use "Get latest changes from server" instead of "Refresh" * Add getUpdatedTiddlers() method to syncadaptor API See https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-573579495 * Refactor revision handling within the syncer Thanks @pmario * Fix typo in tiddlywebadaptor * Improve presentation of errors See https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-573695267 * Add docs for getTiddlerRevision() * Remove unused error animation * Update comment for GET /recipes/default/tiddlers/tiddlers.json * Optimise SVG cloud image * Add optional list of allowed filters for get all tiddlers route An attempt to address @Arlen22's concern here: https://github.com/Jermolene/TiddlyWiki5/pull/4373#pullrequestreview-342146190 * Fix network error alert text translatability * Fix error code and logging for GET /recipes/default/tiddlers/tiddlers.json Thanks @Arlen22 * Flip GET /recipes/default/tiddlers/tiddlers.json allowed filter handling to be secure by default * Validate updates received from getUpdatedTiddlers() * Add syncer method to force loading of a tiddler from the server * Remove the release note update to remove the merge conflict * Fix crash when there's no config section in the tiddlywiki.info file * Use config tiddler title to check filter query (merge into fix-syncer) (#4478) * Use config tiddler title to check filter query * Create config-tiddlers-filter.tid * Add config switch to enable all filters on GET /recipes/default/tiddlers/tiddlers.json And update docs * Fix bug when deleting a tiddler with a shadow Reported by @kookma at https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-604027528 Co-authored-by: jed <inmysocks@fastmail.com> Co-authored-by: Arlen22 <arlenbee@gmail.com>
2020-03-30 14:24:05 +00:00
.tc-drop-down .tc-drop-down-info {
padding-left: 14px;
}
.tc-drop-down p {
padding: 0 14px 0 14px;
}
.tc-drop-down svg {
width: 1em;
height: 1em;
}
.tc-drop-down img {
width: 1em;
}
.tc-drop-down a, .tc-drop-down button {
display: block;
padding: 0 14px 0 14px;
2014-07-28 10:29:06 +00:00
width: 100%;
text-align: left;
2014-07-30 21:25:52 +00:00
color: <<colour foreground>>;
line-height: 1.4;
}
.tc-drop-down .tc-tab-set .tc-tab-buttons button {
display: inline-block;
2021-05-19 13:12:12 +00:00
width: auto;
margin-bottom: 0px;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
2015-05-05 17:53:30 +00:00
.tc-drop-down .tc-prompt {
padding: 0 14px;
2015-05-05 17:53:30 +00:00
}
.tc-drop-down .tc-chooser {
border: none;
}
.tc-drop-down .tc-chooser .tc-swatches-horiz {
font-size: 0.4em;
padding-left: 1.2em;
}
2014-08-28 18:41:29 +00:00
.tc-drop-down .tc-file-input-wrapper {
2014-08-02 20:37:46 +00:00
width: 100%;
}
2014-08-28 18:41:29 +00:00
.tc-drop-down .tc-file-input-wrapper button {
2014-08-02 20:37:46 +00:00
color: <<colour foreground>>;
}
2014-08-28 18:41:29 +00:00
.tc-drop-down a:hover, .tc-drop-down button:hover, .tc-drop-down .tc-file-input-wrapper:hover button {
color: <<colour tiddler-link-background>>;
background-color: <<colour tiddler-link-foreground>>;
text-decoration: none;
}
2014-08-28 18:41:29 +00:00
.tc-drop-down .tc-tab-buttons button {
background-color: <<colour dropdown-tab-background>>;
}
2014-08-28 18:41:29 +00:00
.tc-drop-down .tc-tab-buttons button.tc-tab-selected {
background-color: <<colour dropdown-tab-background-selected>>;
border-bottom: 1px solid <<colour dropdown-tab-background-selected>>;
}
.tc-drop-down-bullet {
display: inline-block;
width: 0.5em;
}
2014-08-28 18:41:29 +00:00
.tc-drop-down .tc-tab-contents a {
padding: 0 0.5em 0 0.5em;
}
.tc-block-dropdown-wrapper {
position: relative;
}
.tc-block-dropdown {
position: absolute;
min-width: 220px;
border: 1px solid <<colour dropdown-border>>;
background-color: <<colour dropdown-background>>;
padding: 7px 0;
margin: 4px 0 0 0;
white-space: nowrap;
z-index: 1000;
text-shadow: none;
}
.tc-block-dropdown.tc-search-drop-down {
margin-left: -12px;
}
.tc-block-dropdown a {
display: block;
padding: 4px 14px 4px 14px;
}
.tc-block-dropdown.tc-search-drop-down a {
display: block;
padding: 0px 10px 0px 10px;
}
.tc-drop-down .tc-dropdown-item-plain,
.tc-block-dropdown .tc-dropdown-item-plain {
padding: 4px 14px 4px 7px;
}
.tc-drop-down .tc-dropdown-item,
.tc-block-dropdown .tc-dropdown-item {
padding: 4px 14px 4px 7px;
color: <<colour muted-foreground>>;
}
.tc-block-dropdown a.tc-tiddlylink:hover {
color: <<colour tiddler-link-background>>;
background-color: <<colour tiddler-link-foreground>>;
text-decoration: none;
}
.tc-search-results {
2016-04-29 16:02:05 +00:00
padding: 0 7px 0 7px;
}
.tc-image-chooser, .tc-colour-chooser {
white-space: normal;
}
.tc-image-chooser a,
.tc-colour-chooser a {
display: inline-block;
vertical-align: top;
2016-04-29 16:02:05 +00:00
text-align: center;
position: relative;
}
.tc-image-chooser a {
border: 1px solid <<colour muted-foreground>>;
padding: 2px;
margin: 2px;
width: 4em;
height: 4em;
}
.tc-colour-chooser a {
padding: 3px;
width: 2em;
height: 2em;
2016-04-29 16:02:05 +00:00
vertical-align: middle;
}
.tc-image-chooser a:hover,
.tc-colour-chooser a:hover {
background: <<colour primary>>;
padding: 0px;
border: 3px solid <<colour primary>>;
}
.tc-image-chooser a svg,
.tc-image-chooser a img {
2016-04-29 16:02:05 +00:00
display: inline-block;
width: auto;
height: auto;
max-width: 3.5em;
max-height: 3.5em;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
/* Make search dropdown visible on small screens. issue #7003 */
@media (max-width: <<sidebarbreakpoint>>) {
.tc-sidebar-search .tc-block-dropdown-wrapper {
position: initial;
}
}
/*
** Modals
*/
.tc-modal-wrapper {
position: fixed;
overflow: auto;
overflow-y: scroll;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 900;
}
.tc-modal-backdrop {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1000;
background-color: <<colour modal-backdrop>>;
}
.tc-modal {
z-index: 1100;
background-color: <<colour modal-background>>;
border: 1px solid <<colour modal-border>>;
}
@media (max-width: 55em) {
.tc-modal {
position: fixed;
top: 1em;
left: 1em;
right: 1em;
}
.tc-modal-body {
overflow-y: auto;
max-height: 400px;
max-height: 60vh;
}
}
@media (min-width: 55em) {
.tc-modal {
position: fixed;
top: 2em;
left: 25%;
width: 50%;
}
.tc-modal-body {
overflow-y: auto;
max-height: 400px;
max-height: 60vh;
}
}
.tc-modal-header {
padding: 9px 15px;
border-bottom: 1px solid <<colour modal-header-border>>;
}
.tc-modal-header h3 {
margin: 0;
line-height: 30px;
}
.tc-modal-header img, .tc-modal-header svg {
width: 1em;
height: 1em;
}
.tc-modal-body {
padding: 15px;
}
.tc-modal-footer {
padding: 14px 15px 15px;
margin-bottom: 0;
text-align: right;
background-color: <<colour modal-footer-background>>;
border-top: 1px solid <<colour modal-footer-border>>;
}
.tc-modal-prevent-scroll {
overflow: hidden;
}
/*
** Centered modals
*/
.tc-modal-centered .tc-modal {
width: auto;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) !important;
}
/*
** Notifications
*/
.tc-notification {
position: fixed;
top: 14px;
right: 42px;
2014-11-23 17:10:44 +00:00
z-index: 1300;
max-width: 280px;
padding: 0 14px 0 14px;
background-color: <<colour notification-background>>;
border: 1px solid <<colour notification-border>>;
}
/*
** Tabs
*/
2014-08-28 18:41:29 +00:00
.tc-tab-set.tc-vertical {
display: -webkit-flex;
display: flex;
}
2014-08-28 18:41:29 +00:00
.tc-tab-buttons {
font-size: 0.85em;
padding-top: 1em;
margin-bottom: -2px;
}
2014-08-28 18:41:29 +00:00
.tc-tab-buttons.tc-vertical {
2014-05-14 18:37:37 +00:00
z-index: 100;
display: block;
padding-top: 14px;
vertical-align: top;
text-align: right;
margin-bottom: inherit;
margin-right: -1px;
max-width: 33%;
-webkit-flex: 0 0 auto;
flex: 0 0 auto;
}
2014-08-28 18:41:29 +00:00
.tc-tab-buttons button.tc-tab-selected {
color: <<colour tab-foreground-selected>>;
background-color: <<colour tab-background-selected>>;
border-left: 1px solid <<colour tab-border-selected>>;
border-top: 1px solid <<colour tab-border-selected>>;
border-right: 1px solid <<colour tab-border-selected>>;
}
2014-08-28 18:41:29 +00:00
.tc-tab-buttons button {
color: <<colour tab-foreground>>;
2014-05-14 18:37:37 +00:00
padding: 3px 5px 3px 5px;
2015-12-29 08:12:06 +00:00
margin-right: 0.3em;
font-weight: normal;
border: none;
background: inherit;
background-color: <<colour tab-background>>;
border-left: 1px solid <<colour tab-border>>;
border-top: 1px solid <<colour tab-border>>;
border-right: 1px solid <<colour tab-border>>;
border-top-left-radius: 2px;
border-top-right-radius: 2px;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
2014-08-28 18:41:29 +00:00
.tc-tab-buttons.tc-vertical button {
display: block;
width: 100%;
margin-top: 3px;
2015-12-29 08:12:06 +00:00
margin-right: 0;
text-align: right;
background-color: <<colour tab-background>>;
border-left: 1px solid <<colour tab-border>>;
border-bottom: 1px solid <<colour tab-border>>;
border-right: none;
border-top-left-radius: 2px;
border-bottom-left-radius: 2px;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
2014-08-28 18:41:29 +00:00
.tc-tab-buttons.tc-vertical button.tc-tab-selected {
background-color: <<colour tab-background-selected>>;
border-right: 1px solid <<colour tab-background-selected>>;
}
2014-08-28 18:41:29 +00:00
.tc-tab-divider {
border-top: 1px solid <<colour tab-divider>>;
}
2014-08-28 18:41:29 +00:00
.tc-tab-divider.tc-vertical {
display: none;
}
2014-08-28 18:41:29 +00:00
.tc-tab-content {
2014-06-21 10:17:04 +00:00
margin-top: 14px;
}
2014-08-28 18:41:29 +00:00
.tc-tab-content.tc-vertical {
display: inline-block;
vertical-align: top;
padding-top: 0;
padding-left: 14px;
border-left: 1px solid <<colour tab-border>>;
2014-08-13 16:06:18 +00:00
-webkit-flex: 1 0 70%;
flex: 1 0 70%;
overflow: auto;
}
.tc-sidebar-lists .tc-tab-buttons {
margin-bottom: -1px;
}
2014-08-28 18:41:29 +00:00
.tc-sidebar-lists .tc-tab-buttons button.tc-tab-selected {
background-color: <<colour sidebar-tab-background-selected>>;
color: <<colour sidebar-tab-foreground-selected>>;
border-left: 1px solid <<colour sidebar-tab-border-selected>>;
border-top: 1px solid <<colour sidebar-tab-border-selected>>;
border-right: 1px solid <<colour sidebar-tab-border-selected>>;
}
2014-08-28 18:41:29 +00:00
.tc-sidebar-lists .tc-tab-buttons button {
background-color: <<colour sidebar-tab-background>>;
color: <<colour sidebar-tab-foreground>>;
border-left: 1px solid <<colour sidebar-tab-border>>;
border-top: 1px solid <<colour sidebar-tab-border>>;
border-right: 1px solid <<colour sidebar-tab-border>>;
}
2014-08-28 18:41:29 +00:00
.tc-sidebar-lists .tc-tab-divider {
border-top: 1px solid <<colour sidebar-tab-divider>>;
}
.tc-more-sidebar > .tc-tab-set > .tc-tab-buttons > button {
display: block;
width: 100%;
background-color: <<colour sidebar-tab-background>>;
border-top: none;
border-left: none;
border-bottom: none;
border-right: 1px solid #ccc;
margin-bottom: inherit;
}
.tc-more-sidebar > .tc-tab-set > .tc-tab-buttons > button.tc-tab-selected {
background-color: <<colour sidebar-tab-background-selected>>;
border: none;
}
2016-11-29 08:36:07 +00:00
/*
** Manager
*/
.tc-manager-wrapper {
}
.tc-manager-controls {
}
.tc-manager-control {
margin: 0.5em 0;
}
.tc-manager-control select {
max-width: 100%;
}
2016-11-29 08:36:07 +00:00
.tc-manager-list {
width: 100%;
border-top: 1px solid <<colour muted-foreground>>;
border-left: 1px solid <<colour muted-foreground>>;
border-right: 1px solid <<colour muted-foreground>>;
}
.tc-manager-list-item {
}
.tc-manager-list-item-heading {
2021-05-19 13:12:12 +00:00
display: block;
width: 100%;
text-align: left;
2016-11-29 08:36:07 +00:00
border-bottom: 1px solid <<colour muted-foreground>>;
padding: 3px;
}
.tc-manager-list-item-heading-selected {
font-weight: bold;
color: <<colour background>>;
fill: <<colour background>>;
background-color: <<colour foreground>>;
}
.tc-manager-list-item-heading:hover {
background: <<colour primary>>;
color: <<colour background>>;
}
.tc-manager-list-item-content {
display: flex;
}
.tc-manager-list-item-content-sidebar {
2021-05-19 13:12:12 +00:00
flex: 1 0;
background: <<colour tiddler-editor-background>>;
border-right: 0.5em solid <<colour muted-foreground>>;
border-bottom: 0.5em solid <<colour muted-foreground>>;
white-space: nowrap;
2016-11-29 08:36:07 +00:00
}
.tc-manager-list-item-content-item-heading {
display: block;
width: 100%;
text-align: left;
2021-05-19 13:12:12 +00:00
background: <<colour muted-foreground>>;
2016-11-29 08:36:07 +00:00
text-transform: uppercase;
font-size: 0.6em;
font-weight: bold;
2021-05-19 13:12:12 +00:00
padding: 0.5em 0 0.5em 0;
2016-11-29 08:36:07 +00:00
}
.tc-manager-list-item-content-item-body {
padding: 0 0.5em 0 0.5em;
}
.tc-manager-list-item-content-item-body > pre {
margin: 0.5em 0 0.5em 0;
border: none;
background: inherit;
}
.tc-manager-list-item-content-tiddler {
2021-05-19 13:12:12 +00:00
flex: 3 1;
border-left: 0.5em solid <<colour muted-foreground>>;
border-right: 0.5em solid <<colour muted-foreground>>;
border-bottom: 0.5em solid <<colour muted-foreground>>;
2016-11-29 08:36:07 +00:00
}
.tc-manager-list-item-content-item-body > table {
border: none;
padding: 0;
margin: 0;
}
.tc-manager-list-item-content-item-body > table td {
border: none;
}
.tc-manager-icon-editor > button {
width: 100%;
}
.tc-manager-icon-editor > button > svg,
.tc-manager-icon-editor > button > button {
width: 100%;
height: auto;
}
/*
** Import table
*/
.tc-import-table {
width: 100%;
}
.tc-import-table svg.tc-image-edit-button {
max-width: unset;
}
.tc-import-table th:first-of-type {
width: 10%;
}
.tc-import-table th:last-of-type {
width: 30%;
}
2020-11-18 15:50:40 +00:00
.tc-import-table .tc-row-disabled {
background: <<colour very-muted-foreground>>10;
opacity: 0.8;
}
.tc-import-table .tc-row-warning {
background: <<colour diff-delete-background>>50;
}
/*
** Alerts
*/
.tc-alerts {
position: fixed;
Fix syncer to handler errors properly (#4373) * First commit * Add throttling of saves Now we refuse to save a tiddler more often than once per second. * Wait for a timeout before trying again after an error * Modest optimisations of isDirty() method * Synchronise system tiddlers and deletions from the server Fixes two long-standing issues: * Changes to system tiddlers are not synchronised from the server to the browser * Deletions of tiddlers on the server are not propagated to browser clients * Make sure we update the dirty status even if there isn't a task to perform * Replace save-wiki button with popup sync menu * Remove the "Server" control panel tab We don't need it with the enhanced sync dropdown * Add indentation to the save-wiki button * Fix spacing in dropdown menu items * Switch between cloud icons according to dirty status * Add a menu item to copy syncer logs to the clipboard * Improve animated icon * Remove indentation from save-wiki button @pmario the annoying thing is that using `\trim whitespace` trims significant whitespace too, so it means we have to use <$text text=" "/> when we need a space that won't be trimmed. For the moment, I've removed the indentation but will keep thinking about it. * Further icon, UI and copy text tweaks Move the icons and styles from the core into the TiddlyWeb plugin * Clean up PR diff * Tweak animation durations * Break the actions from the syncer dropdown into separate tiddlers @pmario I think this makes things a bit easier to follow * Refactor syncadaptor creation and logging The goal is for the syncadaptor to be able to log to the same logger as the syncer, so that the "copy syncer logs to clipboard" data is more useful. * Don't transition the dirty indicator container colour, just the SVG's colour * Only trigger a sync for changes to tiddlers we're interested in Otherwise it is triggered by the creation of the alert tiddlers used to display errors. * Restore deleting local tiddlers removed from the server (I had commented it out for some testing and accidentally commited it). * Guard against missing adaptor info * We still need to trigger a timeout when there was no task to process * Avoid repeatedly polling for changes Instead we only trigger a timeout call at if there is a pending task (ie a tiddler that has changed but isn't yet old enough to save). * Lazy loading: include skinny versions of lazily loaded tiddlers in the index.html * Introduce _is_skinny field for indicating that a tiddler is subject to lazy loading * Remove savetrail plugin from prerelease It doesn't yet work with the new syncer * Make the savetrail plugin work again * Clear outstanding alerts when synchronisation is restored * Logger: only remove alerts from the same component Missed off 9f5c0de07 * Make the saving throttle interval configurable (#4385) After switching Bob to use the core syncer the throttle interval makes saving feel very sluggish compared to the message queue setup that I had before. The editing lock that I use to prevent conflicts with multiple users doesn't go away until the save is completed, and with the 1 second delay it means that if you edit a tiddler and save it than you have to wait one second before you can edit it again. * Tweaks to appearance of alerts * Exclude temp tiddlers from offline snapshots Otherwise alerts will persist * Tweak appearance of status line in dropdown * Update release note * Web server: Don't include full path in error messages Fixes #3724 * In change event handler check for deletions * Disable the official plugin library when the tiddlyweb plugin is loaded * Hide error details from browser for /files/ route See https://github.com/Jermolene/TiddlyWiki5/issues/3724#issuecomment-565702492 -- thanks @pmario * Revert all the changes to the relationship between the syncer and the syncadaptor Previously we had some major rearrangements to make it possible for the syncadaptor to route it's logging to the logger used by the syncer. The motivation is so that the "copy logs to clipboard" button is more useful. On reflection, changing the interface this drastically is undesirable from a backwards compatibility perspective, so I'm going to investigate other ways to achieve the logger sharing * Make the tiddlyweb adaptor use the syncer's logger So that both are availavble when copying the syncer logs to the clipboard * Update release note * Support setting port=0 to get an OS assigned port Quite useful * Update code comment * UI: Use "Get latest changes from server" instead of "Refresh" * Add getUpdatedTiddlers() method to syncadaptor API See https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-573579495 * Refactor revision handling within the syncer Thanks @pmario * Fix typo in tiddlywebadaptor * Improve presentation of errors See https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-573695267 * Add docs for getTiddlerRevision() * Remove unused error animation * Update comment for GET /recipes/default/tiddlers/tiddlers.json * Optimise SVG cloud image * Add optional list of allowed filters for get all tiddlers route An attempt to address @Arlen22's concern here: https://github.com/Jermolene/TiddlyWiki5/pull/4373#pullrequestreview-342146190 * Fix network error alert text translatability * Fix error code and logging for GET /recipes/default/tiddlers/tiddlers.json Thanks @Arlen22 * Flip GET /recipes/default/tiddlers/tiddlers.json allowed filter handling to be secure by default * Validate updates received from getUpdatedTiddlers() * Add syncer method to force loading of a tiddler from the server * Remove the release note update to remove the merge conflict * Fix crash when there's no config section in the tiddlywiki.info file * Use config tiddler title to check filter query (merge into fix-syncer) (#4478) * Use config tiddler title to check filter query * Create config-tiddlers-filter.tid * Add config switch to enable all filters on GET /recipes/default/tiddlers/tiddlers.json And update docs * Fix bug when deleting a tiddler with a shadow Reported by @kookma at https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-604027528 Co-authored-by: jed <inmysocks@fastmail.com> Co-authored-by: Arlen22 <arlenbee@gmail.com>
2020-03-30 14:24:05 +00:00
top: 28px;
left: 0;
Fix syncer to handler errors properly (#4373) * First commit * Add throttling of saves Now we refuse to save a tiddler more often than once per second. * Wait for a timeout before trying again after an error * Modest optimisations of isDirty() method * Synchronise system tiddlers and deletions from the server Fixes two long-standing issues: * Changes to system tiddlers are not synchronised from the server to the browser * Deletions of tiddlers on the server are not propagated to browser clients * Make sure we update the dirty status even if there isn't a task to perform * Replace save-wiki button with popup sync menu * Remove the "Server" control panel tab We don't need it with the enhanced sync dropdown * Add indentation to the save-wiki button * Fix spacing in dropdown menu items * Switch between cloud icons according to dirty status * Add a menu item to copy syncer logs to the clipboard * Improve animated icon * Remove indentation from save-wiki button @pmario the annoying thing is that using `\trim whitespace` trims significant whitespace too, so it means we have to use <$text text=" "/> when we need a space that won't be trimmed. For the moment, I've removed the indentation but will keep thinking about it. * Further icon, UI and copy text tweaks Move the icons and styles from the core into the TiddlyWeb plugin * Clean up PR diff * Tweak animation durations * Break the actions from the syncer dropdown into separate tiddlers @pmario I think this makes things a bit easier to follow * Refactor syncadaptor creation and logging The goal is for the syncadaptor to be able to log to the same logger as the syncer, so that the "copy syncer logs to clipboard" data is more useful. * Don't transition the dirty indicator container colour, just the SVG's colour * Only trigger a sync for changes to tiddlers we're interested in Otherwise it is triggered by the creation of the alert tiddlers used to display errors. * Restore deleting local tiddlers removed from the server (I had commented it out for some testing and accidentally commited it). * Guard against missing adaptor info * We still need to trigger a timeout when there was no task to process * Avoid repeatedly polling for changes Instead we only trigger a timeout call at if there is a pending task (ie a tiddler that has changed but isn't yet old enough to save). * Lazy loading: include skinny versions of lazily loaded tiddlers in the index.html * Introduce _is_skinny field for indicating that a tiddler is subject to lazy loading * Remove savetrail plugin from prerelease It doesn't yet work with the new syncer * Make the savetrail plugin work again * Clear outstanding alerts when synchronisation is restored * Logger: only remove alerts from the same component Missed off 9f5c0de07 * Make the saving throttle interval configurable (#4385) After switching Bob to use the core syncer the throttle interval makes saving feel very sluggish compared to the message queue setup that I had before. The editing lock that I use to prevent conflicts with multiple users doesn't go away until the save is completed, and with the 1 second delay it means that if you edit a tiddler and save it than you have to wait one second before you can edit it again. * Tweaks to appearance of alerts * Exclude temp tiddlers from offline snapshots Otherwise alerts will persist * Tweak appearance of status line in dropdown * Update release note * Web server: Don't include full path in error messages Fixes #3724 * In change event handler check for deletions * Disable the official plugin library when the tiddlyweb plugin is loaded * Hide error details from browser for /files/ route See https://github.com/Jermolene/TiddlyWiki5/issues/3724#issuecomment-565702492 -- thanks @pmario * Revert all the changes to the relationship between the syncer and the syncadaptor Previously we had some major rearrangements to make it possible for the syncadaptor to route it's logging to the logger used by the syncer. The motivation is so that the "copy logs to clipboard" button is more useful. On reflection, changing the interface this drastically is undesirable from a backwards compatibility perspective, so I'm going to investigate other ways to achieve the logger sharing * Make the tiddlyweb adaptor use the syncer's logger So that both are availavble when copying the syncer logs to the clipboard * Update release note * Support setting port=0 to get an OS assigned port Quite useful * Update code comment * UI: Use "Get latest changes from server" instead of "Refresh" * Add getUpdatedTiddlers() method to syncadaptor API See https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-573579495 * Refactor revision handling within the syncer Thanks @pmario * Fix typo in tiddlywebadaptor * Improve presentation of errors See https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-573695267 * Add docs for getTiddlerRevision() * Remove unused error animation * Update comment for GET /recipes/default/tiddlers/tiddlers.json * Optimise SVG cloud image * Add optional list of allowed filters for get all tiddlers route An attempt to address @Arlen22's concern here: https://github.com/Jermolene/TiddlyWiki5/pull/4373#pullrequestreview-342146190 * Fix network error alert text translatability * Fix error code and logging for GET /recipes/default/tiddlers/tiddlers.json Thanks @Arlen22 * Flip GET /recipes/default/tiddlers/tiddlers.json allowed filter handling to be secure by default * Validate updates received from getUpdatedTiddlers() * Add syncer method to force loading of a tiddler from the server * Remove the release note update to remove the merge conflict * Fix crash when there's no config section in the tiddlywiki.info file * Use config tiddler title to check filter query (merge into fix-syncer) (#4478) * Use config tiddler title to check filter query * Create config-tiddlers-filter.tid * Add config switch to enable all filters on GET /recipes/default/tiddlers/tiddlers.json And update docs * Fix bug when deleting a tiddler with a shadow Reported by @kookma at https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-604027528 Co-authored-by: jed <inmysocks@fastmail.com> Co-authored-by: Arlen22 <arlenbee@gmail.com>
2020-03-30 14:24:05 +00:00
right: 0;
max-width: 50%;
z-index: 20000;
}
.tc-alert {
position: relative;
Fix syncer to handler errors properly (#4373) * First commit * Add throttling of saves Now we refuse to save a tiddler more often than once per second. * Wait for a timeout before trying again after an error * Modest optimisations of isDirty() method * Synchronise system tiddlers and deletions from the server Fixes two long-standing issues: * Changes to system tiddlers are not synchronised from the server to the browser * Deletions of tiddlers on the server are not propagated to browser clients * Make sure we update the dirty status even if there isn't a task to perform * Replace save-wiki button with popup sync menu * Remove the "Server" control panel tab We don't need it with the enhanced sync dropdown * Add indentation to the save-wiki button * Fix spacing in dropdown menu items * Switch between cloud icons according to dirty status * Add a menu item to copy syncer logs to the clipboard * Improve animated icon * Remove indentation from save-wiki button @pmario the annoying thing is that using `\trim whitespace` trims significant whitespace too, so it means we have to use <$text text=" "/> when we need a space that won't be trimmed. For the moment, I've removed the indentation but will keep thinking about it. * Further icon, UI and copy text tweaks Move the icons and styles from the core into the TiddlyWeb plugin * Clean up PR diff * Tweak animation durations * Break the actions from the syncer dropdown into separate tiddlers @pmario I think this makes things a bit easier to follow * Refactor syncadaptor creation and logging The goal is for the syncadaptor to be able to log to the same logger as the syncer, so that the "copy syncer logs to clipboard" data is more useful. * Don't transition the dirty indicator container colour, just the SVG's colour * Only trigger a sync for changes to tiddlers we're interested in Otherwise it is triggered by the creation of the alert tiddlers used to display errors. * Restore deleting local tiddlers removed from the server (I had commented it out for some testing and accidentally commited it). * Guard against missing adaptor info * We still need to trigger a timeout when there was no task to process * Avoid repeatedly polling for changes Instead we only trigger a timeout call at if there is a pending task (ie a tiddler that has changed but isn't yet old enough to save). * Lazy loading: include skinny versions of lazily loaded tiddlers in the index.html * Introduce _is_skinny field for indicating that a tiddler is subject to lazy loading * Remove savetrail plugin from prerelease It doesn't yet work with the new syncer * Make the savetrail plugin work again * Clear outstanding alerts when synchronisation is restored * Logger: only remove alerts from the same component Missed off 9f5c0de07 * Make the saving throttle interval configurable (#4385) After switching Bob to use the core syncer the throttle interval makes saving feel very sluggish compared to the message queue setup that I had before. The editing lock that I use to prevent conflicts with multiple users doesn't go away until the save is completed, and with the 1 second delay it means that if you edit a tiddler and save it than you have to wait one second before you can edit it again. * Tweaks to appearance of alerts * Exclude temp tiddlers from offline snapshots Otherwise alerts will persist * Tweak appearance of status line in dropdown * Update release note * Web server: Don't include full path in error messages Fixes #3724 * In change event handler check for deletions * Disable the official plugin library when the tiddlyweb plugin is loaded * Hide error details from browser for /files/ route See https://github.com/Jermolene/TiddlyWiki5/issues/3724#issuecomment-565702492 -- thanks @pmario * Revert all the changes to the relationship between the syncer and the syncadaptor Previously we had some major rearrangements to make it possible for the syncadaptor to route it's logging to the logger used by the syncer. The motivation is so that the "copy logs to clipboard" button is more useful. On reflection, changing the interface this drastically is undesirable from a backwards compatibility perspective, so I'm going to investigate other ways to achieve the logger sharing * Make the tiddlyweb adaptor use the syncer's logger So that both are availavble when copying the syncer logs to the clipboard * Update release note * Support setting port=0 to get an OS assigned port Quite useful * Update code comment * UI: Use "Get latest changes from server" instead of "Refresh" * Add getUpdatedTiddlers() method to syncadaptor API See https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-573579495 * Refactor revision handling within the syncer Thanks @pmario * Fix typo in tiddlywebadaptor * Improve presentation of errors See https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-573695267 * Add docs for getTiddlerRevision() * Remove unused error animation * Update comment for GET /recipes/default/tiddlers/tiddlers.json * Optimise SVG cloud image * Add optional list of allowed filters for get all tiddlers route An attempt to address @Arlen22's concern here: https://github.com/Jermolene/TiddlyWiki5/pull/4373#pullrequestreview-342146190 * Fix network error alert text translatability * Fix error code and logging for GET /recipes/default/tiddlers/tiddlers.json Thanks @Arlen22 * Flip GET /recipes/default/tiddlers/tiddlers.json allowed filter handling to be secure by default * Validate updates received from getUpdatedTiddlers() * Add syncer method to force loading of a tiddler from the server * Remove the release note update to remove the merge conflict * Fix crash when there's no config section in the tiddlywiki.info file * Use config tiddler title to check filter query (merge into fix-syncer) (#4478) * Use config tiddler title to check filter query * Create config-tiddlers-filter.tid * Add config switch to enable all filters on GET /recipes/default/tiddlers/tiddlers.json And update docs * Fix bug when deleting a tiddler with a shadow Reported by @kookma at https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-604027528 Co-authored-by: jed <inmysocks@fastmail.com> Co-authored-by: Arlen22 <arlenbee@gmail.com>
2020-03-30 14:24:05 +00:00
margin: 14px;
padding: 7px;
border: 1px solid <<colour alert-border>>;
background-color: <<colour alert-background>>;
}
.tc-alert-toolbar {
position: absolute;
Fix syncer to handler errors properly (#4373) * First commit * Add throttling of saves Now we refuse to save a tiddler more often than once per second. * Wait for a timeout before trying again after an error * Modest optimisations of isDirty() method * Synchronise system tiddlers and deletions from the server Fixes two long-standing issues: * Changes to system tiddlers are not synchronised from the server to the browser * Deletions of tiddlers on the server are not propagated to browser clients * Make sure we update the dirty status even if there isn't a task to perform * Replace save-wiki button with popup sync menu * Remove the "Server" control panel tab We don't need it with the enhanced sync dropdown * Add indentation to the save-wiki button * Fix spacing in dropdown menu items * Switch between cloud icons according to dirty status * Add a menu item to copy syncer logs to the clipboard * Improve animated icon * Remove indentation from save-wiki button @pmario the annoying thing is that using `\trim whitespace` trims significant whitespace too, so it means we have to use <$text text=" "/> when we need a space that won't be trimmed. For the moment, I've removed the indentation but will keep thinking about it. * Further icon, UI and copy text tweaks Move the icons and styles from the core into the TiddlyWeb plugin * Clean up PR diff * Tweak animation durations * Break the actions from the syncer dropdown into separate tiddlers @pmario I think this makes things a bit easier to follow * Refactor syncadaptor creation and logging The goal is for the syncadaptor to be able to log to the same logger as the syncer, so that the "copy syncer logs to clipboard" data is more useful. * Don't transition the dirty indicator container colour, just the SVG's colour * Only trigger a sync for changes to tiddlers we're interested in Otherwise it is triggered by the creation of the alert tiddlers used to display errors. * Restore deleting local tiddlers removed from the server (I had commented it out for some testing and accidentally commited it). * Guard against missing adaptor info * We still need to trigger a timeout when there was no task to process * Avoid repeatedly polling for changes Instead we only trigger a timeout call at if there is a pending task (ie a tiddler that has changed but isn't yet old enough to save). * Lazy loading: include skinny versions of lazily loaded tiddlers in the index.html * Introduce _is_skinny field for indicating that a tiddler is subject to lazy loading * Remove savetrail plugin from prerelease It doesn't yet work with the new syncer * Make the savetrail plugin work again * Clear outstanding alerts when synchronisation is restored * Logger: only remove alerts from the same component Missed off 9f5c0de07 * Make the saving throttle interval configurable (#4385) After switching Bob to use the core syncer the throttle interval makes saving feel very sluggish compared to the message queue setup that I had before. The editing lock that I use to prevent conflicts with multiple users doesn't go away until the save is completed, and with the 1 second delay it means that if you edit a tiddler and save it than you have to wait one second before you can edit it again. * Tweaks to appearance of alerts * Exclude temp tiddlers from offline snapshots Otherwise alerts will persist * Tweak appearance of status line in dropdown * Update release note * Web server: Don't include full path in error messages Fixes #3724 * In change event handler check for deletions * Disable the official plugin library when the tiddlyweb plugin is loaded * Hide error details from browser for /files/ route See https://github.com/Jermolene/TiddlyWiki5/issues/3724#issuecomment-565702492 -- thanks @pmario * Revert all the changes to the relationship between the syncer and the syncadaptor Previously we had some major rearrangements to make it possible for the syncadaptor to route it's logging to the logger used by the syncer. The motivation is so that the "copy logs to clipboard" button is more useful. On reflection, changing the interface this drastically is undesirable from a backwards compatibility perspective, so I'm going to investigate other ways to achieve the logger sharing * Make the tiddlyweb adaptor use the syncer's logger So that both are availavble when copying the syncer logs to the clipboard * Update release note * Support setting port=0 to get an OS assigned port Quite useful * Update code comment * UI: Use "Get latest changes from server" instead of "Refresh" * Add getUpdatedTiddlers() method to syncadaptor API See https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-573579495 * Refactor revision handling within the syncer Thanks @pmario * Fix typo in tiddlywebadaptor * Improve presentation of errors See https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-573695267 * Add docs for getTiddlerRevision() * Remove unused error animation * Update comment for GET /recipes/default/tiddlers/tiddlers.json * Optimise SVG cloud image * Add optional list of allowed filters for get all tiddlers route An attempt to address @Arlen22's concern here: https://github.com/Jermolene/TiddlyWiki5/pull/4373#pullrequestreview-342146190 * Fix network error alert text translatability * Fix error code and logging for GET /recipes/default/tiddlers/tiddlers.json Thanks @Arlen22 * Flip GET /recipes/default/tiddlers/tiddlers.json allowed filter handling to be secure by default * Validate updates received from getUpdatedTiddlers() * Add syncer method to force loading of a tiddler from the server * Remove the release note update to remove the merge conflict * Fix crash when there's no config section in the tiddlywiki.info file * Use config tiddler title to check filter query (merge into fix-syncer) (#4478) * Use config tiddler title to check filter query * Create config-tiddlers-filter.tid * Add config switch to enable all filters on GET /recipes/default/tiddlers/tiddlers.json And update docs * Fix bug when deleting a tiddler with a shadow Reported by @kookma at https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-604027528 Co-authored-by: jed <inmysocks@fastmail.com> Co-authored-by: Arlen22 <arlenbee@gmail.com>
2020-03-30 14:24:05 +00:00
top: 7px;
right: 7px;
2021-05-19 13:12:12 +00:00
line-height: 0;
}
.tc-alert-toolbar svg {
fill: <<colour alert-muted-foreground>>;
2014-02-15 17:36:49 +00:00
}
.tc-alert-subtitle {
color: <<colour alert-muted-foreground>>;
font-weight: bold;
2021-05-19 13:12:12 +00:00
font-size: 0.8em;
margin-bottom: 0.5em;
Fix syncer to handler errors properly (#4373) * First commit * Add throttling of saves Now we refuse to save a tiddler more often than once per second. * Wait for a timeout before trying again after an error * Modest optimisations of isDirty() method * Synchronise system tiddlers and deletions from the server Fixes two long-standing issues: * Changes to system tiddlers are not synchronised from the server to the browser * Deletions of tiddlers on the server are not propagated to browser clients * Make sure we update the dirty status even if there isn't a task to perform * Replace save-wiki button with popup sync menu * Remove the "Server" control panel tab We don't need it with the enhanced sync dropdown * Add indentation to the save-wiki button * Fix spacing in dropdown menu items * Switch between cloud icons according to dirty status * Add a menu item to copy syncer logs to the clipboard * Improve animated icon * Remove indentation from save-wiki button @pmario the annoying thing is that using `\trim whitespace` trims significant whitespace too, so it means we have to use <$text text=" "/> when we need a space that won't be trimmed. For the moment, I've removed the indentation but will keep thinking about it. * Further icon, UI and copy text tweaks Move the icons and styles from the core into the TiddlyWeb plugin * Clean up PR diff * Tweak animation durations * Break the actions from the syncer dropdown into separate tiddlers @pmario I think this makes things a bit easier to follow * Refactor syncadaptor creation and logging The goal is for the syncadaptor to be able to log to the same logger as the syncer, so that the "copy syncer logs to clipboard" data is more useful. * Don't transition the dirty indicator container colour, just the SVG's colour * Only trigger a sync for changes to tiddlers we're interested in Otherwise it is triggered by the creation of the alert tiddlers used to display errors. * Restore deleting local tiddlers removed from the server (I had commented it out for some testing and accidentally commited it). * Guard against missing adaptor info * We still need to trigger a timeout when there was no task to process * Avoid repeatedly polling for changes Instead we only trigger a timeout call at if there is a pending task (ie a tiddler that has changed but isn't yet old enough to save). * Lazy loading: include skinny versions of lazily loaded tiddlers in the index.html * Introduce _is_skinny field for indicating that a tiddler is subject to lazy loading * Remove savetrail plugin from prerelease It doesn't yet work with the new syncer * Make the savetrail plugin work again * Clear outstanding alerts when synchronisation is restored * Logger: only remove alerts from the same component Missed off 9f5c0de07 * Make the saving throttle interval configurable (#4385) After switching Bob to use the core syncer the throttle interval makes saving feel very sluggish compared to the message queue setup that I had before. The editing lock that I use to prevent conflicts with multiple users doesn't go away until the save is completed, and with the 1 second delay it means that if you edit a tiddler and save it than you have to wait one second before you can edit it again. * Tweaks to appearance of alerts * Exclude temp tiddlers from offline snapshots Otherwise alerts will persist * Tweak appearance of status line in dropdown * Update release note * Web server: Don't include full path in error messages Fixes #3724 * In change event handler check for deletions * Disable the official plugin library when the tiddlyweb plugin is loaded * Hide error details from browser for /files/ route See https://github.com/Jermolene/TiddlyWiki5/issues/3724#issuecomment-565702492 -- thanks @pmario * Revert all the changes to the relationship between the syncer and the syncadaptor Previously we had some major rearrangements to make it possible for the syncadaptor to route it's logging to the logger used by the syncer. The motivation is so that the "copy logs to clipboard" button is more useful. On reflection, changing the interface this drastically is undesirable from a backwards compatibility perspective, so I'm going to investigate other ways to achieve the logger sharing * Make the tiddlyweb adaptor use the syncer's logger So that both are availavble when copying the syncer logs to the clipboard * Update release note * Support setting port=0 to get an OS assigned port Quite useful * Update code comment * UI: Use "Get latest changes from server" instead of "Refresh" * Add getUpdatedTiddlers() method to syncadaptor API See https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-573579495 * Refactor revision handling within the syncer Thanks @pmario * Fix typo in tiddlywebadaptor * Improve presentation of errors See https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-573695267 * Add docs for getTiddlerRevision() * Remove unused error animation * Update comment for GET /recipes/default/tiddlers/tiddlers.json * Optimise SVG cloud image * Add optional list of allowed filters for get all tiddlers route An attempt to address @Arlen22's concern here: https://github.com/Jermolene/TiddlyWiki5/pull/4373#pullrequestreview-342146190 * Fix network error alert text translatability * Fix error code and logging for GET /recipes/default/tiddlers/tiddlers.json Thanks @Arlen22 * Flip GET /recipes/default/tiddlers/tiddlers.json allowed filter handling to be secure by default * Validate updates received from getUpdatedTiddlers() * Add syncer method to force loading of a tiddler from the server * Remove the release note update to remove the merge conflict * Fix crash when there's no config section in the tiddlywiki.info file * Use config tiddler title to check filter query (merge into fix-syncer) (#4478) * Use config tiddler title to check filter query * Create config-tiddlers-filter.tid * Add config switch to enable all filters on GET /recipes/default/tiddlers/tiddlers.json And update docs * Fix bug when deleting a tiddler with a shadow Reported by @kookma at https://github.com/Jermolene/TiddlyWiki5/pull/4373#issuecomment-604027528 Co-authored-by: jed <inmysocks@fastmail.com> Co-authored-by: Arlen22 <arlenbee@gmail.com>
2020-03-30 14:24:05 +00:00
}
.tc-alert-body > p {
margin: 0;
}
.tc-alert-highlight {
color: <<colour alert-highlight>>;
}
@media (min-width: <<sidebarbreakpoint>>) {
.tc-static-alert {
position: relative;
}
.tc-static-alert-inner {
position: absolute;
z-index: 100;
}
}
.tc-static-alert-inner {
padding: 0 2px 2px 42px;
color: <<colour static-alert-foreground>>;
}
/*
** Floating drafts list
*/
.tc-drafts-list {
z-index: 2000;
position: fixed;
font-size: 0.8em;
left: 0;
bottom: 0;
}
.tc-drafts-list a {
margin: 0 0.5em;
padding: 4px 4px;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
border: 1px solid <<colour background>>;
border-bottom: none;
background: <<colour dirty-indicator>>;
color: <<colour background>>;
fill: <<colour background>>;
}
.tc-drafts-list a:hover {
text-decoration: none;
background: <<colour foreground>>;
color: <<colour background>>;
fill: <<colour background>>;
}
.tc-drafts-list a svg {
width: 1em;
height: 1em;
vertical-align: text-bottom;
}
/*
** Control panel
*/
.tc-control-panel td {
padding: 4px;
}
.tc-control-panel table, .tc-control-panel table input, .tc-control-panel table textarea {
width: 100%;
}
2013-11-27 21:30:11 +00:00
.tc-plugin-info {
2019-09-19 12:20:07 +00:00
display: flex;
text-shadow: none;
border: 1px solid <<colour muted-foreground>>;
2019-09-19 12:20:07 +00:00
fill: <<colour muted-foreground>>;
background-color: <<colour background>>;
margin: 0.5em 0 0.5em 0;
padding: 4px;
2021-05-19 13:12:12 +00:00
align-items: center;
}
.tc-sidebar-lists a.tc-tiddlylink.tc-plugin-info {
color: <<colour tiddler-link-foreground>>;
}
.tc-plugin-info-sub-plugins .tc-plugin-info {
2021-05-19 13:12:12 +00:00
margin: 0.5em;
background: <<colour background>>;
}
.tc-plugin-info-sub-plugin-indicator {
margin: -16px 1em 0 2em;
}
.tc-plugin-info-sub-plugin-indicator button {
color: <<colour background>>;
background: <<colour foreground>>;
border-radius: 8px;
2021-05-19 13:12:12 +00:00
padding: 2px 7px;
font-size: 0.75em;
}
2019-09-25 20:56:54 +00:00
.tc-plugin-info-sub-plugins .tc-plugin-info-dropdown {
margin-left: 1em;
margin-right: 1em;
}
.tc-plugin-info-disabled {
2014-08-15 20:10:40 +00:00
background: -webkit-repeating-linear-gradient(45deg, #ff0, #ff0 10px, #eee 10px, #eee 20px);
background: repeating-linear-gradient(45deg, #ff0, #ff0 10px, #eee 10px, #eee 20px);
}
.tc-plugin-info-disabled:hover {
2014-08-15 20:10:40 +00:00
background: -webkit-repeating-linear-gradient(45deg, #aa0, #aa0 10px, #888 10px, #888 20px);
background: repeating-linear-gradient(45deg, #aa0, #aa0 10px, #888 10px, #888 20px);
}
a.tc-tiddlylink.tc-plugin-info:hover {
text-decoration: none;
background-color: <<colour primary>>;
color: <<colour background>>;
fill: <<colour foreground>>;
}
a.tc-tiddlylink.tc-plugin-info:hover > .tc-plugin-info-chunk > svg {
fill: <<colour background>>;
}
.tc-plugin-info-chunk {
2021-05-19 13:12:12 +00:00
margin: 2px;
2019-09-19 12:20:07 +00:00
}
.tc-plugin-info-chunk.tc-plugin-info-toggle {
flex-grow: 0;
flex-shrink: 0;
line-height: 1;
2019-09-19 12:20:07 +00:00
}
.tc-plugin-info-chunk.tc-plugin-info-icon {
flex-grow: 0;
flex-shrink: 0;
line-height: 1;
}
2019-09-19 12:20:07 +00:00
.tc-plugin-info-chunk.tc-plugin-info-description {
flex-grow: 1;
}
.tc-plugin-info-chunk.tc-plugin-info-buttons {
font-size: 0.8em;
line-height: 1.2;
flex-grow: 0;
flex-shrink: 0;
2021-05-19 13:12:12 +00:00
text-align: right;
2019-09-19 12:20:07 +00:00
}
.tc-plugin-info-chunk.tc-plugin-info-description h1 {
font-size: 1em;
2019-09-19 12:20:07 +00:00
line-height: 1.2;
margin: 2px 0 2px 0;
}
2019-09-19 12:20:07 +00:00
.tc-plugin-info-chunk.tc-plugin-info-description h2 {
font-size: 0.8em;
2019-09-19 12:20:07 +00:00
line-height: 1.2;
margin: 2px 0 2px 0;
}
2019-09-19 12:20:07 +00:00
.tc-plugin-info-chunk.tc-plugin-info-description div {
font-size: 0.7em;
2019-09-19 12:20:07 +00:00
line-height: 1.2;
margin: 2px 0 2px 0;
}
2019-09-19 12:20:07 +00:00
.tc-plugin-info-chunk.tc-plugin-info-toggle img, .tc-plugin-info-chunk.tc-plugin-info-toggle svg {
width: 1em;
height: 1em;
}
2019-09-19 12:20:07 +00:00
.tc-plugin-info-chunk.tc-plugin-info-icon img, .tc-plugin-info-chunk.tc-plugin-info-icon svg {
width: 2em;
height: 2em;
}
.tc-plugin-info-dropdown {
border: 1px solid <<colour muted-foreground>>;
background: <<colour background>>;
margin-top: -8px;
}
.tc-plugin-info-dropdown-message {
background: <<colour message-background>>;
padding: 0.5em 1em 0.5em 1em;
font-weight: bold;
font-size: 0.8em;
}
.tc-plugin-info-dropdown-body {
padding: 1em 1em 0 1em;
background: <<colour background>>;
}
.tc-plugin-info-sub-plugins {
padding: 0.5em;
2021-05-19 13:12:12 +00:00
margin: 0 1em 1em 1em;
background: <<colour notification-background>>;
}
.tc-install-plugin {
2019-09-19 12:20:07 +00:00
font-weight: bold;
background: green;
color: white;
fill: white;
border-radius: 4px;
padding: 3px;
}
.tc-install-plugin.tc-reinstall-downgrade {
background: red;
}
.tc-install-plugin.tc-reinstall {
2019-09-19 12:20:07 +00:00
background: blue;
}
.tc-install-plugin.tc-reinstall-upgrade {
background: orange;
}
2019-09-19 12:20:07 +00:00
.tc-check-list {
line-height: 2em;
}
.tc-check-list .tc-image-button {
height: 1.5em;
}
2013-11-27 21:30:11 +00:00
/*
** Message boxes
*/
.tc-message-box {
border: 1px solid <<colour message-border>>;
background: <<colour message-background>>;
2013-11-27 21:30:11 +00:00
padding: 0px 21px 0px 21px;
2013-11-28 07:41:28 +00:00
font-size: 12px;
line-height: 18px;
color: <<colour message-foreground>>;
2013-11-27 21:30:11 +00:00
}
.tc-message-box svg {
width: 1em;
height: 1em;
2021-05-19 13:12:12 +00:00
vertical-align: text-bottom;
}
/*
** Pictures
*/
.tc-bordered-image {
border: 1px solid <<colour muted-foreground>>;
padding: 5px;
margin: 5px;
}
/*
** Floats
*/
.tc-float-right {
2013-11-27 21:30:11 +00:00
float: right;
}
2014-02-20 10:00:38 +00:00
/*
** Chooser
*/
2014-08-28 18:41:29 +00:00
.tc-chooser {
border-right: 1px solid <<colour table-header-background>>;
border-left: 1px solid <<colour table-header-background>>;
2014-02-20 10:00:38 +00:00
}
2014-08-28 18:41:29 +00:00
.tc-chooser-item {
border-bottom: 1px solid <<colour table-header-background>>;
border-top: 1px solid <<colour table-header-background>>;
padding: 2px 4px 2px 14px;
}
.tc-drop-down .tc-chooser-item {
padding: 2px;
}
.tc-chosen,
.tc-chooser-item:hover {
background-color: <<colour table-header-background>>;
border-color: <<colour table-footer-background>>;
2014-02-20 10:00:38 +00:00
}
.tc-chosen .tc-tiddlylink {
cursor:default;
}
.tc-chooser-item .tc-tiddlylink {
2014-02-20 10:00:38 +00:00
display: block;
2014-03-05 04:15:53 +00:00
text-decoration: none;
background-color: transparent;
2014-02-20 10:00:38 +00:00
}
.tc-chooser-item:hover .tc-tiddlylink:hover {
2014-02-20 10:00:38 +00:00
text-decoration: none;
}
.tc-drop-down .tc-chosen .tc-tiddlylink,
.tc-drop-down .tc-chooser-item .tc-tiddlylink:hover {
color: <<colour foreground>>;
}
.tc-chosen > .tc-tiddlylink:before {
margin-left: -10px;
position: relative;
content: "» ";
}
.tc-chooser-item svg,
.tc-chooser-item img{
width: 1em;
height: 1em;
vertical-align: middle;
}
.tc-language-chooser .tc-image-button img {
width: 2em;
vertical-align: -0.15em;
2014-02-20 10:00:38 +00:00
}
/*
** Palette swatches
*/
2014-08-28 18:41:29 +00:00
.tc-swatches-horiz {
}
2014-08-28 18:41:29 +00:00
.tc-swatches-horiz .tc-swatch {
display: inline-block;
}
2014-08-28 18:41:29 +00:00
.tc-swatch {
width: 2em;
height: 2em;
2015-05-05 17:53:30 +00:00
margin: 0.4em;
border: 1px solid #888;
}
input.tc-palette-manager-colour-input {
width: 100%;
padding: 0;
}
2014-06-21 10:17:04 +00:00
/*
** Table of contents
*/
2014-08-28 18:41:29 +00:00
.tc-sidebar-lists .tc-table-of-contents {
2014-06-21 10:17:04 +00:00
white-space: nowrap;
}
.tc-table-of-contents button,
.tc-table-of-contents .toc-item-muted {
2014-08-02 21:49:30 +00:00
color: <<colour sidebar-foreground>>;
}
2014-08-28 18:41:29 +00:00
.tc-table-of-contents svg {
2014-06-21 10:49:42 +00:00
width: 0.7em;
height: 0.7em;
vertical-align: middle;
2014-08-02 21:49:30 +00:00
fill: <<colour sidebar-foreground>>;
2014-06-21 10:49:42 +00:00
}
2014-08-28 18:41:29 +00:00
.tc-table-of-contents ol {
2014-06-21 10:17:04 +00:00
list-style-type: none;
padding-left: 0;
}
2014-08-28 18:41:29 +00:00
.tc-table-of-contents ol ol {
2014-06-21 10:17:04 +00:00
padding-left: 1em;
}
2014-08-28 18:41:29 +00:00
.tc-table-of-contents li {
2014-06-21 10:17:04 +00:00
font-size: 1.0em;
font-weight: bold;
}
2014-08-28 18:41:29 +00:00
.tc-table-of-contents li a {
2014-06-21 10:17:04 +00:00
font-weight: bold;
}
2014-08-28 18:41:29 +00:00
.tc-table-of-contents li li {
2014-06-21 10:17:04 +00:00
font-size: 0.95em;
font-weight: normal;
line-height: 1.4;
}
2014-08-28 18:41:29 +00:00
.tc-table-of-contents li li a {
2014-06-21 10:17:04 +00:00
font-weight: normal;
}
2014-08-28 18:41:29 +00:00
.tc-table-of-contents li li li {
2014-06-21 10:17:04 +00:00
font-size: 0.95em;
font-weight: normal;
2014-06-21 10:17:04 +00:00
line-height: 1.5;
}
2014-08-28 18:41:29 +00:00
.tc-table-of-contents li li li li {
2014-06-21 10:17:04 +00:00
font-size: 0.95em;
font-weight: normal;
2014-06-21 10:17:04 +00:00
}
2014-11-13 21:39:28 +00:00
.tc-tabbed-table-of-contents {
display: -webkit-flex;
display: flex;
}
.tc-tabbed-table-of-contents .tc-table-of-contents {
z-index: 100;
display: inline-block;
padding-left: 1em;
max-width: 50%;
-webkit-flex: 0 0 auto;
flex: 0 0 auto;
background: <<colour tab-background>>;
border-left: 1px solid <<colour tab-border>>;
border-top: 1px solid <<colour tab-border>>;
border-bottom: 1px solid <<colour tab-border>>;
}
.tc-tabbed-table-of-contents .tc-table-of-contents .toc-item > a,
.tc-tabbed-table-of-contents .tc-table-of-contents .toc-item-selected > a {
display: block;
padding: 0.12em 1em 0.12em 0.25em;
}
.tc-tabbed-table-of-contents .tc-table-of-contents .toc-item > a {
border-top: 1px solid <<colour tab-background>>;
border-left: 1px solid <<colour tab-background>>;
border-bottom: 1px solid <<colour tab-background>>;
}
.tc-tabbed-table-of-contents .tc-table-of-contents .toc-item > a:hover {
text-decoration: none;
border-top: 1px solid <<colour tab-border>>;
border-left: 1px solid <<colour tab-border>>;
border-bottom: 1px solid <<colour tab-border>>;
background: <<colour tab-border>>;
}
.tc-tabbed-table-of-contents .tc-table-of-contents .toc-item-selected > a {
border-top: 1px solid <<colour tab-border>>;
border-left: 1px solid <<colour tab-border>>;
border-bottom: 1px solid <<colour tab-border>>;
background: <<colour background>>;
margin-right: -1px;
}
.tc-tabbed-table-of-contents .tc-table-of-contents .toc-item-selected > a:hover {
text-decoration: none;
}
.tc-tabbed-table-of-contents .tc-tabbed-table-of-contents-content {
display: inline-block;
vertical-align: top;
padding-left: 1.5em;
2014-11-13 21:49:19 +00:00
padding-right: 1.5em;
2014-11-13 21:39:28 +00:00
border: 1px solid <<colour tab-border>>;
-webkit-flex: 1 0 50%;
flex: 1 0 50%;
}
/*
** Dirty indicator
*/
html body svg.tc-image-save-button-dynamic .tc-image-save-button-dynamic-clean {
visibility: visible;
}
html body svg.tc-image-save-button-dynamic .tc-image-save-button-dynamic-dirty {
visibility: hidden;
}
html body.tc-dirty svg.tc-image-save-button-dynamic .tc-image-save-button-dynamic-clean {
visibility: hidden;
}
html body.tc-dirty svg.tc-image-save-button-dynamic .tc-image-save-button-dynamic-dirty {
visibility: visible;
}
html body.tc-dirty span.tc-dirty-indicator, html body.tc-dirty span.tc-dirty-indicator svg {
fill: <<colour dirty-indicator>>;
color: <<colour dirty-indicator>>;
}
2014-08-02 10:59:07 +00:00
/*
** File inputs
*/
2014-08-28 18:41:29 +00:00
.tc-file-input-wrapper {
2014-08-02 10:59:07 +00:00
position: relative;
2014-08-02 11:05:01 +00:00
overflow: hidden;
2014-08-02 11:16:14 +00:00
display: inline-block;
vertical-align: middle;
2014-08-02 10:59:07 +00:00
}
2014-08-28 18:41:29 +00:00
.tc-file-input-wrapper input[type=file] {
2014-08-02 10:59:07 +00:00
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
font-size: 999px;
max-width: 100%;
max-height: 100%;
filter: alpha(opacity=0);
opacity: 0;
outline: none;
background: white;
cursor: pointer;
display: inline-block;
}
::-webkit-file-upload-button {
cursor:pointer;
}
/*
2015-03-25 11:11:18 +00:00
** Thumbnail macros
*/
.tc-thumbnail-wrapper {
position: relative;
display: inline-block;
margin: 6px;
vertical-align: top;
}
.tc-thumbnail-right-wrapper {
float:right;
margin: 0.5em 0 0.5em 0.5em;
}
.tc-thumbnail-image {
2016-04-29 16:02:05 +00:00
text-align: center;
overflow: hidden;
border-radius: 3px;
}
.tc-thumbnail-image svg,
.tc-thumbnail-image img {
filter: alpha(opacity=1);
opacity: 1;
2016-04-29 16:02:05 +00:00
min-width: 100%;
min-height: 100%;
max-width: 100%;
}
.tc-thumbnail-wrapper:hover .tc-thumbnail-image svg,
.tc-thumbnail-wrapper:hover .tc-thumbnail-image img {
filter: alpha(opacity=0.8);
opacity: 0.8;
}
.tc-thumbnail-background {
position: absolute;
border-radius: 3px;
}
.tc-thumbnail-icon svg,
.tc-thumbnail-icon img {
width: 3em;
height: 3em;
<<filter "drop-shadow(2px 2px 4px rgba(0,0,0,0.3))">>
}
.tc-thumbnail-wrapper:hover .tc-thumbnail-icon svg,
.tc-thumbnail-wrapper:hover .tc-thumbnail-icon img {
fill: #fff;
<<filter "drop-shadow(3px 3px 4px rgba(0,0,0,0.6))">>
}
.tc-thumbnail-icon {
position: absolute;
2015-04-01 13:08:16 +00:00
top: 0;
left: 0;
right: 0;
bottom: 0;
display: -webkit-flex;
2015-05-10 08:25:37 +00:00
-webkit-align-items: center;
-webkit-justify-content: center;
display: flex;
align-items: center;
justify-content: center;
}
.tc-thumbnail-caption {
position: absolute;
background-color: #777;
color: #fff;
text-align: center;
bottom: 0;
width: 100%;
filter: alpha(opacity=0.9);
opacity: 0.9;
line-height: 1.4;
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
}
.tc-thumbnail-wrapper:hover .tc-thumbnail-caption {
filter: alpha(opacity=1);
opacity: 1;
}
/*
** Diffs
*/
.tc-diff-equal {
background-color: <<colour diff-equal-background>>;
color: <<colour diff-equal-foreground>>;
}
.tc-diff-insert {
background-color: <<colour diff-insert-background>>;
color: <<colour diff-insert-foreground>>;
}
.tc-diff-delete {
background-color: <<colour diff-delete-background>>;
color: <<colour diff-delete-foreground>>;
}
.tc-diff-invisible {
background-color: <<colour diff-invisible-background>>;
color: <<colour diff-invisible-foreground>>;
}
.tc-diff-tiddlers th {
text-align: right;
background: <<colour background>>;
font-weight: normal;
font-style: italic;
}
.tc-diff-tiddlers pre {
2021-05-19 13:12:12 +00:00
margin: 0;
padding: 0;
border: none;
background: none;
}
/*
** Errors
*/
.tc-error {
background: #f00;
color: #fff;
}
/*
** Tree macro
*/
.tc-tree div {
2021-05-19 13:12:12 +00:00
padding-left: 14px;
}
.tc-tree ol {
2021-05-19 13:12:12 +00:00
list-style-type: none;
padding-left: 0;
margin-top: 0;
}
.tc-tree ol ol {
2021-05-19 13:12:12 +00:00
padding-left: 1em;
}
2021-05-19 13:12:12 +00:00
.tc-tree button {
color: #acacac;
}
.tc-tree svg {
2021-05-19 13:12:12 +00:00
fill: #acacac;
}
.tc-tree span svg {
2021-05-19 13:12:12 +00:00
width: 1em;
height: 1em;
vertical-align: baseline;
}
.tc-tree li span {
2021-05-19 13:12:12 +00:00
color: lightgray;
}
select {
2021-05-19 13:12:12 +00:00
color: <<colour select-tag-foreground>>;
background: <<colour select-tag-background>>;
}
Improve translink macro, fixes 4877 (#7425) * Improve translink macro Changes: - Change styles to adapt colours to the current palette, instead of hard-coded white inside black box with grey borders. - Simplify the design to a single div (inspired by the Community links on tiddlywiki.com), instead of two nested contrasting divs. Comments: - I found pre-border and pre-background to be the most consistently readable across the default palettes (better than relying on e.g. tiddler-border, tiddler-background, page-background, code-border, code-background). Cupertino Dark, Gruvbox Dark, Nord, Solar Flare, Spartan Day, Spartan Night, Spartan Day, and Twilight have same or very similar pre-border and pre-background colours, so if the macro is nested (translinking a tiddler that contains a translink), the inner frames are not distinguishable, but I think it's an acceptable edge case. - Padding is defined separately for block and inline modes of the macro to make it appear consistent. * Update translink macro Change the `<h1>` styling so that it is only applied to the transcluded tiddler's title and not to any potential `<h1>` in its text. * Update translink macro Change the class-constructing filter so that the empty message is displayed with consistent padding in block mode. * Update translink.tid * Add styles for translink macro to vanilla/base.tid Split `pre` element styling, to allow part of it be reused with `.tc-pre-border` (used by translink macro). Add `.tc-big-bold` class under Other utility classes (used by translink macro). * Update base.tid Add `.tc-big-bold` class under Other utility classes (used by translink macro). * Update translink.tid Update `tc-pre-border` class name to match the one in vanilla/base.tid * Update translink.tid Simplify by always wrapping transclusion in `<p>` element (adjusts padding when inline mode or tiddler missing). * Update translink.tid Localise missing tiddler message (`$:/language/MissingTiddler/Hint`) * Update vanilla/base.tid - Modify class `tc-pre-background`, so that it can be applied to elements other than `pre`. The styling of `pre` remains unchanged, it is only split into two parts, for one part to be reused in the `tc-pre-background` class (used e.g. in translink macro). - Add `tc-big-v-gap` and `tc-big-bold` in the *Other utility classes* section (used e.g. in translink macro). * Update translink.tid Improve styling to depend only on classes specified in vanilla/base.tid * Update base.tid Update class `tc-translink` and CSS selectors to make styling the translink macro easier * Update translink.tid Change the classes of elements, so that changing the style is possible by modifying the stylesheet only * Update base.tid Add selectors to support new inline mode in translink macro * Update translink.tid Change behaviour of the inline mode, now the whole macro is inline, not just the transcluded text. * Update base.tid Fix padding of tc-translink class to account for multiline inline content. * Update base.tid Remove pseudo-element parentheses from inline translink macro * Update translink.tid Add parentheses around inline macro
2023-05-10 20:57:15 +00:00
/*
** Translink macro
*/
.tc-translink {
background-color: <<colour pre-background>>;
border: 1px solid <<colour pre-border>>;
padding: 0 3px;
border-radius: 3px;
}
div.tc-translink > div {
margin: 1em;
}
div.tc-translink > div > a:first-child > h1 {
font-size: 1.2em;
font-weight: bold;
}
span.tc-translink > a:first-child {
font-weight: bold;
}
Parameterised transclusions (#6666) * Initial commit Everything is draft. * Fix test execution * Fix and test missing target handling * Use the ubertransclude widget for the wikitext transclusion syntax * Changed transclude widget in binary parser to ubertransclude * Add a test for custom action widgets * Don't worry about ordered attributes The changes in 0bffae21088aafc0cdebafe6a5de7907d7c52a3a mean that we don't need to explicitly maintain the ordered attributes * Remove need to explicitly clear widget mapping variable when invoking overridden widget * Use ts- prefix for system slot names * Add a definition for the value widget just so that it doesn't cause errors Of course, it doesn't actually need to be a JS widget, it could be a wikitext widget... * Add support for positional parameters * Ubertransclusion positional parameters should be based on name, not position * Add support for shortcut syntax for positional transclusion parameters * Importvariables should skip parameters widgets * Refactor transclude widget before uberfying it * Refactor ubertransclude functionality into transclude widget * Replace ubertransclude widget with transclude widget * Add wikitext shortcut for new-style function definitions * Allow brackets to be omitted for function definitions with no parameters * Add pragma rule for parameters declarations * Remove erroneous "tag" property * Add support for accessing function parameters as name/value pairs * Be as permissive as possible with parameter names Previously restricted to upper and lower case, digits and dash and underscore * Rewrite some tests to use the shortcut syntaxes * Mustn't allow commas in parameter names * Fix crash when transcluding an undefined variable Thanks @pmario See https://github.com/Jermolene/TiddlyWiki5/pull/6666#issuecomment-1114692359 * Unquoted parameters should not eat a succeeding comma Fixes #6672 * Remove extraneous code * Allow the let widget to create variables starting with $ * Fix addAttributeToParseTreeNode handling of ordered attributes * Reuse attribute objects when executing custom widgets * Fix importing of function definitions * Fix parameter handling * Introduce genesis widget for dynamically creating widgets See the "RedefineLet" test for a contrived example of usage * Change tiddler separator used in wikitext tests Underscore looked ambiguous; I kept typing dashes by accident * Cache parse trees when transcluding variables * Fix bug with empty strings ignored in $tw.utils.stringifyList/parseStringArray I will pull this out into a separate PR. Fixing it doesn't cause problems for the core but I imagine it might cause issues for 3rd party code. * Fixes to enable the transclude widget itself to be overridden There are two big changes here: Replace the previous "ts-wrapper" mechanism, which we had been using to redefine custom widgets inside their definitions to prevent recursive calls. Now we've got the genesis widget we can instead control recursion through a new "$remappable" attribute that allows the custom widget mechanism to be skipped. We also extend the slot widget to allow a depth to be specified; it then reaches up by the indicated number of transclusion widgets to find the one from which it should retrieve the slot value. * Fix genesis widget example * Use enlist:raw to preserve duplicates * Don't create variables with value undefined for missing parameters * Fix variable retrieval bug with test harness * Improve recursion detection While retaining backwards compatibility * Experimental support for custom filter operators Just as we can define custom widgets we can also define custom parameterised filter operators * Add visible transclusions component and demo Very useful to see transclusions explicitly Makes a good demo of a super-complicated widget override. * Genesis widget should pass raw attributes onto child widget... ...so that it can more efficiently handle refreshing itself. * Use consistent parse tree node property for params * Extend transclude widget to work with old-style macros and use it for the macrocall shortcut syntax * Clarify that the recent changes allow functions to be invoked with the double bracket syntax In other words, the transclude widget distinguishes between functions and macros and handles the parameters appropriately * Make the macrocall widget delegate to the transclude widget * Switch to using \procedure to define new-style macros, and \function for custom filter operator functions I now need to update the OP! * Fix visible transclusion example * Remove obsolete code Left over after refactoring * Better backwards compatibility for legacy recursion marker Fixes the problem with tag dropdowns @btheado * Fix stringifying/parsing string arrays containing newlines A very old bug. Fixes the ActionListOpsWidget problem @btheado * Transclude: replace paramNames/paramValues with more robust JSON payload More details at https://github.com/Jermolene/TiddlyWiki5/pull/6666#issuecomment-1123719153 * Rename internal "unknown" filter operator so that users cannot invoke it * Detect recursion by tracking widget tree depth The old recursion marker approach was very slow, and didn't catch test cases like editions/test/tiddlers/tests/data/transclude/Recursion.tid * Use \widget for custom widget definitions, and remove need for angle brackets Need to do some refactoring of all those isFunctionDefinition/isProcedureDefinition/isWidgetDefinition flags into a single property * Rename <$value> widget to <$fill> * Require $$ for custom widgets, and that overridden JS widgets must exist See https://github.com/Jermolene/TiddlyWiki5/pull/6666#issuecomment-1133637763 * Fix invocation of JS macros * Experimental update of the parse-tree preview visualisation An experiment to try out using the new JSON operators for rendering the JSON parse tree that we get back from the wikify widget. As usual with these experiments, this one is going to require quite a lot more work to finish up: * The formatting is via direct styles rather than classes * The formatting for attributes and properties is not yet completed * The same thing needs to also be done to the widget tree preview * Procedures and widgets inherit whitespace trim setting from their definition * Missed off 22e7ec23811b137a119295b5ce72bccdc18a697a * Require period prefix for custom filter operator functions To ensure that custom filter operators cannot clash with future core operators. * Allow custom functions to be invoked as attributes * WIP * Remove unneeded test tiddler * Make is[variable] and variables[] operators resilient to fake widgets * Fix importvariables to work with setvariables as well as set (they are aliases) * Add support for $:/tags/Global * Remove accidental commit 6cc99fcbe33da47cfcb1335d0742b16ea1b9ce03 * Add utility function for parsing macro parameter definitions * Introduce true global variables The basic idea is that if we don't find a variable `foo` then we fallback to retrieving the value from the tiddler `$:/global/foo`, if it exists. This allows us to replace the usual importvariables-based mechanism for global definitions, avoiding cluttering up the variable namespace with every macro. In order to permit subprocedures to be overridden, we also introduce a mechanism for conditional definitions: preceding the word definition|procedure|function|widget with a + causes the definition only to occur if the specified variable doesn't already exist. In the next commit we'll apply this mechanism to the tabs macro * Convert the tabs macro into a global So far it appears to be totally backwards compatible... In practice, I think maybe this and the conversion of the other macros should go into a separate subsequent PR. * Change to `?` for conditional definitions * Fix tabs global so it doesn't crash when viewed directly * Test showing how to un-override a core widget * Cleaning up after f63634900724eda937286d946b2e6f65fcf6d503 * Minor cleanups * Clean up unknown filter * Introduce function operator for calling functions Can invoke any functions, not just those start with a period. And can pass zero parameters (in contrast when invoked as a custom filter operator there's no way to omit the first parameter). * Use underscores for new system fields for global variable tiddlers For consistency with `_canonical_uri`; unlike many system fields, the behaviour of these fields is baked into the core JS code. * Refactor $parameters widget The objective is to add a $depth attribute so that it is possible to reach up to retrieve the parameters of ancestor transclusions. However, doing so requires changing the encoding of parameter names so that it is not possible for a user parameter to clash with an attribute like $depth. So now we have to double up dollars on any attribute names seen by the parameters widget, just like with the transclude widget itself. * Fix refreshing of global variables Global variables access within attributes will automatically trigger a refresh if the attribute text changes, but that wasn't happening for transclusions. * Remove support for $:/tags/Global It is not needed now that we have true global variables * Typo from f513b403fe911442bcbaf0628fa47d3d2ed3cf93 * Make slot fill data available to transclusions Allows transcluded content to dynamically process <$fill> widgets within the calling transclusion * Mark docs as v5.3.0 * Simplify metaparameters implementation * Fix typo * Adjust naming of transclusion metaparameter * Fix up handling of slot/fill for custom widgets Previously we were wrapping the body in an implicit `<$fill $name="ts-body">` widget * Add format:json operator I've been finding this useful for debugging, and it kind of goes with the JSON operators * Docs: JSON operators and tweaks to genesis widget * Docs: format:json Also tweak to the behaviour of format:json if the input string is not valid JSON * Fix #6721 * Revert "Fix #6721" This reverts commit b216579255d6e6214f3cf71ab771fcc57240aa74 which was committed to the wrong branch * Fix new selection tracker to return relative coordinates * Make use of type attribute consistent * Docs: Transclude widget * Simplify the fill widget We can rely on the default processing in the base class * Slot widget: be more defensive about negative depth values * Parameters widget: Be defensive about negative depths * Protect against excessively recursive functions * FIx transcluding of functions This first implementation concatenates the results of the filter (with no separator) and then wikifies the result. The test in this commit is quite interesting... * Tweak semantics of JSON operators to match #6932 This allows us to later bring in the optimisations without breaking backwards compatibility. * Revert obsolete changes to boot.js * Fix inadvertent whitespace change * Remove tests related to obsolete changes to boot.js Should have been part of 2f494ba15246edd356bfc591b0115d30592e7eb8 * Revert changes to parse tree preview This implementation requires #6666 * Add test to show that global widgets need not use the _parameters field * Disable overriding core widgets in safe mode * Coding style tweak * More comments * Fix caching of parse variables/macros/procedures * Transcluded functions should operate on the entire store * Refactor filter recursion detection to avoid an unneeded wrapper function * Fix error in 25312b3e3218c1002c483a1fc995d2b65509b993 * WIP * Revert "WIP" This reverts commit 8654dfc679ea12d30ffd8b14a30165d826be06b7. * When transcluding functions, pass an empty item list to the filter, and just return the first item * Rejig genesis widget to be easier to use * Parameters widget: protect against negative $depth * Docs updates * Docs updates * Tweak comments * Add custom view template body for globals, and a new sidebar tab under "more" And also a custom view template title that greys out the $:/global/ part of the title * Update function operator to return the input list if the function is missing * Remove negation from function operator This implementation was not useful. * Tests and docs for function operator * Docs tweaks * Improve indentation See https://github.com/Jermolene/TiddlyWiki5/pull/6666#discussion_r967655251 * Missing tests for parameters widget * Fix visible transclude * Docs update * Docs typo * Huge Documentation Update Not quite finished, but definitely on the home stretch * Slight optimisation to user defined widgets * Remove implementation of $:/globals/ Performance with this implementation is inherently poor because of the need to perform a wiki lookup for each child widget created. * Docs clarification * Docs update * Some widget.js cleanups * Remove support for conditional definitions It was introduced for use cases associated with the global mechanism that was dropped in e3d13696c887ba849958c8980623d8ff45bb8a36 * Docs updates * Revert change to setwidget docs * Docs update * Docs updates * Clarify/simplify some tests * More docs updates * Fix doc file locations * Docs updates * Revert modified date of docs that have only had minor tweaks * Docs typo https://github.com/Jermolene/TiddlyWiki5/pull/6666#discussion_r990811220 Thanks @btheado * Transcluding functions: fix missing parameters passed as undefined Thanks @btheado – see https://github.com/Jermolene/TiddlyWiki5/pull/6666#issuecomment-1276187372 * Parameter parenthesis should be mandatory in function/procedure/widget definitions See https://github.com/Jermolene/TiddlyWiki5/pull/6666#issuecomment-1280404387 * Attempt to build this branch with CI * Add release note etc for 5.3.0 * Temporary new release banner for v5.3.0 * New New Release Banner * New test for undefined parameters * Adjust modified times of docs tiddlers to make them easier to find * Update release note * Add parenthesis to the visible transclusion definition Parenthesis were made mandatory in 5194b24108efda6da95daf4261ffd80473073a65 Fixes #6998 * Fix macrocall refresh issue It turns out that this.transcludeTitle is always truthy, even if we are transcluding a variable Fixes #7001 * Filter run prefixes should use widget.makeFakeWidgetWithVariables * Docs typo Thanks @twMat * Docs: clarify function operator invocation See discussion at https://github.com/Jermolene/TiddlyWiki5/issues/6991#issuecomment-1301703599 * Docs: Update \define pragma to cover named ends * Docs: move tiddlers to correct directory * Add support for named end markers for procedures, functions and widgets * Docs note about nested macro definitions * Rename test * Fix detection of empty transclusions See https://talk.tiddlywiki.org/t/exploring-default-tiddler-links-hackability-in-v5-3-0/5745/25?u=jeremyruston * New test missed off a45349cc996390192114fed486bfa6900da641d7 * Refactor wikified function tests * Refactor function invocation * Introduce new widget helper function to evaluate variables.Functions are evaluated as parameterised filter strings, macros as text with textual substitution of parameters and variables, and procedures and widgets as plain text * Refactor the function operator and unknown operator to use the new helper * Use the new helper to evaluate variables within filter strings, thus fixing a bug whereby functions called in such a way were being returned as plain text instead of being evaluated * Refactor the transclude widget to use the new helper * Update tests * Fix positional parameters in widget.evaluateVariable() This should clear up the remaining anomalies in #7009, let me know how you get on @btheado * Remove 5.2.8 release note * Fix nonstandard initialisation code for fill/parameter/slot widgets * Update modification times of doc tiddlers So that they are at the top of the recent tab * Update 5.3.0 release note * Remove custom CI step for this branch * Restore standard sitetitle
2023-04-19 10:55:25 +00:00
/*
** Classes for displaying globals
*/
.tc-global-tiddler-body {
padding: 0.25em;
border: 1px solid <<colour foreground>>;
background-color: <<colour muted-foreground>>;
border-radius: 3px;
}
.tc-global-tiddler-body-heading {
margin: 0 0 0.25em 0;
font-weight: normal;
}
.tc-global-tiddler-body-type {
margin: 0 0 0.25em 0;
border-bottom: 1px solid <<colour foreground>>;
}
.tc-global-tiddler-body-details {
background-color: <<colour background>>;
}
.tc-global-tiddler-body pre {
margin: 0;
border: 1px solid <<colour foreground>>;
}
/*
** Utility classes for SVG icons
*/
.tc-fill-background {
fill: <<colour background>>;
}
.tc-network-activity-background {
fill: <<colour network-activity-foreground>>;
}
/*
** Flexbox utility classes
*/
.tc-flex {
display: -webkit-flex;
display: flex;
}
.tc-flex-column {
flex-direction: column;
}
.tc-flex-row {
flex-direction: row;
}
.tc-flex-grow-1 {
flex-grow: 1;
}
.tc-flex-grow-2 {
flex-grow: 2;
}
/*
** Other utility classes
*/
/* Horizontal gaps */
.tc-tiny-gap {
margin-left: .25em;
margin-right: .25em;
}
.tc-tiny-gap-left {
margin-left: .25em;
}
.tc-tiny-gap-right {
margin-right: .25em;
}
.tc-small-gap {
margin-left: .5em;
margin-right: .5em;
}
.tc-small-gap-left {
margin-left: .5em;
}
.tc-small-gap-right {
margin-right: .5em;
}
.tc-big-gap {
margin-left: 1em;
margin-right: 1em;
}
.tc-big-gap-left {
margin-left: 1em;
}
.tc-big-gap-right {
margin-right: 1em;
}
.tc-word-break {
word-break: break-all;
}
/* Vertical gaps */
.tc-tiny-v-gap-bottom {
margin-bottom: 3px;
Improve translink macro, fixes 4877 (#7425) * Improve translink macro Changes: - Change styles to adapt colours to the current palette, instead of hard-coded white inside black box with grey borders. - Simplify the design to a single div (inspired by the Community links on tiddlywiki.com), instead of two nested contrasting divs. Comments: - I found pre-border and pre-background to be the most consistently readable across the default palettes (better than relying on e.g. tiddler-border, tiddler-background, page-background, code-border, code-background). Cupertino Dark, Gruvbox Dark, Nord, Solar Flare, Spartan Day, Spartan Night, Spartan Day, and Twilight have same or very similar pre-border and pre-background colours, so if the macro is nested (translinking a tiddler that contains a translink), the inner frames are not distinguishable, but I think it's an acceptable edge case. - Padding is defined separately for block and inline modes of the macro to make it appear consistent. * Update translink macro Change the `<h1>` styling so that it is only applied to the transcluded tiddler's title and not to any potential `<h1>` in its text. * Update translink macro Change the class-constructing filter so that the empty message is displayed with consistent padding in block mode. * Update translink.tid * Add styles for translink macro to vanilla/base.tid Split `pre` element styling, to allow part of it be reused with `.tc-pre-border` (used by translink macro). Add `.tc-big-bold` class under Other utility classes (used by translink macro). * Update base.tid Add `.tc-big-bold` class under Other utility classes (used by translink macro). * Update translink.tid Update `tc-pre-border` class name to match the one in vanilla/base.tid * Update translink.tid Simplify by always wrapping transclusion in `<p>` element (adjusts padding when inline mode or tiddler missing). * Update translink.tid Localise missing tiddler message (`$:/language/MissingTiddler/Hint`) * Update vanilla/base.tid - Modify class `tc-pre-background`, so that it can be applied to elements other than `pre`. The styling of `pre` remains unchanged, it is only split into two parts, for one part to be reused in the `tc-pre-background` class (used e.g. in translink macro). - Add `tc-big-v-gap` and `tc-big-bold` in the *Other utility classes* section (used e.g. in translink macro). * Update translink.tid Improve styling to depend only on classes specified in vanilla/base.tid * Update base.tid Update class `tc-translink` and CSS selectors to make styling the translink macro easier * Update translink.tid Change the classes of elements, so that changing the style is possible by modifying the stylesheet only * Update base.tid Add selectors to support new inline mode in translink macro * Update translink.tid Change behaviour of the inline mode, now the whole macro is inline, not just the transcluded text. * Update base.tid Fix padding of tc-translink class to account for multiline inline content. * Update base.tid Remove pseudo-element parentheses from inline translink macro * Update translink.tid Add parentheses around inline macro
2023-05-10 20:57:15 +00:00
}