diff --git a/astro.config.mjs b/astro.config.mjs index 650b4f5..625d4ea 100755 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -1,4 +1,5 @@ import { defineConfig } from 'astro/config'; +import vue from '@astrojs/vue'; // Environment Variables import { @@ -24,7 +25,7 @@ export default defineConfig({ integrations: [ mdx(), partytown(), - react(), + vue(), // Disable Keystatic in production // https://keystatic.com/docs/recipes/astro-disable-admin-ui-in-production ...(process.env.SKIP_KEYSTATIC ? [] : [keystatic()]) diff --git a/bun.lockb b/bun.lockb index 893623c..e3d08eb 100755 Binary files a/bun.lockb and b/bun.lockb differ diff --git a/config.json b/config.json index dea74e1..dbca5bd 100755 --- a/config.json +++ b/config.json @@ -5,8 +5,8 @@ "link": "/syntax/" }, { - "text": "Link", - "link": "#" + "text": "Components", + "link": "/components/" }, { "text": "Link", @@ -22,8 +22,8 @@ "link": "syntax/" }, { - "text": "Document Title", - "link": "#" + "text": "Components", + "link": "/components/" }, { "text": "Document Title", diff --git a/package.json b/package.json index 7803d87..d25ef90 100755 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "butterflyvu", "type": "module", - "version": "0.0.1", + "version": "0.1.0", "license": "GPL-3.0-only", "author": { "name": "SudoVanilla" @@ -28,29 +28,29 @@ "preview": "astro preview", "docker:start": "docker compose up -d", "docker:stop": "docker compose down", - "docker:build": "docker build --platform linux/arm64 -t ark.sudovanilla.org/korbs/butterlyvu:arm64 .", - "docker:push": "docker push ark.sudovanilla.org/korbs/butterlyvu:arm64" + "docker:build": "docker build --platform linux/amd64 -t ark.sudovanilla.org/korbs/butterlyvu:amd64 .", + "docker:push": "docker push ark.sudovanilla.org/korbs/butterlyvu:amd64" }, "dependencies": { "@aptabase/react": "^0.3.4", "@aptabase/web": "^0.4.3", - "@astrojs/mdx": "^3.1.4", + "@astrojs/mdx": "^3.1.6", "@astrojs/node": "^8.3.3", - "@astrojs/partytown": "^2.1.1", + "@astrojs/partytown": "^2.1.2", "@astrojs/prism": "^3.1.0", - "@astrojs/react": "^3.6.2", + "@astrojs/vue": "^4.5.1", "@keystatic/astro": "^5.0.0", - "@keystatic/core": "^0.5.32", - "astro": "4.14.5", + "@keystatic/core": "^0.5.35", + "@minpluto/zorn": "^0.4.51", + "astro": "4.15.7", "astro-analytics": "^2.7.0", - "astro-breadcrumbs": "^3.0.1", + "astro-breadcrumbs": "^3.1.0", "astro-feelback": "^0.3.4", "astro-seo": "^0.8.4", "dayjs": "^1.11.13", - "iconoir-react": "^7.8.0", "markdoc": "^0.1.3" }, "devDependencies": { - "sass": "^1.77.8" + "sass": "^1.79.1" } } diff --git a/src/content/docs/components.mdx b/src/content/docs/components.mdx new file mode 100755 index 0000000..54eb9a3 --- /dev/null +++ b/src/content/docs/components.mdx @@ -0,0 +1,67 @@ +--- +title: Components +--- + +import {Zorn} from '@minpluto/zorn' +import { Prism } from '@astrojs/prism'; + +Documentation template for the Astro Web Framework. + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nulla facilisi morbi tempus iaculis urna id volutpat. Diam phasellus vestibulum lorem sed risus ultricies tristique nulla. A cras semper auctor neque vitae tempus quam. Tempus quam pellentesque nec nam aliquam. Lorem ipsum dolor sit amet consectetur adipiscing elit ut aliquam. Sed adipiscing diam donec adipiscing tristique risus nec feugiat in. Quis commodo odio aenean sed adipiscing diam. Pharetra et ultrices neque ornare aenean euismod elementum. Egestas fringilla phasellus faucibus scelerisque eleifend donec. Dolor sit amet consectetur adipiscing elit duis tristique sollicitudin nibh. + +## Prism + + +
+
+
+

{frontmatter.Title}

+

{frontmatter.Description}

+
+ {frontmatter.PrimaryText} + {frontmatter.SecondaryText} +
+
+ +
+
+ +
+
+
+
+

© {ORG_NAME}. All right reserved.

