mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-11-06 01:56:20 +00:00
bfcb386343
* Restructure and optimize `CheckboxWidget` docs * Minor improvements * Use new tab macros and some reformatting * Fix bug in widget-attr-link tooltip * Minor layout tweaks * First try at a Widget Documentation Style Guide * Add new tabs-related macros to overview * Update CSS, add tm-scroll and rename macros * Avoid RSoE with tm-scroll, improve CSS for tab-links * Handle doc-tab-links within tab tiddlers better * Reflect macro name changes in their docs * Update Widget Doc Style Guide
298 lines
5.1 KiB
Plaintext
298 lines
5.1 KiB
Plaintext
created: 20150117152612000
|
|
modified: 20230325101137075
|
|
tags: $:/tags/Stylesheet
|
|
title: $:/editions/tw5.com/doc-styles
|
|
type: text/vnd.tiddlywiki
|
|
|
|
.doc-def {
|
|
font-style: normal;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.doc-em {
|
|
font-style: italic;
|
|
font-variant: small-caps;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.doc-strong {
|
|
color: <<colour alert-highlight>>;
|
|
font-style: normal;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.doc-foreign {
|
|
font-style: italic;
|
|
}
|
|
|
|
.doc-place {
|
|
background-color: <<color background>>;
|
|
border: none;
|
|
color: <<color very-muted-foreground>>;
|
|
font-style: normal;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.doc-button,
|
|
.doc-tab,
|
|
.doc-tag,
|
|
.doc-tiddler,
|
|
.doc-field,
|
|
.doc-value,
|
|
.doc-operator,
|
|
.doc-var,
|
|
.doc-widget,
|
|
.doc-attr,
|
|
.doc-param {
|
|
background-color: <<color background>>;
|
|
border: none;
|
|
color: <<color very-muted-foreground>>;
|
|
font-weight: bold;
|
|
padding: 0;
|
|
}
|
|
|
|
a .doc-place,
|
|
a .doc-button,
|
|
a .doc-tab,
|
|
a .doc-tag,
|
|
a .doc-tiddler,
|
|
a .doc-field,
|
|
a .doc-value,
|
|
a .doc-operator,
|
|
a .doc-var,
|
|
a .doc-widget,
|
|
a .doc-attr {
|
|
color: <<color tiddler-link-foreground>>;
|
|
}
|
|
|
|
.doc-button svg {
|
|
height: 1em;
|
|
}
|
|
|
|
td svg {
|
|
height: 1em;
|
|
}
|
|
|
|
.doc-key {
|
|
color: <<color very-muted-foreground>>;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.doc-clink code {
|
|
color: <<colour tiddler-link-foreground>>;
|
|
}
|
|
|
|
.doc-preamble {
|
|
border: 2px solid <<colour code-border>>;
|
|
color: <<colour very-muted-foreground>>;
|
|
font-size: 90%;
|
|
margin-left: 0;
|
|
padding: 0.5em 0.7em;
|
|
}
|
|
|
|
.doc-note dt {
|
|
color: <<colour very-muted-foreground>>;
|
|
}
|
|
.doc-note dd {
|
|
border-left: 2px solid <<colour code-border>>;
|
|
padding-left: 0.6em;
|
|
}
|
|
|
|
.doc-example {
|
|
margin: 1em 0;
|
|
padding: 0.8em 0;
|
|
}
|
|
.doc-example:hover {
|
|
background-color: <<colour code-background>>;
|
|
}
|
|
.doc-example ul {
|
|
margin-bottom: 0;
|
|
padding-bottom: 0;
|
|
margin-top: 0.2em;
|
|
}
|
|
|
|
.doc-example input[type=search] {
|
|
width: 95%;
|
|
}
|
|
.doc-example pre:first-child {
|
|
margin-top: 0;
|
|
}
|
|
.doc-example-result {
|
|
border-left: 5px solid <<colour blockquote-bar>>;
|
|
border-right: 5px solid <<colour blockquote-bar>>;
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
padding: 0 10px;
|
|
}
|
|
.doc-example-result ul {
|
|
margin-left: 0;
|
|
padding-left: 10px;
|
|
}
|
|
.doc-example-result ol {
|
|
margin-left: 0;
|
|
padding-left: 20px;
|
|
}
|
|
|
|
.doc-examples-hard-breaks .doc-example-result li {
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
.doc-bad-example code, .doc-bad-example pre, table.doc-bad-example {
|
|
background-color:#ffff80;
|
|
}
|
|
|
|
.doc-table th, .doc-table tr {
|
|
vertical-align: top;
|
|
}
|
|
.doc-table th a {
|
|
font-weight: bold;
|
|
}
|
|
|
|
tr.doc-table-subheading {
|
|
height: 2em;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.doc-table.before-tiddler-body {
|
|
margin-top: 2em;
|
|
}
|
|
|
|
.doc-icon svg {
|
|
width: 1em;
|
|
height: 1em;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.doc-icon-block {
|
|
border-left: 2px solid <<colour code-border>>;
|
|
margin-left: 3em;
|
|
padding-left: 0.6em;
|
|
position: relative;
|
|
}
|
|
.doc-block-icon {
|
|
position: absolute;
|
|
left: -3em;
|
|
top: 0.2em;
|
|
}
|
|
.doc-block-icon .tc-image-tip {
|
|
fill: <<colour primary>>;
|
|
}
|
|
.doc-block-icon .tc-image-warning {
|
|
fill: <<colour alert-highlight>>;
|
|
}
|
|
|
|
a.doc-from-version.tc-tiddlylink {
|
|
display: inline-block;
|
|
border-radius: 1em;
|
|
background: <<colour muted-foreground>>;
|
|
color: <<colour background>>;
|
|
fill: <<colour background>>;
|
|
padding: 0 0.4em;
|
|
font-size: 0.7em;
|
|
text-transform: uppercase;
|
|
font-weight: bold;
|
|
line-height: 1.5;
|
|
vertical-align: text-bottom;
|
|
}
|
|
|
|
a.doc-deprecated-version.tc-tiddlylink {
|
|
display: inline-block;
|
|
border-radius: 1em;
|
|
background: red;
|
|
color: <<colour background>>;
|
|
fill: <<colour background>>;
|
|
padding: 0 0.4em;
|
|
font-size: 0.7em;
|
|
text-transform: uppercase;
|
|
font-weight: bold;
|
|
line-height: 1.5;
|
|
vertical-align: text-bottom;
|
|
}
|
|
|
|
.doc-deprecated-version svg,
|
|
.doc-from-version svg {
|
|
width: 1em;
|
|
height: 1em;
|
|
vertical-align: text-bottom;
|
|
}
|
|
|
|
.doc-link-badge {
|
|
text-decoration: none;
|
|
background-color: #7eba4c;
|
|
color: <<colour foreground>>;
|
|
padding: 3px;
|
|
border-radius: 4px;
|
|
font-weight: bold;
|
|
font-size: 0.75em;
|
|
}
|
|
|
|
.doc-link-badge:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.doc-tiddler-fields {
|
|
background-color: <<colour code-background>>;
|
|
border: 1px solid <<colour tiddler-border>>;
|
|
border-radius: 4px;
|
|
padding: 0 0.5em;
|
|
}
|
|
|
|
.doc-tiddler-fields h2 svg {
|
|
height: 1em;
|
|
}
|
|
|
|
|
|
.doc-tiddler-fields table,
|
|
.doc-tiddler-fields h2 {
|
|
margin: 0.5em 0;
|
|
}
|
|
|
|
.doc-tiddler-fields table {
|
|
background-color: <<colour tiddler-background>>;
|
|
}
|
|
|
|
@media screen {
|
|
.doc-tiddler-fields {
|
|
<<box-shadow "1px 1px 6px rgba(0, 0, 0, 0.6)">>
|
|
}
|
|
}
|
|
.doc-github-contributors {
|
|
list-style: none;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
ol.doc-github-contributors li {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
flex-direction:column;
|
|
width:82px;
|
|
height:82px;
|
|
margin:3px 3px 10px 3px;
|
|
text-decoration:none;
|
|
}
|
|
.doc-github-contributors a img {
|
|
border-radius: 50%;
|
|
background:#eee;
|
|
}
|
|
.doc-github-contributor-username {
|
|
display:inline-block;
|
|
font-size:12px;
|
|
font-weight:500;
|
|
text-align:center;
|
|
width:75px;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
.doc-tabs.tc-tab-buttons button {
|
|
font-size: 1rem;
|
|
padding: 0.5em;
|
|
}
|
|
.doc-tabs button .doc-attr {
|
|
background-color: unset;
|
|
color: #666;
|
|
}
|
|
.doc-tab-link .doc-attr {
|
|
color: unset;
|
|
} |