Mirror/brk
1
0
Fork 0
mirror of https://github.com/bitcoinresearchkit/brk.git synced 2026-04-24 14:49:58 -07:00
Code Issues Packages Projects Releases Wiki Activity

global: snapshot

Browse Source
This commit is contained in:
nym21
2026-02-13 13:54:09 +01:00
parent b779edc0d6
commit 80b2c636b0
53 changed files with 1819 additions and 1184 deletions
Download Patch File Download Diff File Expand all files Collapse all files

438
website/styles/components.css
View File

@@ -1,81 +1,3 @@
nav {
margin-top: -0.125rem;
user-select: none;
-webkit-user-select: none;
button::after {
color: var(--off-color);
content: "→";
align-self: baseline;
font-size: 75%;
margin-left: 0.25rem;
margin-bottom: 0.25rem;
line-height: 1;
}
li[data-highlight] {
> details > summary,
> a {
color: var(--color);
}
> details > summary > small {
opacity: 1;
}
> a::after,
> details:not([open]) > summary::after {
color: var(--orange) !important;
content: "";
background-color: var(--orange);
width: 0.375rem;
height: 0.375rem;
border-radius: 9999px;
display: inline-block;
margin-bottom: 0.125rem;
margin-left: 0.375rem;
}
}
> ul > li {
text-transform: uppercase;
& + * {
margin-top: 1.25rem;
}
> details,
> label {
font-size: var(--font-size-base);
line-height: var(--line-height-base);
ul {
margin-left: 0.25rem;
}
}
a,
button,
summary {
padding: 0.25rem 0;
}
ul {
color: var(--off-color);
overflow: hidden;
li {
text-transform: lowercase;
display: block;
position: relative;
padding-left: 0.75rem;
border-left: 1px;
/*border-style: dotted !important;*/
}
}
}
}
#share-div {
font-size: var(--font-size-sm);
line-height: var(--line-height-sm);
@@ -115,94 +37,11 @@ nav {
}
}
search {
text-transform: uppercase;
gap: 1rem;
ul {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
}
.shadow-top {
position: absolute;
background-image: linear-gradient(
to top,
transparent,
var(--background-color)
);
height: var(--main-padding);
top: 0;
left: 0;
right: 0;
z-index: 10;
pointer-events: none;
}
.shadow-bottom {
position: absolute;
background-image: linear-gradient(
to bottom,
transparent,
var(--background-color) 90%,
var(--background-color)
);
height: 21rem;
bottom: 0;
left: 0;
right: 0;
z-index: 10;
pointer-events: none;
}
.shadow-left {
position: absolute;
background-image: linear-gradient(
to left,
transparent,
var(--background-color)
);
width: var(--main-padding);
left: 0;
top: 0;
bottom: 0;
z-index: 50;
pointer-events: none;
}
.shadow-right {
position: absolute;
background-image: linear-gradient(
to right,
transparent,
var(--background-color)
);
width: var(--main-padding);
right: 0;
top: 0;
bottom: 0;
z-index: 30;
pointer-events: none;
}
fieldset {
display: flex;
align-items: center;
gap: 0.5rem;
&[data-size="sm"] {
font-size: var(--font-size-sm);
line-height: var(--line-height-sm);
}
&[data-size="xs"] {
font-size: var(--font-size-xs);
line-height: var(--line-height-xs);
font-weight: 450;
}
> div.field {
text-transform: lowercase;
display: flex;
@@ -214,18 +53,6 @@ fieldset {
flex-shrink: 0;
}
> hr {
min-width: 2rem;
fieldset[data-size="sm"] & {
min-width: 1.5rem;
}
fieldset[data-size="xs"] & {
min-width: 1rem;
}
}
label {
padding: 0.5rem;
margin: -0.5rem;
@@ -234,10 +61,6 @@ fieldset {
> div {
display: flex;
gap: 1.5rem;
fieldset[data-size="xs"] & {
gap: 1rem;
}
}
}
}
@@ -245,8 +68,6 @@ fieldset {
#chart > fieldset {
text-transform: lowercase;
flex-shrink: 0;
display: flex;
align-items: center;
margin: -0.5rem var(--negative-main-padding);
padding: 0.75rem var(--main-padding);
overflow-x: auto;
@@ -255,262 +76,3 @@ fieldset {
line-height: var(--line-height-sm);
scrollbar-width: thin;
}
.chart {
display: flex;
flex-direction: column;
min-height: 0;
flex: 1;
label,
select {
margin: -0.5rem;
padding: 0.5rem;
}
legend {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 20;
font-size: var(--font-size-xs);
line-height: var(--line-height-xs);
text-transform: lowercase;
pointer-events: none;
&::before,
&::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
width: var(--main-padding);
z-index: 1;
pointer-events: none;
}
&::before {
left: 0;
background-image: linear-gradient(
to left,
transparent,
var(--background-color)
);
}
&::after {
right: 0;
background-image: linear-gradient(
to right,
transparent,
var(--background-color)
);
}
> div {
display: flex;
align-items: center;
overflow-x: auto;
scrollbar-width: thin;
padding: 0 var(--main-padding);
padding-top: 0.278rem;
padding-bottom: 0.75rem;
> * {
pointer-events: auto;
}
> span {
padding: 0 0.75rem;
}
> div:has(> select) {
> select {
width: auto;
background: none;
}
small {
flex-shrink: 0;
}
}
> div:last-child {
display: flex;
align-items: center;
gap: 1rem;
flex-shrink: 0;
}
> div:last-child > div {
flex: 0;
height: 100%;
display: flex;
align-items: center;
> label {
> span {
display: flex !important;
}
&:has(input:not(:checked)) {
color: var(--off-color);
> span.main > span.name {
text-decoration-thickness: 1.5px;
text-decoration-color: var(--color);
text-decoration-line: line-through;
}
&:hover {
* {
color: var(--off-color) !important;
}
> span.main > span.name {
text-decoration-color: var(--orange) !important;
}
}
&:active {
color: var(--orange);
}
}
}
> a {
padding-left: 0.375rem;
padding-right: 0.375rem;
margin-left: -0.375rem;
margin-right: -0.375rem;
margin-top: 0.1rem;
}
}
}
}
> div {
min-height: 0;
height: 100%;
margin-right: var(--negative-main-padding);
margin-left: var(--negative-main-padding);
div:has(> select) {
display: flex;
flex-shrink: 0;
gap: 0.375rem;
}
table > tr {
&:first-child > td:nth-child(2) {
position: relative;
&::after {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
height: var(--main-padding);
background-image: linear-gradient(
to bottom,
var(--background-color),
transparent
);
z-index: 10;
pointer-events: none;
}
}
&:last-child > td {
border-top: 1px;
&:nth-child(2) {
position: relative;
> .field {
position: absolute;
left: 0;
top: 0;
bottom: 0;
z-index: 10;
display: flex;
align-items: center;
pointer-events: auto;
font-size: var(--font-size-xs);
line-height: var(--line-height-xs);
text-transform: uppercase;
background-color: var(--background-color);
padding-left: var(--main-padding);
padding-right: 0.25rem;
> select {
width: auto;
background: none;
}
&::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 100%;
width: var(--main-padding);
background-image: linear-gradient(
to right,
var(--background-color),
transparent
);
}
}
}
}
}
td:last-child > .field {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 50;
display: flex;
font-size: var(--font-size-xs);
gap: 0.25rem;
background-color: var(--background-color);
align-items: center;
text-transform: uppercase;
padding-left: 0.625rem;
padding-top: 0.35rem;
padding-bottom: 0.125rem;
label {
margin: -0.25rem;
padding: 0.25rem;
}
&::after {
content: "";
position: absolute;
top: 100%;
left: 0;
right: 0;
height: 1rem;
background-image: linear-gradient(
to top,
transparent,
var(--background-color)
);
}
}
button.capture {
position: absolute;
top: 0.5rem;
right: 0.5rem;
z-index: 50;
font-size: var(--font-size-xs);
line-height: var(--line-height-xs);
color: var(--off-color);
}
}
}