+
+
+ {WHITELABEL ? +

Built with ButterflyVu

+ : + null + } +
+
+ + ` +} /> + + +```jsx + +``` + +## Zorn Player + + +A custom video player tailored for MinPluto. + +## Video Player + + + +The source of both videos above are on a network with limited upload speed, the buffer rate is high. \ No newline at end of file diff --git a/src/layouts/Document.astro b/src/layouts/Document.astro index 2fd93ef..aae0cb3 100755 --- a/src/layouts/Document.astro +++ b/src/layouts/Document.astro @@ -20,6 +20,7 @@ import FeelbackYesNo from "astro-feelback/components/FeelbackYesNo.astro" // Styles import "@styles/index.scss"; import "@styles/feelback.css"; +import "@styles/prism.css" --- diff --git a/src/styles/index.scss b/src/styles/index.scss index 930aeb7..710862f 100755 --- a/src/styles/index.scss +++ b/src/styles/index.scss @@ -90,7 +90,7 @@ header { } .document { height: max-content; - img { + img, video { width: 100%; border-radius: 6px; } diff --git a/src/styles/prism.css b/src/styles/prism.css new file mode 100644 index 0000000..97f7031 --- /dev/null +++ b/src/styles/prism.css @@ -0,0 +1,275 @@ +pre[class*="language-"], +code[class*="language-"] { + color: #d4d4d4; + font-size: 12px; + text-shadow: none; + font-family: Menlo, Monaco, Consolas, "Andale Mono", "Ubuntu Mono", "Courier New", monospace; + direction: ltr; + text-align: left; + white-space: pre; + word-spacing: normal; + word-break: normal; + line-height: 1.5; + -moz-tab-size: 4; + -o-tab-size: 4; + tab-size: 4; + -webkit-hyphens: none; + -moz-hyphens: none; + -ms-hyphens: none; + hyphens: none; +} + +pre[class*="language-"]::selection, +code[class*="language-"]::selection, +pre[class*="language-"] *::selection, +code[class*="language-"] *::selection { + text-shadow: none; + background: #264F78; +} + +@media print { + pre[class*="language-"], + code[class*="language-"] { + text-shadow: none; + } +} + +pre[class*="language-"] { + padding: 0px 12px; + margin: .5em 0; + overflow: auto; + background: #1e1e1e; +} + +:not(pre) > code[class*="language-"] { + padding: .1em .3em; + border-radius: .3em; + color: #db4c69; + background: #1e1e1e; +} +/********************************************************* +* Tokens +*/ +.namespace { + opacity: .7; +} + +.token.doctype .token.doctype-tag { + color: #569CD6; +} + +.token.doctype .token.name { + color: #9cdcfe; +} + +.token.comment, +.token.prolog { + color: #6a9955; +} + +.token.punctuation, +.language-html .language-css .token.punctuation, +.language-html .language-javascript .token.punctuation { + color: #d4d4d4; +} + +.token.property, +.token.tag, +.token.boolean, +.token.number, +.token.constant, +.token.symbol, +.token.inserted, +.token.unit { + color: #b5cea8; +} + +.token.selector, +.token.attr-name, +.token.string, +.token.char, +.token.builtin, +.token.deleted { + color: #ce9178; +} + +.language-css .token.string.url { + text-decoration: underline; +} + +.token.operator, +.token.entity { + color: #d4d4d4; +} + +.token.operator.arrow { + color: #569CD6; +} + +.token.atrule { + color: #ce9178; +} + +.token.atrule .token.rule { + color: #c586c0; +} + +.token.atrule .token.url { + color: #9cdcfe; +} + +.token.atrule .token.url .token.function { + color: #dcdcaa; +} + +.token.atrule .token.url .token.punctuation { + color: #d4d4d4; +} + +.token.keyword { + color: #569CD6; +} + +.token.keyword.module, +.token.keyword.control-flow { + color: #c586c0; +} + +.token.function, +.token.function .token.maybe-class-name { + color: #dcdcaa; +} + +.token.regex { + color: #d16969; +} + +.token.important { + color: #569cd6; +} + +.token.italic { + font-style: italic; +} + +.token.constant { + color: #9cdcfe; +} + +.token.class-name, +.token.maybe-class-name { + color: #4ec9b0; +} + +.token.console { + color: #9cdcfe; +} + +.token.parameter { + color: #9cdcfe; +} + +.token.interpolation { + color: #9cdcfe; +} + +.token.punctuation.interpolation-punctuation { + color: #569cd6; +} + +.token.boolean { + color: #569cd6; +} + +.token.property, +.token.variable, +.token.imports .token.maybe-class-name, +.token.exports .token.maybe-class-name { + color: #9cdcfe; +} + +.token.selector { + color: #d7ba7d; +} + +.token.escape { + color: #d7ba7d; +} + +.token.tag { + color: #569cd6; +} + +.token.tag .token.punctuation { + color: #808080; +} + +.token.cdata { + color: #808080; +} + +.token.attr-name { + color: #9cdcfe; +} + +.token.attr-value, +.token.attr-value .token.punctuation { + color: #ce9178; +} + +.token.attr-value .token.punctuation.attr-equals { + color: #d4d4d4; +} + +.token.entity { + color: #569cd6; +} + +.token.namespace { + color: #4ec9b0; +} +/********************************************************* +* Language Specific +*/ + +pre[class*="language-javascript"], +code[class*="language-javascript"], +pre[class*="language-jsx"], +code[class*="language-jsx"], +pre[class*="language-typescript"], +code[class*="language-typescript"], +pre[class*="language-tsx"], +code[class*="language-tsx"] { + color: #9cdcfe; +} + +pre[class*="language-css"], +code[class*="language-css"] { + color: #ce9178; +} + +pre[class*="language-html"], +code[class*="language-html"] { + color: #d4d4d4; +} + +.language-regex .token.anchor { + color: #dcdcaa; +} + +.language-html .token.punctuation { + color: #808080; +} +/********************************************************* +* Line highlighting +*/ +pre[class*="language-"] > code[class*="language-"] { + position: relative; + z-index: 1; +} + +.line-highlight.line-highlight { + background: #f7ebc6; + box-shadow: inset 5px 0 0 #f7d87c; + z-index: 0; +}