python/jinjax
1
0
Fork 0
Code Issues Activity

Merging upstream version 0.46.

Browse source 
Signed-off-by: Daniel Baumann <daniel@debian.org>
This commit is contained in:
Daniel Baumann 2025-02-05 18:42:39 +01:00
parent d5bf7afd18
commit 76fe8c2886
Signed by: daniel
GPG key ID: FBB4F0E80A80222F
125 changed files with 8421 additions and 71 deletions
Download patch file Download diff file Expand all files Collapse all files

413
docs/static/docs.css vendored Normal file
View file

@ -0,0 +1,413 @@
.bg-cover {
position: absolute;
z-index: -1;
inset: 0;
}
.Logo {
display: flex;
height: 2.5rem;
align-items: center;
color: rgb(24 24 27);
opacity: 0.9;
&:hover {
opacity: 1;
}
& img.light {
display: block;
}
& img.dark {
display: none;
}
&:is(.dark *) img.light {
display: none;
}
&:is(.dark *) img.dark {
display: block;
}
}
.NavLinks {
& a {
padding: 0.25rem;
font-size: 0.875rem;
line-height: 1.25rem;
color: rgb(82 82 91);
}
& a:hover {
color: rgb(24 24 27);
}
& a:is(.dark *) {
color: rgb(212 212 216);
}
& a:is(.dark *):hover {
color: rgb(255 255 255);
}
}
.homepage {
padding-top: 0;
padding-bottom: 0;
padding-left: var(--cd-padding-left);
padding-right: var(--cd-padding-right);
}
.homepage section.hero {
margin-left: auto;
margin-right: auto;
display: flex;
max-width: 56rem;
flex-direction: column;
padding-top: 2.25rem;
padding-bottom: 2.25rem;
color: rgb(23 23 23);
&:is(.dark *) {
color: rgb(245 245 245);
}
& h1 {
margin: 0 auto;
width: 300px;
height: 140px;
background-image: url("/static/img/jinjax-logo.svg");
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
text-indent: -999px;
display: none;
}
& h2 {
font-size: 2.2rem;
font-weight: 600;
line-height: 1.2;
letter-spacing: -0.05em;
}
& h2 .g1 {
background-image: linear-gradient(to bottom right, #fbbf24, #fb923c);
background-clip: text;
color: transparent;
}
& h2 .g2 {
background-image: linear-gradient(to bottom right, #34d399, #3b82f6);
background-clip: text;
color: transparent;
}
@media (min-width: 768px) {
& {
padding-top: 2.5rem;
padding-bottom: 3rem;
}
& h1 {
display: block;
width: 300px;
height: 100px;
}
& h2 {
font-size: 2.4rem;
text-align: center;
}
& h2 .g2 {
white-space: nowrap;
}
}
@media (min-width: 1024px) {
& h1 {
width: 400px;
height: 140px;
}
& h2 {
font-size: 3rem;
}
}
}
.homepage section.code {
margin-left: -1rem;
margin-right: -1rem;
max-width: 72rem;
border-width: 1px;
border-color: rgb(212 212 212);
background-color: rgb(231 229 228);
padding: 1.5rem 0;
&:is(.dark *) {
border-color: rgb(82 82 82);
background-color: rgb(41 37 36);
}
& .panel {
display: flex;
flex-direction: column;
}
& .panel ~ .panel {
margin-top: 1.5rem;
}
& h2 {
margin-bottom: 0.5rem;
text-align: center;
font-size: 1.5rem;
line-height: 1.1;
font-weight: 700;
}
& .highlight {
flex-grow: 1;
}
& pre {
height: 100%;
}
@media (min-width: 1024px) {
& {
border-radius: 1rem;
padding: 1.5rem;
margin-bottom: 2.5rem;
margin-left: auto;
margin-right: auto;
}
& .stack {
display: flex;
align-items: stretch;
}
& .panel {
width: 50%;
}
& .panel ~ .panel {
margin-top: 0;
margin-left: 0.5rem;
}
}
}
.homepage section.features {
margin-left: auto;
margin-right: auto;
max-width: 56rem;
padding-top: 2rem;
padding-bottom: 2rem;
& h2 {
margin-bottom: 2rem;
text-align: center;
font-size: 2.2rem;
line-height: 1.2;
font-weight: 800;
}
& h2 code {
font-size: 0.9em;
}
& .cards {
margin-top: 2.5rem;
display: grid;
grid-template-columns: repeat(1, minmax(0, 1fr));
column-gap: 1rem;
row-gap: 1.5rem;
font-size: 1rem;
line-height: 1.4rem;
}
& .card {
margin-left: auto;
margin-right: auto;
display: flex;
flex-direction: column;
height: 9rem;
max-width: 28rem;
border-radius: 1rem;
border-width: 2px;
border-color: rgb(245 245 244);
background-color: rgb(250 250 249);
padding-top: 1rem;
padding-bottom: 1rem;
padding-left: 1.5rem;
padding-right: 1.5rem;
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
}
& .card:is(.dark *) {
border-color: rgb(41 37 36);
background-color: rgb(41 37 36);
}
& .card > .header {
margin-bottom: 0.5rem;
display: flex;
align-items: center;
flex-direction: row-reverse;
}
& .card > .header img {
float: left;
max-height: 32px;
width: 2.5rem;
padding-right: 0.75rem;
}
& .card > .header img:is(.dark *) {
filter: invert(100%)
}
& .card > .header h3 {
font-size: 1.4rem;
font-weight: 600;
color: rgb(24 24 27);
}
& .card > .header h3:is(.dark *) {
color: rgb(228 228 231);
}
& .card > .body {
flex-grow: 1;
margin-top: 0.5rem;
font-size: 1rem;
line-height: 1.4;
color: rgb(82 82 91);
}
& .card a {
font-weight: 600;
}
@media (min-width: 768px) {
& .cards {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
& .card {
height: 10rem;
}
}
@media (min-width: 1280px) {
& {
max-width: 1280px;
}
& .cards {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
& .card {
height: 13rem;
align-items: flex-start;
padding-top: 1.5rem;
padding-bottom: 1.5rem;
}
}
}
.homepage section.spaghetti {
margin-bottom: 1.25rem;
padding-left: var(--cd-padding-left);
padding-right: var(--cd-padding-right);
& .wrapper {
margin-left: auto;
margin-right: auto;
max-width: 64rem;
padding-left: 0.75rem;
padding-right: 0.75rem;
padding-top: 2rem;
padding-bottom: 2rem;
}
& h2 {
margin-bottom: 2rem;
text-align: center;
font-size: 2.2rem;
line-height: 1.2;
font-weight: 800;
}
& .text {
position: relative;
font-size: 1.4rem;
line-height: 1.4;
}
& .text img {
position: absolute;
left: 0;
top: 0;
display: none;
height: 100%;
max-height: 24rem;
}
& .text p {
margin-bottom:1.5rem;
}
@media (min-width: 640px) {
& .wrapper {
padding-top: 3rem;
padding-bottom: 3rem;
}
}
@media (min-width: 1024px) {
& .wrapper {
max-width: 72rem;
}
& .text {
padding-left: 440px;
}
& .text img {
display: block;
}
}
}
.homepage section.engage {
background-image: linear-gradient(to bottom, #d6d3d1, #e7e5e4, #a8a29e);
margin-left: -1rem;
margin-right: -1rem;
&:is(.dark *) {
background-image: linear-gradient(to bottom, #000, #1c1917);
}
& .wrapper {
padding-top: 3rem;
padding-bottom: 3rem;
text-align: center;
}
& h3 {
margin-bottom: 2rem;
text-align: center;
font-size: 1.875rem;
line-height: 1.4;
font-weight: 800;
}
& a {
display: flex-inline;
align-items: center;
justify-content: center;
margin-left: auto;
margin-right: auto;
margin-bottom: 1.25rem;
display: inline-block;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border-radius: 1rem;
background-image: linear-gradient(to top right, #a3e635, #65a30d);
padding: 1rem 2rem;
text-align: center;
font-family: var(--cd-font-sans);
font-size: 1.25rem;
line-height: 1.75rem;
font-weight: 700;
color: rgb(39 39 42);
text-decoration-line: none;
box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
& a:hover {
background-image: linear-gradient(to top right, #a3e635, #a3e635);
color: rgb(0 0 0);
}
& a i {
font-style: normal;
font-size: 1.2rem;
}
& .hint {
font-size: 0.75rem;
line-height: 1rem;
}
}

BIN
docs/static/favicon.ico vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 3.4 KiB

BIN
docs/static/fonts/karla-bold-ext.woff2 vendored Normal file
View file

Binary file not shown.

BIN
docs/static/fonts/karla-bold.woff2 vendored Normal file
View file

Binary file not shown.

BIN
docs/static/fonts/karla-regular-.woff2 vendored Normal file
View file

Binary file not shown.

BIN
docs/static/fonts/karla-regular-ext.woff2 vendored Normal file
View file

Binary file not shown.

BIN
docs/static/fonts/material-symbols-rounded.woff2 vendored Normal file
View file

Binary file not shown.

BIN
docs/static/img/anatomy-en.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 237 KiB

347
docs/static/img/anatomy-en.svg vendored Normal file
View file

@ -0,0 +1,347 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="420"
height="440"
version="1.1"
viewBox="0 0 420 440"
id="svg151"
sodipodi:docname="anatomy-en.svg"
inkscape:export-filename="/media/data/anatomy-en.png"
inkscape:export-xdpi="223.41818"
inkscape:export-ydpi="223.41818"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview153"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="2.3136364"
inkscape:cx="172.45579"
inkscape:cy="357.66208"
inkscape:window-width="1280"
inkscape:window-height="740"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg151" />
<defs
id="defs5">
<marker
id="TriangleStart"
overflow="visible"
markerHeight="2.6867051"
markerWidth="2.3239999"
orient="auto-start-reverse"
preserveAspectRatio="xMidYMid"
viewBox="0 0 5.3244081 6.1553851">
<path
transform="scale(.6)"
d="m5.8 0-8.6 5v-10z"
fill="context-stroke"
fill-rule="evenodd"
stroke="context-stroke"
stroke-width="1pt"
id="path2" />
</marker>
</defs>
<rect
width="420"
height="440"
fill="#ffffff"
fill-opacity="0.85"
stroke="#dddddd"
id="rect7"
x="0.40752804"
y="1.6170791"
inkscape:export-filename="/home/jpsca/Code/jinjax/docs/static/img/anatomy-en.png"
inkscape:export-xdpi="223.418"
inkscape:export-ydpi="223.418" />
<path
d="m17 98h320"
stroke="#555"
stroke-width="1px"
id="path9"
inkscape:export-filename="/home/jpsca/Code/jinjax/docs/static/img/anatomy-en.png"
inkscape:export-xdpi="223.418"
inkscape:export-ydpi="223.418" />
<text
id="code"
fill="#444444"
font-family="'SF Mono', Monaco, monospace"
font-size="11px"
font-weight="bold"
stroke-width="1.4"
style="line-height:1.25;font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal"
inkscape:export-filename="/home/jpsca/Code/jinjax/docs/static/img/anatomy-en.png"
inkscape:export-xdpi="223.418"
inkscape:export-ydpi="223.418"><tspan
sodipodi:role="line"
id="tspan83456"
x="17"
y="90"><tspan
x="17"
y="90"
font-style="italic"
font-weight="600"
id="tspan8">components/Form.jinja</tspan><tspan
x="17"
y="131"
id="tspan10">{#def action, label, method=&quot;post&quot; #}</tspan><tspan
x="17"
y="145"
id="tspan12" /></tspan><tspan
sodipodi:role="line"
id="tspan83458"
x="17"
y="103.75"><tspan
x="17"
y="145"
id="tspan83460" /></tspan><tspan
sodipodi:role="line"
x="17"
y="145"
id="tspan83494"><tspan
x="17"
y="145"
id="tspan83496">{#css form.css, /static/theme.css #}</tspan><tspan
x="17"
y="160"
id="tspan14">{#js form.js #}</tspan><tspan
x="17"
y="187"
fill="#555555"
id="tspan16">{% set method = method.lower() %}</tspan><tspan
x="17"
y="215"
fill="#3771c8"
id="tspan22"><tspan
id="tspan18">&lt;</tspan><tspan
id="tspan20">form</tspan></tspan><tspan
x="24"
y="229"
id="tspan32"><tspan
fill="#5f8dd3"
id="tspan24">method=</tspan><tspan
fill="#008800"
id="tspan26">&quot;</tspan><tspan
fill="#ff7f2a"
id="tspan28">{{ method }}</tspan><tspan
fill="#008800"
id="tspan30">&quot;</tspan></tspan><tspan
x="24"
y="244"
id="tspan42"><tspan
fill="#5f8dd3"
id="tspan34">action=</tspan><tspan
fill="#008800"
id="tspan36">&quot;</tspan><tspan
fill="#ff7f2a"
id="tspan38">{{ action }}</tspan><tspan
fill="#008800"
id="tspan40">&quot;</tspan></tspan><tspan
x="24"
y="257"
fill="#ff7f2a"
id="tspan46">{{ attrs.render(<tspan
id="tspan44">class=&quot;form&quot;</tspan>) }}</tspan><tspan
x="17"
y="272"
fill="#3771c8"
id="tspan48">&gt;</tspan><tspan
x="24"
y="286"
fill="#555555"
id="tspan50">{% if method == &quot;post&quot; -%}</tspan><tspan
x="24"
y="299"
fill="#3771c8"
id="tspan60">&lt;input <tspan
fill="#5f8dd3"
id="tspan58">type=<tspan
fill="#008800"
id="tspan52">&quot;hidden&quot;</tspan> name=<tspan
fill="#008800"
id="tspan54">&quot;csrf&quot;</tspan> value=&quot;<tspan
fill="#ff7f2a"
id="tspan56">{{token}}</tspan>&quot; /&gt;</tspan></tspan><tspan
x="24"
y="314"
fill="#555555"
id="tspan62">{% endif -%}</tspan><tspan
x="24"
y="341"
id="tspan66"><tspan
fill="#ff7f2a"
id="tspan64">{{ content }}</tspan></tspan><tspan
x="24"
y="370"
fill="#214478"
id="tspan72">&lt;Button :label=<tspan
fill="#008800"
id="tspan53">&quot;label&quot;</tspan> /&gt;</tspan><tspan
x="17"
y="386"
fill="#3771c8"
id="tspan76">&lt;/<tspan
fill="#3771c8"
font-weight="bold"
id="tspan74">form</tspan>&gt;</tspan></tspan></text>
<g
id="arrows"
transform="translate(0.44852325)"
inkscape:export-filename="/home/jpsca/Code/jinjax/docs/static/img/anatomy-en.png"
inkscape:export-xdpi="223.418"
inkscape:export-ydpi="223.418">
<path
d="m 96,49 c 13,28 24,0.84 25,24"
fill="none"
marker-end="url(#TriangleStart)"
stroke="#000000"
stroke-width="1.7"
id="path94" />
<path
d="m 263.05173,66.190373 c 3.21374,29.013609 -66.83732,10.210641 -66.83732,43.210637"
fill="none"
marker-end="url(#TriangleStart)"
stroke="#000000"
stroke-width="1.7"
id="path96"
sodipodi:nodetypes="cc" />
<path
d="m 299.74715,171.9951 c -24.29574,-13.93589 13.75099,-34.69573 -30.19646,-30.86252"
fill="none"
marker-end="url(#TriangleStart)"
stroke="#000000"
stroke-width="1.7"
id="path98"
sodipodi:nodetypes="cc" />
<path
d="M 299.74715,171.9951 C 282.96418,161.72557 170.13518,157.37012 132.6202,158.53979"
fill="none"
marker-end="url(#TriangleStart)"
stroke="#000000"
stroke-width="1.7"
id="path100"
sodipodi:nodetypes="cc" />
<path
d="m 169,404 c -11,-17 -39.53849,-5.19589 -47.53849,-23.49589"
fill="none"
marker-end="url(#TriangleStart)"
stroke="#000000"
stroke-width="1.7"
id="path102"
sodipodi:nodetypes="cc" />
</g>
<text
style="font-size:12px;font-family:'Comic Neue'"
transform="matrix(0.99580394,0,0,0.99717236,22.306709,8.8220192)"
id="text111"
inkscape:export-filename="/home/jpsca/Code/jinjax/docs/static/img/anatomy-en.png"
inkscape:export-xdpi="223.418"
inkscape:export-ydpi="223.418"><tspan
x="0"
y="11"
id="tspan105">Everything before the </tspan><tspan
x="0"
y="30"
id="tspan107">first dot is the component </tspan><tspan
x="0"
y="48"
id="tspan109">name</tspan></text>
<text
style="font-size:12px;font-family:'Comic Neue'"
transform="matrix(0.99585975,0,0,0.94509234,216.62806,15.846205)"
id="text115"
inkscape:export-filename="/home/jpsca/Code/jinjax/docs/static/img/anatomy-en.png"
inkscape:export-xdpi="223.418"
inkscape:export-ydpi="223.418"><tspan
x="0"
y="6"
id="tspan113">Arguments definition</tspan></text>
<text
style="font-size:12px;font-family:'Comic Neue'"
transform="matrix(0.99962611,0,0,0.98554306,218.63043,28.835757)"
id="text121"
inkscape:export-filename="/home/jpsca/Code/jinjax/docs/static/img/anatomy-en.png"
inkscape:export-xdpi="223.418"
inkscape:export-ydpi="223.418"><tspan
x="0"
y="11"
id="tspan117">Arguments without a </tspan><tspan
x="0"
y="30"
id="tspan119">default value are required</tspan></text>
<text
style="font-size:12px;font-family:'Comic Neue';white-space:pre;inline-size:102.594"
transform="matrix(1.0036128,0,0,0.99557292,305.3546,154.45222)"
id="text127"
inkscape:export-filename="/home/jpsca/Code/jinjax/docs/static/img/anatomy-en.png"
inkscape:export-xdpi="223.418"
inkscape:export-ydpi="223.418"
xml:space="preserve"><tspan
x="0"
y="11"
id="tspan1018">Optional lists of </tspan><tspan
x="0"
y="26"
id="tspan1020">CSS and JS files</tspan></text>
<text
style="font-size:12px;font-family:'Comic Neue';white-space:pre;inline-size:138.046"
transform="translate(277.91845,188.39939)"
id="text135"
inkscape:export-filename="/home/jpsca/Code/jinjax/docs/static/img/anatomy-en.png"
inkscape:export-xdpi="223.418"
inkscape:export-ydpi="223.418"
xml:space="preserve"><tspan
x="0"
y="11"
id="tspan1022">Paths are absolute or </tspan><tspan
x="0"
y="26"
id="tspan1024">relative to the root of
</tspan><tspan
x="0"
y="41"
id="tspan1026">the components folder</tspan></text>
<text
style="font-size:12px;font-family:'Comic Neue'"
transform="matrix(0.99764329,0,0,0.98692271,247.4097,314.31427)"
id="text143"
inkscape:export-filename="/home/jpsca/Code/jinjax/docs/static/img/anatomy-en.png"
inkscape:export-xdpi="223.418"
inkscape:export-ydpi="223.418"><tspan
x="0"
y="11"
id="tspan137">You can have more </tspan><tspan
x="0"
y="30"
id="tspan139">than one parent </tspan><tspan
x="0"
y="48"
id="tspan141">element, unlike React</tspan></text>
<text
style="font-size:12px;font-family:'Comic Neue';white-space:pre;inline-size:165.6"
transform="matrix(0.9980174,0,0,0.98858774,171.78044,387.36773)"
id="text149"
inkscape:export-filename="/home/jpsca/Code/jinjax/docs/static/img/anatomy-en.png"
inkscape:export-xdpi="223.418"
inkscape:export-ydpi="223.418"
xml:space="preserve"><tspan
x="0"
y="11"
id="tspan1028">You can call any other </tspan><tspan
x="0"
y="26"
id="tspan1030">component and pass attributes </tspan><tspan
x="0"
y="41"
id="tspan1032">to them</tspan></text>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 11 KiB

288
docs/static/img/anatomy-es.svg vendored Normal file
View file

@ -0,0 +1,288 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="420"
height="440"
version="1.1"
viewBox="0 0 420 440"
id="svg151"
sodipodi:docname="anatomy-es.svg"
inkscape:export-filename="/media/data/Code/jinjax-docs/static/img/anatomy-es.png"
inkscape:export-xdpi="223.41818"
inkscape:export-ydpi="223.41818"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview153"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="1.1568182"
inkscape:cx="14.695481"
inkscape:cy="220.86444"
inkscape:window-width="2560"
inkscape:window-height="1357"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg151" />
<defs
id="defs5">
<marker
id="TriangleStart"
overflow="visible"
markerHeight="2.6867051"
markerWidth="2.3239999"
orient="auto-start-reverse"
preserveAspectRatio="xMidYMid"
viewBox="0 0 5.3244081 6.1553851">
<path
transform="scale(.6)"
d="m5.8 0-8.6 5v-10z"
fill="context-stroke"
fill-rule="evenodd"
stroke="context-stroke"
stroke-width="1pt"
id="path2" />
</marker>
</defs>
<rect
width="420"
height="440"
fill="#fff"
fill-opacity=".85"
stroke="#ddd"
id="rect7" />
<path
d="m17 98h320"
stroke="#555"
stroke-width="1px"
id="path9" />
<text
id="code"
fill="#444"
font-family="'SF Mono', Monaco, monospace"
font-size="11px"
font-weight="bold"
stroke-width="1.4"
style="font-variant-caps:normal;font-variant-east-asian:normal;font-variant-ligatures:normal;font-variant-numeric:normal;line-height:1.25"><tspan
x="17"
y="90"
font-style="italic"
font-weight="600"
id="tspan1151">components/Form.jinja</tspan><tspan
x="17"
y="131"
id="tspan1153">{#def action, label, method=&quot;post&quot; #}</tspan><tspan
x="17"
y="145"
id="tspan1155">{#css form.css %}</tspan><tspan
x="17"
y="160"
id="tspan1157">{#js form.js %}</tspan><tspan
x="17"
y="187"
fill="#555"
id="tspan1159">{% set method = method.lower() %}</tspan><tspan
x="17"
y="215"
fill="#3771c8"
id="tspan1165"><tspan
id="tspan1161">&lt;</tspan><tspan
id="tspan1163">form</tspan></tspan><tspan
x="24"
y="229"
id="tspan1175"><tspan
fill="#5f8dd3"
id="tspan1167">method=</tspan><tspan
fill="#080"
id="tspan1169">&quot;</tspan><tspan
fill="#ff7f2a"
id="tspan1171">{{ method }}</tspan><tspan
fill="#080"
id="tspan1173">&quot;</tspan></tspan><tspan
x="24"
y="244"
id="tspan1185"><tspan
fill="#5f8dd3"
id="tspan1177">action=</tspan><tspan
fill="#080"
id="tspan1179">&quot;</tspan><tspan
fill="#ff7f2a"
id="tspan1181">{{ action }}</tspan><tspan
fill="#080"
id="tspan1183">&quot;</tspan></tspan><tspan
x="24"
y="257"
fill="#ff7f2a"
id="tspan1189">{{ attrs.render(<tspan
id="tspan1187">class=&quot;form&quot;</tspan>) }}
</tspan><tspan
x="17"
y="272"
fill="#3771c8"
id="tspan1191">&gt;</tspan><tspan
x="24"
y="286"
fill="#555"
id="tspan1193">{% if method == &quot;post&quot; -%}</tspan><tspan
x="24"
y="299"
fill="#3771c8"
id="tspan1203">
&lt;input <tspan
fill="#5f8dd3"
id="tspan1201">type=<tspan
fill="#080"
id="tspan1195">&quot;hidden&quot;</tspan> name=<tspan
fill="#080"
id="tspan1197">&quot;csrf&quot;</tspan> value=&quot;<tspan
fill="#ff7f2a"
id="tspan1199">{{token}}</tspan>&quot; /&gt;</tspan></tspan><tspan
x="24"
y="314"
fill="#555"
id="tspan1205">{% endif -%}</tspan><tspan
x="24"
y="341"
id="tspan1209"><tspan
fill="#ff7f2a"
id="tspan1207">{{ content }}</tspan></tspan><tspan
x="24"
y="370"
fill="#214478"
id="tspan1215">
&lt;Button <tspan
fill="#5f8dd3"
id="tspan1211">label=</tspan><tspan
fill="#ff7f2a"
id="tspan1213">{label}</tspan>&gt;
</tspan><tspan
x="17"
y="386"
fill="#3771c8"
id="tspan1219">&lt;/<tspan
fill="#3771c8"
font-weight="bold"
id="tspan1217">form</tspan>&gt;</tspan></text>
<g
id="arrows">
<path
d="m96 49c13 28 24 .84 25 24"
fill="none"
marker-end="url(#TriangleStart)"
stroke="#000"
stroke-width="1.7"
id="path94" />
<path
d="m255 65c13 28-60 16-60 49"
fill="none"
marker-end="url(#TriangleStart)"
stroke="#000"
stroke-width="1.7"
id="path96" />
<path
d="m260 151c-26 6.7-74-7.6-108-9.2"
fill="none"
marker-end="url(#TriangleStart)"
stroke="#000"
stroke-width="1.7"
id="path98" />
<path
d="m262 158c-26 5.2-91-.74-124-2"
fill="none"
marker-end="url(#TriangleStart)"
stroke="#000"
stroke-width="1.7"
id="path100" />
<path
d="m169 404c-11-17-56-3.7-64-22"
fill="none"
marker-end="url(#TriangleStart)"
stroke="#000"
stroke-width="1.7"
id="path102" />
</g>
<text
style="font-size:12px;font-family:'Comic Neue'"
transform="matrix(0.99580394,0,0,0.99717236,22.306709,8.8220192)"
id="text111"><tspan
x="0"
y="11"
id="tspan105">Todo antes del primer </tspan><tspan
x="0"
y="30"
id="tspan107">punto es el nombre del </tspan><tspan
x="0"
y="48"
id="tspan109">componente</tspan></text>
<text
style="font-size:12px;font-family:'Comic Neue'"
transform="matrix(0.99585975,0,0,0.94509234,216.62806,15.846205)"
id="text115"><tspan
x="0"
y="6"
id="tspan113">Definición de argumentos</tspan></text>
<text
style="font-size:12px;font-family:'Comic Neue'"
transform="matrix(0.99962611,0,0,0.98554306,218.63043,28.835757)"
id="text121"><tspan
x="0"
y="11"
id="tspan117">Los argumentos sin valores </tspan><tspan
x="0"
y="30"
id="tspan119">predefinidos son obligatorios</tspan></text>
<text
style="font-size:12px;font-family:'Comic Neue'"
transform="matrix(1.0036128,0,0,0.99557292,276.36705,142.82391)"
id="text127"><tspan
x="0"
y="11"
id="tspan123">Listas opcionales de </tspan><tspan
x="0"
y="30"
id="tspan125">archivos CSS y JS</tspan></text>
<text
style="font-size:12px;font-family:'Comic Neue'"
transform="translate(275.93954,180.65106)"
id="text135"><tspan
x="0"
y="11"
id="tspan129">Las rutas son </tspan><tspan
x="0"
y="30"
id="tspan131">relativas al folder </tspan><tspan
x="0"
y="48"
id="tspan133">de componentes</tspan></text>
<text
style="font-size:12px;font-family:'Comic Neue'"
transform="matrix(0.99764329,0,0,0.98692271,247.4097,314.31427)"
id="text143"><tspan
x="0"
y="11"
id="tspan137">Puedes tener mas de </tspan><tspan
x="0"
y="30"
id="tspan139">un elemento padre, a </tspan><tspan
x="0"
y="48"
id="tspan141">diferencia de React</tspan></text>
<text
style="font-size:12px;font-family:'Comic Neue'"
transform="matrix(0.9980174,0,0,0.98858774,171.78044,387.36773)"
id="text149"><tspan
x="0"
y="11"
id="tspan145">Puedes llamar a cualquier </tspan><tspan
x="0"
y="30"
id="tspan147">otro componente</tspan></text>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 8.1 KiB

BIN
docs/static/img/anchors.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 31 KiB

BIN
docs/static/img/apple-touch-icon.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

3
docs/static/img/composable.svg vendored Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M14.25 6.087c0-.355.186-.676.401-.959.221-.29.349-.634.349-1.003 0-1.036-1.007-1.875-2.25-1.875s-2.25.84-2.25 1.875c0 .369.128.713.349 1.003.215.283.401.604.401.959v0a.64.64 0 01-.657.643 48.39 48.39 0 01-4.163-.3c.186 1.613.293 3.25.315 4.907a.656.656 0 01-.658.663v0c-.355 0-.676-.186-.959-.401a1.647 1.647 0 00-1.003-.349c-1.036 0-1.875 1.007-1.875 2.25s.84 2.25 1.875 2.25c.369 0 .713-.128 1.003-.349.283-.215.604-.401.959-.401v0c.31 0 .555.26.532.57a48.039 48.039 0 01-.642 5.056c1.518.19 3.058.309 4.616.354a.64.64 0 00.657-.643v0c0-.355-.186-.676-.401-.959a1.647 1.647 0 01-.349-1.003c0-1.035 1.008-1.875 2.25-1.875 1.243 0 2.25.84 2.25 1.875 0 .369-.128.713-.349 1.003-.215.283-.4.604-.4.959v0c0 .333.277.599.61.58a48.1 48.1 0 005.427-.63 48.05 48.05 0 00.582-4.717.532.532 0 00-.533-.57v0c-.355 0-.676.186-.959.401-.29.221-.634.349-1.003.349-1.035 0-1.875-1.007-1.875-2.25s.84-2.25 1.875-2.25c.37 0 .713.128 1.003.349.283.215.604.401.96.401v0a.656.656 0 00.658-.663 48.422 48.422 0 00-.37-5.36c-1.886.342-3.81.574-5.766.689a.578.578 0 01-.61-.58v0z" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.2 KiB

3
docs/static/img/encapsulated.svg vendored Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M21 11.25v8.25a1.5 1.5 0 01-1.5 1.5H5.25a1.5 1.5 0 01-1.5-1.5v-8.25M12 4.875A2.625 2.625 0 109.375 7.5H12m0-2.625V7.5m0-2.625A2.625 2.625 0 1114.625 7.5H12m0 0V21m-8.625-9.75h18c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125h-18c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125z" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 510 B

BIN
docs/static/img/favicon.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.7 KiB

7
docs/static/img/favicon.svg vendored Normal file
View file

@ -0,0 +1,7 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="512" height="512" viewBox="0 0 135 135" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
<rect style="fill:#ffffff" width="128.0000" height="112.0000" x="4.0000" y="12.0000" />
<rect style="fill:#55b2ff" width="128.0000" height="16.0000" x="4.0000" y="12.0000" />
<path style="fill:#000000" d="m 1.6901338,127.07004 v 3e-5 C 1.3828219,126.9448 0.8768176,126.51851 0.56568825,126.12275 L -6.9341144e-6,125.40319 V 67.874657 C -6.9341144e-6,23.83623 0.07409113,10.183354 0.31607229,9.6520087 1.0219463,8.1019542 -3.7115247,8.2034435 67.877153,8.2034435 h 65.786837 l 0.90134,0.9018238 0.90133,0.9018247 c 0,0 -0.0453,38.573404 -0.0679,57.860106 -0.0226,19.286701 -0.0679,57.860102 -0.0679,57.860102 l -0.7336,0.73399 -0.73359,0.73399 m -3.69215,-5.16205 V 33.351884 H 5.291517 V 122.03323 M 130.17158,13.497852 H 5.291517 V 28.057476 H 130.17158 Z" />
<rect style="fill:#d0ec7e;stroke:#000000;stroke-width:4.81818;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none" width="58.46307" height="58.463062" x="55.0000" y="50.0000" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
docs/static/img/jinjax-logo-w.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 9.8 KiB

1
docs/static/img/jinjax-logo-w.svg vendored Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="87mm" height="24mm" viewBox="0 0 87 24"><g style="fill:#f0f0f0;fill-opacity:1"><g style="font-size:40px;line-height:1.25;white-space:pre;shape-inside:url(#d);fill:#f0f0f0;fill-opacity:1;stroke:none;stroke-width:1.44682;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" transform="matrix(.46943 0 0 .47617 -461.947 -45.454)"><path d="M1054.78 135.02c6.991 0 10.976-3.75 10.976-10.273v-18.691h-8.281v18.632c0 2.227-.957 3.399-2.813 3.399-1.836 0-3.027-1.27-3.027-3.496v-.04h-7.93v.06c0 6.523 4.316 10.41 11.074 10.41zm18.964-25.273c2.246 0 4.082-1.758 4.082-3.984 0-2.247-1.836-4.004-4.082-4.004-2.226 0-4.082 1.757-4.082 4.004 0 2.226 1.856 3.984 4.082 3.984zm-4.004 24.492h8.008v-21.953h-8.008zm11.29.001h8.007v-12.403c0-2.13 1.074-3.653 2.988-3.653 2.032 0 2.95 1.368 2.95 3.653v12.402h8.007v-14.18c0-5.273-2.5-8.32-7.343-8.32-3.047 0-5.313 1.602-6.211 4.024h-.39v-3.477h-8.009zm29.042-24.493c2.246 0 4.082-1.758 4.082-3.984 0-2.247-1.836-4.004-4.082-4.004-2.226 0-4.082 1.757-4.082 4.004 0 2.226 1.856 3.984 4.082 3.984zm-4.804 31.914c5.566 0 8.808-2.598 8.808-7.05v-22.325h-8.008v21.973c0 1.23-.703 1.757-2.324 1.757-.332 0-.683-.019-.918-.058v5.586c.469.058 1.64.117 2.442.117zm18.027-7.109c2.773 0 5.117-1.153 5.957-2.891h.39v2.578h7.852v-14.941c0-4.805-3.574-7.559-9.844-7.559-6.308 0-10.234 2.754-10.566 6.992l-.02.254h7.148l.04-.097c.37-.918 1.328-1.426 2.91-1.426 1.543 0 2.48.703 2.48 1.836v1.62l-4.336.255c-5.82.351-9.004 2.695-9.004 6.68v.038c0 4.004 2.793 6.66 6.992 6.66zm.645-7.266v-.04c0-1.054.976-1.757 2.656-1.874l3.047-.195v1.27c0 1.523-1.426 2.714-3.223 2.714-1.523 0-2.48-.742-2.48-1.875zm15.468 6.954h8.75l4.824-8.497h.157l4.863 8.496h9.219l-8.692-14.082v-.156l8.73-13.945h-9.179l-4.453 8.984h-.156l-4.434-8.984h-9.648l8.32 13.906v.156z" aria-label="JinjaX" style="font-weight:900;font-family:&quot;SF Pro Text&quot;;-inkscape-font-specification:&quot;SF Pro Text Heavy&quot;;fill:#f0f0f0;fill-opacity:1;stroke:none;stroke-width:1.44682;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"/></g></g><g style="fill:#90d73b;stroke:#4d4d4d;stroke-width:4"><path fill="#fff" stroke="none" d="M1.74 1.616h23.704v20.906H1.741Z"/><path fill="#e6e6e6" stroke="none" d="M1.74 1.616h23.704v2.986H1.741Z"/><path fill="#4d4d4d" stroke="none" d="M1 23c.003-7.61 0-15.455 0-22h25v22m-.894-.846V5.601H1.98v16.553m23.126-18.9V1.897H1.98v2.718h23.126z"/><path d="M92.311 45.905h26.316v26.316H92.311Z" transform="matrix(.18519 0 0 .18666 1 -.624)"/><path fill="#fff" d="M17.147 45.887h64.319v64.319H17.147Z" transform="matrix(.18519 0 0 .18666 1 -.624)"/><path fill="#55b2ff" d="M25.854 53.803h35.304v35.304H25.854Z" transform="matrix(.18519 0 0 .18666 1 -.624)"/><path fill="#e6e6e6" d="M92.311 83.873h26.316v26.316H92.311Z" transform="matrix(.18519 0 0 .18666 1 -.624)"/></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
docs/static/img/jinjax-logo.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 9.1 KiB

1
docs/static/img/jinjax-logo.svg vendored Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="87mm" height="24mm" viewBox="0 0 87 24"><g style="fill:#000;fill-opacity:1"><g style="font-size:40px;line-height:1.25;white-space:pre;shape-inside:url(#d);fill:#000;fill-opacity:1;stroke:none;stroke-width:1.44682;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" transform="matrix(.46943 0 0 .47617 -461.947 -45.454)"><path d="M1054.78 135.02c6.991 0 10.976-3.75 10.976-10.273v-18.691h-8.281v18.632c0 2.227-.957 3.399-2.813 3.399-1.836 0-3.027-1.27-3.027-3.496v-.04h-7.93v.06c0 6.523 4.316 10.41 11.074 10.41zm18.964-25.273c2.246 0 4.082-1.758 4.082-3.984 0-2.247-1.836-4.004-4.082-4.004-2.226 0-4.082 1.757-4.082 4.004 0 2.226 1.856 3.984 4.082 3.984zm-4.004 24.492h8.008v-21.953h-8.008zm11.29.001h8.007v-12.403c0-2.13 1.074-3.653 2.988-3.653 2.032 0 2.95 1.368 2.95 3.653v12.402h8.007v-14.18c0-5.273-2.5-8.32-7.343-8.32-3.047 0-5.313 1.602-6.211 4.024h-.39v-3.477h-8.009zm29.042-24.493c2.246 0 4.082-1.758 4.082-3.984 0-2.247-1.836-4.004-4.082-4.004-2.226 0-4.082 1.757-4.082 4.004 0 2.226 1.856 3.984 4.082 3.984zm-4.804 31.914c5.566 0 8.808-2.598 8.808-7.05v-22.325h-8.008v21.973c0 1.23-.703 1.757-2.324 1.757-.332 0-.683-.019-.918-.058v5.586c.469.058 1.64.117 2.442.117zm18.027-7.109c2.773 0 5.117-1.153 5.957-2.891h.39v2.578h7.852v-14.941c0-4.805-3.574-7.559-9.844-7.559-6.308 0-10.234 2.754-10.566 6.992l-.02.254h7.148l.04-.097c.37-.918 1.328-1.426 2.91-1.426 1.543 0 2.48.703 2.48 1.836v1.62l-4.336.255c-5.82.351-9.004 2.695-9.004 6.68v.038c0 4.004 2.793 6.66 6.992 6.66zm.645-7.266v-.04c0-1.054.976-1.757 2.656-1.874l3.047-.195v1.27c0 1.523-1.426 2.714-3.223 2.714-1.523 0-2.48-.742-2.48-1.875zm15.468 6.954h8.75l4.824-8.497h.157l4.863 8.496h9.219l-8.692-14.082v-.156l8.73-13.945h-9.179l-4.453 8.984h-.156l-4.434-8.984h-9.648l8.32 13.906v.156z" aria-label="JinjaX" style="font-weight:900;font-family:&quot;SF Pro Text&quot;;-inkscape-font-specification:&quot;SF Pro Text Heavy&quot;;fill:#000;fill-opacity:1;stroke:none;stroke-width:1.44682;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"/></g></g><g style="fill:#90d73b;stroke:#4d4d4d;stroke-width:4"><path fill="#fff" stroke="none" d="M1.74 1.616h23.704v20.906H1.741Z"/><path fill="#e6e6e6" stroke="none" d="M1.74 1.616h23.704v2.986H1.741Z"/><path fill="#4d4d4d" stroke="none" d="M1 23c.003-7.61 0-15.455 0-22h25v22m-.894-.846V5.601H1.98v16.553m23.126-18.9V1.897H1.98v2.718h23.126z"/><path d="M92.311 45.905h26.316v26.316H92.311Z" transform="matrix(.18519 0 0 .18666 1 -.624)"/><path fill="#fff" d="M17.147 45.887h64.319v64.319H17.147Z" transform="matrix(.18519 0 0 .18666 1 -.624)"/><path fill="#55b2ff" d="M25.854 53.803h35.304v35.304H25.854Z" transform="matrix(.18519 0 0 .18666 1 -.624)"/><path fill="#e6e6e6" d="M92.311 83.873h26.316v26.316H92.311Z" transform="matrix(.18519 0 0 .18666 1 -.624)"/></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
docs/static/img/logo.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.4 KiB

9
docs/static/img/logo.svg vendored Normal file
View file

@ -0,0 +1,9 @@
<svg width="512" height="512" viewBox="0 0 135 135" fill="#90d73b" stroke-width="4" stroke="#4d4d4d" xmlns="http://www.w3.org/2000/svg">
<path d="M4 12h128v112H4z" fill="#fff" stroke-width="0"/>
<path d="M4 12h128v16H4z" fill="#e6e6e6" stroke-width="0"/>
<path d="M0 126.563C.014 85.794 0 43.763 0 8.7h135v117.862m-4.828-4.53V33.35H5.292v88.681M130.17 20.78V13.5H5.29v14.56h124.88z" fill="#4d4d4d" stroke-width="0"/>
<path d="M92.311 45.905h26.316v26.316H92.311z"/>
<path d="M17.147 45.887h64.319v64.319H17.147z" fill="#fff"/>
<path d="M25.854 53.803h35.304v35.304H25.854z" fill="#55b2ff"/>
<path d="M92.311 83.873h26.316v26.316H92.311z" fill="#e6e6e6"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 661 B

8
docs/static/img/modern.svg vendored Normal file
View file

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg width="32mm" height="20mm" version="1.1" viewBox="0 0 32 20" xmlns="http://www.w3.org/2000/svg">
<text transform="matrix(.38398 0 0 .3722 -42.207 -42.291)" fill="#000000" font-family="sans-serif" font-size="40px" style="line-height:1.25;shape-inside:url(#rect2079);white-space:pre" xml:space="preserve"/>
<path d="m21.48 2.5704e-6h-3.3855l-7.4789 20h3.3986z" fill="#3465a4" stroke-width=".7728"/>
<path d="m32 8.6678-10.497-3.7261v2.6314l7.9024 2.5711-7.9024 2.5812v2.5711l10.497-3.7261z" fill="#333" stroke-width=".44679"/>
<path d="m1.3575e-7 8.6678 10.497-3.7261v2.6314l-7.9024 2.5711 7.9024 2.5812v2.5711l-10.497-3.7261z" fill="#333" stroke-width=".44679"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 775 B

3
docs/static/img/practical.svg vendored Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M18.375 12.739l-7.693 7.693a4.5 4.5 0 01-6.364-6.364l10.94-10.94A3 3 0 1119.5 7.372L8.552 18.32m.009-.01l-.01.01m5.699-9.941l-7.81 7.81a1.5 1.5 0 002.112 2.13" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 358 B

3
docs/static/img/simple.svg vendored Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 259 B

BIN
docs/static/img/slots-_slot.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 309 KiB

BIN
docs/static/img/slots-diagram.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 91 KiB

BIN
docs/static/img/spaghetti_code.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 185 KiB

BIN
docs/static/img/ui-accordion.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 158 KiB

BIN
docs/static/img/ui-linkedlist.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 229 KiB

BIN
docs/static/img/ui-menu.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 193 KiB

BIN
docs/static/img/ui-popover.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 187 KiB

BIN
docs/static/img/ui-reldate.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 47 KiB

BIN
docs/static/img/ui-tabs.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 167 KiB

637
docs/static/prose.css vendored Normal file
View file

@ -0,0 +1,637 @@
.prose {
--cd-prose-body: #3f3f46;
--cd-prose-headings: #18181b;
--cd-prose-lead: #52525b;
--cd-prose-links: #18181b;
--cd-prose-bold: #18181b;
--cd-prose-counters: #71717a;
--cd-prose-bullets: #d4d4d8;
--cd-prose-hr: #e4e4e7;
--cd-prose-quotes: #18181b;
--cd-prose-quote-borders: #e4e4e7;
--cd-prose-captions: #71717a;
--cd-prose-code: #18181b;
--cd-prose-pre-code: rgb(238 238 238);
--cd-prose-pre-border: rgb(51, 51, 51);
--cd-prose-pre-bg: rgb(24 24 24);
--cd-prose-th-borders: #ddd;
--cd-prose-td-borders: #eee;
--cd-prose-bg-hover: rgba(0,0,0,0.035);
--cd-prose-invert-body: #d4d4d8;
--cd-prose-invert-headings: #fff;
--cd-prose-invert-lead: #a1a1aa;
--cd-prose-invert-links: #fff;
--cd-prose-invert-bold: #fff;
--cd-prose-invert-counters: #a1a1aa;
--cd-prose-invert-bullets: #52525b;
--cd-prose-invert-hr: #3f3f46;
--cd-prose-invert-quotes: #f4f4f5;
--cd-prose-invert-quote-borders: #3f3f46;
--cd-prose-invert-captions: #a1a1aa;
--cd-prose-invert-code: #fff;
--cd-prose-invert-pre-code: rgb(238 238 238);
--cd-prose-invert-pre-border: rgb(51, 51, 51);
--cd-prose-invert-pre-bg: rgb(24 24 24);
--cd-prose-invert-th-borders: #52525b;
--cd-prose-invert-td-borders: #3f3f46;
--cd-prose-invert-bg-hover: rgba(0,0,0,0.035);
}
.dark .prose {
--cd-prose-body: var(--cd-prose-invert-body);
--cd-prose-headings: var(--cd-prose-invert-headings);
--cd-prose-lead: var(--cd-prose-invert-lead);
--cd-prose-links: var(--cd-prose-invert-links);
--cd-prose-bold: var(--cd-prose-invert-bold);
--cd-prose-counters: var(--cd-prose-invert-counters);
--cd-prose-bullets: var(--cd-prose-invert-bullets);
--cd-prose-hr: var(--cd-prose-invert-hr);
--cd-prose-quotes: var(--cd-prose-invert-quotes);
--cd-prose-quote-borders: var(--cd-prose-invert-quote-borders);
--cd-prose-captions: var(--cd-prose-invert-captions);
--cd-prose-code: var(--cd-prose-invert-code);
--cd-prose-pre-code: var(--cd-prose-invert-pre-code);
--cd-prose-pre-border: var(--cd-prose-invert-pre-border);
--cd-prose-pre-bg: var(--cd-prose-invert-pre-bg);
--cd-prose-th-borders: var(--cd-prose-invert-th-borders);
--cd-prose-td-borders: var(--cd-prose-invert-td-borders);
--cd-prose-bg-hover: var(--cd-prose-invert-bg-hover);
}
.prose {
font-size: 1em;
line-height: 1.75;
color: var(--cd-prose-body);
}
.prose h1:not(:where([class~="not-prose"] *)) ,
.prose h2:not(:where([class~="not-prose"] *)) ,
.prose h3:not(:where([class~="not-prose"] *)) ,
.prose h4:not(:where([class~="not-prose"] *)) ,
.prose h5:not(:where([class~="not-prose"] *)) ,
.prose h6:not(:where([class~="not-prose"] *)) {
font-family: var(--cd-font-serif);
}
.prose :where(p):not(:where([class~="not-prose"] *)) {
margin-top: 1.25em;
margin-bottom: 1.25em;
}
.prose :where([class~="lead"]):not(:where([class~="not-prose"] *)) {
color: var(--cd-prose-lead);
font-size: 1.25em;
line-height: 1.6;
margin-top: 1.2em;
margin-bottom: 1.2em;
}
.prose :where(a):not(:where([class~="not-prose"] *)) {
color: var(--cd-prose-links);
text-decoration: underline;
font-weight: 500;
}
.prose :where(strong):not(:where([class~="not-prose"] *)) {
color: var(--cd-prose-bold);
font-weight: 600;
}
.prose :where(a strong):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(blockquote strong):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(thead th strong):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(ol):not(:where([class~="not-prose"] *)) {
list-style-type: decimal;
margin-top: 1.25em;
margin-bottom: 1.25em;
padding-left: 1.625em;
}
.prose :where(ol[type="A"]):not(:where([class~="not-prose"] *)) {
list-style-type: upper-alpha;
}
.prose :where(ol[type="a"]):not(:where([class~="not-prose"] *)) {
list-style-type: lower-alpha;
}
.prose :where(ol[type="A" s]):not(:where([class~="not-prose"] *)) {
list-style-type: upper-alpha;
}
.prose :where(ol[type="a" s]):not(:where([class~="not-prose"] *)) {
list-style-type: lower-alpha;
}
.prose :where(ol[type="I"]):not(:where([class~="not-prose"] *)) {
list-style-type: upper-roman;
}
.prose :where(ol[type="i"]):not(:where([class~="not-prose"] *)) {
list-style-type: lower-roman;
}
.prose :where(ol[type="I" s]):not(:where([class~="not-prose"] *)) {
list-style-type: upper-roman;
}
.prose :where(ol[type="i" s]):not(:where([class~="not-prose"] *)) {
list-style-type: lower-roman;
}
.prose :where(ol[type="1"]):not(:where([class~="not-prose"] *)) {
list-style-type: decimal;
}
.prose :where(ul):not(:where([class~="not-prose"] *)) {
list-style-type: disc;
margin-top: 1.25em;
margin-bottom: 1.25em;
padding-left: 1.625em;
}
.prose :where(ol > li):not(:where([class~="not-prose"] *))::marker {
font-weight: 400;
color: var(--cd-prose-counters);
}
.prose :where(ul > li):not(:where([class~="not-prose"] *))::marker {
color: var(--cd-prose-bullets);
}
.prose :where(hr):not(:where([class~="not-prose"] *)) {
border-color: var(--cd-prose-hr);
border-top-width: 1px;
margin-top: 3em;
margin-bottom: 3em;
}
.prose :where(blockquote):not(:where([class~="not-prose"] *)) {
font-weight: 500;
font-style: italic;
color: var(--cd-prose-quotes);
border-left-width: 0.25em;
border-left-color: var(--cd-prose-quote-borders);
quotes: "\201C""\201D""\2018""\2019";
margin-top: 1.6em;
margin-bottom: 1.6em;
padding-left: 1em;
}
.prose :where(blockquote p:first-of-type):not(:where([class~="not-prose"] *))::before {
content: open-quote;
}
.prose :where(blockquote p:last-of-type):not(:where([class~="not-prose"] *))::after {
content: close-quote;
}
.prose :where(h1):not(:where([class~="not-prose"] *)) {
color: var(--cd-prose-headings);
font-weight: 800;
font-size: 2.2rem;
margin-top: 0;
margin-bottom: 0.8888889em;
line-height: 1.1111111;
}
.prose :where(h1 strong):not(:where([class~="not-prose"] *)) {
font-weight: 900;
color: inherit;
}
.prose :where(h2):not(:where([class~="not-prose"] *)) {
color: var(--cd-prose-headings);
font-weight: 700;
font-size: 1.8em;
margin-top: 1.2em;
margin-bottom: 0.5em;
line-height: 1.3333333;
}
.prose :where(h2 strong):not(:where([class~="not-prose"] *)) {
font-weight: 800;
color: inherit;
}
.prose :where(h3):not(:where([class~="not-prose"] *)) {
color: var(--cd-prose-headings);
font-weight: 600;
font-size: 1.4em;
margin-top: 1.6em;
margin-bottom: 0.4em;
line-height: 1.6;
}
.prose :where(h3 strong):not(:where([class~="not-prose"] *)) {
font-weight: 700;
color: inherit;
}
.prose :where(h4):not(:where([class~="not-prose"] *)) {
color: var(--cd-prose-headings);
font-weight: 600;
font-size: 1.2em;
margin-top: 1.5em;
margin-bottom: 0.5em;
line-height: 1.5;
}
.prose :where(h4 strong):not(:where([class~="not-prose"] *)) {
font-weight: 700;
color: inherit;
}
.prose :where(h5):not(:where([class~="not-prose"] *)) {
color: var(--cd-prose-headings);
font-weight: 600;
font-size: 1em;
margin-top: 1em;
margin-bottom: 0.5em;
line-height: 1.5;
}
.prose :where(h6):not(:where([class~="not-prose"] *)) {
color: var(--cd-prose-headings);
font-weight: 600;
font-size: 1em;
margin-top: 1em;
margin-bottom: 0.5em;
line-height: 1.4;
}
.prose :where(img):not(:where([class~="not-prose"] *)) {
margin-top: 2em;
margin-bottom: 2em;
}
.prose :where(figure > *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
margin-bottom: 0;
}
.prose :where(figcaption):not(:where([class~="not-prose"] *)) {
color: var(--cd-prose-captions);
font-size: 0.875em;
line-height: 1.4285714;
margin-top: 0.8571429em;
}
.prose :where(code):not(:where([class~="not-prose"] *)) {
color: var(--cd-prose-code);
font-size: 0.98em;
letter-spacing: -0.02em;
}
.prose :where(code):not(:where(pre code)):not(:where([class~="not-prose"] *)) {
padding: 0.1em;
background: var(--cd-bg-color-hover);
}
.prose :where(a code):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(h1 code):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(h2 code):not(:where([class~="not-prose"] *)) {
color: inherit;
font-size: 0.875em;
}
.prose :where(h3 code):not(:where([class~="not-prose"] *)) {
color: inherit;
font-size: 0.9em;
}
.prose :where(h4 code):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(blockquote code):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(thead th code):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(table):not(:where([class~="not-prose"] *)) {
width: 100%;
table-layout: auto;
text-align: left;
margin-top: 2em;
margin-bottom: 2em;
font-size: 0.875em;
line-height: 1.7142857;
border-width: 1px;
border-color: var(--cd-prose-td-borders);
}
.prose :where(thead):not(:where([class~="not-prose"] *)) {
border-bottom-width: 1px;
border-bottom-color: var(--cd-prose-th-borders);
}
.prose :where(thead th):not(:where([class~="not-prose"] *)) {
color: var(--cd-prose-headings);
font-weight: 600;
vertical-align: bottom;
border-left-width: 1px;
border-left-color: var(--cd-prose-th-borders);
/* text-transform: uppercase; */
}
.prose :where(thead th:first-child):not(:where([class~="not-prose"] *)) {
border-left-width: 0;
}
.prose :where(tbody tr):not(:where([class~="not-prose"] *)) {
border-bottom-width: 1px;
border-bottom-color: var(--cd-prose-td-borders);
transition: background-color 125ms;
}
.prose :where(tbody tr:hover):not(:where([class~="not-prose"] *)) {
background-color: var(--cd-prose-bg-hover);
}
.prose :where(tbody tr:last-child):not(:where([class~="not-prose"] *)) {
border-bottom-width: 0;
}
.prose :where(tbody td):not(:where([class~="not-prose"] *)) {
vertical-align: baseline;
border-left-width: 1px;
border-left-color: var(--cd-prose-th-borders);
}
.prose :where(tbody td:first-child):not(:where([class~="not-prose"] *)) {
border-left-width: 0;
}
.prose :where(tbody td p:first-child):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose :where(tfoot):not(:where([class~="not-prose"] *)) {
border-top-width: 1px;
border-top-color: var(--cd-prose-th-borders);
}
.prose :where(tfoot td):not(:where([class~="not-prose"] *)) {
vertical-align: top;
}
.prose :where(th, td):not(:where([class~="not-prose"] *)) {
padding: 0.5rem 1rem;
}
.prose :where(video):not(:where([class~="not-prose"] *)) {
margin-top: 2em;
margin-bottom: 2em;
}
.prose :where(figure):not(:where([class~="not-prose"] *)) {
margin-top: 2em;
margin-bottom: 2em;
}
.prose :where(li):not(:where([class~="not-prose"] *)) {
margin-top: 0.5em;
margin-bottom: 0.5em;
}
.prose :where(ol > li):not(:where([class~="not-prose"] *)) {
padding-left: 0.375em;
}
.prose :where(ul > li):not(:where([class~="not-prose"] *)) {
padding-left: 0.375em;
}
.prose :where(.prose > ul > li p):not(:where([class~="not-prose"] *)) {
margin-top: 0.75em;
margin-bottom: 0.75em;
}
.prose :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
margin-top: 1.25em;
}
.prose :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
margin-bottom: 1.25em;
}
.prose :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
margin-top: 1.25em;
}
.prose :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
margin-bottom: 1.25em;
}
.prose :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"] *)) {
margin-top: 0.75em;
margin-bottom: 0.75em;
}
.prose :where(hr + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose :where(h2 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose :where(h3 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose :where(h4 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose :where(.prose > :first-child):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose :where(.prose > :last-child):not(:where([class~="not-prose"] *)) {
margin-bottom: 0;
}
.prose :where(.task-list .task-list):not(:where([class~="not-prose"] *)) {
padding-left: 1em;
}
.prose :where(dl):not(:where([class~="not-prose"] *)) {
margin-top: 1.25em;
margin-bottom: 1.25em;
}
.prose :where(dt):not(:where([class~="not-prose"] *)) {
font-weight: bold;
}
.prose :where(dd):not(:where([class~="not-prose"] *)) {
padding-left: 1em;
}
pre {
border: 1px solid rgb(var(--cd-prose-pre-border));
overflow-x: auto;
font-weight: 400;
font-feature-settings: "kern";
white-space: pre;
scrollbar-width: thin;
padding: 1.25rem 1.5rem;
}
pre::-webkit-scrollbar {
width: 2px;
background-color: ButtonFace;
}
pre:has([data-linenos]) {
padding-left: 0;
}
pre code {
background-color: transparent;
border-width: 0;
border-radius: 0;
padding: 0;
font-weight: inherit;
color: inherit;
font-size: inherit;
font-family: inherit;
line-height: inherit;
}
pre a {
text-decoration: none;
}
.highlight {
margin-top: 0.5rem;
margin-bottom: 1rem;
border-radius: 6px;
}
.highlight:has(> .filename) {
background-color: rgb(249 250 251);
border: 1px solid rgb(153, 153, 153);
}
.highlight:is(.dark *):has(> .filename) {
background-color: rgb(55 65 81);
border-color: rgb(75 85 99);
}
.highlight > .filename {
border-radius: 6px 0 0 0;
display: inline-block;
border-right: 1px solid rgb(153, 153, 153);
background-color: #e7e9ed;
padding: 0.5rem;
color: #333;
font-weight: 500;
font-size: 0.9em;
}
.highlight:is(.dark *) > .filename {
border-color: rgb(75 85 99);
background-color: #111;
color: rgb(255 255 255);
}
.highlight pre {
background-color: rgba(0, 0, 0, 0.9);
border-radius: 6px;
font-size: 0.98rem;
line-height: 1.4;
}
.highlight .filename + pre {
border-radius: 0 0 6px 6px;
}
.highlight pre code { color: white; }
.highlight pre code [data-linenos]:before {
content: attr(data-linenos);
display: inline-block;
width: 3rem;
text-align: right;
padding-right: 1rem;
white-space: nowrap;
color: rgb(82 82 91);
font-size: 0.75rem;
}
.highlight .hll {
background-color: #333;
display: block;
}
.highlight .c { color: hsl(31, 76%, 64%) } /* Comment */
.highlight .err { color: #960050; background-color: #1e0010 } /* Error */
.highlight .k { color: #66d9ef } /* Keyword */
.highlight .l { color: #ae81ff } /* Literal */
.highlight .n { color: #f8f8f2 } /* Name */
.highlight .o { color: #f92672 } /* Operator */
.highlight .p { color: #f8f8f2 } /* Punctuation */
.highlight .cm { color: hsl(30, 20%, 50%) } /* Comment.Multiline */
.highlight .cp { color: hsl(30, 20%, 50%) } /* Comment.Preproc */
.highlight .c1 { color: hsl(30, 20%, 50%) } /* Comment.Single */
.highlight .cs { color: hsl(30, 20%, 50%) } /* Comment.Special */
.highlight .ge { font-style: italic } /* Generic.Emph */
.highlight .gs { font-weight: bold } /* Generic.Strong */
.highlight .kc { color: #66d9ef } /* Keyword.Constant */
.highlight .kd { color: #66d9ef } /* Keyword.Declaration */
.highlight .kn { color: #f92672 } /* Keyword.Namespace */
.highlight .kp { color: #66d9ef } /* Keyword.Pseudo */
.highlight .kr { color: #66d9ef } /* Keyword.Reserved */
.highlight .kt { color: #66d9ef } /* Keyword.Type */
.highlight .ld { color: #e6db74 } /* Literal.Date */
.highlight .m { color: #ae81ff } /* Literal.Number */
.highlight .s { color: #e6db74 } /* Literal.String */
.highlight .na { color: #a6e22e } /* Name.Attribute */
.highlight .nb { color: #f8f8f2 } /* Name.Builtin */
.highlight .nc { color: #a6e22e } /* Name.Class */
.highlight .no { color: #66d9ef } /* Name.Constant */
.highlight .nd { color: #a6e22e } /* Name.Decorator */
.highlight .ni { color: #f8f8f2 } /* Name.Entity */
.highlight .ne { color: #a6e22e } /* Name.Exception */
.highlight .nf { color: #a6e22e } /* Name.Function */
.highlight .nl { color: #f8f8f2 } /* Name.Label */
.highlight .nn { color: #f8f8f2 } /* Name.Namespace */
.highlight .nx { color: #a6e22e } /* Name.Other */
.highlight .py { color: #f8f8f2 } /* Name.Property */
.highlight .nt { color: #f92672 } /* Name.Tag */
.highlight .nv { color: #f8f8f2 } /* Name.Variable */
.highlight .ow { color: #f92672 } /* Operator.Word */
.highlight .w { color: #f8f8f2 } /* Text.Whitespace */
.highlight .mf { color: #ae81ff } /* Literal.Number.Float */
.highlight .mh { color: #ae81ff } /* Literal.Number.Hex */
.highlight .mi { color: #ae81ff } /* Literal.Number.Integer */
.highlight .mo { color: #ae81ff } /* Literal.Number.Oct */
.highlight .sb { color: #e6db74 } /* Literal.String.Backtick */
.highlight .sc { color: #e6db74 } /* Literal.String.Char */
.highlight .sd { color: #e6db74 } /* Literal.String.Doc */
.highlight .s2 { color: #e6db74 } /* Literal.String.Double */
.highlight .se { color: #ae81ff } /* Literal.String.Escape */
.highlight .sh { color: #e6db74 } /* Literal.String.Heredoc */
.highlight .si { color: #e6db74 } /* Literal.String.Interpol */
.highlight .sx { color: #e6db74 } /* Literal.String.Other */
.highlight .sr { color: #e6db74 } /* Literal.String.Regex */
.highlight .s1 { color: #e6db74 } /* Literal.String.Single */
.highlight .ss { color: #e6db74 } /* Literal.String.Symbol */
.highlight .bp { color: #f8f8f2 } /* Name.Builtin.Pseudo */
.highlight .vc { color: #f8f8f2 } /* Name.Variable.Class */
.highlight .vg { color: #f8f8f2 } /* Name.Variable.Global */
.highlight .vi { color: #f8f8f2 } /* Name.Variable.Instance */
.highlight .il { color: #ae81ff } /* Literal.Number.Integer.Long */
.highlight .gh { } /* Generic Heading & Diff Header */
.highlight .gu { color: hsl(30, 20%, 50%); } /* Generic.Subheading & Diff Unified/Comment? */
.highlight .gd { color: #f92672; } /* Generic.Deleted & Diff Deleted */
.highlight .gi { color: #a6e22e; } /* Generic.Inserted & Diff Inserted */

1808
docs/static/theme.css vendored Normal file
View file

File diff suppressed because it is too large Load diff