Mirror/brk
1
0
Fork 0
mirror of https://github.com/bitcoinresearchkit/brk.git synced 2026-07-22 08:28:10 -07:00
Code Issues Packages Projects Releases Wiki Activity

website: redesign part 25

Browse Source
This commit is contained in:
nym21
2026-06-09 11:26:14 +02:00
parent b0b261fe9f
commit e54843291e
33 changed files with 1259 additions and 226 deletions
Download Patch File Download Diff File Expand all files Collapse all files
website_next/learn/style.css
+80 -57
View File
@@ -11,6 +11,13 @@ main.learn {
--detail-font-size: 1.5rem;
--detail-padding-top: calc(var(--topic-sticky-size) + 0.75rem);
--detail-padding-bottom: 0.375rem;
--detail-sticky-size: calc(
var(--detail-padding-top) + var(--detail-font-size) +
var(--detail-padding-bottom) + 1px
);
--subtopic-font-size: 1rem;
--subtopic-padding-top: calc(var(--detail-sticky-size) + 0.375rem);
--subtopic-padding-bottom: 0.25rem;
display: grid;
grid-template-columns: 14rem minmax(0, 1fr);
@@ -25,7 +32,7 @@ main.learn {
content: "";
position: sticky;
top: 0;
z-index: 4;
z-index: 9;
display: block;
height: var(--offset);
margin-top: calc(-1 * var(--offset));
@@ -57,10 +64,6 @@ main.learn {
padding: 0;
border: 0;
font-size: 4rem;
a::before {
content: none;
}
}
> p {
@@ -84,18 +87,86 @@ main.learn {
> section > section > section {
counter-increment: detail;
counter-reset: subtopic;
scroll-margin-top: var(--offset);
}
section[id] {
> h1,
> h2,
> h3 {
> section > section > section > section {
counter-increment: subtopic;
scroll-margin-top: var(--offset);
}
section[id]:not([data-numbered="false"]) {
> :is(h1, h2, h3, h4) {
position: sticky;
top: var(--offset);
line-height: 1;
background: var(--black);
}
> h1 {
z-index: 8;
padding-bottom: var(--heading-padding-bottom);
border-bottom: 1px solid var(--gray);
font-size: 3rem;
a::before {
content: counter(theme, upper-roman) ". ";
}
}
> h2 {
z-index: 7;
padding-top: var(--topic-padding-top);
padding-bottom: var(--heading-padding-bottom);
border-bottom: 1px dashed var(--gray);
font-size: var(--topic-font-size);
a::before {
content: counter(topic) ". ";
}
}
> h3 {
z-index: 6;
padding-top: var(--detail-padding-top);
padding-bottom: var(--detail-padding-bottom);
border-bottom: 1px dotted var(--gray);
font-size: var(--detail-font-size);
a::before {
content: counter(detail, lower-alpha) ". ";
}
}
> h4 {
z-index: 5;
padding-top: var(--subtopic-padding-top);
padding-bottom: var(--subtopic-padding-bottom);
border-bottom: 1px dotted var(--gray);
font-size: var(--subtopic-font-size);
a::before {
content: counter(subtopic, lower-alpha) ". ";
}
}
> p {
margin-top: 1rem;
color: var(--dark-white);
font-size: var(--font-size-sm);
line-height: var(--line-height-sm);
}
> figure {
margin-top: 2rem;
color: var(--gray);
font-size: var(--font-size-xs);
}
}
section[id] {
> :is(h1, h2, h3, h4) {
a {
position: relative;
display: inline-block;
@@ -127,54 +198,6 @@ main.learn {
}
}
}
> h1 {
z-index: 3;
padding-bottom: var(--heading-padding-bottom);
border-bottom: 1px solid var(--gray);
font-size: 3rem;
a::before {
content: counter(theme, upper-roman) ". ";
}
}
> h2 {
z-index: 2;
padding-top: var(--topic-padding-top);
padding-bottom: var(--heading-padding-bottom);
border-bottom: 1px dashed var(--gray);
font-size: var(--topic-font-size);
a::before {
content: counter(topic) ". ";
}
}
> h3 {
z-index: 1;
padding-top: var(--detail-padding-top);
padding-bottom: var(--detail-padding-bottom);
border-bottom: 1px dotted var(--gray);
font-size: var(--detail-font-size);
a::before {
content: counter(detail, lower-alpha) ". ";
}
}
> p {
margin-top: 1rem;
color: var(--dark-white);
font-size: var(--font-size-sm);
line-height: var(--line-height-sm);
}
> figure {
margin-top: 2rem;
color: var(--gray);
font-size: var(--font-size-xs);
}
}
}
}