mirror of
https://github.com/tachiyomiorg/website.git
synced 2024-10-31 23:15:05 +01:00
Change CSS to Stylus
Also reworks some lint commands
This commit is contained in:
parent
37884467f8
commit
7de935b557
@ -1,4 +1,11 @@
|
||||
*.png
|
||||
*.jpg
|
||||
*.webm
|
||||
*.webp
|
||||
*.ico
|
||||
*.svg
|
||||
*.md
|
||||
*.styl
|
||||
*.vue
|
||||
dist
|
||||
pnpm-lock.yaml
|
||||
|
47
.stylintrc
Normal file
47
.stylintrc
Normal file
@ -0,0 +1,47 @@
|
||||
{
|
||||
"blocks": false,
|
||||
"brackets": "always",
|
||||
"colons": "always",
|
||||
"colors": "always",
|
||||
"commaSpace": "always",
|
||||
"commentSpace": "always",
|
||||
"cssLiteral": "never",
|
||||
"customProperties": [],
|
||||
"depthLimit": false,
|
||||
"duplicates": true,
|
||||
"efficient": "always",
|
||||
"exclude": [],
|
||||
"extendPref": "@extends",
|
||||
"globalDupe": true,
|
||||
"groupOutputByFile": true,
|
||||
"indentPref": false,
|
||||
"leadingZero": "always",
|
||||
"maxErrors": false,
|
||||
"maxWarnings": false,
|
||||
"mixed": true,
|
||||
"mixins": [],
|
||||
"namingConvention": false,
|
||||
"namingConventionStrict": false,
|
||||
"none": "always",
|
||||
"noImportant": false,
|
||||
"parenSpace": "never",
|
||||
"placeholders": "always",
|
||||
"prefixVarsWithDollar": "always",
|
||||
"quotePref": "double",
|
||||
"reporterOptions": {
|
||||
"columns": ["lineData", "severity", "description", "rule"],
|
||||
"columnSplitter": " ",
|
||||
"showHeaders": false,
|
||||
"truncate": true
|
||||
},
|
||||
"semicolons": "never",
|
||||
"sortOrder": ["grouped", "alphabetical"],
|
||||
"stackedProperties": "never",
|
||||
"trailingWhitespace": "never",
|
||||
"universal": false,
|
||||
"valid": true,
|
||||
"zeroUnits": "never",
|
||||
"zIndexNormalize": false,
|
||||
"stylusSupremacy.selectorSeparator": ",\n",
|
||||
"stylusSupremacy.insertNewLineAroundBlocks": true
|
||||
}
|
2260
package-lock.json
generated
2260
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
15
package.json
15
package.json
@ -13,11 +13,15 @@
|
||||
},
|
||||
"scripts": {
|
||||
"docs:dev": "vitepress dev src",
|
||||
"docs:build": "vitepress build src",
|
||||
"docs:build": "npm run lint && vitepress build src",
|
||||
"docs:preview": "vitepress preview src",
|
||||
"format": "prettier --check --write .",
|
||||
"format:fail": "prettier --check .",
|
||||
"lint:mdl": "markdownlint \"**/*.md\" \".github/**/*.md\" --enable sentences-per-line --disable MD025 MD033"
|
||||
"lint": "npm run lint:prettier && npm run lint:mdl && npm run lint:style",
|
||||
"lint:fix": "npm run lint:prettier:fix && npm run lint:style:fix",
|
||||
"lint:prettier": "prettier --check \"src/**/*\"",
|
||||
"lint:prettier:fix": "prettier --check --write \"src/**/*\"",
|
||||
"lint:mdl": "markdownlint \"**/*.md\" \".github/**/*.md\" --enable sentences-per-line --disable MD025 MD033",
|
||||
"lint:style": "stylelint \"**/*.{styl,vue}\" \"src/.vitepress/**/*.{styl,vue}\"",
|
||||
"lint:style:fix": "stylelint --fix \"**/*.{styl,vue}\" \"src/.vitepress/**/*.{styl,vue}\""
|
||||
},
|
||||
"devDependencies": {
|
||||
"@mdit/plugin-attrs": "^0.4.8",
|
||||
@ -34,6 +38,9 @@
|
||||
"prettier": "^3.0.0",
|
||||
"sentences-per-line": "^0.2.1",
|
||||
"sitemap": "^7.1.1",
|
||||
"stylelint": "^15.10.2",
|
||||
"stylelint-stylus": "^0.18.0",
|
||||
"stylus": "^0.59.0",
|
||||
"vitepress": "^1.0.0-beta.6",
|
||||
"vue": "^3.3.4"
|
||||
},
|
||||
|
@ -2,7 +2,7 @@
|
||||
import { h } from "vue";
|
||||
import Theme from "vitepress/theme";
|
||||
import CustomLayout from "./layouts/CustomLayout.vue";
|
||||
import "./styles/style.css";
|
||||
import "./styles/base.styl";
|
||||
|
||||
export default {
|
||||
extends: Theme,
|
||||
|
89
src/.vitepress/theme/styles/base.styl
Normal file
89
src/.vitepress/theme/styles/base.styl
Normal file
@ -0,0 +1,89 @@
|
||||
/**
|
||||
* Customize default theme styling by overriding CSS variables:
|
||||
* https://github.com/vuejs/vitepress/blob/main/src/client/theme-default/styles/vars.css
|
||||
*/
|
||||
/**
|
||||
* Colors
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root {
|
||||
--vp-c-brand: #818cf8
|
||||
--vp-c-brand-light: #a0a8f9
|
||||
--vp-c-brand-lighter: #c0c5fb
|
||||
--vp-c-brand-lightest: #dfe2fd
|
||||
--vp-c-brand-dark: #6069ba
|
||||
--vp-c-brand-darker: #40467c
|
||||
--vp-c-brand-darkest: #20233e
|
||||
--vp-c-brand-dimm: rgba(100, 108, 255, 0.08)
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Button
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root {
|
||||
--vp-button-brand-border: var(--vp-c-brand-light)
|
||||
--vp-button-brand-text: var(--vp-c-black)
|
||||
--vp-button-brand-bg: var(--vp-c-brand)
|
||||
--vp-button-brand-hover-border: var(--vp-c-brand-light)
|
||||
--vp-button-brand-hover-text: var(--vp-c-black)
|
||||
--vp-button-brand-hover-bg: var(--vp-c-brand-light)
|
||||
--vp-button-brand-active-border: var(--vp-c-brand-light)
|
||||
--vp-button-brand-active-text: var(--vp-c-black)
|
||||
--vp-button-brand-active-bg: var(--vp-button-brand-bg)
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Home
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root {
|
||||
--vp-home-hero-name-color: transparent
|
||||
--vp-home-hero-name-background: -webkit-linear-gradient(120deg, var(--vp-c-brand) 30%, var(--vp-c-brand-dark))
|
||||
--vp-home-hero-image-background-image: linear-gradient(-45deg, var(--vp-c-brand-light) 50%, var(--vp-c-brand-lighter) 50%)
|
||||
--vp-home-hero-image-filter: blur(40px)
|
||||
}
|
||||
|
||||
.dark {
|
||||
--vp-home-hero-image-background-image: linear-gradient(-45deg, var(--vp-c-brand-darker) 25%, var(--vp-c-brand-darkest) 25%)
|
||||
}
|
||||
|
||||
@media (min-width 640px) {
|
||||
:root {
|
||||
--vp-home-hero-image-filter: blur(56px)
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width 960px) {
|
||||
:root {
|
||||
--vp-home-hero-image-filter: blur(72px)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Custom Block
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root {
|
||||
--vp-custom-block-tip-border: var(--vp-c-brand)
|
||||
--vp-custom-block-tip-text: var(--vp-c-brand-darker)
|
||||
--vp-custom-block-tip-bg: var(--vp-c-brand-dimm)
|
||||
}
|
||||
|
||||
.dark {
|
||||
--vp-custom-block-tip-border: var(--vp-c-brand)
|
||||
--vp-custom-block-tip-text: var(--vp-c-brand-lightest)
|
||||
--vp-custom-block-tip-bg: var(--vp-c-brand-dimm)
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Algolia
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
.DocSearch {
|
||||
--docsearch-primary-color: var(--vp-c-brand) !important
|
||||
}
|
||||
|
||||
.VPImage.image-src {
|
||||
border-radius: 8px
|
||||
}
|
@ -1,32 +0,0 @@
|
||||
.page-neko .image-bg {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.page-neko ::selection {
|
||||
background: rgba(255, 109, 137, 0.2);
|
||||
}
|
||||
|
||||
/**
|
||||
* Colors
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-neko {
|
||||
--vp-c-brand: #ff6884 !important;
|
||||
--vp-c-brand-light: #ff8da2;
|
||||
--vp-c-brand-lighter: #ffb3c1;
|
||||
--vp-c-brand-lightest: #ffd9e0;
|
||||
--vp-c-brand-dark: #bf4e63;
|
||||
--vp-c-brand-darker: #7f3442;
|
||||
--vp-c-brand-darkest: #3f1a21;
|
||||
--vp-c-brand-dimm: rgba(255, 109, 137, 0.08);
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Button
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-neko {
|
||||
--vp-button-brand-text: var(--vp-c-black);
|
||||
--vp-button-brand-hover-text: var(--vp-c-black);
|
||||
--vp-button-brand-active-text: var(--vp-c-black);
|
||||
}
|
34
src/.vitepress/theme/styles/forks/neko.styl
Normal file
34
src/.vitepress/theme/styles/forks/neko.styl
Normal file
@ -0,0 +1,34 @@
|
||||
.page-neko {
|
||||
.image-bg {
|
||||
display: none
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: rgba(255, 109, 137, 0.2)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Colors
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-neko {
|
||||
--vp-c-brand: #ff6884 !important
|
||||
--vp-c-brand-light: #ff8da2
|
||||
--vp-c-brand-lighter: #ffb3c1
|
||||
--vp-c-brand-lightest: #ffd9e0
|
||||
--vp-c-brand-dark: #bf4e63
|
||||
--vp-c-brand-darker: #7f3442
|
||||
--vp-c-brand-darkest: #3f1a21
|
||||
--vp-c-brand-dimm: rgba(255, 109, 137, 0.08)
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Button
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-neko {
|
||||
--vp-button-brand-text: var(--vp-c-black)
|
||||
--vp-button-brand-hover-text: var(--vp-c-black)
|
||||
--vp-button-brand-active-text: var(--vp-c-black)
|
||||
}
|
@ -1,396 +0,0 @@
|
||||
.page-tachiyomiaz .image-bg {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.page-tachiyomiaz ::selection {
|
||||
background: rgba(255, 204, 77, 0.2);
|
||||
}
|
||||
|
||||
/**
|
||||
* Colors
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-tachiyomiaz {
|
||||
--vp-c-brand: #ffcc4d;
|
||||
--vp-c-brand-light: #ffd879;
|
||||
--vp-c-brand-lighter: #ffe5a6;
|
||||
--vp-c-brand-lightest: #fff2d2;
|
||||
--vp-c-brand-dark: #bf9939;
|
||||
--vp-c-brand-darker: #7f6626;
|
||||
--vp-c-brand-darkest: #3f3313;
|
||||
--vp-c-brand-dimm: rgba(255, 204, 77, 0.08);
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Button
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-tachiyomiaz {
|
||||
--vp-button-brand-text: var(--vp-c-black);
|
||||
--vp-button-brand-hover-text: var(--vp-c-black);
|
||||
--vp-button-brand-active-text: var(--vp-c-black);
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Dumb
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
@font-face {
|
||||
font-family: "Comic Sans MS";
|
||||
src: url("//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.eot");
|
||||
src:
|
||||
url("//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.eot?#iefix") format("embedded-opentype"),
|
||||
url("//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.woff2") format("woff2"),
|
||||
url("//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.woff") format("woff"),
|
||||
url("//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.ttf") format("truetype"),
|
||||
url("//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.svg#Comic Sans MS") format("svg");
|
||||
}
|
||||
.azContainer {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.azContainer .azMarquee {
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
animation: marquee 10s linear infinite;
|
||||
padding-left: 100%;
|
||||
}
|
||||
.azContainer .azMarquee .azWiggleText {
|
||||
padding: 2em;
|
||||
width: fit-content;
|
||||
animation: wiggleAnimation 1s ease-out infinite;
|
||||
}
|
||||
.azContainer .azMarquee .azWiggleText:hover {
|
||||
animation: barrelRollAnimation 0.6s;
|
||||
}
|
||||
.azContainer .azMarquee .azWiggleText .azText {
|
||||
font-family: "Comic Sans MS", "Comic Sans", cursive;
|
||||
font-size: 2em;
|
||||
display: inline-block;
|
||||
-webkit-text-stroke: 1px #000;
|
||||
text-shadow:
|
||||
-1px -1px 0 #000,
|
||||
1px -1px 0 #000,
|
||||
-1px 1px 0 #000,
|
||||
1px 1px 0 #000;
|
||||
animation:
|
||||
rainbowTextColorAnimation 0.5s linear infinite,
|
||||
scaleXTextAnimation 2s infinite;
|
||||
}
|
||||
@-moz-keyframes marquee {
|
||||
0% {
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
100% {
|
||||
transform: translate(-100%, 0);
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes marquee {
|
||||
0% {
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
100% {
|
||||
transform: translate(-100%, 0);
|
||||
}
|
||||
}
|
||||
@-o-keyframes marquee {
|
||||
0% {
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
100% {
|
||||
transform: translate(-100%, 0);
|
||||
}
|
||||
}
|
||||
@keyframes marquee {
|
||||
0% {
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
100% {
|
||||
transform: translate(-100%, 0);
|
||||
}
|
||||
}
|
||||
@-moz-keyframes barrelRollAnimation {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes barrelRollAnimation {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@-o-keyframes barrelRollAnimation {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@keyframes barrelRollAnimation {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@-moz-keyframes wiggleAnimation {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
25% {
|
||||
transform: rotate(-15deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
75% {
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes wiggleAnimation {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
25% {
|
||||
transform: rotate(-15deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
75% {
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
@-o-keyframes wiggleAnimation {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
25% {
|
||||
transform: rotate(-15deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
75% {
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
@keyframes wiggleAnimation {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
25% {
|
||||
transform: rotate(-15deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
75% {
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
@-moz-keyframes scaleXTextAnimation {
|
||||
0% {
|
||||
transform: scaleX(0.5) scaleY(0.5);
|
||||
}
|
||||
50% {
|
||||
transform: scaleX(1) scaleY(1);
|
||||
}
|
||||
100% {
|
||||
transform: scaleX(0.5) scaleY(0.5);
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes scaleXTextAnimation {
|
||||
0% {
|
||||
transform: scaleX(0.5) scaleY(0.5);
|
||||
}
|
||||
50% {
|
||||
transform: scaleX(1) scaleY(1);
|
||||
}
|
||||
100% {
|
||||
transform: scaleX(0.5) scaleY(0.5);
|
||||
}
|
||||
}
|
||||
@-o-keyframes scaleXTextAnimation {
|
||||
0% {
|
||||
transform: scaleX(0.5) scaleY(0.5);
|
||||
}
|
||||
50% {
|
||||
transform: scaleX(1) scaleY(1);
|
||||
}
|
||||
100% {
|
||||
transform: scaleX(0.5) scaleY(0.5);
|
||||
}
|
||||
}
|
||||
@keyframes scaleXTextAnimation {
|
||||
0% {
|
||||
transform: scaleX(0.5) scaleY(0.5);
|
||||
}
|
||||
50% {
|
||||
transform: scaleX(1) scaleY(1);
|
||||
}
|
||||
100% {
|
||||
transform: scaleX(0.5) scaleY(0.5);
|
||||
}
|
||||
}
|
||||
@-moz-keyframes rainbowTextColorAnimation {
|
||||
0% {
|
||||
color: #f00;
|
||||
}
|
||||
10% {
|
||||
color: #f90;
|
||||
}
|
||||
20% {
|
||||
color: #cf0;
|
||||
}
|
||||
30% {
|
||||
color: #3f0;
|
||||
}
|
||||
40% {
|
||||
color: #0f6;
|
||||
}
|
||||
50% {
|
||||
color: #0ff;
|
||||
}
|
||||
60% {
|
||||
color: #06f;
|
||||
}
|
||||
70% {
|
||||
color: #30f;
|
||||
}
|
||||
80% {
|
||||
color: #c0f;
|
||||
}
|
||||
90% {
|
||||
color: #f09;
|
||||
}
|
||||
100% {
|
||||
color: #f00;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes rainbowTextColorAnimation {
|
||||
0% {
|
||||
color: #f00;
|
||||
}
|
||||
10% {
|
||||
color: #f90;
|
||||
}
|
||||
20% {
|
||||
color: #cf0;
|
||||
}
|
||||
30% {
|
||||
color: #3f0;
|
||||
}
|
||||
40% {
|
||||
color: #0f6;
|
||||
}
|
||||
50% {
|
||||
color: #0ff;
|
||||
}
|
||||
60% {
|
||||
color: #06f;
|
||||
}
|
||||
70% {
|
||||
color: #30f;
|
||||
}
|
||||
80% {
|
||||
color: #c0f;
|
||||
}
|
||||
90% {
|
||||
color: #f09;
|
||||
}
|
||||
100% {
|
||||
color: #f00;
|
||||
}
|
||||
}
|
||||
@-o-keyframes rainbowTextColorAnimation {
|
||||
0% {
|
||||
color: #f00;
|
||||
}
|
||||
10% {
|
||||
color: #f90;
|
||||
}
|
||||
20% {
|
||||
color: #cf0;
|
||||
}
|
||||
30% {
|
||||
color: #3f0;
|
||||
}
|
||||
40% {
|
||||
color: #0f6;
|
||||
}
|
||||
50% {
|
||||
color: #0ff;
|
||||
}
|
||||
60% {
|
||||
color: #06f;
|
||||
}
|
||||
70% {
|
||||
color: #30f;
|
||||
}
|
||||
80% {
|
||||
color: #c0f;
|
||||
}
|
||||
90% {
|
||||
color: #f09;
|
||||
}
|
||||
100% {
|
||||
color: #f00;
|
||||
}
|
||||
}
|
||||
@keyframes rainbowTextColorAnimation {
|
||||
0% {
|
||||
color: #f00;
|
||||
}
|
||||
10% {
|
||||
color: #f90;
|
||||
}
|
||||
20% {
|
||||
color: #cf0;
|
||||
}
|
||||
30% {
|
||||
color: #3f0;
|
||||
}
|
||||
40% {
|
||||
color: #0f6;
|
||||
}
|
||||
50% {
|
||||
color: #0ff;
|
||||
}
|
||||
60% {
|
||||
color: #06f;
|
||||
}
|
||||
70% {
|
||||
color: #30f;
|
||||
}
|
||||
80% {
|
||||
color: #c0f;
|
||||
}
|
||||
90% {
|
||||
color: #f09;
|
||||
}
|
||||
100% {
|
||||
color: #f00;
|
||||
}
|
||||
}
|
177
src/.vitepress/theme/styles/forks/tachiyomi-az.styl
Normal file
177
src/.vitepress/theme/styles/forks/tachiyomi-az.styl
Normal file
@ -0,0 +1,177 @@
|
||||
.page-tachiyomi-az {
|
||||
.image-bg {
|
||||
display: none
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: rgba(255, 204, 77, 0.2)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Colors
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-tachiyomi-az {
|
||||
--vp-c-brand: #ffcc4d
|
||||
--vp-c-brand-light: #ffd879
|
||||
--vp-c-brand-lighter: #ffe5a6
|
||||
--vp-c-brand-lightest: #fff2d2
|
||||
--vp-c-brand-dark: #bf9939
|
||||
--vp-c-brand-darker: #7f6626
|
||||
--vp-c-brand-darkest: #3f3313
|
||||
--vp-c-brand-dimm: rgba(255, 204, 77, 0.08)
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Button
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-tachiyomi-az {
|
||||
--vp-button-brand-text: var(--vp-c-black)
|
||||
--vp-button-brand-hover-text: var(--vp-c-black)
|
||||
--vp-button-brand-active-text: var(--vp-c-black)
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Dumb
|
||||
* -------------------------------------------------------------------------- */
|
||||
@font-face {
|
||||
font-family: 'Comic Sans MS'
|
||||
src: url('//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.eot')
|
||||
src: url('//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.eot?#iefix') format('embedded-opentype'), url('//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.woff2') format('woff2'), url('//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.woff') format('woff'), url('//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.ttf') format('truetype'), url('//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.svg#Comic Sans MS') format('svg')
|
||||
}
|
||||
|
||||
.azContainer {
|
||||
width: 100%
|
||||
overflow: hidden
|
||||
|
||||
.azMarquee {
|
||||
display: inline-block
|
||||
overflow: hidden
|
||||
white-space: nowrap
|
||||
animation: marquee 10s linear infinite
|
||||
padding-left: 100%
|
||||
|
||||
.azWiggleText {
|
||||
padding: 2em
|
||||
width: fit-content
|
||||
animation: wiggleAnimation 1s ease-out infinite
|
||||
|
||||
&:hover {
|
||||
animation: barrelRollAnimation 0.6s
|
||||
}
|
||||
|
||||
.azText {
|
||||
font-family: 'Comic Sans MS', 'Comic Sans', cursive
|
||||
font-size: 2em
|
||||
display: inline-block
|
||||
-webkit-text-stroke: 1px black
|
||||
text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000
|
||||
animation: rainbowTextColorAnimation 0.5s linear infinite, scaleXTextAnimation 2s infinite
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes marquee {
|
||||
0% {
|
||||
transform: translate(0, 0)
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translate(-100%, 0)
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes barrelRollAnimation {
|
||||
from {
|
||||
transform: rotate(0)
|
||||
}
|
||||
|
||||
to {
|
||||
transform: rotate(360deg)
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes wiggleAnimation {
|
||||
0% {
|
||||
transform: rotate(0)
|
||||
}
|
||||
|
||||
25% {
|
||||
transform: rotate(-15deg)
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: rotate(0)
|
||||
}
|
||||
|
||||
75% {
|
||||
transform: rotate(15deg)
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(0)
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes scaleXTextAnimation {
|
||||
0% {
|
||||
transform: scaleX(0.5) scaleY(0.5)
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: scaleX(1) scaleY(1)
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scaleX(0.5) scaleY(0.5)
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes rainbowTextColorAnimation {
|
||||
0% {
|
||||
color: hsl(0, 100%, 50%)
|
||||
}
|
||||
|
||||
10% {
|
||||
color: hsl(36, 100%, 50%)
|
||||
}
|
||||
|
||||
20% {
|
||||
color: hsl(72, 100%, 50%)
|
||||
}
|
||||
|
||||
30% {
|
||||
color: hsl(108, 100%, 50%)
|
||||
}
|
||||
|
||||
40% {
|
||||
color: hsl(144, 100%, 50%)
|
||||
}
|
||||
|
||||
50% {
|
||||
color: hsl(180, 100%, 50%)
|
||||
}
|
||||
|
||||
60% {
|
||||
color: hsl(216, 100%, 50%)
|
||||
}
|
||||
|
||||
70% {
|
||||
color: hsl(252, 100%, 50%)
|
||||
}
|
||||
|
||||
80% {
|
||||
color: hsl(288, 100%, 50%)
|
||||
}
|
||||
|
||||
90% {
|
||||
color: hsl(324, 100%, 50%)
|
||||
}
|
||||
|
||||
100% {
|
||||
color: hsl(360, 100%, 50%)
|
||||
}
|
||||
}
|
@ -1,32 +0,0 @@
|
||||
.page-tachiyomij2k .image-bg {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.page-tachiyomij2k ::selection {
|
||||
background: rgba(9, 82, 175, 0.2);
|
||||
}
|
||||
|
||||
/**
|
||||
* Colors
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-tachiyomij2k {
|
||||
--vp-c-brand: #0952af;
|
||||
--vp-c-brand-light: #467dc3;
|
||||
--vp-c-brand-lighter: #84a8d7;
|
||||
--vp-c-brand-lightest: #c1d3eb;
|
||||
--vp-c-brand-dark: #063d83;
|
||||
--vp-c-brand-darker: #042957;
|
||||
--vp-c-brand-darkest: #02142b;
|
||||
--vp-c-brand-dimm: rgba(9, 82, 175, 0.08);
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Button
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-tachiyomij2k {
|
||||
--vp-button-brand-text: var(--vp-c-white);
|
||||
--vp-button-brand-hover-text: var(--vp-c-white);
|
||||
--vp-button-brand-active-text: var(--vp-c-white);
|
||||
}
|
34
src/.vitepress/theme/styles/forks/tachiyomi-j2k.styl
Normal file
34
src/.vitepress/theme/styles/forks/tachiyomi-j2k.styl
Normal file
@ -0,0 +1,34 @@
|
||||
.page-tachiyomi-j2k {
|
||||
.image-bg {
|
||||
display: none
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: rgba(9, 82, 175, 0.2)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Colors
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-tachiyomi-j2k {
|
||||
--vp-c-brand: #0952af
|
||||
--vp-c-brand-light: #467dc3
|
||||
--vp-c-brand-lighter: #84a8d7
|
||||
--vp-c-brand-lightest: #c1d3eb
|
||||
--vp-c-brand-dark: #063d83
|
||||
--vp-c-brand-darker: #042957
|
||||
--vp-c-brand-darkest: #02142b
|
||||
--vp-c-brand-dimm: rgba(9, 82, 175, 0.08)
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Button
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-tachiyomi-j2k {
|
||||
--vp-button-brand-text: var(--vp-c-white)
|
||||
--vp-button-brand-hover-text: var(--vp-c-white)
|
||||
--vp-button-brand-active-text: var(--vp-c-white)
|
||||
}
|
@ -1,32 +0,0 @@
|
||||
.page-tachiyomisy .image-bg {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.page-tachiyomisy ::selection {
|
||||
background: rgba(206, 40, 40, 0.2);
|
||||
}
|
||||
|
||||
/**
|
||||
* Colors
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-tachiyomisy {
|
||||
--vp-c-brand: #ce2828;
|
||||
--vp-c-brand-light: #da5d5d;
|
||||
--vp-c-brand-lighter: #e69393;
|
||||
--vp-c-brand-lightest: #f2c9c9;
|
||||
--vp-c-brand-dark: #9a1e1e;
|
||||
--vp-c-brand-darker: #671414;
|
||||
--vp-c-brand-darkest: #330a0a;
|
||||
--vp-c-brand-dimm: rgba(206, 40, 40, 0.08);
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Button
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-tachiyomisy {
|
||||
--vp-button-brand-text: var(--vp-c-white);
|
||||
--vp-button-brand-hover-text: var(--vp-c-white);
|
||||
--vp-button-brand-active-text: var(--vp-c-white);
|
||||
}
|
34
src/.vitepress/theme/styles/forks/tachiyomi-sy.styl
Normal file
34
src/.vitepress/theme/styles/forks/tachiyomi-sy.styl
Normal file
@ -0,0 +1,34 @@
|
||||
.page-tachiyomi-sy {
|
||||
.image-bg {
|
||||
display: none
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: rgba(206, 40, 40, 0.2)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Colors
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-tachiyomi-sy {
|
||||
--vp-c-brand: #ce2828
|
||||
--vp-c-brand-light: #da5d5d
|
||||
--vp-c-brand-lighter: #e69393
|
||||
--vp-c-brand-lightest: #f2c9c9
|
||||
--vp-c-brand-dark: #9a1e1e
|
||||
--vp-c-brand-darker: #671414
|
||||
--vp-c-brand-darkest: #330a0a
|
||||
--vp-c-brand-dimm: rgba(206, 40, 40, 0.08)
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Button
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root .page-tachiyomi-sy {
|
||||
--vp-button-brand-text: var(--vp-c-white)
|
||||
--vp-button-brand-hover-text: var(--vp-c-white)
|
||||
--vp-button-brand-active-text: var(--vp-c-white)
|
||||
}
|
@ -1,99 +0,0 @@
|
||||
/**
|
||||
* Customize default theme styling by overriding CSS variables:
|
||||
* https://github.com/vuejs/vitepress/blob/main/src/client/theme-default/styles/vars.css
|
||||
*/
|
||||
|
||||
/**
|
||||
* Colors
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root {
|
||||
--vp-c-brand: #818cf8;
|
||||
--vp-c-brand-light: #a0a8f9;
|
||||
--vp-c-brand-lighter: #c0c5fb;
|
||||
--vp-c-brand-lightest: #dfe2fd;
|
||||
--vp-c-brand-dark: #6069ba;
|
||||
--vp-c-brand-darker: #40467c;
|
||||
--vp-c-brand-darkest: #20233e;
|
||||
--vp-c-brand-dimm: rgba(100, 108, 255, 0.08);
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Button
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root {
|
||||
--vp-button-brand-border: var(--vp-c-brand-light);
|
||||
--vp-button-brand-text: var(--vp-c-black);
|
||||
--vp-button-brand-bg: var(--vp-c-brand);
|
||||
--vp-button-brand-hover-border: var(--vp-c-brand-light);
|
||||
--vp-button-brand-hover-text: var(--vp-c-black);
|
||||
--vp-button-brand-hover-bg: var(--vp-c-brand-light);
|
||||
--vp-button-brand-active-border: var(--vp-c-brand-light);
|
||||
--vp-button-brand-active-text: var(--vp-c-black);
|
||||
--vp-button-brand-active-bg: var(--vp-button-brand-bg);
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Home
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root {
|
||||
--vp-home-hero-name-color: transparent;
|
||||
--vp-home-hero-name-background: -webkit-linear-gradient(120deg, var(--vp-c-brand) 30%, var(--vp-c-brand-dark));
|
||||
|
||||
--vp-home-hero-image-background-image: linear-gradient(
|
||||
-45deg,
|
||||
var(--vp-c-brand-light) 50%,
|
||||
var(--vp-c-brand-lighter) 50%
|
||||
);
|
||||
--vp-home-hero-image-filter: blur(40px);
|
||||
}
|
||||
|
||||
.dark {
|
||||
--vp-home-hero-image-background-image: linear-gradient(
|
||||
-45deg,
|
||||
var(--vp-c-brand-darker) 25%,
|
||||
var(--vp-c-brand-darkest) 25%
|
||||
);
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
:root {
|
||||
--vp-home-hero-image-filter: blur(56px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 960px) {
|
||||
:root {
|
||||
--vp-home-hero-image-filter: blur(72px);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Custom Block
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
:root {
|
||||
--vp-custom-block-tip-border: var(--vp-c-brand);
|
||||
--vp-custom-block-tip-text: var(--vp-c-brand-darker);
|
||||
--vp-custom-block-tip-bg: var(--vp-c-brand-dimm);
|
||||
}
|
||||
|
||||
.dark {
|
||||
--vp-custom-block-tip-border: var(--vp-c-brand);
|
||||
--vp-custom-block-tip-text: var(--vp-c-brand-lightest);
|
||||
--vp-custom-block-tip-bg: var(--vp-c-brand-dimm);
|
||||
}
|
||||
|
||||
/**
|
||||
* Component: Algolia
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
.DocSearch {
|
||||
--docsearch-primary-color: var(--vp-c-brand) !important;
|
||||
}
|
||||
|
||||
.VPImage.image-src {
|
||||
border-radius: 8px;
|
||||
}
|
@ -1,74 +0,0 @@
|
||||
.tree {
|
||||
border-radius: 8px;
|
||||
margin: 16px;
|
||||
padding: 16px;
|
||||
color: var(--vp-code-block-color);
|
||||
background-color: var(--vp-code-block-bg);
|
||||
font-family: "Roboto Mono", monospace;
|
||||
font-size: 0.85rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.tree > ul {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.tree li + li {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.tree span.folder.main {
|
||||
color: var(--vp-c-brand) !important;
|
||||
}
|
||||
|
||||
.tree span.folder,
|
||||
.tree span.file.zip {
|
||||
color: var(--vp-c-brand-lighter) !important;
|
||||
}
|
||||
|
||||
.tree ul {
|
||||
padding-left: 5px;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.tree ul li {
|
||||
position: relative;
|
||||
padding-left: 15px;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.tree ul li:before {
|
||||
top: 15px;
|
||||
left: 0;
|
||||
width: 10px;
|
||||
height: 1px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.tree ul li:after {
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 1px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.tree ul li:before,
|
||||
.tree ul li:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
background-color: var(--vp-c-code-dimm);
|
||||
}
|
||||
|
||||
.tree ul li:last-child:after {
|
||||
height: 15px;
|
||||
}
|
||||
|
||||
.tree-icon {
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
margin-right: 6px;
|
||||
display: inline-block;
|
||||
}
|
82
src/.vitepress/theme/styles/tree.styl
Normal file
82
src/.vitepress/theme/styles/tree.styl
Normal file
@ -0,0 +1,82 @@
|
||||
.tree {
|
||||
border-radius: 8px
|
||||
margin: 16px
|
||||
padding: 16px
|
||||
color: var(--vp-code-block-color)
|
||||
background-color: var(--vp-code-block-bg)
|
||||
font-family: 'Roboto Mono', monospace
|
||||
font-size: 0.85rem
|
||||
line-height: 1.5
|
||||
|
||||
& > ul {
|
||||
margin: 0
|
||||
}
|
||||
|
||||
li {
|
||||
& + li {
|
||||
margin-top: 0
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
&.folder {
|
||||
&.main {
|
||||
color: var(--vp-c-brand) !important
|
||||
}
|
||||
}
|
||||
|
||||
&.folder,
|
||||
&.file.zip {
|
||||
color: var(--vp-c-brand-lighter) !important
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-left: 5px
|
||||
list-style: none
|
||||
|
||||
li {
|
||||
position: relative
|
||||
padding-left: 15px
|
||||
-webkit-box-sizing: border-box
|
||||
-moz-box-sizing: border-box
|
||||
box-sizing: border-box
|
||||
|
||||
&:before {
|
||||
top: 15px
|
||||
left: 0
|
||||
width: 10px
|
||||
height: 1px
|
||||
margin: auto
|
||||
}
|
||||
|
||||
&:after {
|
||||
top: 0
|
||||
bottom: 0
|
||||
left: 0
|
||||
width: 1px
|
||||
height: 100%
|
||||
}
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
position: absolute
|
||||
content: ''
|
||||
background-color: var(--vp-c-code-dimm)
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
&:after {
|
||||
height: 15px
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-icon {
|
||||
height: 12px
|
||||
width: 12px
|
||||
margin-right: 6px
|
||||
display: inline-block
|
||||
}
|
||||
}
|
@ -230,5 +230,5 @@ The app will then use your custom image in the local source listing.
|
||||
|
||||
|
||||
<style scoped>
|
||||
@import "../../.vitepress/theme/styles/tree.css"
|
||||
@import "../../.vitepress/theme/styles/tree.styl"
|
||||
</style>
|
||||
|
@ -60,5 +60,5 @@ const members = [
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import "../.vitepress/theme/styles/forks/neko.css"
|
||||
@import "../.vitepress/theme/styles/forks/neko.styl"
|
||||
</style>
|
||||
|
@ -3,7 +3,7 @@ title: TachiyomiAZ
|
||||
description: Hentai-focused with legacy features
|
||||
|
||||
layout: home
|
||||
pageClass: page-tachiyomiaz
|
||||
pageClass: page-tachiyomi-az
|
||||
|
||||
hero:
|
||||
name: TachiyomiAZ
|
||||
@ -78,5 +78,5 @@ const members = [
|
||||
</div>
|
||||
|
||||
<style scoped>
|
||||
@import "../.vitepress/theme/styles/forks/tachiyomi-az.css"
|
||||
@import "../.vitepress/theme/styles/forks/tachiyomi-az.styl"
|
||||
</style>
|
||||
|
@ -3,7 +3,7 @@ title: TachiyomiJ2K
|
||||
description: New approach to the design of the base app along with several other enhancements
|
||||
|
||||
layout: home
|
||||
pageClass: page-tachiyomij2k
|
||||
pageClass: page-tachiyomi-j2k
|
||||
|
||||
hero:
|
||||
name: TachiyomiJ2K
|
||||
@ -52,5 +52,5 @@ const members = [
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import "../.vitepress/theme/styles/forks/tachiyomi-j2k.css"
|
||||
@import "../.vitepress/theme/styles/forks/tachiyomi-j2k.styl"
|
||||
</style>
|
||||
|
@ -3,7 +3,7 @@ title: TachiyomiSY
|
||||
description: LongDesc
|
||||
|
||||
layout: home
|
||||
pageClass: page-tachiyomisy
|
||||
pageClass: page-tachiyomi-sy
|
||||
|
||||
hero:
|
||||
name: TachiyomiSY
|
||||
@ -68,5 +68,5 @@ const members = [
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import "../.vitepress/theme/styles/forks/tachiyomi-sy.css"
|
||||
@import "../.vitepress/theme/styles/forks/tachiyomi-sy.styl"
|
||||
</style>
|
||||
|
25
stylelint.config.js
Normal file
25
stylelint.config.js
Normal file
@ -0,0 +1,25 @@
|
||||
module.exports = {
|
||||
plugins: ["stylelint-stylus"],
|
||||
rules: {
|
||||
"stylus/pythonic": "never",
|
||||
"stylus/declaration-colon": "always",
|
||||
"stylus/semicolon": "never",
|
||||
"stylus/single-line-comment-double-slash-space-after": "always",
|
||||
"stylus/property-no-unknown": null,
|
||||
"stylus/selector-type-no-unknown": null,
|
||||
"stylus/selector-list-comma": "always",
|
||||
"stylus/indentation": [
|
||||
"tab",
|
||||
{
|
||||
indentInsideParens: "twice",
|
||||
},
|
||||
],
|
||||
"rule-empty-line-before": [
|
||||
"always",
|
||||
{
|
||||
except: ["first-nested"],
|
||||
},
|
||||
],
|
||||
},
|
||||
extends: ["stylelint-stylus/standard"],
|
||||
};
|
Loading…
Reference in New Issue
Block a user