kazbo/public_notes
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

sync notes(auto)
Some checks are pending
Build and Test / build-and-test (macos-latest) (push) Waiting to run
Details
Build and Test / build-and-test (ubuntu-latest) (push) Waiting to run
Details
Build and Test / build-and-test (windows-latest) (push) Waiting to run
Details
Build and Test / publish-tag (push) Waiting to run
Details
/ test (push) Waiting to run
Details
Deploy Quartz site to GitHub Pages / build (push) Waiting to run
Details
Deploy Quartz site to GitHub Pages / deploy (push) Blocked by required conditions
Details

Browse source
This commit is contained in:
Kaz Saita(raspi5) 2024-10-24 18:00:07 +09:00
parent 68d6eb58d0
commit 7390615c3e
3 changed files with 33 additions and 170 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

191
quartz/styles/base.scss
View file

@ -24,6 +24,7 @@ section {
padding: 0 0.1rem; padding: 0 0.1rem;
border-radius: 5px; border-radius: 5px;
} }
::selection { ::selection {
background: color-mix(in srgb, var(--tertiary) 60%, rgba(255, 255, 255, 0)); background: color-mix(in srgb, var(--tertiary) 60%, rgba(255, 255, 255, 0));
color: var(--darkgray); color: var(--darkgray);
@ -90,6 +91,7 @@ a {
border-radius: 0; border-radius: 0;
padding: 0; padding: 0;
} }
&.tag-link { &.tag-link {
&::before { &::before {
content: "#"; content: "#";
@ -101,7 +103,7 @@ a {
height: 1ex; height: 1ex;
margin: 0 0.15em; margin: 0 0.15em;
> path { >path {
fill: var(--dark); fill: var(--dark);
} }
} }
@ -109,60 +111,29 @@ a {
.desktop-only { .desktop-only {
display: initial; display: initial;
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> parent of fd6c0cb (tweak)
=======
>>>>>>> parent of fd6c0cb (tweak)
@media all and ($mobile) {
=======
@media all and (max-width: $fullPageWidth) { @media all and (max-width: $fullPageWidth) {
>>>>>>> parent of b41a266 (merge upstream)
display: none; display: none;
} }
} }
.mobile-only { .mobile-only {
display: none; display: none;
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> parent of fd6c0cb (tweak)
=======
>>>>>>> parent of fd6c0cb (tweak)
@media all and ($mobile) {
=======
@media all and (max-width: $fullPageWidth) { @media all and (max-width: $fullPageWidth) {
>>>>>>> parent of b41a266 (merge upstream)
display: initial; display: initial;
} }
} }
.page { .page {
<<<<<<< HEAD
max-width: calc(#{map-get($breakpoints, desktop)} + 300px);
margin: 0 auto;
<<<<<<< HEAD
<<<<<<< HEAD
=======
@media all and (max-width: $fullPageWidth) { @media all and (max-width: $fullPageWidth) {
margin: 0 auto; margin: 0 auto;
padding: 0 1rem; padding: 0 1rem;
max-width: $pageWidth; max-width: $pageWidth;
} }
>>>>>>> parent of b41a266 (merge upstream)
=======
>>>>>>> parent of fd6c0cb (tweak)
=======
>>>>>>> parent of fd6c0cb (tweak)
& article { & article {
& > h1 { &>h1 {
font-size: 2rem; font-size: 2rem;
} }
@ -177,59 +148,22 @@ a {
color: var(--gray); color: var(--gray);
} }
& li > * { & li>* {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
} }
p > strong { p>strong {
color: var(--dark); color: var(--dark);
} }
} }
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
&>#quartz-body { &>#quartz-body {
=======
& > #quartz-body {
>>>>>>> parent of fd6c0cb (tweak)
=======
& > #quartz-body {
>>>>>>> parent of fd6c0cb (tweak)
display: grid;
grid-template-columns: #{map-get($desktopGrid, templateColumns)};
grid-template-rows: #{map-get($desktopGrid, templateRows)};
column-gap: #{map-get($desktopGrid, columnGap)};
row-gap: #{map-get($desktopGrid, rowGap)};
grid-template-areas: #{map-get($desktopGrid, templateAreas)};
@media all and ($tablet) {
grid-template-columns: #{map-get($tabletGrid, templateColumns)};
grid-template-rows: #{map-get($tabletGrid, templateRows)};
column-gap: #{map-get($tabletGrid, columnGap)};
row-gap: #{map-get($tabletGrid, rowGap)};
grid-template-areas: #{map-get($tabletGrid, templateAreas)};
}
@media all and ($mobile) {
grid-template-columns: #{map-get($mobileGrid, templateColumns)};
grid-template-rows: #{map-get($mobileGrid, templateRows)};
column-gap: #{map-get($mobileGrid, columnGap)};
row-gap: #{map-get($mobileGrid, rowGap)};
grid-template-areas: #{map-get($mobileGrid, templateAreas)};
}
@media all and not ($desktop) {
padding: 0 1rem;
}
@media all and ($mobile) {
margin: 0 auto;
=======
& > #quartz-body {
width: 100%; width: 100%;
display: flex; display: flex;
@media all and (max-width: $fullPageWidth) { @media all and (max-width: $fullPageWidth) {
flex-direction: column; flex-direction: column;
>>>>>>> parent of b41a266 (merge upstream)
} }
& .sidebar { & .sidebar {
@ -243,6 +177,7 @@ a {
box-sizing: border-box; box-sizing: border-box;
padding: 0 4rem; padding: 0 4rem;
position: fixed; position: fixed;
@media all and (max-width: $fullPageWidth) { @media all and (max-width: $fullPageWidth) {
position: initial; position: initial;
flex-direction: row; flex-direction: row;
@ -253,63 +188,19 @@ a {
} }
& .sidebar.left { & .sidebar.left {
<<<<<<< HEAD
z-index: 1;
grid-area: grid-sidebar-left;
flex-direction: column;
@media all and ($mobile) {
=======
left: calc(calc(100vw - $pageWidth) / 2 - $sidePanelWidth); left: calc(calc(100vw - $pageWidth) / 2 - $sidePanelWidth);
@media all and (max-width: $fullPageWidth) { @media all and (max-width: $fullPageWidth) {
>>>>>>> parent of b41a266 (merge upstream)
gap: 0; gap: 0;
align-items: center; align-items: center;
} }
} }
& .sidebar.right { & .sidebar.right {
<<<<<<< HEAD
grid-area: grid-sidebar-right;
margin-right: 0;
flex-direction: column;
@media all and ($mobile) {
margin-left: inherit;
margin-right: inherit;
}
@media all and not ($desktop) {
position: initial;
height: unset;
width: 100%;
flex-direction: row;
padding: 0;
& > * {
flex: 1;
}
& > .toc {
display: none;
}
}
}
& .page-header,
& .page-footer {
margin-top: 1rem;
}
& .page-header {
grid-area: grid-header;
margin: $topSpacing 0 0 0;
@media all and ($mobile) {
margin-top: 0;
padding: 0;
}
}
& .center > article {
grid-area: grid-center;
=======
right: calc(calc(100vw - $pageWidth) / 2 - $sidePanelWidth); right: calc(calc(100vw - $pageWidth) / 2 - $sidePanelWidth);
flex-wrap: wrap; flex-wrap: wrap;
& > * {
&>* {
@media all and (max-width: $fullPageWidth) { @media all and (max-width: $fullPageWidth) {
flex: 1; flex: 1;
min-width: 140px; min-width: 140px;
@ -325,42 +216,25 @@ a {
@media all and (max-width: $fullPageWidth) { @media all and (max-width: $fullPageWidth) {
width: initial; width: initial;
>>>>>>> parent of b41a266 (merge upstream)
} }
} }
& .page-header { & .page-header {
margin: $topSpacing auto 0 auto; margin: $topSpacing auto 0 auto;
@media all and (max-width: $fullPageWidth) { @media all and (max-width: $fullPageWidth) {
margin-top: 2rem; margin-top: 2rem;
} }
} }
<<<<<<< HEAD
& .center,
& footer {
max-width: 100%;
min-width: 100%;
margin-left: auto;
margin-right: auto;
@media all and ($tablet) {
margin-right: 0;
}
@media all and ($mobile) {
margin-right: 0;
margin-left: 0;
}
}
& footer {
=======
& .center, & .center,
& footer { & footer {
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
width: $pageWidth; width: $pageWidth;
@media all and (max-width: $fullPageWidth) { @media all and (max-width: $fullPageWidth) {
width: initial; width: initial;
>>>>>>> parent of b41a266 (merge upstream)
margin-left: 0; margin-left: 0;
margin-right: 0; margin-right: 0;
} }
@ -423,7 +297,7 @@ thead {
font-weight: revert; font-weight: revert;
margin-bottom: 0; margin-bottom: 0;
article > & > a[role="anchor"] { article>&>a[role="anchor"] {
color: var(--dark); color: var(--dark);
background-color: transparent; background-color: transparent;
} }
@ -435,7 +309,7 @@ h3,
h4, h4,
h5, h5,
h6 { h6 {
&[id] > a[href^="#"] { &[id]>a[href^="#"] {
margin: 0 0.5rem; margin: 0 0.5rem;
opacity: 0; opacity: 0;
transition: opacity 0.2s ease; transition: opacity 0.2s ease;
@ -444,7 +318,7 @@ h6 {
user-select: none; user-select: none;
} }
&[id]:hover > a { &[id]:hover>a {
opacity: 1; opacity: 1;
} }
} }
@ -482,7 +356,7 @@ figure[data-rehype-pretty-code-figure] {
line-height: 1.6rem; line-height: 1.6rem;
position: relative; position: relative;
& > [data-rehype-pretty-code-title] { &>[data-rehype-pretty-code-title] {
font-family: var(--codeFont); font-family: var(--codeFont);
font-size: 0.9rem; font-size: 0.9rem;
padding: 0.1rem 0.5rem; padding: 0.1rem 0.5rem;
@ -493,7 +367,7 @@ figure[data-rehype-pretty-code-figure] {
color: var(--darkgray); color: var(--darkgray);
} }
& > pre { &>pre {
padding: 0; padding: 0;
} }
} }
@ -510,7 +384,7 @@ pre {
border: none; border: none;
} }
& > code { &>code {
background: none; background: none;
padding: 0; padding: 0;
font-size: 0.85rem; font-size: 0.85rem;
@ -525,7 +399,7 @@ pre {
border-radius: 5px; border-radius: 5px;
} }
& > [data-line] { &>[data-line] {
padding: 0 0.25rem; padding: 0 0.25rem;
box-sizing: border-box; box-sizing: border-box;
border-left: 3px solid transparent; border-left: 3px solid transparent;
@ -546,11 +420,11 @@ pre {
} }
} }
&[data-line-numbers-max-digits="2"] > [data-line]::before { &[data-line-numbers-max-digits="2"]>[data-line]::before {
width: 2rem; width: 2rem;
} }
&[data-line-numbers-max-digits="3"] > [data-line]::before { &[data-line-numbers-max-digits="3"]>[data-line]::before {
width: 3rem; width: 3rem;
} }
} }
@ -574,7 +448,7 @@ p {
.table-container { .table-container {
overflow-x: auto; overflow-x: auto;
& > table { &>table {
margin: 1rem; margin: 1rem;
padding: 1.5rem; padding: 1.5rem;
border-collapse: collapse; border-collapse: collapse;
@ -584,7 +458,7 @@ p {
min-width: 75px; min-width: 75px;
} }
& > * { &>* {
line-height: 2rem; line-height: 2rem;
} }
} }
@ -602,6 +476,7 @@ td {
tr { tr {
border-bottom: 1px solid var(--lightgray); border-bottom: 1px solid var(--lightgray);
&:last-child { &:last-child {
border-bottom: none; border-bottom: none;
} }
@ -613,7 +488,7 @@ img {
margin: 1rem 0; margin: 1rem 0;
} }
p > img + em { p>img+em {
display: block; display: block;
transform: translateY(-1rem); transform: translateY(-1rem);
} }
@ -649,21 +524,11 @@ ol.overflow {
content: ""; content: "";
clear: both; clear: both;
& > li:last-of-type { &>li:last-of-type {
margin-bottom: 30px; margin-bottom: 30px;
} }
<<<<<<< HEAD
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> parent of fd6c0cb (tweak)
=======
>>>>>>> parent of fd6c0cb (tweak)
/*&:after {
=======
&:after { &:after {
>>>>>>> parent of b41a266 (merge upstream)
pointer-events: none; pointer-events: none;
content: ""; content: "";
width: 100%; width: 100%;
@ -694,4 +559,4 @@ iframe.pdf {
height: 100%; height: 100%;
width: 100%; width: 100%;
border-radius: 5px; border-radius: 5px;
} }

8
quartz/styles/callouts.scss
View file

@ -10,7 +10,7 @@
transition: max-height 0.3s ease; transition: max-height 0.3s ease;
box-sizing: border-box; box-sizing: border-box;
& > .callout-content > :first-child { &>.callout-content> :first-child {
margin-top: 0; margin-top: 0;
} }
@ -113,7 +113,7 @@
--callout-icon: var(--callout-icon-quote); --callout-icon: var(--callout-icon-quote);
} }
&.is-collapsed > .callout-title > .fold-callout-icon { &.is-collapsed>.callout-title>.fold-callout-icon {
transform: rotateZ(-90deg); transform: rotateZ(-90deg);
} }
} }
@ -134,7 +134,7 @@
--callout-icon: var(--callout-icon-fold); --callout-icon: var(--callout-icon-fold);
} }
& > .callout-title-inner > p { &>.callout-title-inner>p {
color: var(--color); color: var(--color);
margin: 0; margin: 0;
} }
@ -159,4 +159,4 @@
.callout-title-inner { .callout-title-inner {
font-weight: $semiBoldWeight; font-weight: $semiBoldWeight;
} }
} }

4
quartz/styles/custom.scss
View file

@ -1,4 +1,3 @@
/*
@use "./base.scss"; @use "./base.scss";
$root-font-size: 18px; $root-font-size: 18px;
@ -143,5 +142,4 @@ code {
font-size: 1rem !important; font-size: 1rem !important;
font-family: $pre-font-family !important; font-family: $pre-font-family !important;
line-height: 1rem !important; line-height: 1rem !important;
} }
*/