Skip to content

Commit

Permalink
Migrate to @siteup/cli for site building
Browse files Browse the repository at this point in the history
Doesn't provide as much advantage here.
  • Loading branch information
bcomnes committed May 14, 2022
1 parent d194af9 commit 390aaa3
Show file tree
Hide file tree
Showing 11 changed files with 190 additions and 170 deletions.
2 changes: 1 addition & 1 deletion README.md
Expand Up @@ -293,7 +293,7 @@ The two classes are:

## License

[ISC](LICENSE.md)
[ISC](LICENSE)

[style]: https://css-pkg.github.io/style.css/
[style-gh]: https://github.com/css-pkg/style.css
Expand Down
38 changes: 38 additions & 0 deletions global.client.js
@@ -0,0 +1,38 @@
import {toggleTheme} from './src/theme-switcher.js';

window.toggleTheme = toggleTheme

const page = document.querySelector('body')
const sansButton = document.querySelector('.style-sans')
const serifButton = document.querySelector('.style-serif')
const roundButton = document.querySelector('.style-round')
const toggle = document.querySelector('.id')

function round () {
page.classList.toggle('serif', false)
page.classList.toggle('round', true)

sansButton.classList.toggle('current-page', false)
serifButton.classList.toggle('current-page', false)
roundButton.classList.toggle('current-page', true)
}

function serif () {
page.classList.toggle('serif', true)
page.classList.toggle('round', false)
sansButton.classList.toggle('current-page', false)
serifButton.classList.toggle('current-page', true)
roundButton.classList.toggle('current-page', false)
}

function sans () {
page.classList.toggle('serif', false)
page.classList.toggle('round', false)
sansButton.classList.toggle('current-page', true)
serifButton.classList.toggle('current-page', false)
roundButton.classList.toggle('current-page', false)
}

sansButton.addEventListener('click', sans)
serifButton.addEventListener('click', serif)
roundButton.addEventListener('click', round)
4 changes: 2 additions & 2 deletions site/index.css → global.css
Expand Up @@ -5,8 +5,8 @@ $top-bar-family: $system-sans;
*/
@import 'top-bar.css';
@import '../dist/mine.css';
@import '../dist/layout.css';
@import './dist/mine.css';
@import './dist/layout.css';
@import 'highlight.js/styles/github-dark-dimmed.css';

.top-bar {
Expand Down
10 changes: 10 additions & 0 deletions global.vars.js
@@ -0,0 +1,10 @@
// The global.vars.js file should export default either an object, function that
// returns an object or an async function that returns an object.
//
// These variables are available to every page, and have the lowest precedence.

export default async function () {
return {
siteName: 'bcomnes/mine.css'
}
}
168 changes: 84 additions & 84 deletions guide.md → guide/README.md

Large diffs are not rendered by default.

File renamed without changes
File renamed without changes
File renamed without changes
16 changes: 6 additions & 10 deletions package.json
Expand Up @@ -10,6 +10,7 @@
"Bret Comnes <bcomnes@gmail.com> (https://bret.io)"
],
"devDependencies": {
"@siteup/cli": "^2.0.0",
"auto-changelog": "^2.0.0",
"autoprefixer": "^10.0.1",
"browser-sync": "^2.26.7",
Expand All @@ -28,10 +29,10 @@
"postcss-reporter": "^7.0.1",
"postcss-url": "^10.1.0",
"rimraf": "^3.0.0",
"sitedown": "^5.0.0",
"stylelint": "^14.0.0",
"stylelint-config-standard": "^25.0.0",
"top-bar.css": "^3.0.0"
"top-bar.css": "^3.0.0",
"uhtml-isomorphic": "^2.0.0"
},
"homepage": "https://github.com/bcomnes/mine.css",
"keywords": [
Expand All @@ -54,12 +55,10 @@
},
"scripts": {
"build": "run-s clean build:*",
"build:md": "sitedown . -b public/ -l site/layout.html",
"build:mine.css": "postcss src/index.css -o dist/mine.css",
"build:layout.css": "postcss src/layout.css -o dist/layout.css",
"build:site.css": "postcss site/index.css -o public/site.css",
"build:static": "cpx 'site/**/*.{jpg,png,svg,ico}' public",
"build:js": "cpx 'src/theme-switcher.js' public",
"build:js": "cpx 'src/theme-switcher.js' dist",
"build:site": "siteup --src . --dest public --ignore 'src,package.json,*.map'",
"clean": "rimraf 'dist/*' 'public/*' && mkdirp dist public",
"prepare": "npm run build",
"prepublishOnly": "git push --follow-tags && gh-release -y",
Expand All @@ -71,11 +70,8 @@
"version:changelog": "auto-changelog -p --template keepachangelog auto-changelog --breaking-pattern 'BREAKING CHANGE:'",
"version:git": "git add CHANGELOG.md dist",
"watch": "npm run clean && run-p build:mine.css build:layout.css && run-p watch:*",
"watch:static": "npm run build:static -- -w",
"watch:js": "npm run build:js -- -w",
"watch:serve": "browser-sync start --server 'public' --files 'public'",
"watch:md": "npm run build:md -- -w",
"watch:site.css": "run-s 'build:site.css -- --watch'",
"watch:site": "npm run build:site -- -w",
"watch:mine.css": "run-s 'build:mine.css -- --watch'",
"watch:layout.css": "run-s 'build:layout.css -- --watch'"
}
Expand Down
49 changes: 49 additions & 0 deletions root.layout.js
@@ -0,0 +1,49 @@
import { html, render } from 'uhtml-isomorphic'

export default async function RootLayout ({
title,
siteName,
scripts,
styles,
children
}) {
return render(String, html`
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>${title ? `${title} | ` : ''}${siteName}</title>
${scripts
? scripts.map(script => html`<script src="${script}" type='module'></script>`)
: null}
${styles
? styles.map(style => html`<link rel="stylesheet" href=${style} />`)
: null}
</head>
<body>
<nav class="top-bar">
<div class="top-bar-title">
<a href="/">mine.css</a>
</div>
<a class="top-bar-link" href="/guide/">guide</a>
<a class="top-bar-link sans style-sans current-page">sans</a>
<a class="top-bar-link serif style-serif">serif</a>
<a class="top-bar-link round style-round">round</a>
<span class="top-bar-link"><input class="dark-icon" onclick="toggleTheme()" type="image" alt="Toogle Theme" height="14" width="14" src="/light-dark.svg"></span>
<div class="top-bar-right">
<a class="top-bar-link" href="https://github.com/bcomnes/mine.css/">
🐈 github
</a>
</div>
</nav>
<main class="markdown-body mine-layout">
${typeof children === 'string' ? html([children]) : children /* Support both uhtml and string children. Optional. */}
</main>
<footer>
<a href="https://github.com/bcomnes/mine.css/issues"><small>💌</small></a>
</footer>
</body>
</html>
`)
}
73 changes: 0 additions & 73 deletions site/layout.html

This file was deleted.

0 comments on commit 390aaa3

Please sign in to comment.