Change CSS to Stylus

Also reworks some lint commands
This commit is contained in:
Soitora 2023-07-25 22:38:04 +02:00
parent 37884467f8
commit 7de935b557
No known key found for this signature in database
GPG Key ID: A6D711EB4F2CCD97
23 changed files with 2809 additions and 678 deletions

View File

@ -1,4 +1,11 @@
*.png
*.jpg
*.webm
*.webp
*.ico
*.svg
*.md
*.styl
*.vue
dist
pnpm-lock.yaml

47
.stylintrc Normal file
View 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

File diff suppressed because it is too large Load Diff

View File

@ -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"
},

View File

@ -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,

View 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
}

View File

@ -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);
}

View 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)
}

View File

@ -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;
}
}

View 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%)
}
}

View File

@ -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);
}

View 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)
}

View File

@ -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);
}

View 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)
}

View File

@ -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;
}

View File

@ -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;
}

View 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
}
}

View File

@ -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>

View File

@ -60,5 +60,5 @@ const members = [
</script>
<style>
@import "../.vitepress/theme/styles/forks/neko.css"
@import "../.vitepress/theme/styles/forks/neko.styl"
</style>

View File

@ -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>

View File

@ -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>

View File

@ -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
View 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"],
};