diff --git a/assets/otadesign_rounded.woff b/assets/otadesign_rounded.woff
new file mode 100644
index 0000000..34a0623
Binary files /dev/null and b/assets/otadesign_rounded.woff differ
diff --git a/assets/otadesign_rounded.woff2 b/assets/otadesign_rounded.woff2
new file mode 100644
index 0000000..b5f1cfc
Binary files /dev/null and b/assets/otadesign_rounded.woff2 differ
diff --git a/package.json b/package.json
index 3a1ef4e..e3029ec 100644
--- a/package.json
+++ b/package.json
@@ -8,9 +8,10 @@
"scripts": {
"build": "run-s build:backend build:frontend",
"build:frontend": "webpack",
- "build:backend": "run-s build:backend-source build:views build:styles build:meta",
+ "build:backend": "run-s build:backend-source build:views build:meta build:styles build:assets",
"build:backend-source": "tsc",
"build:views": "copyfiles -u 1 src/backend/views/*.pug ./built/",
+ "build:assets": "copyfiles -u 1 assets/* ./built/assets/",
"build:meta": "node ./build-meta.js",
"build:styles": "sass styles/:built/assets",
"start": "node built/app.js",
@@ -91,7 +92,7 @@
"typeorm": "0.2.25",
"typescript": "^4.4.2",
"uuid": "^8.3.0",
- "webpack": "^5.51.1",
+ "webpack": "^5.75.0",
"webpack-cli": "^4.8.0",
"xeltica-ui": "xeltica/design-system"
},
diff --git a/src/backend/views/frontend.pug b/src/backend/views/frontend.pug
index 94f7f0c..3cb8724 100644
--- a/src/backend/views/frontend.pug
+++ b/src/backend/views/frontend.pug
@@ -14,19 +14,12 @@ html
meta(name='twitter:card' content='summary')
meta(name='twitter:site' content='@Xeltica')
meta(name='twitter:creator' content='@Xeltica')
+ link(rel="preload" href="https://koruri.chillout.chat/koruri.css")
+ link(rel="preload", href="/assets/otadesign_rounded.woff")
+ link(rel="preload", href="/assets/otadesign_rounded.woff2")
link(rel="stylesheet" href="https://koruri.chillout.chat/koruri.css")
script(src='https://kit.fontawesome.com/c7ab6eba70.js' crossorigin='anonymous')
- style.
- .loading {
- display: flex;
- position: fixed;
- inset: 0;
- background: #222;
- color: #fff;
- font-size: 16px;
- align-items: center;
- justify-content: center;
- }
+ link(rel="stylesheet", href="/assets/style.css")
body
#app: .loading Loading...
diff --git a/src/frontend/components/NavigationMenu.tsx b/src/frontend/components/NavigationMenu.tsx
index eaef9de..45a1d79 100644
--- a/src/frontend/components/NavigationMenu.tsx
+++ b/src/frontend/components/NavigationMenu.tsx
@@ -20,7 +20,7 @@ export const NavigationMenu: React.VFC = () => {
return (
<>
- {t('title')}
+ {t('title')}
diff --git a/src/frontend/pages/index.welcome.tsx b/src/frontend/pages/index.welcome.tsx
index bcf6604..6bf92e0 100644
--- a/src/frontend/pages/index.welcome.tsx
+++ b/src/frontend/pages/index.welcome.tsx
@@ -76,7 +76,7 @@ export const IndexWelcomePage: React.VFC = () => {
<>
-
{t('title')}
+
{t('title')}
{t('description1')}
{t('description2')}
diff --git a/styles/_colors.scss b/styles/_colors.scss
deleted file mode 100644
index 986e193..0000000
--- a/styles/_colors.scss
+++ /dev/null
@@ -1,300 +0,0 @@
-/*
-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);
\ No newline at end of file
diff --git a/styles/_xeltica-design.scss b/styles/_xeltica-design.scss
deleted file mode 100644
index 31259af..0000000
--- a/styles/_xeltica-design.scss
+++ /dev/null
@@ -1,501 +0,0 @@
-/*
- Xeltica Design CSS Framework
- (C)2020 Xeltica
-*/
-
-* {
- box-sizing: border-box;
- line-height: 1.8em;
-}
-
-html {
- $primary: rgb(134, 179, 0);
- $fg: rgba(255, 255, 255, 0.8);
- $bg: rgba(24, 24, 24, 0.8);
- $overlay: transparentize($bg, 0.5);
- $danger: #c72c2c;
- font-size: 18px;
- @media screen and (max-width: 640px) {
- font-size: 15px;
- }
- --primary: #{$primary};
- --primary-light: #{lighten($primary, 5%)};
- --primary-dark: #{darken($primary, 5%)};
- --primary-fg: white;
- --bg: #{$bg};
- --bg-pale-1: #{darken($bg, 5%)};
- --bg-pale-2: #{darken($bg, 10%)};
- --overlay: #{$overlay};
- --fg: #{$fg};
- // --divider: rgba(70, 70, 70, 0.25);
- --radius: 0px;
- --margin: 16px;
-
- --bg-danger: #{$danger};
- --fg-danger: white;
- --divider-danger: #400e0e;
- --bg-danger-lighten: #{lighten($danger, 5%)};
- --bg-danger-darken: #{darken($danger, 5%)};
-}
-
-body {
- background: var(--bg);
- color: var(--fg);
-}
-
-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: var(--radius);
- color: var(--fg);
- background: transparent;
- border: 1px solid var(--fg);
- padding: 2px 8px;
- font-size: 1rem;
-
- &:focus {
- border-color: var(--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: var(--bg);
- padding: 32px;
- border-radius: var(--radius);
- border: 1px solid var(--divider);
- max-width: 960px;
- margin: 24px auto;
- backdrop-filter: blur(32px) saturate(4);
- -webkit-backdrop-filter: blur(32px) saturate(4);
- box-shadow: 0 0 16px black;
-}
-
-button, .xd-button {
- display: flex;
- color: var(--fg);
- background: var(--bg);
- border: 1px solid var(--bg-pale-1);
- align-items: center;
- justify-content: center;
- border-radius: var(--radius);
- font-size: 1rem;
- outline: none;
- padding: 2px 8px;
- text-decoration: none;
- cursor: pointer;
-
- &:hover, &:focus {
- background: var(--bg-pale-1);
- }
- &:active {
- background: var(--bg-pale-2);
- }
-
- &.primary {
- background: var(--primary);
- color: var(--primary-fg);
- border-color: var(--primary-dark);
- &:hover, &:focus {
- background: var(--primary-light);
- }
- &:active {
- background: var(--primary-dark);
- }
- }
-
- &.danger {
- background: var(--bg-danger);
- color: white;
- border-color: var(--divider-danger);
- &:hover, &:focus {
- background: var(--bg-danger-lighten);
- }
- &:active {
- background: var(--bg-danger-lighten);
- }
- }
-}
-
-textarea {
- width: 100%;
- font-size: 1rem;
- padding: 16px;
- border-radius: var(--radius);
- background: var(--overlay);
- border: none;
- outline: none;
- height: 8rem;
- line-height: 1.2;
- color: var(--fg);
- &:focus {
- border: 1px solid var(--primary);
- }
-}
-
-// ul, ol {
-// > ul, > ol {
-// margin-bottom: 0;
-// }
-// }
-
-a, .link {
- text-decoration: none;
- color: var(--primary);
- &:hover {
- opacity: 0.7;
- }
-}
-
-table {
- border: 1px solid var(--divider);
- border-radius: var(--radius);
- background: var(--overlay);
- width: 100%;
-
- > thead {
- background: var(--overlay);
- margin-bottom: 2px;
- text-align: left;
- }
- > tbody > tr {
- border-bottom: 1px solid var(--overlay);
- }
- th, td {
- padding: 4px 8px;
- }
-}
-
-code {
- border-radius: var(--radius);
- color: #0f0;
- background: #000;
- padding: 8px;
-}
-
-.xd-container {
- max-width: 960px;
- margin: 64px auto;
-}
-
-.xd-hstack {
- display: flex;
- > *:not(:last-child) {
- margin-right: var(--margin);
- }
-
- > * {
- width: 100%;
- }
-
- @media screen and (max-width: 640px) {
- flex-direction: column;
- > * {
- margin-bottom: var(--margin);
- }
- }
-}
-
-.xd-vstack {
- display: flex;
- flex-direction: column;
- > *:not(:last-child) {
- margin-bottom: var(--margin);
- }
-}
-
-.xd-card {
- background: var(--bg);
- padding: 16px;
- border-radius: var(--radius);
- border: 1px solid var(--divider);
- // backdrop-filter: blur(32px) saturate(4);
- // -webkit-backdrop-filter: blur(32px) saturate(4);
- box-shadow: 0 0 16px black;
- 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 {
- > h1.title {
- font-size: 1.5rem;
- margin: 0;
- font-weight: bold;
- }
- }
-
- > .footer {
- background: var(--bg-pale-1);
- border-top: 1px solid var(--divider);
- }
- @media screen and (max-width: 640px) {
- border-radius: 0;
- }
-}
-
-.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;
- > .xd-card {
- margin: 8px 0;
- }
- }
-
- &.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-alert {
- padding: 8px 16px;
- display: flex;
- align-items: center;
- border-radius: var(--radius);
- width: 100%;
- background: var(--bg);
- border: 1px solid var(--bg-pale-2);
- color: var(--fg);
- font-size: 75%;
-
- > .icon {
- opacity: 0.5;
- font-size: 1.2rem;
- margin-right: 16px;
- }
-
- &.danger {
- > .icon {
- opacity: 1;
- }
- background: var(--bg-danger);
- border: 1px solid var(--divider-danger);
- color: var(--fg-danger);
- }
-
-}
-
-.xd-center {
- text-align: center;
-}
-
-.xd-centerized {
- display: flex;
- justify-content: center;
- align-items: center;
- text-align: center;
- width: 100vw;
- height: 100vh;
-}
\ No newline at end of file
diff --git a/styles/style.scss b/styles/style.scss
index 8b895c4..812e2b0 100644
--- a/styles/style.scss
+++ b/styles/style.scss
@@ -1,58 +1,20 @@
-@import '_xeltica-design.scss';
-
-body {
- background: var(--bg-pale-1);
+@font-face {
+ font-family: "OTADESIGN Rounded";
+ src: url("/assets/otadesign_rounded.woff2") format('woff2'),
+ url("/assets/otadesign_rounded.woff") format('woff');
}
-h1> a {
- border-bottom: none;
+.font-misskey {
+ font-family: "OTADESIGN Rounded";
}
-.background {
+.loading {
+ display: flex;
position: fixed;
- z-index: -50;
inset: 0;
-
- background: radial-gradient(
- farthest-corner at 0 0,
- #86b300 0%,
- #86b300 40%,
- #6900ba 90%,
- #6900ba 100%
- );
-}
-
-.background:before {
- z-index: -200;
- position: absolute;
- inset: 0;
- background: radial-gradient(
- 60vw at 150vh 50vh,
- #ff9900 0%,
- #ff9900 20%,
- rgba(0, 0, 0, 0) 100%
- );
- content: "";
-}
-
-.background:after {
- z-index: -100;
- position: absolute;
- inset: 0;
- background: radial-gradient(
- 50vw at 120vw 120vh,
- rgba(0, 30, 190, 1) 0%,
- rgba(0, 30, 190, 0) 100%
- );
- content: "";
-}
-
-details > summary {
- margin-bottom: 8px;
- cursor: pointer;
-}
-
-h1 > small {
- margin-left: 1rem;
- font-size: 1.2rem;
+ background: #222;
+ color: #fff;
+ font-size: 16px;
+ align-items: center;
+ justify-content: center;
}
\ No newline at end of file
diff --git a/yarn.lock b/yarn.lock
index 61560c8..07ca7c5 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -362,10 +362,10 @@
dependencies:
deepmerge "*"
-"@types/eslint-scope@^3.7.0":
- version "3.7.1"
- resolved "https://registry.yarnpkg.com/@types/eslint-scope/-/eslint-scope-3.7.1.tgz#8dc390a7b4f9dd9f1284629efce982e41612116e"
- integrity sha512-SCFeogqiptms4Fg29WpOTk5nHIzfpKCemSN63ksBQYKTcXoJEmJagV+DhVmbapZzY4/5YaOV1nZwrsU79fFm1g==
+"@types/eslint-scope@^3.7.3":
+ version "3.7.4"
+ resolved "https://registry.yarnpkg.com/@types/eslint-scope/-/eslint-scope-3.7.4.tgz#37fc1223f0786c39627068a12e94d6e6fc61de16"
+ integrity sha512-9K4zoImiZc3HlIp6AVUDE4CWYx22a+lhSZMYNpbjW04+YF0KWj4pJXnEMjdnFTiQibFFmElcsasJXDbdI/EPhA==
dependencies:
"@types/eslint" "*"
"@types/estree" "*"
@@ -378,11 +378,16 @@
"@types/estree" "*"
"@types/json-schema" "*"
-"@types/estree@*", "@types/estree@^0.0.50":
+"@types/estree@*":
version "0.0.50"
resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.50.tgz#1e0caa9364d3fccd2931c3ed96fdbeaa5d4cca83"
integrity sha512-C6N5s2ZFtuZRj54k2/zyRhNDjJwwcViAM3Nbm8zjBpbqAdZ00mr0CFxvSKeO8Y/e03WVFLpQMdHYVfUd6SB+Hw==
+"@types/estree@^0.0.51":
+ version "0.0.51"
+ resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.51.tgz#cfd70924a25a3fd32b218e5e420e6897e1ac4f40"
+ integrity sha512-CuPgU6f3eT/XgKKPqKd/gLZV1Xmvf1a2R5POBOGQa6uv82xpls89HU5zKeVoyR8XzHd1RGNOlQlvUe3CFkjWNQ==
+
"@types/express-serve-static-core@^4.17.18":
version "4.17.24"
resolved "https://registry.yarnpkg.com/@types/express-serve-static-core/-/express-serve-static-core-4.17.24.tgz#ea41f93bf7e0d59cd5a76665068ed6aab6815c07"
@@ -926,10 +931,10 @@ acorn@^7.1.1, acorn@^7.4.0:
resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.1.tgz#feaed255973d2e77555b83dbc08851a6c63520fa"
integrity sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==
-acorn@^8.4.1:
- version "8.5.0"
- resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.5.0.tgz#4512ccb99b3698c752591e9bb4472e38ad43cee2"
- integrity sha512-yXbYeFy+jUuYd3/CDcg2NkIYE991XYX/bje7LmjJigUciaeO1JR4XxXgCIV1/Zc/dRuFEyw1L0pbA+qynJkW5Q==
+acorn@^8.7.1:
+ version "8.8.1"
+ resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.8.1.tgz#0a3f9cbecc4ec3bea6f0a80b66ae8dd2da250b73"
+ integrity sha512-7zFpHzhnqYKrkYdUjF1HI1bzd0VygEGX8lFk4k5zVMqHEoES+P+7TKI+EvLO9WVMJ8eekdO0aDEK044xTXwPPA==
ajv-keywords@^3.5.2:
version "3.5.2"
@@ -1909,7 +1914,7 @@ end-of-stream@^1.1.0:
dependencies:
once "^1.4.0"
-enhanced-resolve@^5.0.0, enhanced-resolve@^5.7.0, enhanced-resolve@^5.8.3:
+enhanced-resolve@^5.0.0, enhanced-resolve@^5.7.0:
version "5.8.3"
resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.8.3.tgz#6d552d465cce0423f5b3d718511ea53826a7b2f0"
integrity sha512-EGAbGvH7j7Xt2nc0E7D99La1OiEs8LnyimkRgwExpUMScN6O+3x9tIWs7PLQZVNx4YD+00skHXPXi1yQHpAmZA==
@@ -1917,6 +1922,14 @@ enhanced-resolve@^5.0.0, enhanced-resolve@^5.7.0, enhanced-resolve@^5.8.3:
graceful-fs "^4.2.4"
tapable "^2.2.0"
+enhanced-resolve@^5.10.0:
+ version "5.12.0"
+ resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.12.0.tgz#300e1c90228f5b570c4d35babf263f6da7155634"
+ integrity sha512-QHTXI/sZQmko1cbDoNAa3mJ5qhWUUNAq3vR0/YiD379fWQrcfuoX1+HW2S0MTt7XmoPLapdaDKUtelUSPic7hQ==
+ dependencies:
+ graceful-fs "^4.2.4"
+ tapable "^2.2.0"
+
enquirer@^2.3.5:
version "2.3.6"
resolved "https://registry.yarnpkg.com/enquirer/-/enquirer-2.3.6.tgz#2a7fe5dd634a1e4125a975ec994ff5456dc3734d"
@@ -2562,7 +2575,7 @@ graceful-fs@^4.1.2, graceful-fs@^4.2.4:
resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.8.tgz#e412b8d33f5e006593cbd3cee6df9f2cebbe802a"
integrity sha512-qkIilPUYcNhJpd33n0GBXTB1MMPp14TxEsEs0pTrsSVucApsYzW5V+Q8Qxhik6KU3evy+qkAAowTByymK0avdg==
-graceful-fs@^4.1.6, graceful-fs@^4.2.0:
+graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.9:
version "4.2.10"
resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.10.tgz#147d3a006da4ca3ce14728c7aefc287c367d7a6c"
integrity sha512-9ByhssR2fPVsNZj478qUUbKfmL0+t5BDVyjShtyZZLiK7ZDAArFFfopyOTj0M05wE2tJPisA4iTnnXl2YoPvOA==
@@ -3173,11 +3186,16 @@ json-buffer@3.0.0:
resolved "https://registry.yarnpkg.com/json-buffer/-/json-buffer-3.0.0.tgz#5b1f397afc75d677bde8bcfc0e47e1f9a3d9a898"
integrity sha1-Wx85evx11ne96Lz8Dkfh+aPZqJg=
-json-parse-better-errors@^1.0.1, json-parse-better-errors@^1.0.2:
+json-parse-better-errors@^1.0.1:
version "1.0.2"
resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9"
integrity sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw==
+json-parse-even-better-errors@^2.3.1:
+ version "2.3.1"
+ resolved "https://registry.yarnpkg.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz#7c47805a94319928e05777405dc12e1f7a4ee02d"
+ integrity sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==
+
json-schema-traverse@^0.4.1:
version "0.4.1"
resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz#69f6a87d9513ab8bb8fe63bdb0979c448e684660"
@@ -6145,10 +6163,10 @@ void-elements@3.1.0, void-elements@^3.1.0:
resolved "https://registry.yarnpkg.com/void-elements/-/void-elements-3.1.0.tgz#614f7fbf8d801f0bb5f0661f5b2f5785750e4f09"
integrity sha1-YU9/v42AHwu18GYfWy9XhXUOTwk=
-watchpack@^2.2.0:
- version "2.2.0"
- resolved "https://registry.yarnpkg.com/watchpack/-/watchpack-2.2.0.tgz#47d78f5415fe550ecd740f99fe2882323a58b1ce"
- integrity sha512-up4YAn/XHgZHIxFBVCdlMiWDj6WaLKpwVeGQk2I5thdYxF/KmF0aaz6TfJZ/hfl1h/XlcDr7k1KH7ThDagpFaA==
+watchpack@^2.4.0:
+ version "2.4.0"
+ resolved "https://registry.yarnpkg.com/watchpack/-/watchpack-2.4.0.tgz#fa33032374962c78113f93c7f2fb4c54c9862a5d"
+ integrity sha512-Lcvm7MGST/4fup+ifyKi2hjyIAwcdI4HRgtvTpIUxBRhB+RFtUh8XtDOxUfctVCnhVi+QQj49i91OyvzkJl6cg==
dependencies:
glob-to-regexp "^0.4.1"
graceful-fs "^4.1.2"
@@ -6180,40 +6198,40 @@ webpack-merge@^5.7.3:
clone-deep "^4.0.1"
wildcard "^2.0.0"
-webpack-sources@^3.2.0:
- version "3.2.1"
- resolved "https://registry.yarnpkg.com/webpack-sources/-/webpack-sources-3.2.1.tgz#251a7d9720d75ada1469ca07dbb62f3641a05b6d"
- integrity sha512-t6BMVLQ0AkjBOoRTZgqrWm7xbXMBzD+XDq2EZ96+vMfn3qKgsvdXZhbPZ4ElUOpdv4u+iiGe+w3+J75iy/bYGA==
+webpack-sources@^3.2.3:
+ version "3.2.3"
+ resolved "https://registry.yarnpkg.com/webpack-sources/-/webpack-sources-3.2.3.tgz#2d4daab8451fd4b240cc27055ff6a0c2ccea0cde"
+ integrity sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==
-webpack@^5.51.1:
- version "5.58.0"
- resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.58.0.tgz#9ec621cf8534f23c25e779e7c35dfde1211d5ccb"
- integrity sha512-xc2k5MLbR1iah24Z5xUm1nBh1PZXEdUnrX6YkTSOScq/VWbl5JCLREXJzGYqEAUbIO8tZI+Dzv82lGtnuUnVCQ==
+webpack@^5.75.0:
+ version "5.75.0"
+ resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.75.0.tgz#1e440468647b2505860e94c9ff3e44d5b582c152"
+ integrity sha512-piaIaoVJlqMsPtX/+3KTTO6jfvrSYgauFVdt8cr9LTHKmcq/AMd4mhzsiP7ZF/PGRNPGA8336jldh9l2Kt2ogQ==
dependencies:
- "@types/eslint-scope" "^3.7.0"
- "@types/estree" "^0.0.50"
+ "@types/eslint-scope" "^3.7.3"
+ "@types/estree" "^0.0.51"
"@webassemblyjs/ast" "1.11.1"
"@webassemblyjs/wasm-edit" "1.11.1"
"@webassemblyjs/wasm-parser" "1.11.1"
- acorn "^8.4.1"
+ acorn "^8.7.1"
acorn-import-assertions "^1.7.6"
browserslist "^4.14.5"
chrome-trace-event "^1.0.2"
- enhanced-resolve "^5.8.3"
+ enhanced-resolve "^5.10.0"
es-module-lexer "^0.9.0"
eslint-scope "5.1.1"
events "^3.2.0"
glob-to-regexp "^0.4.1"
- graceful-fs "^4.2.4"
- json-parse-better-errors "^1.0.2"
+ graceful-fs "^4.2.9"
+ json-parse-even-better-errors "^2.3.1"
loader-runner "^4.2.0"
mime-types "^2.1.27"
neo-async "^2.6.2"
schema-utils "^3.1.0"
tapable "^2.1.1"
terser-webpack-plugin "^5.1.3"
- watchpack "^2.2.0"
- webpack-sources "^3.2.0"
+ watchpack "^2.4.0"
+ webpack-sources "^3.2.3"
which-boxed-primitive@^1.0.2:
version "1.0.2"