257 lines
6.8 KiB
CSS
257 lines
6.8 KiB
CSS
.max-w-prose {
|
|
max-width:240ch
|
|
}
|
|
|
|
.panzoom-popup {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
background: rgba(0, 0, 0, 0.8);
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
z-index: 9999;
|
|
cursor: zoom-out;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.panzoom-popup img {
|
|
max-width: 100%;
|
|
max-height: 100%;
|
|
cursor: grab;
|
|
vertical-align: middle;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.panzoom-popup .panzoom-overlay {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.panzoom-container {
|
|
cursor: zoom-in;
|
|
display: inline-block; /* Shrink-wrap the content */
|
|
max-width: fit-content; /* Ensure the container doesn't grow larger than its content */
|
|
max-height: fit-content; /* Restrict height similarly */
|
|
margin: 0 auto; /* Optional: Center the container if necessary */
|
|
overflow: hidden; /* Ensure no content overflows */
|
|
}
|
|
|
|
.panzoom-container img {
|
|
display: block;
|
|
max-width: 100%;
|
|
height: auto;
|
|
}
|
|
|
|
.gallery {
|
|
width: auto; /* Allow it to size naturally */
|
|
max-width: 100%; /* Prevent overflow */
|
|
margin-bottom:8px;
|
|
}
|
|
|
|
.prose :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
|
color:var(--tw-prose-links);
|
|
text-decoration:underline;
|
|
font-weight:500;
|
|
text-decoration-color:rgba(var(--color-secondary-700), 1);
|
|
text-decoration-thickness:1px;
|
|
text-decoration-style:wavy;
|
|
}
|
|
|
|
.prose nav a {
|
|
color:var(--tw-prose-links);
|
|
text-decoration:none;
|
|
font-weight:500;
|
|
text-decoration-color:rgba(var(--color-primary-300), 1);
|
|
}
|
|
|
|
.dark\:prose-invert:is(.dark *) :where(a):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
|
|
text-decoration-color:rgba(var(--color-secondary-700), 1);
|
|
}
|
|
|
|
.prose {
|
|
--tw-prose-body:rgba(var(--color-neutral-700), 1);
|
|
--tw-prose-headings:rgba(var(--color-neutral-800), 1);
|
|
--tw-prose-lead:rgba(var(--color-neutral-500), 1);
|
|
--tw-prose-links:rgba(var(--color-secondary-600), 1);
|
|
--tw-prose-bold:rgba(var(--color-neutral-900), 1);
|
|
--tw-prose-counters:rgba(var(--color-neutral-800), 1);
|
|
--tw-prose-bullets:rgba(var(--color-neutral-500), 1);
|
|
--tw-prose-hr:rgba(var(--color-neutral-200), 1);
|
|
--tw-prose-quotes:rgba(var(--color-neutral-700), 1);
|
|
--tw-prose-quote-borders:rgba(var(--color-primary-200), 1);
|
|
--tw-prose-captions:rgba(var(--color-neutral-500), 1);
|
|
--tw-prose-kbd:#111827;
|
|
--tw-prose-kbd-shadows:17 24 39;
|
|
--tw-prose-code:rgba(var(--color-secondary-700), 1);
|
|
--tw-prose-pre-code:rgba(var(--color-neutral-700), 1);
|
|
--tw-prose-pre-bg:rgba(var(--color-neutral-50), 1);
|
|
--tw-prose-th-borders:rgba(var(--color-neutral-500), 1);
|
|
--tw-prose-td-borders:rgba(var(--color-neutral-300), 1);
|
|
--tw-prose-invert-body:rgba(var(--color-neutral-300), 1);
|
|
--tw-prose-invert-headings:rgba(var(--color-secondary-600), 1);
|
|
--tw-prose-invert-lead:rgba(var(--color-neutral-500), 1);
|
|
--tw-prose-invert-links:rgba(var(--color-secondary-600), 1);
|
|
--tw-prose-invert-bold:rgba(var(--color-neutral), 1);
|
|
--tw-prose-invert-counters:rgba(var(--color-neutral-400), 1);
|
|
--tw-prose-invert-bullets:rgba(var(--color-neutral-600), 1);
|
|
--tw-prose-invert-hr:rgba(var(--color-neutral-500), 1);
|
|
--tw-prose-invert-quotes:rgba(var(--color-neutral-200), 1);
|
|
--tw-prose-invert-quote-borders:rgba(var(--color-primary-900), 1);
|
|
--tw-prose-invert-captions:rgba(var(--color-neutral-400), 1);
|
|
--tw-prose-invert-kbd:#fff;
|
|
--tw-prose-invert-kbd-shadows:255 255 255;
|
|
--tw-prose-invert-code:rgba(var(--color-secondary-400), 1);
|
|
--tw-prose-invert-pre-code:rgba(var(--color-neutral-200), 1);
|
|
--tw-prose-invert-pre-bg:rgba(var(--color-neutral-700), 1);
|
|
--tw-prose-invert-th-borders:rgba(var(--color-neutral-500), 1);
|
|
--tw-prose-invert-td-borders:rgba(var(--color-neutral-700), 1);
|
|
font-size:1rem;
|
|
line-height:1.75
|
|
}
|
|
|
|
/*
|
|
p {
|
|
background-color:rgba(var(--color-primary-900), 0.5);
|
|
border-radius:2px;
|
|
padding-right:4px;
|
|
padding-left:4px;
|
|
} */
|
|
|
|
.prose :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
|
color:var(--tw-prose-captions);
|
|
font-size:0.875em;
|
|
line-height:1.4285714;
|
|
margin-top:0.8571429em
|
|
}
|
|
|
|
/* .grow :where(main){
|
|
flex-grow:1;
|
|
background-color:rgba(var(--color-primary-900), 0.5);
|
|
border-width:2px;
|
|
border-style:dashed;
|
|
border-radius:2px;
|
|
border-color:rgba(var(--color-secondary-600), 1);
|
|
padding-right:8px;
|
|
padding-left:8px;
|
|
padding-top:8px;
|
|
} .*/
|
|
|
|
.article-content {
|
|
background-color:rgba(var(--color-primary-900), 0.5);
|
|
border-width:2px;
|
|
border-style:dashed;
|
|
border-radius:2px;
|
|
border-color:rgba(var(--color-secondary-600), 1);
|
|
padding-right:8px;
|
|
padding-left:8px;
|
|
padding-bottom:8px;
|
|
border-top-color:transparent;
|
|
}
|
|
|
|
#single_header {
|
|
flex-grow:1;
|
|
background-color:rgba(var(--color-primary-900), 0.5);
|
|
border-width:2px;
|
|
border-style:dashed;
|
|
border-radius:2px;
|
|
border-color:rgba(var(--color-secondary-600), 1);
|
|
padding-right:8px;
|
|
padding-left:8px;
|
|
padding-top:8px;
|
|
border-bottom-color:transparent;
|
|
}
|
|
|
|
.prose .chroma:is(.dark *) {
|
|
background-color:rgba(var(--color-primary-900), 0.8);
|
|
--tw-text-opacity:1;
|
|
color:rgba(var(--color-neutral-200), var(--tw-text-opacity))
|
|
}
|
|
|
|
.dark\:prose-invert:is(.dark *) :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
|
background-color:transparent;
|
|
}
|
|
|
|
.prose :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
|
color:var(--tw-prose-headings);
|
|
font-weight:700;
|
|
font-size:1.5em;
|
|
margin-top:0.5em;
|
|
margin-bottom:0.2em;
|
|
line-height:1.3333333
|
|
}
|
|
|
|
.prose :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
|
color:var(--tw-prose-headings);
|
|
font-weight:600;
|
|
font-size:1.25em;
|
|
margin-top:0.5em;
|
|
margin-bottom:0.2em;
|
|
line-height:1.6
|
|
}
|
|
|
|
.prose :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
|
color:var(--tw-prose-headings);
|
|
font-weight:600;
|
|
margin-top:0.5em;
|
|
margin-bottom:0.2em;
|
|
line-height:1.5
|
|
}
|
|
|
|
.cool-title {
|
|
color:rgba(var(--color-primary-700), 1);
|
|
background-color:rgba(var(--color-secondary-600), 1);
|
|
padding:4px;
|
|
}
|
|
|
|
.prose :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
|
border-color:var(--tw-prose-hr);
|
|
border-top-width:1px;
|
|
margin-top:0.5em;
|
|
margin-bottom:0.5em
|
|
}
|
|
|
|
.min-w-content {
|
|
min-width:fit-content;
|
|
}
|
|
|
|
.vari-flex {
|
|
display:flex;
|
|
flex-wrap:nowrap;
|
|
}
|
|
|
|
@media (max-width: 512px) {
|
|
.vari-flex {
|
|
flex-wrap:wrap;
|
|
}
|
|
}
|
|
|
|
.card-styled {
|
|
background-color:rgba(var(--color-primary-900), 0.5);
|
|
border-width:2px;
|
|
border-style:dashed;
|
|
border-radius:2px;
|
|
border-color:rgba(var(--color-secondary-600), 1);
|
|
padding-top:8px;
|
|
padding-right:8px;
|
|
padding-left:8px;
|
|
}
|
|
|
|
.caption {
|
|
background-color:rgba(var(--color-primary-900), 0.5);
|
|
border-width:1px;
|
|
border-style:hidden;
|
|
border-radius:8px;
|
|
border-color:rgba(var(--color-secondary-600), 1);
|
|
padding:4px;
|
|
padding-left:8px;
|
|
padding-right:8px;
|
|
max-width:fit-content;
|
|
font-style:italic;
|
|
margin:auto;
|
|
text-align:center;
|
|
} |