mirror of
https://github.com/liyunze-coding/coworking-website.git
synced 2026-11-06 13:13:34 +00:00
added pagefind for search
This commit is contained in:
liyunze
parent
04d28ef117
commit
8983746f0e
16 changed files with 246 additions and 152 deletions
3
.gitignore
vendored
3
.gitignore
vendored
|
|
@ -19,3 +19,6 @@ pnpm-debug.log*
|
|||
|
||||
# macOS-specific files
|
||||
.DS_Store
|
||||
|
||||
# PageFind
|
||||
public/pagefind
|
||||
|
|
@ -54,5 +54,5 @@ This website is deployed on <a href="https://vercel.com/">Vercel</a>, which is a
|
|||
<li><a href="https://www.twitch.tv/team/coworkingcrew">Coworking Crew</a> for providing resources</li>
|
||||
<li><a href="https://third-stinger-20a.notion.site/A-Coworking-Streamer-Cheat-Sheet-01ee1e5ff006410d84c339069ea6546c" target="_blank">A Coworking Streamer Cheat Sheet</a> as an amazing resource</li>
|
||||
<li><a href="https://www.twitch.tv/MohFocus">MohFocus</a> for the resources (bots and widgets)</li>
|
||||
<li><a href="https://www.twitch.tv/ryanpython">RyanPython</a> for building the website</li>
|
||||
<li><a href="https://www.twitch.tv/rythondev">RythonDev</a> for building the website</li>
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@ import { defineConfig } from "astro/config";
|
|||
import tailwind from "@astrojs/tailwind";
|
||||
import mdx from "@astrojs/mdx";
|
||||
import react from "@astrojs/react";
|
||||
|
||||
import expressiveCode from "astro-expressive-code";
|
||||
|
||||
// https://astro.build/config
|
||||
|
|
|
|||
125
package-lock.json
generated
125
package-lock.json
generated
|
|
@ -22,10 +22,11 @@
|
|||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"tailwind-merge": "^2.2.1",
|
||||
"tailwindcss": "^3.4.1"
|
||||
"tailwindcss": "^3.4.1",
|
||||
"typescript": "^5.4.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react-router-dom": "^5.3.3",
|
||||
"pagefind": "^1.0.4",
|
||||
"prettier": "^3.2.5",
|
||||
"prettier-plugin-tailwindcss": "^0.5.11"
|
||||
}
|
||||
|
|
@ -1475,6 +1476,71 @@
|
|||
"node": ">= 8"
|
||||
}
|
||||
},
|
||||
"node_modules/@pagefind/darwin-arm64": {
|
||||
"version": "1.0.4",
|
||||
"resolved": "https://registry.npmjs.org/@pagefind/darwin-arm64/-/darwin-arm64-1.0.4.tgz",
|
||||
"integrity": "sha512-2OcthvceX2xhm5XbgOmW+lT45oLuHqCmvFeFtxh1gsuP5cO8vcD8ZH8Laj4pXQFCcK6eAdSShx+Ztx/LsQWZFQ==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"os": [
|
||||
"darwin"
|
||||
]
|
||||
},
|
||||
"node_modules/@pagefind/darwin-x64": {
|
||||
"version": "1.0.4",
|
||||
"resolved": "https://registry.npmjs.org/@pagefind/darwin-x64/-/darwin-x64-1.0.4.tgz",
|
||||
"integrity": "sha512-xkdvp0D9Ld/ZKsjo/y1bgfhTEU72ITimd2PMMQtts7jf6JPIOJbsiErCvm37m/qMFuPGEq/8d+fZ4pydOj08HQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"os": [
|
||||
"darwin"
|
||||
]
|
||||
},
|
||||
"node_modules/@pagefind/linux-arm64": {
|
||||
"version": "1.0.4",
|
||||
"resolved": "https://registry.npmjs.org/@pagefind/linux-arm64/-/linux-arm64-1.0.4.tgz",
|
||||
"integrity": "sha512-jGBrcCzIrMnNxLKVtogaQyajVfTAXM59KlBEwg6vTn8NW4fQ6nuFbbhlG4dTIsaamjEM5e8ZBEAKZfTB/qd9xw==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
]
|
||||
},
|
||||
"node_modules/@pagefind/linux-x64": {
|
||||
"version": "1.0.4",
|
||||
"resolved": "https://registry.npmjs.org/@pagefind/linux-x64/-/linux-x64-1.0.4.tgz",
|
||||
"integrity": "sha512-LIn/QcvcEtLEBqKe5vpSbSC2O3fvqbRCWOTIklslqSORisCsvzsWbP6j+LYxE9q0oWIfkdMoWV1vrE/oCKRxHg==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
]
|
||||
},
|
||||
"node_modules/@pagefind/windows-x64": {
|
||||
"version": "1.0.4",
|
||||
"resolved": "https://registry.npmjs.org/@pagefind/windows-x64/-/windows-x64-1.0.4.tgz",
|
||||
"integrity": "sha512-QlBCVeZfj9fc9sbUgdOz76ZDbeK4xZihOBAFqGuRJeChfM8pnVeH9iqSnXgO3+m9oITugTf7PicyRUFAG76xeQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"os": [
|
||||
"win32"
|
||||
]
|
||||
},
|
||||
"node_modules/@pkgjs/parseargs": {
|
||||
"version": "0.11.0",
|
||||
"resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
|
||||
|
|
@ -1719,12 +1785,6 @@
|
|||
"@types/unist": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/history": {
|
||||
"version": "4.7.11",
|
||||
"resolved": "https://registry.npmjs.org/@types/history/-/history-4.7.11.tgz",
|
||||
"integrity": "sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@types/mdast": {
|
||||
"version": "4.0.3",
|
||||
"resolved": "https://registry.npmjs.org/@types/mdast/-/mdast-4.0.3.tgz",
|
||||
|
|
@ -1794,27 +1854,6 @@
|
|||
"@types/react": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/react-router": {
|
||||
"version": "5.1.20",
|
||||
"resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.20.tgz",
|
||||
"integrity": "sha512-jGjmu/ZqS7FjSH6owMcD5qpq19+1RS9DeVRqfl1FeBMxTDQAGwlMWOcs52NDoXaNKyG3d1cYQFMs9rCrb88o9Q==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@types/history": "^4.7.11",
|
||||
"@types/react": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/react-router-dom": {
|
||||
"version": "5.3.3",
|
||||
"resolved": "https://registry.npmjs.org/@types/react-router-dom/-/react-router-dom-5.3.3.tgz",
|
||||
"integrity": "sha512-kpqnYK4wcdm5UaWI3fLcELopqLrHgLqNsdpHauzlQktfkHL3npOSwtj1Uz9oKBAzs7lFtVkV8j83voAz2D8fhw==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@types/history": "^4.7.11",
|
||||
"@types/react": "*",
|
||||
"@types/react-router": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/scheduler": {
|
||||
"version": "0.16.8",
|
||||
"resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.8.tgz",
|
||||
|
|
@ -5693,6 +5732,22 @@
|
|||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/pagefind": {
|
||||
"version": "1.0.4",
|
||||
"resolved": "https://registry.npmjs.org/pagefind/-/pagefind-1.0.4.tgz",
|
||||
"integrity": "sha512-oRIizYe+zSI2Jw4zcMU0ebDZm27751hRFiSOBLwc1OIYMrsZKk+3m8p9EVaOmc6zZdtqwwdilNUNxXvBeHcP9w==",
|
||||
"dev": true,
|
||||
"bin": {
|
||||
"pagefind": "lib/runner/bin.cjs"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@pagefind/darwin-arm64": "1.0.4",
|
||||
"@pagefind/darwin-x64": "1.0.4",
|
||||
"@pagefind/linux-arm64": "1.0.4",
|
||||
"@pagefind/linux-x64": "1.0.4",
|
||||
"@pagefind/windows-x64": "1.0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/parse-entities": {
|
||||
"version": "4.0.1",
|
||||
"resolved": "https://registry.npmjs.org/parse-entities/-/parse-entities-4.0.1.tgz",
|
||||
|
|
@ -7916,6 +7971,18 @@
|
|||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/typescript": {
|
||||
"version": "5.4.3",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.3.tgz",
|
||||
"integrity": "sha512-KrPd3PKaCLr78MalgiwJnA25Nm8HAmdwN3mYUYZgG/wizIo9EainNVQI9/yDavtVFRN2h3k8uf3GLHuhDMgEHg==",
|
||||
"bin": {
|
||||
"tsc": "bin/tsc",
|
||||
"tsserver": "bin/tsserver"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14.17"
|
||||
}
|
||||
},
|
||||
"node_modules/ultrahtml": {
|
||||
"version": "1.5.3",
|
||||
"resolved": "https://registry.npmjs.org/ultrahtml/-/ultrahtml-1.5.3.tgz",
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
"scripts": {
|
||||
"dev": "astro dev --open",
|
||||
"start": "astro dev",
|
||||
"build": "astro build",
|
||||
"build": "astro build && pagefind --site dist && copy -r dist/pagefind public/",
|
||||
"preview": "astro preview",
|
||||
"astro": "astro"
|
||||
},
|
||||
|
|
@ -24,10 +24,11 @@
|
|||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"tailwind-merge": "^2.2.1",
|
||||
"tailwindcss": "^3.4.1"
|
||||
"tailwindcss": "^3.4.1",
|
||||
"typescript": "^5.4.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react-router-dom": "^5.3.3",
|
||||
"pagefind": "^1.0.4",
|
||||
"prettier": "^3.2.5",
|
||||
"prettier-plugin-tailwindcss": "^0.5.11"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@ const { title, tagline, pubDate, url } = Astro.props;
|
|||
|
||||
<a
|
||||
href={url}
|
||||
class="hover:no-underline hover:-translate-y-1 shadow-xl transition-all duration-300"
|
||||
class="no-target-blank hover:no-underline hover:-translate-y-1 shadow-xl transition-all duration-300"
|
||||
>
|
||||
<div class="bg-[#303338] text-white
|
||||
px-5 py-3
|
||||
|
|
|
|||
|
|
@ -42,7 +42,7 @@ const items = [
|
|||
];
|
||||
---
|
||||
|
||||
<div class="relative w-fit mt-20 z-50">
|
||||
<div class="relative w-fit mt-20 z-50" data-pagefind-ignore>
|
||||
<HeroTitle />
|
||||
|
||||
<div class="max-w-5xl mx-auto px-8 pt-10">
|
||||
|
|
|
|||
|
|
@ -17,7 +17,11 @@ const { headings } = Astro.props;
|
|||
if (heading.depth === 1) return;
|
||||
const margin = `${heading.depth - 1.5}rem`;
|
||||
return (
|
||||
<div style={{ marginLeft: margin }} class="mb-2 pl-0">
|
||||
<div
|
||||
style={{ marginLeft: margin }}
|
||||
class="mb-2 pl-0"
|
||||
data-pagefind-ignore
|
||||
>
|
||||
<a
|
||||
href={`#${heading.slug}`}
|
||||
class="no-target-blank text-white hover:no-underline hover:text-blue-400 transition-colors duration-150 line-clamp-1"
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
---
|
||||
import VerticalNav from "./verticalNav.astro";
|
||||
import SearchModal from "../ui/SearchModal.astro";
|
||||
---
|
||||
|
||||
<div
|
||||
transition:persist
|
||||
transition:name="navbar"
|
||||
class="w-full backdrop-blur fixed top-0 text-white bg-secondary/75 z-[60] text-lg py-3 h-[var(--header-height)]"
|
||||
data-pagefind-ignore
|
||||
>
|
||||
<div
|
||||
class="mx-auto relative px-3 lg:px-8 max-w-7xl flex flex-row justify-between items-center gap-3"
|
||||
|
|
@ -37,6 +37,7 @@ import VerticalNav from "./verticalNav.astro";
|
|||
<div
|
||||
class="flex-1 flex items-center text-xl select-none ml-10 lg:ml-0"
|
||||
transition:name="cowo-logo"
|
||||
transition:persist
|
||||
>
|
||||
<a
|
||||
href="/"
|
||||
|
|
@ -46,7 +47,12 @@ import VerticalNav from "./verticalNav.astro";
|
|||
</a>
|
||||
</div>
|
||||
<!-- Navigation Links -->
|
||||
<div class="hidden lg:flex items-center gap-8" id="navbar-links">
|
||||
<div
|
||||
class="hidden lg:flex items-center gap-8"
|
||||
id="navbar-links"
|
||||
transition:persist
|
||||
transition:name="navbar"
|
||||
>
|
||||
<a
|
||||
class="no-target-blank hover:text-black hover:bg-white rounded-md transition-colors duration-300 px-2 py-1 text-white hover:no-underline"
|
||||
href="/get-started/introduction">Get started</a
|
||||
|
|
@ -68,8 +74,10 @@ import VerticalNav from "./verticalNav.astro";
|
|||
href="/credits">Credits</a
|
||||
>
|
||||
</div>
|
||||
<!-- Theme Toggle (COMING SOON) -->
|
||||
<div class="flex lg:flex-1 justify-end"></div>
|
||||
<!-- Search bar -->
|
||||
<div class="flex lg:flex-1 justify-end relative">
|
||||
<SearchModal id="dialog" open="Open modal" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<aside
|
||||
|
|
@ -80,51 +88,23 @@ import VerticalNav from "./verticalNav.astro";
|
|||
<VerticalNav showHome={true} />
|
||||
</aside>
|
||||
|
||||
<style is:global>
|
||||
:root {
|
||||
--pagefind-ui-scale: 1;
|
||||
--pagefind-ui-primary: #fff;
|
||||
--pagefind-ui-text: #fff;
|
||||
--pagefind-ui-background: #272727;
|
||||
--pagefind-ui-border: #505050;
|
||||
--pagefind-ui-tag: #fff;
|
||||
--pagefind-ui-border-width: 1px;
|
||||
--pagefind-ui-border-radius: 10px;
|
||||
--pagefind-ui-image-border-radius: 2px;
|
||||
--pagefind-ui-image-box-ratio: 2 / 1;
|
||||
--pagefind-ui-font: system-ui;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
function updateDarkModeIcon() {
|
||||
const darkModeToggle = document.querySelector("#theme-toggle");
|
||||
const isDarkMode = localStorage.getItem("theme") === "dark";
|
||||
const moonSVG = `
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6">
|
||||
<path fill-rule="evenodd" d="M9.528 1.718a.75.75 0 0 1 .162.819A8.97 8.97 0 0 0 9 6a9 9 0 0 0 9 9 8.97 8.97 0 0 0 3.463-.69.75.75 0 0 1 .981.98 10.503 10.503 0 0 1-9.694 6.46c-5.799 0-10.5-4.7-10.5-10.5 0-4.368 2.667-8.112 6.46-9.694a.75.75 0 0 1 .818.162Z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
`;
|
||||
const sunSVG = `
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6">
|
||||
<path d="M12 2.25a.75.75 0 0 1 .75.75v2.25a.75.75 0 0 1-1.5 0V3a.75.75 0 0 1 .75-.75ZM7.5 12a4.5 4.5 0 1 1 9 0 4.5 4.5 0 0 1-9 0ZM18.894 6.166a.75.75 0 0 0-1.06-1.06l-1.591 1.59a.75.75 0 1 0 1.06 1.061l1.591-1.59ZM21.75 12a.75.75 0 0 1-.75.75h-2.25a.75.75 0 0 1 0-1.5H21a.75.75 0 0 1 .75.75ZM17.834 18.894a.75.75 0 0 0 1.06-1.06l-1.59-1.591a.75.75 0 1 0-1.061 1.06l1.59 1.591ZM12 18a.75.75 0 0 1 .75.75V21a.75.75 0 0 1-1.5 0v-2.25A.75.75 0 0 1 12 18ZM7.758 17.303a.75.75 0 0 0-1.061-1.06l-1.591 1.59a.75.75 0 0 0 1.06 1.061l1.591-1.59ZM6 12a.75.75 0 0 1-.75.75H3a.75.75 0 0 1 0-1.5h2.25A.75.75 0 0 1 6 12ZM6.697 7.757a.75.75 0 0 0 1.06-1.06l-1.59-1.591a.75.75 0 0 0-1.061 1.06l1.59 1.591Z" />
|
||||
</svg>
|
||||
`;
|
||||
|
||||
if (darkModeToggle) {
|
||||
if (isDarkMode) {
|
||||
darkModeToggle.innerHTML = moonSVG;
|
||||
} else {
|
||||
darkModeToggle.innerHTML = sunSVG;
|
||||
}
|
||||
}
|
||||
}
|
||||
const darkModeToggle = document.querySelector("#theme-toggle");
|
||||
|
||||
if (!localStorage.getItem("theme")) {
|
||||
localStorage.setItem("theme", "dark");
|
||||
}
|
||||
|
||||
if (darkModeToggle) {
|
||||
darkModeToggle.addEventListener("click", () => {
|
||||
const isDarkMode = localStorage.getItem("theme") === "dark";
|
||||
|
||||
if (isDarkMode) {
|
||||
localStorage.setItem("theme", "light");
|
||||
document.documentElement.setAttribute("data-theme", "light");
|
||||
} else {
|
||||
localStorage.setItem("theme", "dark");
|
||||
document.documentElement.setAttribute("data-theme", "dark");
|
||||
}
|
||||
|
||||
updateDarkModeIcon();
|
||||
});
|
||||
}
|
||||
|
||||
// JavaScript for toggling the menu
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
const menuToggle = document.querySelector("#menu-toggle");
|
||||
|
|
@ -145,4 +125,15 @@ import VerticalNav from "./verticalNav.astro";
|
|||
});
|
||||
});
|
||||
});
|
||||
window.addEventListener("DOMContentLoaded", (event) => {
|
||||
// @ts-ignore
|
||||
new PagefindUI({
|
||||
element: "#search",
|
||||
showSubResults: false,
|
||||
showEmptyFilters: false,
|
||||
debounceTimeoutMs: 0,
|
||||
showImages: false,
|
||||
autofocus: false,
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -66,7 +66,7 @@ const { showHome } = Astro.props;
|
|||
---
|
||||
|
||||
<div class="relative">
|
||||
<nav id="vertical-nav-component" class="flex flex-col">
|
||||
<nav id="vertical-nav-component" class="flex flex-col" data-pagefind-ignore>
|
||||
{
|
||||
showHome && (
|
||||
<div class="mb-2">
|
||||
|
|
|
|||
55
src/components/ui/SearchModal.astro
Normal file
55
src/components/ui/SearchModal.astro
Normal file
|
|
@ -0,0 +1,55 @@
|
|||
---
|
||||
const { id } = Astro.props;
|
||||
---
|
||||
|
||||
<style>
|
||||
dialog::backdrop {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
</style>
|
||||
|
||||
<button
|
||||
onclick={`window.${id}.showModal()`}
|
||||
class="text-sm flex bg-[#101010] w-60 px-2 py-2 border border-gray-600 border-solid text-left rounded-lg group"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 20 20"
|
||||
fill="currentColor"
|
||||
class="w-5 h-5"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
d="M9 3.5a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11ZM2 9a7 7 0 1 1 12.452 4.391l3.328 3.329a.75.75 0 1 1-1.06 1.06l-3.329-3.328A7 7 0 0 1 2 9Z"
|
||||
clip-rule="evenodd"></path>
|
||||
</svg>
|
||||
<span class="ml-3 text-gray-400 group-hover:text-white">Search...</span>
|
||||
</button>
|
||||
|
||||
<dialog
|
||||
id=`${id}`
|
||||
class="fixed left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 bg-[#141414] border-2 border-solid border-[#505050] text-white rounded-lg w-1/2 h-5/6 px-10 py-10"
|
||||
>
|
||||
<form method="dialog">
|
||||
<button class="absolute top-3 right-3"
|
||||
><svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="currentColor"
|
||||
class="w-6 h-6"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
d="M5.47 5.47a.75.75 0 0 1 1.06 0L12 10.94l5.47-5.47a.75.75 0 1 1 1.06 1.06L13.06 12l5.47 5.47a.75.75 0 1 1-1.06 1.06L12 13.06l-5.47 5.47a.75.75 0 0 1-1.06-1.06L10.94 12 5.47 6.53a.75.75 0 0 1 0-1.06Z"
|
||||
clip-rule="evenodd"></path>
|
||||
</svg>
|
||||
</button>
|
||||
</form>
|
||||
<div id="search" class="mt-10" transition:name="search" transition:persist>
|
||||
</div>
|
||||
</dialog>
|
||||
|
|
@ -15,16 +15,6 @@ import VerticalNav from "../components/blocks/verticalNav.astro";
|
|||
</aside>
|
||||
</div>
|
||||
<div class="lg:col-span-8 pt-8">
|
||||
<!-- <div class="flex flex-col lg:grid lg:grid-cols-10">
|
||||
<div class="col-span-8 pr-10 pb-10 pt-8">
|
||||
<slot />
|
||||
</div>
|
||||
<div
|
||||
class="col-span-2 pt-8 lg:block lg:sticky lg:px-4 lg:-mx-4 lg:max-h-[calc(100vh-var(--header-height))] lg:top-[--header-height]"
|
||||
>
|
||||
<TableOfContent headings={headings} />
|
||||
</div>
|
||||
</div> -->
|
||||
<slot />
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -20,6 +20,8 @@ const { title, description } = Astro.props;
|
|||
<meta name="theme-color" content="#2B2D31" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
|
||||
<link href="/pagefind/pagefind-ui.css" rel="stylesheet" />
|
||||
<script src="/pagefind/pagefind-ui.js" is:inline></script>
|
||||
<script is:inline src="/_vercel/insights/script.js"></script>
|
||||
<ViewTransitions />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
|
|
@ -30,6 +32,14 @@ const { title, description } = Astro.props;
|
|||
<NavBar />
|
||||
<slot />
|
||||
</div>
|
||||
<script>
|
||||
// make all <a> attributes have target="_blank" except for Table of Contents
|
||||
document
|
||||
.querySelectorAll("a:not(.no-target-blank)")
|
||||
.forEach((el) => {
|
||||
el.setAttribute("target", "_blank");
|
||||
});
|
||||
</script>
|
||||
|
||||
<style is:global>
|
||||
:root {
|
||||
|
|
@ -56,10 +66,6 @@ const { title, description } = Astro.props;
|
|||
font-family: system-ui;
|
||||
}
|
||||
|
||||
body {
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family:
|
||||
Menlo,
|
||||
|
|
@ -148,33 +154,5 @@ const { title, description } = Astro.props;
|
|||
@apply ml-5 list-outside list-decimal leading-7;
|
||||
}
|
||||
</style>
|
||||
<script is:inline>
|
||||
const theme = (() => {
|
||||
if (
|
||||
typeof localStorage !== "undefined" &&
|
||||
localStorage.getItem("theme")
|
||||
) {
|
||||
return localStorage.getItem("theme");
|
||||
}
|
||||
if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
|
||||
return "dark";
|
||||
}
|
||||
return "light";
|
||||
})();
|
||||
|
||||
if (theme === "light") {
|
||||
document.documentElement.classList.remove("dark");
|
||||
} else {
|
||||
document.documentElement.classList.add("dark");
|
||||
}
|
||||
window.localStorage.setItem("theme", theme);
|
||||
|
||||
// make all <a> attributes have target="_blank" except for Table of Contents
|
||||
document
|
||||
.querySelectorAll("a:not(.no-target-blank)")
|
||||
.forEach((el) => {
|
||||
el.setAttribute("target", "_blank");
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ const allPosts = await getCollection("posts");
|
|||
{
|
||||
allPosts.map((post) => (
|
||||
<BlogPost
|
||||
url={`blog/posts/${post.slug}/`}
|
||||
url={`/blog/posts/${post.slug}/`}
|
||||
title={post.data.heading}
|
||||
tagline={post.data.subheading}
|
||||
pubDate={post.data.pubDate}
|
||||
|
|
|
|||
|
|
@ -77,9 +77,9 @@ Ultimately, co-working streams cater to a specific need for some viewers. They o
|
|||
|
||||
## What is a task widget?
|
||||
|
||||
<a href="../guide/widgets#task-widgets" class="no-target-blank"><img src="/images/widgets/multitask.webp" alt="Multi Task Widget" loading="lazy"></a>
|
||||
<a href="../guide/stream-widgets#task-widgets" class="no-target-blank"><img src="/images/widgets/multitask.webp" alt="Multi Task Widget" loading="lazy"></a>
|
||||
|
||||
If you want to add a task widget to your own stream, check it out in the <a href="../guide/widgets#task-widgets" class="no-target-blank">Widgets section</a>!
|
||||
If you want to add a task widget to your own stream, check it out in the <a href="../guide/stream-widgets#task-widgets" class="no-target-blank">Widgets section</a>!
|
||||
|
||||
A task widget is a widget where users can use commands such as:
|
||||
- !task [current task]
|
||||
|
|
|
|||
|
|
@ -2,6 +2,12 @@
|
|||
"extends": "astro/tsconfigs/strict",
|
||||
"compilerOptions": {
|
||||
"jsx": "react-jsx",
|
||||
"jsxImportSource": "react"
|
||||
"jsxImportSource": "react",
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": [
|
||||
"./src/*"
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in a new issue