update
This commit is contained in:
Korbs
parent
f1537f67dc
commit
88c1c549ed
8 changed files with 361 additions and 17 deletions
|
|
@ -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()])
|
||||
|
|
|
|||
BIN
bun.lockb
BIN
bun.lockb
Binary file not shown.
|
|
@ -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",
|
||||
|
|
|
|||
22
package.json
22
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"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
67
src/content/docs/components.mdx
Executable file
67
src/content/docs/components.mdx
Executable file
|
|
@ -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
|
||||
|
||||
<Prism lang="jsx" code={
|
||||
`
|
||||
<div class="page">
|
||||
<div class="content">
|
||||
<div class="splash">
|
||||
<div class="splash-content">
|
||||
<h1>{frontmatter.Title}</h1>
|
||||
<p>{frontmatter.Description}</p>
|
||||
<div class="splash-action">
|
||||
<a href={frontmatter.PrimaryLink} class="button">{frontmatter.PrimaryText}</a>
|
||||
<a href={frontmatter.SecondaryLink} class="button-secondary">{frontmatter.SecondaryText}</a>
|
||||
</div>
|
||||
</div>
|
||||
<img src={frontmatter.Banner}/>
|
||||
</div>
|
||||
<div class="document">
|
||||
<slot/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<div class="footer-start">
|
||||
<p>© {ORG_NAME}. All right reserved.</p>
|
||||
</div>
|
||||
<div class="footer-end">
|
||||
{WHITELABEL ?
|
||||
<p>Built with <a href="#">ButterflyVu</a></p>
|
||||
:
|
||||
null
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
} />
|
||||
|
||||
|
||||
```jsx
|
||||
|
||||
```
|
||||
|
||||
## Zorn Player
|
||||
<Zorn
|
||||
Poster="https://md.sudovanilla.org/images/wote-p-v.jpeg"
|
||||
Video="https://ocean.sudovanilla.org/media/videos/The%20Mark%20On%20The%20Wall/1080.mp4"
|
||||
Audio="https://ocean.sudovanilla.org/media/videos/The%20Mark%20On%20The%20Wall/audio.mp4"
|
||||
/>
|
||||
|
||||
A custom video player tailored for MinPluto.
|
||||
|
||||
## Video Player
|
||||
|
||||
<video controls src="https://md.sudovanilla.org/videos/webm/Ennie-and-Yoyki.webm" poster="https://md.sudovanilla.org/images/eay-p-v.jpg"></video>
|
||||
|
||||
The source of both videos above are on a network with limited upload speed, the buffer rate is high.
|
||||
|
|
@ -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"
|
||||
---
|
||||
|
||||
<Head/>
|
||||
|
|
|
|||
|
|
@ -90,7 +90,7 @@ header {
|
|||
}
|
||||
.document {
|
||||
height: max-content;
|
||||
img {
|
||||
img, video {
|
||||
width: 100%;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
|
|
|||
275
src/styles/prism.css
Normal file
275
src/styles/prism.css
Normal file
|
|
@ -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;
|
||||
}
|
||||
Loading…
Reference in a new issue