add awsm theme
This commit is contained in:
polv committed
1 parent
7039b10df2
commit
e397c9ae1e
15 files changed
+116
-114
No files matched your search
@@ -88,3 +88,6 @@ sw.*
|
||||
|
||||
# Vim swap files
|
||||
*.swp
|
||||
|
||||
/built/
|
||||
/static/media/
|
||||
@@ -1,7 +0,0 @@
|
||||
# ASSETS
|
||||
|
||||
**This directory is not required, you can delete it if you don't want to use it.**
|
||||
|
||||
This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.
|
||||
|
||||
More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#webpacked).
|
||||
@@ -0,0 +1,3 @@
|
||||
import type { ITheme } from '~/server/theme'
|
||||
|
||||
export const THEME: ITheme = JSON.parse(process.env.THEME!)
|
||||
@@ -1,7 +0,0 @@
|
||||
# LAYOUTS
|
||||
|
||||
**This directory is not required, you can delete it if you don't want to use it.**
|
||||
|
||||
This directory contains your Application Layouts.
|
||||
|
||||
More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/views#layouts).
|
||||
@@ -1,55 +1,64 @@
|
||||
<template>
|
||||
<div>
|
||||
<main>
|
||||
<header>
|
||||
<h1>{{ theme.title }}</h1>
|
||||
|
||||
<nav>
|
||||
<ul v-if="theme.nav">
|
||||
<li v-for="(n, i) in theme.nav" :key="i">
|
||||
<nuxt-link v-if="n.to" :to="n.to">{{ n.name }}</nuxt-link>
|
||||
<a v-else :href="n.href" target="_blank" rel="noopener">
|
||||
{{ n.name }}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<form @submit.prevent="doSearch">
|
||||
<input
|
||||
type="search"
|
||||
:value="$route.query.q"
|
||||
placeholder="Search..."
|
||||
/>
|
||||
<div class="icon">🔎</div>
|
||||
</form>
|
||||
</nav>
|
||||
</header>
|
||||
<Nuxt />
|
||||
</div>
|
||||
</main>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
html {
|
||||
font-family: 'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI',
|
||||
Roboto, 'Helvetica Neue', Arial, sans-serif;
|
||||
font-size: 16px;
|
||||
word-spacing: 1px;
|
||||
-ms-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
<script lang="ts">
|
||||
import { Vue, Component } from 'nuxt-property-decorator'
|
||||
import { THEME } from '~/assets/global'
|
||||
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
}
|
||||
@Component
|
||||
export default class DefaultLayout extends Vue {
|
||||
theme = THEME
|
||||
|
||||
.button--green {
|
||||
doSearch() {
|
||||
alert('not implemented')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
nav ul {
|
||||
display: inline-block;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #3b8070;
|
||||
color: #3b8070;
|
||||
text-decoration: none;
|
||||
padding: 10px 30px;
|
||||
}
|
||||
|
||||
.button--green:hover {
|
||||
color: #fff;
|
||||
background-color: #3b8070;
|
||||
form {
|
||||
float: right;
|
||||
max-width: 300px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.button--grey {
|
||||
display: inline-block;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #35495e;
|
||||
color: #35495e;
|
||||
text-decoration: none;
|
||||
padding: 10px 30px;
|
||||
margin-left: 15px;
|
||||
form .icon {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 5px;
|
||||
}
|
||||
|
||||
.button--grey:hover {
|
||||
color: #fff;
|
||||
background-color: #35495e;
|
||||
input {
|
||||
padding-right: 1.5em;
|
||||
}
|
||||
</style>
|
||||
@@ -18,7 +18,15 @@ const config = async (): Promise<NuxtConfig> => {
|
||||
content: theme.description || '',
|
||||
},
|
||||
],
|
||||
link: [{ rel: 'icon', type: 'image/x-icon', href: '/media/favicon.ico' }],
|
||||
link: [
|
||||
{ rel: 'icon', type: 'image/x-icon', href: '/media/favicon.ico' },
|
||||
{
|
||||
rel: 'stylesheet',
|
||||
href: theme.awsm
|
||||
? `https://unpkg.com/awsm.css/dist/awsm_theme_${theme.awsm}.min.css`
|
||||
: 'https://unpkg.com/awsm.css/dist/awsm.min.css',
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
// Global CSS (https://go.nuxtjs.dev/config-css)
|
||||
@@ -47,6 +55,9 @@ const config = async (): Promise<NuxtConfig> => {
|
||||
|
||||
// Build Configuration (https://go.nuxtjs.dev/config-build)
|
||||
build: {},
|
||||
env: {
|
||||
THEME: JSON.stringify(theme),
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -9,14 +9,15 @@
|
||||
"generate": "nuxt-ts generate",
|
||||
"lint:js": "eslint --ext .ts,.js,.vue --ignore-path .gitignore .",
|
||||
"lint": "yarn lint:js",
|
||||
"ts": "ts-node -O '{\"module\":\"commonjs\"}'"
|
||||
"ts": "ts-node -O '{\"module\":\"commonjs\"}'",
|
||||
"ts:prepare": "yarn ts scripts/prepare.ts"
|
||||
},
|
||||
"dependencies": {
|
||||
"@types/express": "^4.17.9",
|
||||
"@types/js-yaml": "^3.12.5",
|
||||
"@nuxt/typescript-runtime": "^2.0.0",
|
||||
"@nuxtjs/axios": "^5.12.2",
|
||||
"@patarapolw/scope-css": "^1.3.0",
|
||||
"@types/express": "^4.17.9",
|
||||
"@types/js-yaml": "^3.12.5",
|
||||
"better-sqlite3": "^7.1.1",
|
||||
"cheerio": "^1.0.0-rc.3",
|
||||
"core-js": "^3.6.5",
|
||||
@@ -45,6 +46,7 @@
|
||||
"eslint-plugin-prettier": "^3.1.4",
|
||||
"import-sort-parser-typescript": "^6.0.0",
|
||||
"nodejieba": "^2.5.1",
|
||||
"nuxt-property-decorator": "^2.8.8",
|
||||
"prettier": "^2.1.2",
|
||||
"ts-node": "^9.1.1",
|
||||
"typescript": "4.0.5"
|
||||
|
||||
@@ -1,6 +0,0 @@
|
||||
# PAGES
|
||||
|
||||
This directory contains your Application Views and Routes.
|
||||
The framework reads all the `*.vue` files inside this directory and creates the router of your application.
|
||||
|
||||
More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/routing).
|
||||
@@ -1,8 +1,6 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<div>
|
||||
<Logo />
|
||||
<h1 class="title">zhdiary</h1>
|
||||
<div class="links">
|
||||
<a
|
||||
href="https://nuxtjs.org/"
|
||||
@@ -30,36 +28,3 @@ import Vue from 'vue'
|
||||
|
||||
export default Vue.extend({})
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.container {
|
||||
margin: 0 auto;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-family: 'Quicksand', 'Source Sans Pro', -apple-system, BlinkMacSystemFont,
|
||||
'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
||||
display: block;
|
||||
font-weight: 300;
|
||||
font-size: 100px;
|
||||
color: #35495e;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-weight: 300;
|
||||
font-size: 42px;
|
||||
color: #526488;
|
||||
word-spacing: 5px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.links {
|
||||
padding-top: 15px;
|
||||
}
|
||||
</style>
|
||||
@@ -22,4 +22,4 @@ export const builtPath = (...ps: string[]): string =>
|
||||
path.join(__dirname, '../built', ...ps)
|
||||
|
||||
export const dstMediaPath = (...ps: string[]): string =>
|
||||
path.join(__dirname, '../public/media', ...ps)
|
||||
path.join(__dirname, '../static/media', ...ps)
|
||||
@@ -5,6 +5,7 @@ const zMatter = z.object({
|
||||
date: z.date().optional(),
|
||||
createdAt: z.date().optional(),
|
||||
updatedAt: z.date().optional(),
|
||||
priority: z.number().optional(),
|
||||
title: z.string(),
|
||||
image: z.string().optional(),
|
||||
tag: z.array(z.string()).optional(),
|
||||
@@ -41,6 +42,7 @@ export class Database {
|
||||
[date] INT, -- epoch milli
|
||||
[createdAt] INT, -- epoch milli
|
||||
[updatedAt] INT, -- epoch milli
|
||||
priority INT,
|
||||
-- q.title
|
||||
[image] TEXT,
|
||||
-- q.tag.split(/ /g)
|
||||
@@ -53,6 +55,7 @@ export class Database {
|
||||
CREATE INDEX IF NOT EXISTS files_date ON files([date]);
|
||||
CREATE INDEX IF NOT EXISTS files_createdAt ON files(createdAt);
|
||||
CREATE INDEX IF NOT EXISTS files_updatedAt ON files(updatedAt);
|
||||
CREATE INDEX IF NOT EXISTS files_priority ON files(priority);
|
||||
`)
|
||||
|
||||
this.db.exec(/* sql */ `
|
||||
@@ -68,8 +71,8 @@ export class Database {
|
||||
|
||||
public insert(...ps: IPost[]): void {
|
||||
const fStmt = this.db.prepare(/* sql */ `
|
||||
INSERT INTO files ([path], [date], [createdAt], [updatedAt], [image], excerptHtml, contentHtml)
|
||||
VALUES (@path, @date, @createdAt, @updatedAt, @image, @excerptHtml, @contentHtml)
|
||||
INSERT INTO files ([path], [date], [createdAt], [updatedAt], priority, [image], excerptHtml, contentHtml)
|
||||
VALUES (@path, @date, @createdAt, @updatedAt, @priority, @image, @excerptHtml, @contentHtml)
|
||||
`)
|
||||
|
||||
const qStmt = this.db.prepare(/* sql */ `
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import fs from 'fs'
|
||||
import path from 'path'
|
||||
|
||||
import yaml from 'js-yaml'
|
||||
import * as z from 'zod'
|
||||
@@ -8,6 +9,7 @@ export const THEME_FILENAME = 'theme.yml'
|
||||
export const zTheme = z
|
||||
.object({
|
||||
title: z.string(),
|
||||
awsm: z.string().optional(),
|
||||
description: z.string().optional(),
|
||||
keywords: z.array(z.string()).optional(),
|
||||
nav: z
|
||||
@@ -50,6 +52,10 @@ export const zTheme = z
|
||||
})
|
||||
.nonstrict()
|
||||
|
||||
export type ITheme = z.infer<typeof zTheme>
|
||||
|
||||
export function getTheme() {
|
||||
return zTheme.parse(yaml.safeLoad(fs.readFileSync(THEME_FILENAME, 'utf-8')))
|
||||
return zTheme.parse(
|
||||
yaml.safeLoad(fs.readFileSync(path.join('built', THEME_FILENAME), 'utf-8'))
|
||||
)
|
||||
}
|
||||
@@ -1,11 +0,0 @@
|
||||
# STATIC
|
||||
|
||||
**This directory is not required, you can delete it if you don't want to use it.**
|
||||
|
||||
This directory contains your static files.
|
||||
Each file inside this directory is mapped to `/`.
|
||||
Thus you'd want to delete this README.md before deploying to production.
|
||||
|
||||
Example: `/static/robots.txt` is mapped as `/robots.txt`.
|
||||
|
||||
More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#static).
|
||||
@@ -6431,6 +6431,16 @@ number-is-nan@^1.0.0:
|
||||
resolved "https://registry.yarnpkg.com/number-is-nan/-/number-is-nan-1.0.1.tgz#097b602b53422a522c1afb8790318336941a011d"
|
||||
integrity sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=
|
||||
|
||||
nuxt-property-decorator@^2.8.8:
|
||||
version "2.8.8"
|
||||
resolved "https://registry.yarnpkg.com/nuxt-property-decorator/-/nuxt-property-decorator-2.8.8.tgz#a383fdaa9a94f79937a1add0218a6736ff1a8f25"
|
||||
integrity sha512-JdSbzZmiHk47ZSDZ1sF2iYTr13fVKUrtqj+e/APtRjkKhFNpmNpjlWycjKsDE+UxJQtDcNrmGKYWhwaP6hOXBg==
|
||||
dependencies:
|
||||
vue-class-component "^7.2.6"
|
||||
vue-property-decorator "^9.0.0"
|
||||
vuex-class "^0.3.2"
|
||||
vuex-module-decorators "^1.0.1"
|
||||
|
||||
nuxt@^2.14.6:
|
||||
version "2.14.11"
|
||||
resolved "https://registry.yarnpkg.com/nuxt/-/nuxt-2.14.11.tgz#f6895dd4a4bb8750a6844973c610f9741468dcc8"
|
||||
@@ -9299,6 +9309,11 @@ vm-browserify@^1.0.1:
|
||||
resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.2.tgz#78641c488b8e6ca91a75f511e7a3b32a86e5dda0"
|
||||
integrity sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==
|
||||
|
||||
vue-class-component@^7.2.6:
|
||||
version "7.2.6"
|
||||
resolved "https://registry.yarnpkg.com/vue-class-component/-/vue-class-component-7.2.6.tgz#8471e037b8e4762f5a464686e19e5afc708502e4"
|
||||
integrity sha512-+eaQXVrAm/LldalI272PpDe3+i4mPis0ORiMYxF6Ae4hyuCh15W8Idet7wPUEs4N4YptgFHGys4UrgNQOMyO6w==
|
||||
|
||||
vue-client-only@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/vue-client-only/-/vue-client-only-2.0.0.tgz#ddad8d675ee02c761a14229f0e440e219de1da1c"
|
||||
@@ -9344,6 +9359,11 @@ vue-no-ssr@^1.1.1:
|
||||
resolved "https://registry.yarnpkg.com/vue-no-ssr/-/vue-no-ssr-1.1.1.tgz#875f3be6fb0ae41568a837f3ac1a80eaa137b998"
|
||||
integrity sha512-ZMjqRpWabMPqPc7gIrG0Nw6vRf1+itwf0Itft7LbMXs2g3Zs/NFmevjZGN1x7K3Q95GmIjWbQZTVerxiBxI+0g==
|
||||
|
||||
vue-property-decorator@^9.0.0:
|
||||
version "9.1.2"
|
||||
resolved "https://registry.yarnpkg.com/vue-property-decorator/-/vue-property-decorator-9.1.2.tgz#266a2eac61ba6527e2e68a6933cfb98fddab5457"
|
||||
integrity sha512-xYA8MkZynPBGd/w5QFJ2d/NM0z/YeegMqYTphy7NJQXbZcuU6FC6AOdUAcy4SXP+YnkerC6AfH+ldg7PDk9ESQ==
|
||||
|
||||
vue-router@^3.4.9:
|
||||
version "3.4.9"
|
||||
resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-3.4.9.tgz#c016f42030ae2932f14e4748b39a1d9a0e250e66"
|
||||
@@ -9389,6 +9409,16 @@ vue@^2.6.12:
|
||||
resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.12.tgz#f5ebd4fa6bd2869403e29a896aed4904456c9123"
|
||||
integrity sha512-uhmLFETqPPNyuLLbsKz6ioJ4q7AZHzD8ZVFNATNyICSZouqP2Sz0rotWQC8UNBF6VGSCs5abnKJoStA6JbCbfg==
|
||||
|
||||
vuex-class@^0.3.2:
|
||||
version "0.3.2"
|
||||
resolved "https://registry.yarnpkg.com/vuex-class/-/vuex-class-0.3.2.tgz#c7e96a076c1682137d4d23a8dcfdc63f220e17a8"
|
||||
integrity sha512-m0w7/FMsNcwJgunJeM+wcNaHzK2KX1K1rw2WUQf7Q16ndXHo7pflRyOV/E8795JO/7fstyjH3EgqBI4h4n4qXQ==
|
||||
|
||||
vuex-module-decorators@^1.0.1:
|
||||
version "1.0.1"
|
||||
resolved "https://registry.yarnpkg.com/vuex-module-decorators/-/vuex-module-decorators-1.0.1.tgz#d34dafb5428a3636f1c26d3d014c15fc9659ccd0"
|
||||
integrity sha512-FLWZsXV5XAtl/bcKUyQFpnSBtpc3wK/7zSdy9oKbyp71mZd4ut5y2zSd219wWW9OG7WUOlVwac4rXFFDVnq7ug==
|
||||
|
||||
vuex@^3.6.0:
|
||||
version "3.6.0"
|
||||
resolved "https://registry.yarnpkg.com/vuex/-/vuex-3.6.0.tgz#95efa56a58f7607c135b053350833a09e01aa813"
|
||||
|
||||
Reference in new issue
Block a user