Implement various visual improvements for the doc generator
- Display function's signature next to the function name
(instead of being repeated below the function documentation).
- Same for module constants
- Display record constructors in a more concise manner, with
constructors fields next to constructors.
- Display generic parameters, if any, next to the type
- Plus some minor color and icon rework.
This commit is contained in:
KtorZ
@@ -218,8 +218,6 @@
|
||||
|
||||
<symbol id="icon-more-vertical" viewBox="0 0 24 24"><path d="M14 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 5c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 19c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414z"></path></symbol>
|
||||
|
||||
<symbol id="icon-star" viewBox="0 0 24 24"><path d="M12.897 1.557c-0.092-0.189-0.248-0.352-0.454-0.454-0.495-0.244-1.095-0.041-1.339 0.454l-2.858 5.789-6.391 0.935c-0.208 0.029-0.411 0.127-0.571 0.291-0.386 0.396-0.377 1.029 0.018 1.414l4.623 4.503-1.091 6.362c-0.036 0.207-0.006 0.431 0.101 0.634 0.257 0.489 0.862 0.677 1.351 0.42l5.714-3.005 5.715 3.005c0.186 0.099 0.408 0.139 0.634 0.101 0.544-0.093 0.91-0.61 0.817-1.155l-1.091-6.362 4.623-4.503c0.151-0.146 0.259-0.344 0.292-0.572 0.080-0.546-0.298-1.054-0.845-1.134l-6.39-0.934zM12 4.259l2.193 4.444c0.151 0.305 0.436 0.499 0.752 0.547l4.906 0.717-3.549 3.457c-0.244 0.238-0.341 0.569-0.288 0.885l0.837 4.883-4.386-2.307c-0.301-0.158-0.647-0.148-0.931 0l-4.386 2.307 0.837-4.883c0.058-0.336-0.059-0.661-0.288-0.885l-3.549-3.457 4.907-0.718c0.336-0.049 0.609-0.26 0.752-0.546z"></path></symbol>
|
||||
|
||||
<symbol id="icon-sun" viewBox="0 0 24 24"><path d="M18 12c0-1.657-0.673-3.158-1.757-4.243s-2.586-1.757-4.243-1.757-3.158 0.673-4.243 1.757-1.757 2.586-1.757 4.243 0.673 3.158 1.757 4.243 2.586 1.757 4.243 1.757 3.158-0.673 4.243-1.757 1.757-2.586 1.757-4.243zM16 12c0 1.105-0.447 2.103-1.172 2.828s-1.723 1.172-2.828 1.172-2.103-0.447-2.828-1.172-1.172-1.723-1.172-2.828 0.447-2.103 1.172-2.828 1.723-1.172 2.828-1.172 2.103 0.447 2.828 1.172 1.172 1.723 1.172 2.828zM11 1v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM11 21v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM3.513 4.927l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM17.653 19.067l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM1 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM21 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM4.927 20.487l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0zM19.067 6.347l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0z"></path></symbol>
|
||||
|
||||
<symbol id="icon-toggle-left" viewBox="0 0 24 24"><path d="M8 4c-2.209 0-4.21 0.897-5.657 2.343s-2.343 3.448-2.343 5.657 0.897 4.21 2.343 5.657 3.448 2.343 5.657 2.343h8c2.209 0 4.21-0.897 5.657-2.343s2.343-3.448 2.343-5.657-0.897-4.21-2.343-5.657-3.448-2.343-5.657-2.343zM8 6h8c1.657 0 3.156 0.67 4.243 1.757s1.757 2.586 1.757 4.243-0.67 3.156-1.757 4.243-2.586 1.757-4.243 1.757h-8c-1.657 0-3.156-0.67-4.243-1.757s-1.757-2.586-1.757-4.243 0.67-3.156 1.757-4.243 2.586-1.757 4.243-1.757zM12 12c0-1.104-0.449-2.106-1.172-2.828s-1.724-1.172-2.828-1.172-2.106 0.449-2.828 1.172-1.172 1.724-1.172 2.828 0.449 2.106 1.172 2.828 1.724 1.172 2.828 1.172 2.106-0.449 2.828-1.172 1.172-1.724 1.172-2.828zM10 12c0 0.553-0.223 1.051-0.586 1.414s-0.861 0.586-1.414 0.586-1.051-0.223-1.414-0.586-0.586-0.861-0.586-1.414 0.223-1.051 0.586-1.414 0.861-0.586 1.414-0.586 1.051 0.223 1.414 0.586 0.586 0.861 0.586 1.414z"></path></symbol>
|
||||
@@ -241,6 +239,15 @@
|
||||
<path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"></path><polyline points="13 2 13 9 20 9"></polyline>
|
||||
</svg>
|
||||
</symbol>
|
||||
<symbol id="icon-at" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-at-sign">
|
||||
<circle cx="12" cy="12" r="4"></circle>
|
||||
<path d="M16 8v5a3 3 0 0 0 6 0v-1a10 10 0 1 0-3.92 7.94"></path>
|
||||
</symbol>
|
||||
<symbol id="icon-box" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-box">
|
||||
<path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path>
|
||||
<polyline points="3.27 6.96 12 12.01 20.73 6.96"></polyline>
|
||||
<line x1="12" y1="22.08" x2="12" y2="12"></line>
|
||||
</symbol>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
@@ -253,6 +260,16 @@
|
||||
}
|
||||
});
|
||||
hljs.highlightAll();
|
||||
document.querySelectorAll(".member-name > h2 > pre").forEach((el) => {
|
||||
hljs.highlightElement(el)
|
||||
const span = el.firstElementChild;
|
||||
span.remove();
|
||||
const a = document.createElement("a");
|
||||
a.href = `#${span.innerText}`;
|
||||
a.className = span.className;
|
||||
a.innerText = span.innerText;
|
||||
el.prepend(a);
|
||||
});
|
||||
</script>
|
||||
<script src="{{ breadcrumbs }}/js/lunr.min.js?v={{ aiken_version }}"></script>
|
||||
<script src="{{ breadcrumbs }}/js/index.js?v={{ timestamp }}"></script>
|
||||
|
||||
@@ -1 +1,2 @@
|
||||
pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{color:#abb2bf;background:#282c34}.hljs-comment,.hljs-quote{color:#5c6370;font-style:italic}.hljs-doctag,.hljs-formula,.hljs-keyword,.hljs-operator{color:#c678dd}.hljs-deletion,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-subst{color:#e06c75}.hljs-literal{color:#56b6c2}.hljs-addition,.hljs-attribute,.hljs-meta .hljs-string,.hljs-regexp,.hljs-string,.hljs-number{color:#98c379}.hljs-attr,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-pseudo,.hljs-template-variable,.hljs-type,.hljs-variable{color:#d19a66}.hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-title{color:#61aeee}.hljs-built_in,.hljs-class .hljs-title,.hljs-title.class_,.hljs-title.function_,.hljs-title.invoke__{color:#e6c07b}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.hljs-link{text-decoration:underline}
|
||||
.member-name pre,.member-name pre .hljs-string,.member-name pre .hljs-regexp,.member-name pre .hljs-string,.member-name pre .hljs-number{color: #363256}.member-name pre .hljs-title.function_{color:#141414}.member-name pre .hljs-ponctuation,.member-name pre .hljs-operator{color: #BA4FA0}.member-name pre .hljs-title{color:#456DC4}.member-name pre .hljs-keyword{color: #4A47A3;}
|
||||
|
||||
@@ -1 +1,2 @@
|
||||
pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{color:#383a42;background:#fafafa}.hljs-comment,.hljs-quote{color:#a0a1a7;font-style:italic}.hljs-doctag,.hljs-formula,.hljs-keyword,.hljs-operator{color:#a626a4}.hljs-deletion,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-subst{color:#e45649}.hljs-literal{color:#0184bb}.hljs-addition,.hljs-attribute,.hljs-meta .hljs-string,.hljs-regexp,.hljs-string,.hljs-number{color:#50a14f}.hljs-attr,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-pseudo,.hljs-template-variable,.hljs-type,.hljs-variable{color:#986801}.hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-title{color:#4078f2}.hljs-built_in,.hljs-class .hljs-title,.hljs-title.class_,.hljs-title.function_,.hljs-title.invoke__{color:#c18401}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.hljs-link{text-decoration:underline}
|
||||
.member-name pre,.member-name pre .hljs-string,.member-name pre .hljs-regexp,.member-name pre .hljs-string,.member-name pre .hljs-number{color: #FEF9EC}.member-name pre .hljs-title.function_{color:#FAF4B7}.member-name pre .hljs-ponctuation,.member-name pre .hljs-operator{color: #EA76CB}.member-name pre .hljs-title{color:#B5F8FB}.member-name pre .hljs-keyword{color: #EEE8AE;}
|
||||
|
||||
@@ -17,8 +17,8 @@
|
||||
--color-text: #4c4f69;
|
||||
--color-text-accent: #e6e9ef;
|
||||
--color-inline-code: #ea76cb;
|
||||
--color-link: #dc8a78;
|
||||
--color-link-accent: #dd7878;
|
||||
--color-link: #ea76cb;
|
||||
--color-link-accent: #e660c2;
|
||||
--color-background: #eff1f5;
|
||||
--color-background-sidebar: #e6e9ef;
|
||||
--color-background-accent: #8839ef;
|
||||
@@ -409,10 +409,19 @@ body.drawer-open .label-closed {
|
||||
|
||||
.member-name h2 {
|
||||
display: flex;
|
||||
font-size: 1.5rem;
|
||||
font-size: 1.25rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.member-name > h2 > pre {
|
||||
background: none;
|
||||
font-family: 'Ubuntu Mono';
|
||||
box-shadow: unset;
|
||||
border-radius: unset;
|
||||
margin: 0;
|
||||
|
||||
}
|
||||
|
||||
.member-name h2 a {
|
||||
color: var(--color-text-accent);
|
||||
}
|
||||
@@ -436,6 +445,12 @@ body.drawer-open .label-closed {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.constructor-row .icon {
|
||||
flex-shrink: 0;
|
||||
font-size: 0.7rem;
|
||||
margin: 0 0.88rem;
|
||||
}
|
||||
|
||||
.constructor-item {
|
||||
margin-bottom: var(--small-gap);
|
||||
}
|
||||
@@ -459,12 +474,20 @@ body.drawer-open .label-closed {
|
||||
.constructor-item-docs {
|
||||
margin-left: var(--large-gap);
|
||||
margin-bottom: var(--gap);
|
||||
padding-left: 1.5rem;
|
||||
margin-top: -1em;
|
||||
}
|
||||
|
||||
.constructor-item .icon {
|
||||
flex-shrink: 0;
|
||||
font-size: 0.7rem;
|
||||
margin: 0 0.88rem;
|
||||
.constructor-item-docs::before {
|
||||
content: '↳';
|
||||
position: relative;
|
||||
margin-left: -1.5rem;
|
||||
top: 1.5em;
|
||||
color: var(--color-background-accent);
|
||||
}
|
||||
|
||||
.constructor-item-docs p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.constructor-name {
|
||||
|
||||
@@ -63,7 +63,7 @@ hljs.registerLanguage("aiken", function (hljs) {
|
||||
};
|
||||
const LABEL = {
|
||||
begin: [/\b[a-z][a-z0-9_]*/, ":"],
|
||||
beginScope: { 1: "symbol", 2: "operator" },
|
||||
beginScope: { 1: "symbol", 2: "ponctuation" },
|
||||
relevance: 1,
|
||||
};
|
||||
const DISCARD_NAME = {
|
||||
@@ -93,8 +93,8 @@ hljs.registerLanguage("aiken", function (hljs) {
|
||||
],
|
||||
},
|
||||
{
|
||||
begin: [/[a-z][a-z0-9_]*/, /[ ]*\(/],
|
||||
beginScope: { 1: "title.function.invoke", 2: "ponctuation" },
|
||||
begin: [/[a-z][a-z0-9_]*/, /[\n ]*\(/],
|
||||
beginScope: { 1: "title.function.invoke" },
|
||||
},
|
||||
{
|
||||
scope: "keyword",
|
||||
@@ -109,7 +109,7 @@ hljs.registerLanguage("aiken", function (hljs) {
|
||||
},
|
||||
{
|
||||
scope: "title",
|
||||
begin: "\\b[A-Z][A-Za-z0-9]*\\b",
|
||||
begin: "\\b[A-Z][A-Za-z0-9_]*\\b",
|
||||
relevance: 0,
|
||||
},
|
||||
{
|
||||
|
||||
@@ -46,7 +46,7 @@
|
||||
<div class="member-name">
|
||||
<h2 id="{{ type_info.name }}">
|
||||
<a href="#{{ type_info.name }}">
|
||||
{{ type_info.name }}
|
||||
{{ type_info.name }}{% if !type_info.parameters.is_empty() %}<{{ type_info.parameters.join(", ") }}>{% endif %}
|
||||
</a>
|
||||
</h2>
|
||||
{% if !type_info.source_url.is_empty() %}
|
||||
@@ -59,46 +59,29 @@
|
||||
</div>
|
||||
<div class="custom-type-constructors">
|
||||
<div class="rendered-markdown">{{ type_info.documentation|safe }}</div>
|
||||
<pre><code class="hljs aiken">{{ type_info.definition }}</code></pre>
|
||||
{% if !type_info.constructors.is_empty() %}
|
||||
<h3>
|
||||
Constructors
|
||||
</h3>
|
||||
<h3>Constructors</h3>
|
||||
<ul class="constructor-list">
|
||||
{% for constructor in type_info.constructors %}
|
||||
<li class="constructor-item">
|
||||
<div class="constructor-row">
|
||||
<svg class="icon icon-star"><use xlink:href="#icon-star"></use></svg>
|
||||
<svg class="icon icon-box"><use xlink:href="#icon-box"></use></svg>
|
||||
<pre class="constructor-name"><code class="hljs aiken">{{ constructor.definition }}</code></pre>
|
||||
</div>
|
||||
|
||||
{% if !constructor.documentation.is_empty() %}
|
||||
<div class="constructor-item-docs">
|
||||
{{ constructor.documentation|safe }}
|
||||
|
||||
{% if !constructor.arguments.is_empty() %}
|
||||
<h4>
|
||||
Arguments
|
||||
</h4>
|
||||
|
||||
<ul class="constructor-argument-list">
|
||||
{% for argument in constructor.arguments %}
|
||||
<li>
|
||||
<div class="constructor-argument-item">
|
||||
<p class="constructor-argument-label">
|
||||
<i>{{ argument.label }}</i>
|
||||
</p>
|
||||
<div class="constructor-argument-doc">
|
||||
{{ argument.documentation|safe }}
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else if !type_info.opaque %}
|
||||
<h3>Alias</h3>
|
||||
<div class="constructor-row">
|
||||
<svg class="icon icon-at"><use xlink:href="#icon-at"></use></svg>
|
||||
<pre class="constructor-name"><code class="hljs aiken">{{ type_info.definition }}</code></pre>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
@@ -115,11 +98,7 @@
|
||||
{% for constant in constants %}
|
||||
<div class="member">
|
||||
<div class="member-name">
|
||||
<h2 id="{{ constant.name }}">
|
||||
<a href="#{{ constant.name }}">
|
||||
{{ constant.name }}
|
||||
</a>
|
||||
</h2>
|
||||
<h2 id="{{ constant.name }}"><pre class="hljs language-aiken">{{ constant.definition }}</pre></h2>
|
||||
{% if !constant.source_url.is_empty() %}
|
||||
<!-- TODO: support source linking
|
||||
<a class="member-source" alt="View Source" title="View Source" href="{{ constant.source_url|safe }}">
|
||||
@@ -128,7 +107,6 @@
|
||||
-->
|
||||
{% endif %}
|
||||
</div>
|
||||
<pre><code class="hljs aiken">{{ constant.definition }}</code></pre>
|
||||
<div class="rendered-markdown">{{ constant.documentation|safe }}</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
@@ -143,11 +121,7 @@
|
||||
{% for function in functions %}
|
||||
<div class="member">
|
||||
<div class="member-name">
|
||||
<h2 id="{{ function.name }}">
|
||||
<a href="#{{ function.name }}">
|
||||
{{ function.name }}
|
||||
</a>
|
||||
</h2>
|
||||
<h2 id="{{ function.name }}"><pre class="hljs language-aiken">{{ function.signature }}</pre></h2>
|
||||
{% if !function.source_url.is_empty() %}
|
||||
<!-- TODO: support source linking
|
||||
<a class="member-source" alt="View Source" title="View Source" href="{{ function.source_url|safe }}">
|
||||
@@ -156,7 +130,6 @@
|
||||
-->
|
||||
{% endif %}
|
||||
</div>
|
||||
<pre><code class="hljs aiken">{{ function.signature }}</code></pre>
|
||||
<div class="rendered-markdown">{{ function.documentation|safe }}</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
Reference in New Issue
Block a user