wip
This commit is contained in:
Xeltica
commit
326384957c
22 changed files with 4176 additions and 0 deletions
36
.eslintrc.js
Normal file
36
.eslintrc.js
Normal file
|
|
@ -0,0 +1,36 @@
|
||||||
|
module.exports = {
|
||||||
|
'env': {
|
||||||
|
'browser': true,
|
||||||
|
'es2020': true
|
||||||
|
},
|
||||||
|
'extends': [
|
||||||
|
'eslint:recommended',
|
||||||
|
'plugin:@typescript-eslint/recommended'
|
||||||
|
],
|
||||||
|
'parser': '@typescript-eslint/parser',
|
||||||
|
'parserOptions': {
|
||||||
|
'ecmaVersion': 11,
|
||||||
|
'sourceType': 'module'
|
||||||
|
},
|
||||||
|
'plugins': [
|
||||||
|
'@typescript-eslint'
|
||||||
|
],
|
||||||
|
'rules': {
|
||||||
|
'indent': [
|
||||||
|
'error',
|
||||||
|
'tab'
|
||||||
|
],
|
||||||
|
'linebreak-style': [
|
||||||
|
'error',
|
||||||
|
'unix'
|
||||||
|
],
|
||||||
|
'quotes': [
|
||||||
|
'error',
|
||||||
|
'single'
|
||||||
|
],
|
||||||
|
'semi': [
|
||||||
|
'error',
|
||||||
|
'always'
|
||||||
|
]
|
||||||
|
}
|
||||||
|
};
|
||||||
4
.gitignore
vendored
Normal file
4
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,4 @@
|
||||||
|
node_modules
|
||||||
|
built
|
||||||
|
yarn-error.log
|
||||||
|
config.json
|
||||||
15
LICENSE
Normal file
15
LICENSE
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
Misshaialert
|
||||||
|
Copyright (C) 2020 Xeltica
|
||||||
|
|
||||||
|
This program is free software: you can redistribute it and/or modify
|
||||||
|
it under the terms of the GNU Affero General Public License as
|
||||||
|
published by the Free Software Foundation, either version 3 of the
|
||||||
|
License, or (at your option) any later version.
|
||||||
|
|
||||||
|
This program is distributed in the hope that it will be useful,
|
||||||
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||||
|
GNU Affero General Public License for more details.
|
||||||
|
|
||||||
|
You should have received a copy of the GNU Affero General Public License
|
||||||
|
along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||||
24
README.md
Normal file
24
README.md
Normal file
|
|
@ -0,0 +1,24 @@
|
||||||
|
# みす廃あらーと
|
||||||
|
|
||||||
|
みす廃あらーとは、Misskeyでのノート、フォロー、フォロワーの数および前日比を毎日0時にノートするサービスです。
|
||||||
|
|
||||||
|
|
||||||
|
## build
|
||||||
|
|
||||||
|
```
|
||||||
|
# 依存関係の解決
|
||||||
|
yarn install
|
||||||
|
|
||||||
|
# アプリケーションのビルド
|
||||||
|
yarn build
|
||||||
|
|
||||||
|
# 実行
|
||||||
|
yarn start
|
||||||
|
|
||||||
|
# デバッグ用に起動
|
||||||
|
yarn watch
|
||||||
|
```
|
||||||
|
|
||||||
|
## LICENSE
|
||||||
|
|
||||||
|
[AGPL 3.0](LICENSE)
|
||||||
4
config.example.json
Normal file
4
config.example.json
Normal file
|
|
@ -0,0 +1,4 @@
|
||||||
|
{
|
||||||
|
"port": 4000,
|
||||||
|
"url": "https://misshaialert.com"
|
||||||
|
}
|
||||||
5
nodemon.json
Normal file
5
nodemon.json
Normal file
|
|
@ -0,0 +1,5 @@
|
||||||
|
{
|
||||||
|
"watch": ["src", ["styles"]],
|
||||||
|
"ext": "ts,pug,scss",
|
||||||
|
"exec": "run-s build start"
|
||||||
|
}
|
||||||
55
package.json
Normal file
55
package.json
Normal file
|
|
@ -0,0 +1,55 @@
|
||||||
|
{
|
||||||
|
"name": "misshaialert",
|
||||||
|
"version": "1.0.0-alpha.1",
|
||||||
|
"description": "",
|
||||||
|
"main": "built/app.js",
|
||||||
|
"author": "Xeltica",
|
||||||
|
"private": true,
|
||||||
|
"scripts": {
|
||||||
|
"tsc": "tsc",
|
||||||
|
"start": "node built/app.js",
|
||||||
|
"lint": "eslint src/index.ts",
|
||||||
|
"lint:fix": "eslint --fix src/index.ts",
|
||||||
|
"build:views": "copyfiles -u 1 src/views/*.pug ./built/",
|
||||||
|
"clean": "rimraf built",
|
||||||
|
"build:scripts": "tsc",
|
||||||
|
"build:styles": "sass styles/:built/assets",
|
||||||
|
"build": "run-p build:*",
|
||||||
|
"watch": "nodemon"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@types/koa-bodyparser": "^4.3.0",
|
||||||
|
"@types/koa-mount": "^4.0.0",
|
||||||
|
"@types/koa-static": "^4.0.1",
|
||||||
|
"@types/uuid": "^8.0.0",
|
||||||
|
"axios": "^0.19.2",
|
||||||
|
"koa": "^2.13.0",
|
||||||
|
"koa-bodyparser": "^4.3.0",
|
||||||
|
"koa-mount": "^4.0.0",
|
||||||
|
"koa-router": "^9.1.0",
|
||||||
|
"koa-session": "^6.0.0",
|
||||||
|
"koa-static": "^5.0.0",
|
||||||
|
"koa-views": "^6.3.0",
|
||||||
|
"pug": "^3.0.0",
|
||||||
|
"sass": "^1.26.10",
|
||||||
|
"typescript": "^3.9.7",
|
||||||
|
"uuid": "^8.3.0"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@types/axios": "^0.14.0",
|
||||||
|
"@types/koa": "^2.11.3",
|
||||||
|
"@types/koa-router": "^7.4.1",
|
||||||
|
"@types/koa-session": "^5.10.2",
|
||||||
|
"@types/koa-views": "^2.0.4",
|
||||||
|
"@typescript-eslint/eslint-plugin": "^3.7.0",
|
||||||
|
"@typescript-eslint/parser": "^3.7.0",
|
||||||
|
"copyfiles": "^2.3.0",
|
||||||
|
"eslint": "^7.5.0",
|
||||||
|
"eslint-config-prettier": "^6.11.0",
|
||||||
|
"eslint-plugin-prettier": "^3.1.4",
|
||||||
|
"nodemon": "^2.0.4",
|
||||||
|
"npm-run-all": "^4.1.5",
|
||||||
|
"prettier": "^2.0.5",
|
||||||
|
"rimraf": "^3.0.2"
|
||||||
|
}
|
||||||
|
}
|
||||||
24
src/app.ts
Normal file
24
src/app.ts
Normal file
|
|
@ -0,0 +1,24 @@
|
||||||
|
import Koa from 'koa';
|
||||||
|
import bodyParser from 'koa-bodyparser';
|
||||||
|
|
||||||
|
import { router } from './router';
|
||||||
|
import constant from './const';
|
||||||
|
import { render } from './render';
|
||||||
|
import serve from 'koa-static';
|
||||||
|
import mount from 'koa-mount';
|
||||||
|
import { config } from './config';
|
||||||
|
|
||||||
|
const app = new Koa();
|
||||||
|
|
||||||
|
console.log('Misshaialert v' + constant.version);
|
||||||
|
|
||||||
|
app.use(bodyParser());
|
||||||
|
app.use(render);
|
||||||
|
app.use(mount('/assets', serve(__dirname + '/assets')));
|
||||||
|
app.use(router.routes());
|
||||||
|
|
||||||
|
console.log(`listening port ${config.port}...`);
|
||||||
|
|
||||||
|
console.log('App launched!');
|
||||||
|
|
||||||
|
app.listen(config.port || 3000);
|
||||||
3
src/config.ts
Normal file
3
src/config.ts
Normal file
|
|
@ -0,0 +1,3 @@
|
||||||
|
import fs from 'fs';
|
||||||
|
|
||||||
|
export const config = Object.freeze(JSON.parse(fs.readFileSync(__dirname + '/../config.json', 'utf-8')));
|
||||||
6
src/const.ts
Normal file
6
src/const.ts
Normal file
|
|
@ -0,0 +1,6 @@
|
||||||
|
export default {
|
||||||
|
version: '1.0.0-alpha.1',
|
||||||
|
changelog: [
|
||||||
|
'初版'
|
||||||
|
],
|
||||||
|
};
|
||||||
6
src/die.ts
Normal file
6
src/die.ts
Normal file
|
|
@ -0,0 +1,6 @@
|
||||||
|
import { Context } from 'koa';
|
||||||
|
|
||||||
|
export const die = (ctx: Context, error: string): Promise<void> => {
|
||||||
|
ctx.status = 400;
|
||||||
|
return ctx.render('error', { error });
|
||||||
|
};
|
||||||
10
src/render.ts
Normal file
10
src/render.ts
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
import views from 'koa-views';
|
||||||
|
|
||||||
|
|
||||||
|
import constant from './const';
|
||||||
|
|
||||||
|
export const render = views(__dirname + '/views', {
|
||||||
|
extension: 'pug', options: {
|
||||||
|
...constant,
|
||||||
|
}
|
||||||
|
});
|
||||||
58
src/router.ts
Normal file
58
src/router.ts
Normal file
|
|
@ -0,0 +1,58 @@
|
||||||
|
import { Context, DefaultState } from 'koa';
|
||||||
|
import Router from 'koa-router';
|
||||||
|
import { die } from './die';
|
||||||
|
import { v4 as uuid } from 'uuid';
|
||||||
|
import { config } from './config';
|
||||||
|
import axios from 'axios';
|
||||||
|
|
||||||
|
export const router = new Router<DefaultState, Context>();
|
||||||
|
|
||||||
|
export const sessionHostCache: Record<string, string> = { };
|
||||||
|
|
||||||
|
router.get('/', async ctx => {
|
||||||
|
await ctx.render('index');
|
||||||
|
});
|
||||||
|
|
||||||
|
router.get('/login', async ctx => {
|
||||||
|
const host = ctx.query.host as string | undefined;
|
||||||
|
if (!host) {
|
||||||
|
await die(ctx, 'ホストを空欄にしてはいけない');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const session = uuid();
|
||||||
|
const name = encodeURI('みす廃あらーと');
|
||||||
|
const permission = encodeURI('write:notes');
|
||||||
|
const callback = encodeURI(`${config.url}/miauth`);
|
||||||
|
const url = `https://${host}/miauth/${session}?name=${name}&callback=${callback}&permission=${permission}`;
|
||||||
|
sessionHostCache[session] = host;
|
||||||
|
|
||||||
|
ctx.redirect(url);
|
||||||
|
});
|
||||||
|
|
||||||
|
router.get('/miauth', async ctx => {
|
||||||
|
const session = ctx.query.session as string | undefined;
|
||||||
|
if (!session) {
|
||||||
|
await die(ctx, 'セッションが見つからなかった');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const host = sessionHostCache[session];
|
||||||
|
if (!host) {
|
||||||
|
await die(ctx, '問題が発生しました。お手数ですが、最初からやり直してください。');
|
||||||
|
}
|
||||||
|
const url = `https://${host}/api/miauth/${session}/check`;
|
||||||
|
const { token, user } = (await axios.post(url)).data;
|
||||||
|
|
||||||
|
ctx.body = { ok: true, user };
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
router.get('/legacy-auth', async ctx => {
|
||||||
|
await die(ctx, 'coming soon');
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
// Return 404 for other pages
|
||||||
|
router.all('(.*)', async ctx => {
|
||||||
|
ctx.status = 404;
|
||||||
|
await die(ctx, 'ページが見つかりませんでした');
|
||||||
|
});
|
||||||
28
src/views/_base.pug
Normal file
28
src/views/_base.pug
Normal file
|
|
@ -0,0 +1,28 @@
|
||||||
|
include _components
|
||||||
|
doctype html
|
||||||
|
html
|
||||||
|
head
|
||||||
|
meta(charset="UTF-8")
|
||||||
|
link(href='https://unpkg.com/sanitize.css' rel='stylesheet')
|
||||||
|
meta(name="viewport", content="width=device-width, initial-scale=1.0")
|
||||||
|
block meta
|
||||||
|
title= title
|
||||||
|
link(rel='stylesheet' href='/assets/style.css')
|
||||||
|
block style
|
||||||
|
body
|
||||||
|
.xd-main
|
||||||
|
h1 みす廃あらーと
|
||||||
|
block content
|
||||||
|
footer.xd-footer.xd-container
|
||||||
|
a(href="/privacy-policy") プライバシーポリシー
|
||||||
|
| ・
|
||||||
|
a(href="/terms") 利用規約
|
||||||
|
| ・
|
||||||
|
a(href="https://github.com/Xeltica/misshaialert") リポジトリ
|
||||||
|
p (C)2020 Xeltica -
|
||||||
|
a(href="/about") version #{version}
|
||||||
|
block footer
|
||||||
|
block script
|
||||||
|
script(defer src='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/js/all.min.js')
|
||||||
|
|
||||||
|
|
||||||
0
src/views/_components.pug
Normal file
0
src/views/_components.pug
Normal file
7
src/views/error.pug
Normal file
7
src/views/error.pug
Normal file
|
|
@ -0,0 +1,7 @@
|
||||||
|
extends _base
|
||||||
|
|
||||||
|
block content
|
||||||
|
section
|
||||||
|
h2 エラー
|
||||||
|
p= error
|
||||||
|
a(href="/") トップに戻る
|
||||||
53
src/views/index.pug
Normal file
53
src/views/index.pug
Normal file
|
|
@ -0,0 +1,53 @@
|
||||||
|
extends _base
|
||||||
|
|
||||||
|
block content
|
||||||
|
section
|
||||||
|
h2 ついついノートしすぎていませんか？
|
||||||
|
p Misskey は楽しいものです。気がついたら1日中入り浸っていることも多いでしょう。
|
||||||
|
p
|
||||||
|
strong みす廃あらーと
|
||||||
|
| をあなたの Misskey アカウントにインストールして、今日のあなたの Misskey 活動を把握しましょう。
|
||||||
|
form(action="/login", method="get")
|
||||||
|
.xd-inputs
|
||||||
|
input.xd-input(type="text" placeholder="ホスト名(例: misskey.io)" name="host" required)
|
||||||
|
input.xd-button.primary(type="submit", value="ログイン")
|
||||||
|
p Misskey 以外のソフトウェアには対応していません。マストドンユーザーは
|
||||||
|
a(href="https://donhaialert.herokuapp.com/" target="_blank" rel="noopener noreferrer") ドン廃あらーと
|
||||||
|
| をお使いください。
|
||||||
|
|
||||||
|
section
|
||||||
|
.xd-cards.center
|
||||||
|
.xd-card
|
||||||
|
.header
|
||||||
|
h1.title
|
||||||
|
i.fas.fa-info-circle
|
||||||
|
| 情報
|
||||||
|
.body
|
||||||
|
dl
|
||||||
|
dt
|
||||||
|
i.fas.fa-users
|
||||||
|
| 登録者数
|
||||||
|
dd 0 人
|
||||||
|
dt
|
||||||
|
i.fas.fa-comment
|
||||||
|
| 累計ノート数
|
||||||
|
dd 0 ノート
|
||||||
|
.xd-card
|
||||||
|
.header
|
||||||
|
h1.title
|
||||||
|
i.fas.fa-phone-alt
|
||||||
|
| 開発者
|
||||||
|
.body
|
||||||
|
p 何か困ったことがあったら、以下のアカウントにメッセージを送ってください。
|
||||||
|
ul
|
||||||
|
li: a(href="https://misskey.io/@ebi") @ebi@misskey.io
|
||||||
|
li: a(href="https://groundpolis.app/@X") @X@groundpolis.app
|
||||||
|
li: a(href="https://twitter.com/Xeltica") @Xeltica@twitter.com
|
||||||
|
li: a(href="mailto:xeltica@gmail.com") xeltica@gmail.com
|
||||||
|
.xd-card
|
||||||
|
.header
|
||||||
|
h1.title
|
||||||
|
i.fas.fa-hashtag
|
||||||
|
| タイムライン
|
||||||
|
.body
|
||||||
|
p 準備中。
|
||||||
300
styles/_colors.scss
Normal file
300
styles/_colors.scss
Normal file
|
|
@ -0,0 +1,300 @@
|
||||||
|
/*
|
||||||
|
https://github.com/shuhei/material-colors
|
||||||
|
ISC License
|
||||||
|
Copyright 2014 Shuhei Kagawa
|
||||||
|
Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies.
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
$md-red-50: #ffebee;
|
||||||
|
$md-red-100: #ffcdd2;
|
||||||
|
$md-red-200: #ef9a9a;
|
||||||
|
$md-red-300: #e57373;
|
||||||
|
$md-red-400: #ef5350;
|
||||||
|
$md-red-500: #f44336;
|
||||||
|
$md-red-600: #e53935;
|
||||||
|
$md-red-700: #d32f2f;
|
||||||
|
$md-red-800: #c62828;
|
||||||
|
$md-red-900: #b71c1c;
|
||||||
|
$md-red-a100: #ff8a80;
|
||||||
|
$md-red-a200: #ff5252;
|
||||||
|
$md-red-a400: #ff1744;
|
||||||
|
$md-red-a700: #d50000;
|
||||||
|
|
||||||
|
$md-pink-50: #fce4ec;
|
||||||
|
$md-pink-100: #f8bbd0;
|
||||||
|
$md-pink-200: #f48fb1;
|
||||||
|
$md-pink-300: #f06292;
|
||||||
|
$md-pink-400: #ec407a;
|
||||||
|
$md-pink-500: #e91e63;
|
||||||
|
$md-pink-600: #d81b60;
|
||||||
|
$md-pink-700: #c2185b;
|
||||||
|
$md-pink-800: #ad1457;
|
||||||
|
$md-pink-900: #880e4f;
|
||||||
|
$md-pink-a100: #ff80ab;
|
||||||
|
$md-pink-a200: #ff4081;
|
||||||
|
$md-pink-a400: #f50057;
|
||||||
|
$md-pink-a700: #c51162;
|
||||||
|
|
||||||
|
$md-purple-50: #f3e5f5;
|
||||||
|
$md-purple-100: #e1bee7;
|
||||||
|
$md-purple-200: #ce93d8;
|
||||||
|
$md-purple-300: #ba68c8;
|
||||||
|
$md-purple-400: #ab47bc;
|
||||||
|
$md-purple-500: #9c27b0;
|
||||||
|
$md-purple-600: #8e24aa;
|
||||||
|
$md-purple-700: #7b1fa2;
|
||||||
|
$md-purple-800: #6a1b9a;
|
||||||
|
$md-purple-900: #4a148c;
|
||||||
|
$md-purple-a100: #ea80fc;
|
||||||
|
$md-purple-a200: #e040fb;
|
||||||
|
$md-purple-a400: #d500f9;
|
||||||
|
$md-purple-a700: #aa00ff;
|
||||||
|
|
||||||
|
$md-deep-purple-50: #ede7f6;
|
||||||
|
$md-deep-purple-100: #d1c4e9;
|
||||||
|
$md-deep-purple-200: #b39ddb;
|
||||||
|
$md-deep-purple-300: #9575cd;
|
||||||
|
$md-deep-purple-400: #7e57c2;
|
||||||
|
$md-deep-purple-500: #673ab7;
|
||||||
|
$md-deep-purple-600: #5e35b1;
|
||||||
|
$md-deep-purple-700: #512da8;
|
||||||
|
$md-deep-purple-800: #4527a0;
|
||||||
|
$md-deep-purple-900: #311b92;
|
||||||
|
$md-deep-purple-a100: #b388ff;
|
||||||
|
$md-deep-purple-a200: #7c4dff;
|
||||||
|
$md-deep-purple-a400: #651fff;
|
||||||
|
$md-deep-purple-a700: #6200ea;
|
||||||
|
|
||||||
|
$md-indigo-50: #e8eaf6;
|
||||||
|
$md-indigo-100: #c5cae9;
|
||||||
|
$md-indigo-200: #9fa8da;
|
||||||
|
$md-indigo-300: #7986cb;
|
||||||
|
$md-indigo-400: #5c6bc0;
|
||||||
|
$md-indigo-500: #3f51b5;
|
||||||
|
$md-indigo-600: #3949ab;
|
||||||
|
$md-indigo-700: #303f9f;
|
||||||
|
$md-indigo-800: #283593;
|
||||||
|
$md-indigo-900: #1a237e;
|
||||||
|
$md-indigo-a100: #8c9eff;
|
||||||
|
$md-indigo-a200: #536dfe;
|
||||||
|
$md-indigo-a400: #3d5afe;
|
||||||
|
$md-indigo-a700: #304ffe;
|
||||||
|
|
||||||
|
$md-blue-50: #e3f2fd;
|
||||||
|
$md-blue-100: #bbdefb;
|
||||||
|
$md-blue-200: #90caf9;
|
||||||
|
$md-blue-300: #64b5f6;
|
||||||
|
$md-blue-400: #42a5f5;
|
||||||
|
$md-blue-500: #2196f3;
|
||||||
|
$md-blue-600: #1e88e5;
|
||||||
|
$md-blue-700: #1976d2;
|
||||||
|
$md-blue-800: #1565c0;
|
||||||
|
$md-blue-900: #0d47a1;
|
||||||
|
$md-blue-a100: #82b1ff;
|
||||||
|
$md-blue-a200: #448aff;
|
||||||
|
$md-blue-a400: #2979ff;
|
||||||
|
$md-blue-a700: #2962ff;
|
||||||
|
|
||||||
|
$md-light-blue-50: #e1f5fe;
|
||||||
|
$md-light-blue-100: #b3e5fc;
|
||||||
|
$md-light-blue-200: #81d4fa;
|
||||||
|
$md-light-blue-300: #4fc3f7;
|
||||||
|
$md-light-blue-400: #29b6f6;
|
||||||
|
$md-light-blue-500: #03a9f4;
|
||||||
|
$md-light-blue-600: #039be5;
|
||||||
|
$md-light-blue-700: #0288d1;
|
||||||
|
$md-light-blue-800: #0277bd;
|
||||||
|
$md-light-blue-900: #01579b;
|
||||||
|
$md-light-blue-a100: #80d8ff;
|
||||||
|
$md-light-blue-a200: #40c4ff;
|
||||||
|
$md-light-blue-a400: #00b0ff;
|
||||||
|
$md-light-blue-a700: #0091ea;
|
||||||
|
|
||||||
|
$md-cyan-50: #e0f7fa;
|
||||||
|
$md-cyan-100: #b2ebf2;
|
||||||
|
$md-cyan-200: #80deea;
|
||||||
|
$md-cyan-300: #4dd0e1;
|
||||||
|
$md-cyan-400: #26c6da;
|
||||||
|
$md-cyan-500: #00bcd4;
|
||||||
|
$md-cyan-600: #00acc1;
|
||||||
|
$md-cyan-700: #0097a7;
|
||||||
|
$md-cyan-800: #00838f;
|
||||||
|
$md-cyan-900: #006064;
|
||||||
|
$md-cyan-a100: #84ffff;
|
||||||
|
$md-cyan-a200: #18ffff;
|
||||||
|
$md-cyan-a400: #00e5ff;
|
||||||
|
$md-cyan-a700: #00b8d4;
|
||||||
|
|
||||||
|
$md-teal-50: #e0f2f1;
|
||||||
|
$md-teal-100: #b2dfdb;
|
||||||
|
$md-teal-200: #80cbc4;
|
||||||
|
$md-teal-300: #4db6ac;
|
||||||
|
$md-teal-400: #26a69a;
|
||||||
|
$md-teal-500: #009688;
|
||||||
|
$md-teal-600: #00897b;
|
||||||
|
$md-teal-700: #00796b;
|
||||||
|
$md-teal-800: #00695c;
|
||||||
|
$md-teal-900: #004d40;
|
||||||
|
$md-teal-a100: #a7ffeb;
|
||||||
|
$md-teal-a200: #64ffda;
|
||||||
|
$md-teal-a400: #1de9b6;
|
||||||
|
$md-teal-a700: #00bfa5;
|
||||||
|
|
||||||
|
$md-green-50: #e8f5e9;
|
||||||
|
$md-green-100: #c8e6c9;
|
||||||
|
$md-green-200: #a5d6a7;
|
||||||
|
$md-green-300: #81c784;
|
||||||
|
$md-green-400: #66bb6a;
|
||||||
|
$md-green-500: #4caf50;
|
||||||
|
$md-green-600: #43a047;
|
||||||
|
$md-green-700: #388e3c;
|
||||||
|
$md-green-800: #2e7d32;
|
||||||
|
$md-green-900: #1b5e20;
|
||||||
|
$md-green-a100: #b9f6ca;
|
||||||
|
$md-green-a200: #69f0ae;
|
||||||
|
$md-green-a400: #00e676;
|
||||||
|
$md-green-a700: #00c853;
|
||||||
|
|
||||||
|
$md-light-green-50: #f1f8e9;
|
||||||
|
$md-light-green-100: #dcedc8;
|
||||||
|
$md-light-green-200: #c5e1a5;
|
||||||
|
$md-light-green-300: #aed581;
|
||||||
|
$md-light-green-400: #9ccc65;
|
||||||
|
$md-light-green-500: #8bc34a;
|
||||||
|
$md-light-green-600: #7cb342;
|
||||||
|
$md-light-green-700: #689f38;
|
||||||
|
$md-light-green-800: #558b2f;
|
||||||
|
$md-light-green-900: #33691e;
|
||||||
|
$md-light-green-a100: #ccff90;
|
||||||
|
$md-light-green-a200: #b2ff59;
|
||||||
|
$md-light-green-a400: #76ff03;
|
||||||
|
$md-light-green-a700: #64dd17;
|
||||||
|
|
||||||
|
$md-lime-50: #f9fbe7;
|
||||||
|
$md-lime-100: #f0f4c3;
|
||||||
|
$md-lime-200: #e6ee9c;
|
||||||
|
$md-lime-300: #dce775;
|
||||||
|
$md-lime-400: #d4e157;
|
||||||
|
$md-lime-500: #cddc39;
|
||||||
|
$md-lime-600: #c0ca33;
|
||||||
|
$md-lime-700: #afb42b;
|
||||||
|
$md-lime-800: #9e9d24;
|
||||||
|
$md-lime-900: #827717;
|
||||||
|
$md-lime-a100: #f4ff81;
|
||||||
|
$md-lime-a200: #eeff41;
|
||||||
|
$md-lime-a400: #c6ff00;
|
||||||
|
$md-lime-a700: #aeea00;
|
||||||
|
|
||||||
|
$md-yellow-50: #fffde7;
|
||||||
|
$md-yellow-100: #fff9c4;
|
||||||
|
$md-yellow-200: #fff59d;
|
||||||
|
$md-yellow-300: #fff176;
|
||||||
|
$md-yellow-400: #ffee58;
|
||||||
|
$md-yellow-500: #ffeb3b;
|
||||||
|
$md-yellow-600: #fdd835;
|
||||||
|
$md-yellow-700: #fbc02d;
|
||||||
|
$md-yellow-800: #f9a825;
|
||||||
|
$md-yellow-900: #f57f17;
|
||||||
|
$md-yellow-a100: #ffff8d;
|
||||||
|
$md-yellow-a200: #ffff00;
|
||||||
|
$md-yellow-a400: #ffea00;
|
||||||
|
$md-yellow-a700: #ffd600;
|
||||||
|
|
||||||
|
$md-amber-50: #fff8e1;
|
||||||
|
$md-amber-100: #ffecb3;
|
||||||
|
$md-amber-200: #ffe082;
|
||||||
|
$md-amber-300: #ffd54f;
|
||||||
|
$md-amber-400: #ffca28;
|
||||||
|
$md-amber-500: #ffc107;
|
||||||
|
$md-amber-600: #ffb300;
|
||||||
|
$md-amber-700: #ffa000;
|
||||||
|
$md-amber-800: #ff8f00;
|
||||||
|
$md-amber-900: #ff6f00;
|
||||||
|
$md-amber-a100: #ffe57f;
|
||||||
|
$md-amber-a200: #ffd740;
|
||||||
|
$md-amber-a400: #ffc400;
|
||||||
|
$md-amber-a700: #ffab00;
|
||||||
|
|
||||||
|
$md-orange-50: #fff3e0;
|
||||||
|
$md-orange-100: #ffe0b2;
|
||||||
|
$md-orange-200: #ffcc80;
|
||||||
|
$md-orange-300: #ffb74d;
|
||||||
|
$md-orange-400: #ffa726;
|
||||||
|
$md-orange-500: #ff9800;
|
||||||
|
$md-orange-600: #fb8c00;
|
||||||
|
$md-orange-700: #f57c00;
|
||||||
|
$md-orange-800: #ef6c00;
|
||||||
|
$md-orange-900: #e65100;
|
||||||
|
$md-orange-a100: #ffd180;
|
||||||
|
$md-orange-a200: #ffab40;
|
||||||
|
$md-orange-a400: #ff9100;
|
||||||
|
$md-orange-a700: #ff6d00;
|
||||||
|
|
||||||
|
$md-deep-orange-50: #fbe9e7;
|
||||||
|
$md-deep-orange-100: #ffccbc;
|
||||||
|
$md-deep-orange-200: #ffab91;
|
||||||
|
$md-deep-orange-300: #ff8a65;
|
||||||
|
$md-deep-orange-400: #ff7043;
|
||||||
|
$md-deep-orange-500: #ff5722;
|
||||||
|
$md-deep-orange-600: #f4511e;
|
||||||
|
$md-deep-orange-700: #e64a19;
|
||||||
|
$md-deep-orange-800: #d84315;
|
||||||
|
$md-deep-orange-900: #bf360c;
|
||||||
|
$md-deep-orange-a100: #ff9e80;
|
||||||
|
$md-deep-orange-a200: #ff6e40;
|
||||||
|
$md-deep-orange-a400: #ff3d00;
|
||||||
|
$md-deep-orange-a700: #dd2c00;
|
||||||
|
|
||||||
|
$md-brown-50: #efebe9;
|
||||||
|
$md-brown-100: #d7ccc8;
|
||||||
|
$md-brown-200: #bcaaa4;
|
||||||
|
$md-brown-300: #a1887f;
|
||||||
|
$md-brown-400: #8d6e63;
|
||||||
|
$md-brown-500: #795548;
|
||||||
|
$md-brown-600: #6d4c41;
|
||||||
|
$md-brown-700: #5d4037;
|
||||||
|
$md-brown-800: #4e342e;
|
||||||
|
$md-brown-900: #3e2723;
|
||||||
|
|
||||||
|
$md-grey-50: #fafafa;
|
||||||
|
$md-grey-100: #f5f5f5;
|
||||||
|
$md-grey-200: #eeeeee;
|
||||||
|
$md-grey-300: #e0e0e0;
|
||||||
|
$md-grey-400: #bdbdbd;
|
||||||
|
$md-grey-500: #9e9e9e;
|
||||||
|
$md-grey-600: #757575;
|
||||||
|
$md-grey-700: #616161;
|
||||||
|
$md-grey-800: #424242;
|
||||||
|
$md-grey-900: #212121;
|
||||||
|
|
||||||
|
$md-blue-grey-50: #eceff1;
|
||||||
|
$md-blue-grey-100: #cfd8dc;
|
||||||
|
$md-blue-grey-200: #b0bec5;
|
||||||
|
$md-blue-grey-300: #90a4ae;
|
||||||
|
$md-blue-grey-400: #78909c;
|
||||||
|
$md-blue-grey-500: #607d8b;
|
||||||
|
$md-blue-grey-600: #546e7a;
|
||||||
|
$md-blue-grey-700: #455a64;
|
||||||
|
$md-blue-grey-800: #37474f;
|
||||||
|
$md-blue-grey-900: #263238;
|
||||||
|
|
||||||
|
$md-black: #000000;
|
||||||
|
|
||||||
|
$md-white: #ffffff;
|
||||||
|
|
||||||
|
$md-dark-text-primary: rgba(0, 0, 0, 0.87);
|
||||||
|
$md-dark-text-secondary: rgba(0, 0, 0, 0.54);
|
||||||
|
$md-dark-text-disabled: rgba(0, 0, 0, 0.38);
|
||||||
|
$md-dark-text-dividers: rgba(0, 0, 0, 0.12);
|
||||||
|
|
||||||
|
$md-light-text-primary: rgba(255, 255, 255, 1);
|
||||||
|
$md-light-text-secondary: rgba(255, 255, 255, 0.7);
|
||||||
|
$md-light-text-disabled: rgba(255, 255, 255, 0.5);
|
||||||
|
$md-light-text-dividers: rgba(255, 255, 255, 0.12);
|
||||||
|
|
||||||
|
$md-dark-icons-active: rgba(0, 0, 0, 0.54);
|
||||||
|
$md-dark-icons-inactive: rgba(0, 0, 0, 0.38);
|
||||||
|
|
||||||
|
$md-light-icons-active: rgba(255, 255, 255, 1);
|
||||||
|
$md-light-icons-inactive: rgba(255, 255, 255, 0.5);
|
||||||
388
styles/_xeltica-design.scss
Normal file
388
styles/_xeltica-design.scss
Normal file
|
|
@ -0,0 +1,388 @@
|
||||||
|
@import '_colors';
|
||||||
|
|
||||||
|
/*
|
||||||
|
Xeltica Design CSS Framework
|
||||||
|
(C)2020 Xeltica
|
||||||
|
*/
|
||||||
|
|
||||||
|
$primary: rgb(134, 179, 0);
|
||||||
|
$primary-light: lighten($primary, 5%);
|
||||||
|
$primary-dark: darken($primary, 5%);
|
||||||
|
$primary-fg: $md-white;
|
||||||
|
$bg: $md-white;
|
||||||
|
$bg-pale-1: darken($bg, 5%);
|
||||||
|
$bg-pale-2: darken($bg-pale-1, 5%);
|
||||||
|
$fg: $md-black;
|
||||||
|
$card-bg: $bg;
|
||||||
|
$card-header: $bg-pale-1;
|
||||||
|
$card-footer: $bg-pale-1;
|
||||||
|
$card-fg: $fg;
|
||||||
|
$divider: rgba($fg, 0.25);
|
||||||
|
$barSize: 64px;
|
||||||
|
|
||||||
|
* {
|
||||||
|
box-sizing: border-box;
|
||||||
|
line-height: 1.8em;
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
font-size: 18px;
|
||||||
|
@media screen and (max-width: 640px) {
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
background: $bg;
|
||||||
|
font-family: 'Noto Sans JP', sans-serif;
|
||||||
|
color: $fg;
|
||||||
|
}
|
||||||
|
|
||||||
|
section:not(:last-child) {
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
font-weight: normal;
|
||||||
|
margin: 0;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
dl {
|
||||||
|
margin: 0;
|
||||||
|
> dt {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
> dd {
|
||||||
|
margin-left: 2rem;
|
||||||
|
@media screen and (max-width: 640px) {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 { font-size: 2.5rem; }
|
||||||
|
h2 { font-size: 1.6rem; }
|
||||||
|
h3 { font-size: 1.4rem; }
|
||||||
|
h4 { font-size: 1.2rem; }
|
||||||
|
h5 { font-size: 1.1rem; }
|
||||||
|
h6 { font-size: 1.05rem; }
|
||||||
|
|
||||||
|
input.xd-input {
|
||||||
|
outline: none;
|
||||||
|
border-radius: 2px;
|
||||||
|
color: $fg;
|
||||||
|
background: transparent;
|
||||||
|
border: 1px solid $fg;
|
||||||
|
padding: 2px 8px;
|
||||||
|
font-size: 1rem;
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
border-color: $primary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin: 1em 0;
|
||||||
|
&:first-child {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-inputs {
|
||||||
|
display: flex;
|
||||||
|
> *:not(:first-child) {
|
||||||
|
border-left: none;
|
||||||
|
border-top-left-radius: 0;
|
||||||
|
border-bottom-left-radius: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
> *:not(:last-child) {
|
||||||
|
border-top-right-radius: 0;
|
||||||
|
border-bottom-right-radius: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-main {
|
||||||
|
background: $bg;
|
||||||
|
padding: 32px;
|
||||||
|
border-radius: 2px;
|
||||||
|
border: 1px solid $divider;
|
||||||
|
max-width: 960px;
|
||||||
|
margin: 24px auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
button, .xd-button {
|
||||||
|
display: flex;
|
||||||
|
color: $fg;
|
||||||
|
background: $bg;
|
||||||
|
border: 1px solid $bg-pale-1;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 2px;
|
||||||
|
font-size: 1rem;
|
||||||
|
outline: none;
|
||||||
|
padding: 2px 8px;
|
||||||
|
text-decoration: none;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: $bg-pale-1;
|
||||||
|
}
|
||||||
|
&:active {
|
||||||
|
background: $bg-pale-2;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.primary {
|
||||||
|
background: $primary;
|
||||||
|
color: $primary-fg;
|
||||||
|
border-color: $primary-dark;
|
||||||
|
&:hover {
|
||||||
|
background: $primary-light;
|
||||||
|
}
|
||||||
|
&:active {
|
||||||
|
background: $primary-dark;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// ul, ol {
|
||||||
|
// > ul, > ol {
|
||||||
|
// margin-bottom: 0;
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
a, .link {
|
||||||
|
text-decoration: none;
|
||||||
|
color: $primary;
|
||||||
|
border-bottom: 1px solid $primary;
|
||||||
|
&:hover {
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
border-radius: 2px;
|
||||||
|
color: #0f0;
|
||||||
|
background: #000;
|
||||||
|
padding: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-container {
|
||||||
|
padding: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-card {
|
||||||
|
background: $card-bg;
|
||||||
|
color: $card-fg;
|
||||||
|
border: 1px solid $divider;
|
||||||
|
border-radius: 2px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
h1 { font-size: 2rem; }
|
||||||
|
h2 { font-size: 1.5rem; }
|
||||||
|
h3 { font-size: 1.3rem; }
|
||||||
|
h4 { font-size: 1.17rem; }
|
||||||
|
h5 { font-size: 1.12rem; }
|
||||||
|
h6 { font-size: 1.08rem; }
|
||||||
|
|
||||||
|
> .media {
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
> .body {
|
||||||
|
padding: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
> .header, > .footer {
|
||||||
|
padding: 8px 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
> .header {
|
||||||
|
background: $card-header;
|
||||||
|
border-bottom: 1px solid $divider;
|
||||||
|
> h1.title {
|
||||||
|
font-size: 1rem;
|
||||||
|
margin: 0;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> .footer {
|
||||||
|
background: $card-footer;
|
||||||
|
border-top: 1px solid $divider;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-cards {
|
||||||
|
list-style: none;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: nowrap;
|
||||||
|
justify-content: left;
|
||||||
|
|
||||||
|
> .xd-card {
|
||||||
|
width: 100%;
|
||||||
|
margin: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.center {
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
@media screen and (max-width: 640px) {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.wrap {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx-auto { margin-left: auto; margin-right: auto; }
|
||||||
|
.my-auto { margin-top: auto; margin-bottom: auto; }
|
||||||
|
|
||||||
|
.px-auto { padding-left: auto; padding-right: auto; }
|
||||||
|
.py-auto { padding-top: auto; padding-bottom: auto; }
|
||||||
|
|
||||||
|
@for $v from -5 through 5 {
|
||||||
|
$size: $v * 8px;
|
||||||
|
.ma-#{$v} { margin: $size; }
|
||||||
|
.ml-#{$v} { margin-left: $size; }
|
||||||
|
.mr-#{$v} { margin-right: $size; }
|
||||||
|
.mt-#{$v} { margin-top: $size; }
|
||||||
|
.mb-#{$v} { margin-bottom: $size; }
|
||||||
|
.mx-#{$v} { margin-left: $size; margin-right: $size; }
|
||||||
|
.my-#{$v} { margin-top: $size; margin-bottom: $size; }
|
||||||
|
|
||||||
|
.pa-#{$v} { padding: $size; }
|
||||||
|
.pl-#{$v} { padding-left: $size; }
|
||||||
|
.pr-#{$v} { padding-right: $size; }
|
||||||
|
.pt-#{$v} { padding-top: $size; }
|
||||||
|
.pb-#{$v} { padding-bottom: $size; }
|
||||||
|
.px-#{$v} { padding-left: $size; padding-right: $size; }
|
||||||
|
.py-#{$v} { padding-top: $size; padding-bottom: $size; }
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-slide-in {
|
||||||
|
animation: slideIn 1s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes slideIn {
|
||||||
|
0% {
|
||||||
|
transform: translateY(32px);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: none;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
figure {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@each $mode in none, block, inline, flex, grid, inline-block, inline-flex {
|
||||||
|
.display-#{$mode} { display: $mode; }
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width: 901px) {
|
||||||
|
.hide-on-pc {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 900px) and (min-width: 641px) {
|
||||||
|
.hide-on-tablet {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 640px) {
|
||||||
|
.hide-on-mobile {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@for $i from -18 through 18 {
|
||||||
|
.xd-tilt-#{$i * 5} {
|
||||||
|
display: inline-block;
|
||||||
|
transform: rotateZ($i * 5deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes blink {
|
||||||
|
0% { opacity: 1 }
|
||||||
|
10% { opacity: 1 }
|
||||||
|
12% { opacity: 0 }
|
||||||
|
14% { opacity: 1 }
|
||||||
|
20% { opacity: 1 }
|
||||||
|
21% { opacity: 0 }
|
||||||
|
39% { opacity: 0 }
|
||||||
|
40% { opacity: 1 }
|
||||||
|
48% { opacity: 1 }
|
||||||
|
49% { opacity: 0 }
|
||||||
|
50% { opacity: 1 }
|
||||||
|
54% { opacity: 1 }
|
||||||
|
55% { opacity: 0 }
|
||||||
|
56% { opacity: 1 }
|
||||||
|
85% { opacity: 1 }
|
||||||
|
89% { opacity: 0 }
|
||||||
|
95% { opacity: 1 }
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-big {
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-small {
|
||||||
|
font-size: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-blink {
|
||||||
|
animation: blink 2s infinite linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-fluid {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
img, .xd-responsive {
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-footer {
|
||||||
|
text-align: center;
|
||||||
|
// background: darken($bg, 2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-columns {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
@media screen and (max-width: 640px) {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-column {
|
||||||
|
&.gap-1 { margin: 8px; }
|
||||||
|
&.gap-2 { margin: 16px; }
|
||||||
|
&.gap-3 { margin: 24px; }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-center {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.xd-centerized {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
text-align: center;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
5
styles/style.scss
Normal file
5
styles/style.scss
Normal file
|
|
@ -0,0 +1,5 @@
|
||||||
|
@import '_xeltica-design.scss';
|
||||||
|
|
||||||
|
body {
|
||||||
|
background: $bg-pale-1;
|
||||||
|
}
|
||||||
72
tsconfig.json
Normal file
72
tsconfig.json
Normal file
|
|
@ -0,0 +1,72 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
/* Visit https://aka.ms/tsconfig.json to read more about this file */
|
||||||
|
|
||||||
|
/* Basic Options */
|
||||||
|
// "incremental": true, /* Enable incremental compilation */
|
||||||
|
"target": "es5", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
|
||||||
|
"module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
|
||||||
|
// "lib": [], /* Specify library files to be included in the compilation. */
|
||||||
|
// "allowJs": true, /* Allow javascript files to be compiled. */
|
||||||
|
// "checkJs": true, /* Report errors in .js files. */
|
||||||
|
// "jsx": "preserve", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
|
||||||
|
// "declaration": true, /* Generates corresponding '.d.ts' file. */
|
||||||
|
// "declarationMap": true, /* Generates a sourcemap for each corresponding '.d.ts' file. */
|
||||||
|
// "sourceMap": true, /* Generates corresponding '.map' file. */
|
||||||
|
// "outFile": "./", /* Concatenate and emit output to single file. */
|
||||||
|
"outDir": "./built/", /* Redirect output structure to the directory. */
|
||||||
|
"rootDir": "./src/", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
|
||||||
|
// "composite": true, /* Enable project compilation */
|
||||||
|
// "tsBuildInfoFile": "./", /* Specify file to store incremental compilation information */
|
||||||
|
// "removeComments": true, /* Do not emit comments to output. */
|
||||||
|
// "noEmit": true, /* Do not emit outputs. */
|
||||||
|
// "importHelpers": true, /* Import emit helpers from 'tslib'. */
|
||||||
|
// "downlevelIteration": true, /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
|
||||||
|
// "isolatedModules": true, /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
|
||||||
|
|
||||||
|
/* Strict Type-Checking Options */
|
||||||
|
"strict": true, /* Enable all strict type-checking options. */
|
||||||
|
// "noImplicitAny": true, /* Raise error on expressions and declarations with an implied 'any' type. */
|
||||||
|
// "strictNullChecks": true, /* Enable strict null checks. */
|
||||||
|
// "strictFunctionTypes": true, /* Enable strict checking of function types. */
|
||||||
|
// "strictBindCallApply": true, /* Enable strict 'bind', 'call', and 'apply' methods on functions. */
|
||||||
|
// "strictPropertyInitialization": true, /* Enable strict checking of property initialization in classes. */
|
||||||
|
// "noImplicitThis": true, /* Raise error on 'this' expressions with an implied 'any' type. */
|
||||||
|
// "alwaysStrict": true, /* Parse in strict mode and emit "use strict" for each source file. */
|
||||||
|
|
||||||
|
/* Additional Checks */
|
||||||
|
// "noUnusedLocals": true, /* Report errors on unused locals. */
|
||||||
|
// "noUnusedParameters": true, /* Report errors on unused parameters. */
|
||||||
|
// "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */
|
||||||
|
// "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */
|
||||||
|
|
||||||
|
/* Module Resolution Options */
|
||||||
|
// "moduleResolution": "node", /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
|
||||||
|
// "baseUrl": "./", /* Base directory to resolve non-absolute module names. */
|
||||||
|
// "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
|
||||||
|
// "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */
|
||||||
|
"typeRoots": [
|
||||||
|
"node_modules/@types",
|
||||||
|
"src/@types"
|
||||||
|
], /* List of folders to include type definitions from. */
|
||||||
|
// "types": [], /* Type declaration files to be included in compilation. */
|
||||||
|
// "allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
|
||||||
|
"esModuleInterop": true, /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
|
||||||
|
// "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */
|
||||||
|
// "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */
|
||||||
|
|
||||||
|
/* Source Map Options */
|
||||||
|
// "sourceRoot": "", /* Specify the location where debugger should locate TypeScript files instead of source locations. */
|
||||||
|
// "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */
|
||||||
|
// "inlineSourceMap": true, /* Emit a single file with source maps instead of having a separate file. */
|
||||||
|
// "inlineSources": true, /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
|
||||||
|
|
||||||
|
/* Experimental Options */
|
||||||
|
// "experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */
|
||||||
|
// "emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */
|
||||||
|
|
||||||
|
/* Advanced Options */
|
||||||
|
"skipLibCheck": true, /* Skip type checking of declaration files. */
|
||||||
|
"forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Add table
Add a link
Reference in a new issue