From: Christian Shtarkov Date: Sun, 20 Oct 2024 10:09:53 +0000 (+0100) Subject: Initial commit X-Git-Url: https://shtarkov.net/gitweb/?a=commitdiff_plain;h=cad72c953adedb7765ae678cea68a417889e57ae;p=shtarkov.net.git Initial commit --- cad72c953adedb7765ae678cea68a417889e57ae diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..87174b6 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +/public/ diff --git a/assets/cat.png b/assets/cat.png new file mode 100644 index 0000000..8c0156c Binary files /dev/null and b/assets/cat.png differ diff --git a/assets/one.css b/assets/one.css new file mode 100644 index 0000000..b99d34f --- /dev/null +++ b/assets/one.css @@ -0,0 +1,482 @@ +@import url('https://fonts.googleapis.com/css2?family=Fira+Mono:wght@400&family=Noto+Sans:wght@400;700&display=swap'); + +html, body, p, ol, ul, li, dl, dt, dd, +blockquote, figure, fieldset, legend, textarea, +pre, iframe, hr, h1, h2, h3, h4, h5, h6 { + margin: 0; + padding: 0; +} + +*, *::before, *::after { + box-sizing: border-box; +} + +p, blockquote, ul, ol, code, +dl, table, pre, details { + margin-bottom: 16px; + margin-top: 0; +} + +ul { + padding-left: 2em; + list-style: disc; +} + +ul ul { + margin-top: 0; + margin-bottom: 0; +} + +ol { + padding-left: 2em; + list-style: decimal; +} + +li p:first-of-type { + margin: 0; +} + +li p { + margin: 16px 0; +} + +li code { + margin: 16px 0; +} + +html { + scroll-padding-top: 4rem; /* because we use a sticky header */ +} + +body { + background: #151515; + color: #dedede; + font-family: "Noto Sans",sans-serif; + font-size: 106%; + line-height: 1.5; + word-wrap: break-word; +} + +h1 { + font-size: 2em; +} + +h2, h3, h4, h5, h6 { + padding-bottom: 0.3em; + margin-top: 24px; + margin-bottom: 16px; + font-weight: bold; + line-height: 1.25; +} + +h2, h3 { + border-bottom: 1px solid #1d272b; +} + +h2 {font-size: 2em;} +h3 {font-size: 1.5em;} +h4 {font-size: 1.25em;} +h5 {font-size: 1em;} +h6 {font-size: .875em;} + +a { + color: #ffd787; + cursor: pointer; + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} + +a:visited { + color: #ffd787; +} + +img { + display: block; + margin-left: auto; + margin-right: auto; + border: 1px solid; +} + +/* ------- '.one' classes used by 'one-ox' org backend ------- */ + +.one-hl { + font-family: 'Fira Mono', monospace; + font-size: 80%; + border-radius: 6px; +} + +.one-hl-inline { + background: #31424a; + padding: 0.2em 0.4em; + margin: 0; + white-space: break-spaces; +} + +.one-hl-block { + background: #161f22; + color: #c5c5c5; + display: block; + overflow: auto; + padding: 16px; + line-height: 1.45; +} + +.one-blockquote { + background: #202d31; + border-left: 0.3em solid #31424a; + margin: 0px auto 16px; + padding: 1em 1em; + width: 90%; +} + +.one-blockquote > p:last-child { + margin-bottom: 0; +} + +.one-hl-results { + background: #202d31 ; + border-left: 2px solid #c5c5c5; + display: block; + margin: auto; + padding: 0.5em 1em; + overflow: auto; + width: 98%; +} + +.one-hl-negation-char { color: #ff6c60} /* font-lock-negation-char-face */ +.one-hl-warning { color: #fd971f} /* font-lock-warning-face */ +.one-hl-variable-name { color: #fd971f} /* font-lock-variable-name-face */ +.one-hl-doc { color: #d3b2a1} /* font-lock-doc-face */ +.one-hl-doc-string { color: #d3b2a1} /* font-lock-doc-string-face */ +.one-hl-string { color: #d3b2a1} /* font-lock-string-face */ +.one-hl-function-name { color: #02d2da} /* font-lock-function-name-face */ +.one-hl-builtin { color: #b2a1d3} /* font-lock-builtin-face */ +.one-hl-type { color: #457f8b} /* font-lock-type-face */ +.one-hl-keyword { color: #f92672} /* font-lock-keyword-face */ +.one-hl-preprocessor { color: #f92672} /* font-lock-preprocessor-face */ +.one-hl-comment-delimiter { color: #8c8c8c} /* font-lock-comment-delimiter-face */ +.one-hl-comment { color: #8c8c8c} /* font-lock-comment-face */ +.one-hl-constant { color: #f5ebb6} /* font-lock-constant-face */ +.one-hl-reference { color: #f5ebb6} /* font-lock-reference-face */ +.one-hl-regexp-grouping-backslash { color: #966046} /* font-lock-regexp-grouping-backslash */ +.one-hl-regexp-grouping-construct { color: #aa86ee} /* font-lock-regexp-grouping-construct */ +.one-hl-number { color: #eedc82} /* font-lock-number-face */ + +.one-hl-sh-quoted-exec { color: #62bd9c} /* sh-quoted-exec */ + +/* -------- scrollbar -------- */ + +::-webkit-scrollbar { + width: 1em; + height: 1em; +} + +::-webkit-scrollbar-track { + background: #202d31; +} + +::-webkit-scrollbar-thumb { + background: #31424a; + border-radius: 0.5em; +} + +::-webkit-scrollbar-thumb:hover { + background: #31424a; +} + +/* -------- specific to the default render functions -------- */ + +.header { + color: #ffffff; + font-size: 2em; + font-weight: bold; + padding: 0 16px 0 16px; + background: #151515; + width: 100%; + height: 3.5rem; + position: fixed; + top: 0; + left: 0; + border-bottom: 1px solid #1d272b; + display: flex; + justify-content: center; + align-items: center; +} + +.header > a { + color: inherit; + cursor: pointer; + text-decoration: none; +} + +.header > a:visited { + color: inherit; +} + +.content { + margin: 3.5rem auto; + padding-top: 1.8rem; + max-width: 740px; + padding: 0 16px; +} + +.title { + text-align: center; + padding: 1.8rem 0; +} + +.title-empty { + padding-top: 1rem; +} + +/* -------- one-default-home -------- */ + +#home { + margin: 5rem 0 1.5rem 0; +} + +/* -------- one-default-home-list-pages -------- */ + +#home-list-pages { + margin: 5rem 0 1.5rem 0; +} + +#pages ul { + padding: 0; + list-style: none; +} + +#pages a { + display: block; + line-height: 1.2em; + font-size: 1.2em; + color: #dedede; + border-bottom: 1px solid #1d272b; + padding: 1em 0.3em; +} + +#pages a:hover { + text-decoration: none; + background: #31424a; + color: #ffffff; +} + +/* -------- one-default, one-default-with-toc, one-default-with-sidebar, one-default-doc -------- */ + +.nav { + border-top: 1px solid #c5c5c5; + margin-top: 3em; + padding: 2em 0; + display: flex; + justify-content: center; + gap: 0.5em; + font-weight: bold; +} + +.nav a { + display: block; + background: #dedede; + border-radius: 6px; + padding: 0.2em 0.8em; + color: #151515; + width: 20%; + text-align: center; +} + +@media (max-width:600px) { + .nav a { + width: auto; + } +} + +/* -------- one-default-with-toc, one-default-doc -------- */ + +.toc { + display: flex; + justify-content: center; + margin-bottom: 1.8rem; + color: #d1d1d1; +} + +.toc > div { + padding: 0 1em; +} + +.toc a { + color: #d1d1d1; +} + +.toc > div > div:first-child { + text-decoration: underline 1px; + text-align: center; + font-size: 1.2em; + margin-bottom: 16px; +} + +/* --------- one-default-with-sidebar, one-default-doc --------- */ + +#sidebar-header { + color: #ffffff; + font-size: 2em; + font-weight: bold; + padding: 0 16px 0 16px; + background: #151515; + width: 100%; + height: 3.5rem; + position: fixed; + top: 0; + left: 0; + border-bottom: 1px solid #1d272b; + display: flex; + justify-content: center; + align-items: center; +} + +#sidebar-header > a { + color: inherit; + cursor: pointer; + text-decoration: none; +} + +#sidebar-header > a:visited { + color: inherit; +} + +#hamburger { + cursor: pointer; + height: 1em; + fill: #dedede; + display: none; + font-weight: normal; + margin-right: 0.3em; +} + +#sidebar-content { + margin: 3.5rem auto; + display: flex; + margin-left: auto; + margin-right: auto; + max-width: 1140px; + width: 100%; + padding: 1em 16px; +} + +#sidebar { + border-right: 2px solid #31424a; + top: 4.5rem; + position: sticky; + padding-top: 2.2em; + padding-bottom: 6em; + width: 250px; + max-height: 100vh; + overflow-y: auto; +} + +#sidebar a { + display: block; + color: #dedede; +} + +#sidebar a:hover { + text-decoration: none; +} + +#sidebar ul { + list-style: none; + padding:0; +} + +#sidebar li { + padding: 0.5em 0.6em; +} + +#sidebar li:hover { + background: #31424a; +} + +article { + padding: 0 1.5em; + max-width: 640px; + width: 100%; +} + +#sidebar-left { + width: 0; + height: 100%; + position: fixed; + z-index: 3; + top: 0; + left: 0; + transition: 0.25s; + background: #2c444f; + overflow: hidden; /* to make the children disappear when width is 0 */ + overflow-y: auto; +} + +#sidebar-left > div:first-child { + height: 3.5rem; + font-size: 2em; + font-weight: bold; + border-bottom: 1px solid #b8b8b8; + padding-left: 16px; + margin-bottom: 16px; + display: flex; + align-items: center; +} + +#sidebar-left > ul { + padding: 0 16px 0 16px; +} + +#sidebar-left > ul ul { + padding-left: 0.8em; + margin-left: 3px; + border-left: 1px solid #b8b8b8; +} + +#sidebar-left a { + color: #dedede; + text-decoration: none; +} + +#sidebar-left li { + padding: 0.5em 0; + list-style-type: none; +} + +#sidebar-main { + display: none; + top: 0; + right: 0; + width: 100%; + height: 100%; + position: fixed; + background: #080808; + opacity: 0.80; + z-index: 2; +} + +@media (max-width: 840px) { + #hamburger { + display: block; + } + #sidebar { + display: none; + } + #sidebar-content { + justify-content: center; + } + #sidebar-header { + justify-content: left; + } + article { + padding: 0; + } +} + +/* Local Variables: */ +/* css-indent-offset: 2 */ +/* End: */ diff --git a/one.org b/one.org new file mode 100644 index 0000000..9b8c4c2 --- /dev/null +++ b/one.org @@ -0,0 +1,219 @@ +* shtarkov.net +:PROPERTIES: +:ONE: one-default-home-list-pages +:CUSTOM_ID: / +:END: + +[[./assets/cat.png][Cat]] + +* List all website's pages on the home page +:PROPERTIES: +:ONE: one-default-home-list-pages +:CUSTOM_ID: /blog/default-home-list-pages/ +:END: + +This page is rendered with the default render function +~one-default-home-list-pages~ specified in ~ONE~ org property which lists +below all the pages on the website. You can use it instead of +~one-default-home~ for your home page. + +* The default page +:PROPERTIES: +:ONE: one-default +:CUSTOM_ID: /blog/default/ +:END: + +This page is rendered with the default render function ~one-default~ +specified in ~ONE~ org property. + +** Do you want a table of content? + +As you can see, ~one-default~ doesn't add a table of content (TOC). If +you want a default render function that adds the TOC to the page you can +use the render function ~one-default-with-toc~ presented in [[#/blog/one-default-with-toc/][The default +page with a TOC]]. + +** Headline foo +*** Headline bar + +Some content. + +*** Headline baz + +#+BEGIN_SRC bash :results verbatim +tree +#+END_SRC + +#+RESULTS: +#+begin_example +. +├── assets +│ └── one.css +├── one.org +└── public + ├── blog + │ ├── default + │ │ └── index.html + │ ├── default-home-list-pages + │ │ └── index.html + │ ├── one-default-doc + │ │ └── index.html + │ ├── one-default-with-sidebar + │ │ └── index.html + │ └── one-default-with-toc + │ └── index.html + ├── index.html + └── one.css + +8 directories, 9 files +#+end_example + +* The default page with a TOC +:PROPERTIES: +:ONE: one-default-with-toc +:CUSTOM_ID: /blog/one-default-with-toc/ +:END: + +This page is rendered with the render function ~one-default-with-toc~ +specified in the org property ~ONE~. + +** Do you want a sidebar? + +Perhaps you want a sidebar listing all the pages on your website, as +many modern documentation sites do. If so, you can use the default +render function ~one-default-with-sidebar~ presented in [[#/blog/one-default-with-sidebar/][The default page +with a sidebar]]. + +** Headline foo +*** Headline bar + +Some content. + +*** Headline baz + +#+BEGIN_SRC bash :results verbatim +tree +#+END_SRC + +#+RESULTS: +#+begin_example +. +├── assets +│ └── one.css +├── one.org +└── public + ├── blog + │ ├── default + │ │ └── index.html + │ ├── default-home-list-pages + │ │ └── index.html + │ ├── one-default-doc + │ │ └── index.html + │ ├── one-default-with-sidebar + │ │ └── index.html + │ └── one-default-with-toc + │ └── index.html + ├── index.html + └── one.css + +8 directories, 9 files +#+end_example + +* The default page with a sidebar +:PROPERTIES: +:ONE: one-default-with-sidebar +:CUSTOM_ID: /blog/one-default-with-sidebar/ +:END: + +This page is rendered with the render function ~one-default-with-sidebar~ +specified in the org property ~ONE~. + +** Do you want a sidebar and a TOC? + +Perhaps you want a sidebar listing all the pages on your website and a +table of content, as many modern documentation sites do. If so, you +can use the default render function ~one-default-doc~ presented in [[#/blog/one-default-doc/][The +default page with TOC and sidebar]]. + +** Headline foo +*** Headline bar + +Some content. + +*** Headline baz + +#+BEGIN_SRC bash :results verbatim +tree +#+END_SRC + +#+RESULTS: +#+begin_example +. +├── assets +│ └── one.css +├── one.org +└── public + ├── blog + │ ├── default + │ │ └── index.html + │ ├── default-home-list-pages + │ │ └── index.html + │ ├── one-default-doc + │ │ └── index.html + │ ├── one-default-with-sidebar + │ │ └── index.html + │ └── one-default-with-toc + │ └── index.html + ├── index.html + └── one.css + +8 directories, 9 files +#+end_example + +* The default page with TOC and sidebar +:PROPERTIES: +:ONE: one-default-doc +:CUSTOM_ID: /blog/one-default-doc/ +:END: + +This page is rendered with the function ~one-default-doc~ specified +in the org property ~ONE~. + +** Do you want to know more about one.el? + +Check the documentation at https://one.tonyaldon.com. + +** Headline foo +*** Headline bar + +Some content. + +*** Headline baz + +#+BEGIN_SRC bash :results verbatim +tree +#+END_SRC + +#+RESULTS: +#+begin_example +. +├── assets +│ └── one.css +├── one.org +└── public + ├── blog + │ ├── default + │ │ └── index.html + │ ├── default-home-list-pages + │ │ └── index.html + │ ├── one-default-doc + │ │ └── index.html + │ ├── one-default-with-sidebar + │ │ └── index.html + │ └── one-default-with-toc + │ └── index.html + ├── index.html + └── one.css + +8 directories, 9 files +#+end_example