zoralabTOC科技规范 - ZORALab赫斯提亚

当用着这份代码包时所需的科技规范。 随和、支持离线(通过PWA安装)和非常注重细节的。

创史来历

主要目的

这个软件包的出生主要是支持渲染目录列单的界面元件。在网络界面世界里, 这元件的成果如下:



历史遗录

这个软件包在ZORALab赫斯提亚v1.2.0版本之前曾经被名为 toc_hestiaUI。改名的目的是有人要横行强盗设计的版权和为了编程 文件编写能力而整理过。

软件包的设计

设计师

这个元件的设计是由以下的创造者所建设的:

(Holloway) 周健豪

依赖其他元件

这个元件是需要以下的其他元件才能好好的运行 (排序从‘左上到右下’):

zoralabCORE

HTML

至于HTML,为了简单化和最大的兼容性整个用法,ZORALab赫斯提亚运用W3C的语法。我们 推荐您用以下的HTML代码来运用这个界面元件。

最小的HTML

在最小的HTML代码运用方法如下:

<nav class='toc'>
	...
</nav>

CSS界面自选性

ZORALab赫斯提亚非常重用CSS变化值来装置这个界面元件并且还推出界面自选性功能。 以下是所有界面自选性CSS变化值任您发挥。

Display

影响元件的显示模式。

变化值     : --toc-display
CSS属性    : display
默认数码   : block (>= v1.2.0)

Margin

影响元件的外向边距空间。

变化值     : --toc-margin
CSS属性    : margin
默认数码   : 2rem auto (>= v1.2.0)

Padding

影响元件的内向边距空间。

变化值     : --toc-padding
CSS属性    : padding
默认数码   : 2rem (>= v1.2.0)

Min-Width

影响元件的最少宽度。

变化值     : --toc-min-width
CSS属性    : min-width
默认数码   : 20rem (>= v1.2.0)

Width

影响元件的宽度。

变化值     : --toc-width
CSS属性    : width
默认数码   : fit-content (>= v1.2.0)

Max-Width

影响元件的宽度。

变化值     : --toc-max-width
CSS属性    : max-width
默认数码   : 100% (>= v1.2.0)

Min-Height

影响元件的最少高度。

变化值     : --toc-min-height
CSS属性    : min-hieght
默认数码   : initial (>= v1.2.0)

Height

影响元件的高度。

变化值     : --toc-height
CSS属性    : height
默认数码   : fit-content (>= v1.2.0)

Max-Height

影响元件的最大高度。

变化值     : --toc-max-height
CSS属性    : max-height
默认数码   : initial (>= v1.2.0)

Border

影响元件的边界线。

变化值     : --toc-border
CSS属性    : border
默认数码   : 1px solid currentColor (>= v1.2.0)

Border Radius

影响元件边界线的角落圆形度。

变化值     : --toc-border-radius
CSS属性    : border-radius
默认数码   : .5rem (>= v1.2.0)

Color

影响元件的颜色。

变化值     : --toc-color
CSS属性    : color
默认数码   : var(--body-color) (>= v1.2.0)

Color (反转环境)

影响元件在反转环境里的颜色。

变化值     : --toc-color-inverted
CSS属性    : color
默认数码   : var(--body-color-inverted) (>= v1.2.0)

Color (印刷)

影响元件在印刷环境里的颜色。

变化值     : --toc-color-print
CSS属性    : color
默认数码   : var(--body-color-print) (>= v1.2.0)

Background

影响元件的背景。

变化值     : --toc-background
CSS属性    : background
默认数码   : transparent (>= v1.2.0)

Background (反转环境)

影响元件在反转环境里的背景。

变化值     : --toc-background-inverted
CSS属性    : background
默认数码   : transparent (>= v1.2.0)

Background (印刷)

影响元件在印刷环境里的背景。

变化值     : --toc-background-print
CSS属性    : background
默认数码   : transparent (>= v1.2.0)

JavaScript

庆幸的是这个元件没有运用到任何JavaScript。放心吧!

固定值

这个代码包没有提供任何固定值。

变化值

这个代码包没有提供任何变化值。

提供的功能

ToCSS

渲染呈现CSS的输出数据。

Hugo

用法:

{{- $ret := partial "hestiaGUI/zoralabTOC/ToCSS" . -}}
<pre>{{- printf "%#v\n" $ret -}}</pre>

数码构架

这个代码包没有提供任何数码构架。

终结

我们已经抵达终结段落了。如有询问,您是可以通过以下管道来联系我们吧:


GitHub论坛