Fix consistency between Webkit & Gecko.

Also, minor style fixes.
This commit is contained in:
Sergio Martínez Portela 2022-11-21 00:09:52 +01:00
parent 913e2c54d3
commit 86e36d5b79

View File

@ -151,11 +151,11 @@ body nav input {
/* Item list */ /* Item list */
.node .contents ul { .node .contents ul {
--tree-spacing : 1rem; --tree-spacing : 1rem;
--tree-radius : 0.75ex;
--tree-line-separation: 0.5rem; --tree-line-separation: 0.5rem;
--tree-color: #ccc; --tree-color: #ccc;
--tree-border-radius: 10px; --tree-border-radius: 10px;
list-style: none; list-style: none;
/* margin-left: var(--tree-spacing); */
} }
.node .contents ul li { .node .contents ul li {
@ -163,36 +163,43 @@ body nav input {
} }
.node .contents ul li::after { .node .contents ul li::after {
content: ''; content: '';
color: var(--tree-color); display: block;
position: absolute; position: absolute;
/* left: calc(var(--tree-spacing) - 0.5ex); */ top: calc(var(--tree-spacing) / 2 - var(--tree-radius));
/* Shown on right */ left: calc(var(--tree-spacing) - var(--tree-radius) - 1px);
left: -1ex; width: calc(2 * var(--tree-radius));
/* Shown on left */ height: calc(2 * var(--tree-radius));
top: calc(-0.5ex - 2px); border-radius: 50%;
background: var(--tree-color);
} }
.node .contents ul li::before { .node .contents ul li::before {
content: ' '; content: ' ';
width: var(--tree-spacing); width: var(--tree-spacing);
display: inline-block; display: inline-block;
border-bottom: 2px solid var(--tree-color); border-bottom: 2px dashed var(--tree-color);
vertical-align: super; vertical-align: super;
margin-right: var(--tree-line-separation); margin-right: calc(var(--tree-line-separation) + 0.5ex);
margin-left: -2px;
} }
/* Nested item list */ /* Nested item list */
.node .contents ul ul { .node .contents ul ul {
padding: 0; padding: 0;
margin-left: calc(var(--tree-spacing)); margin-left: calc(var(--tree-spacing));
list-style: none;
} }
.node .contents ul ul li { .node .contents ul ul li {
/* margin-left: 1ex; */ margin-left: calc(0px - var(--tree-radius) / 2 + 2px);
border-left: 2px solid var(--tree-color); border-left: 2px solid var(--tree-color);
} }
.node .contents ul ul li::marker {
content: '';
}
.node .contents ul ul li::after { .node .contents ul ul li::after {
left: calc(var(--tree-spacing) * 2 - 0.5ex); left: calc(var(--tree-spacing) * 2 - 0.5ex);
} }
@ -204,14 +211,14 @@ body nav input {
border-radius: 0; border-radius: 0;
top: calc(-0.5ex - 2px); top: calc(-0.5ex - 2px);
border-left: 2px solid var(--tree-color); border-left: 2px solid var(--tree-color);
margin-left: -2px; border-bottom-style: solid;
} }
.node .contents ul ul li:last-child::before { .node .contents ul ul li:last-of-type::before {
border-bottom-left-radius: var(--tree-border-radius); border-bottom-left-radius: var(--tree-border-radius);
} }
.node .contents ul li:last-child { .node .contents ul li:last-of-type {
border-color: transparent; border-color: transparent;
} }
@ -382,7 +389,7 @@ article.post {
border-right: 1px solid #000; border-right: 1px solid #000;
padding-left: 0.75ex; padding-left: 0.75ex;
} }
.site-header .site-links .fancy-link:last-child { .site-header .site-links .fancy-link:last-of-type {
border: none; border: none;
} }
@ -525,6 +532,10 @@ tr.__table-separator {
border: 1px solid rgba(255,255,255,0.5); border: 1px solid rgba(255,255,255,0.5);
} }
.node .contents ul {
--tree-color: #666;
}
/* Tables. */ /* Tables. */
table, th, td, tr { table, th, td, tr {
border: 1px solid #eee; border: 1px solid #eee;