diff --git a/.vitepress/config.mts b/.vitepress/config.mts index 3fe998a35..a8b397d7c 100644 --- a/.vitepress/config.mts +++ b/.vitepress/config.mts @@ -10,7 +10,8 @@ export default defineConfig({ lastUpdated: true, cleanUrls: true, appearance: "dark", - srcExclude: ["README.md", "single-page"], + srcExclude: ["README.md", "single-page", "DEVTools.md"], + ignoreDeadLinks: true, head: [ ["meta", { name: "theme-color", content: "#7bc5e4" }], ["meta", { name: "og:type", content: "website" }], diff --git a/.vitepress/theme/index.ts b/.vitepress/theme/index.ts index 8586ccadd..6193cd7a6 100644 --- a/.vitepress/theme/index.ts +++ b/.vitepress/theme/index.ts @@ -1,11 +1,10 @@ import { h } from "vue"; -import "uno.css" +import "uno.css"; import type { Theme } from "vitepress"; import DefaultTheme from "vitepress/theme"; import "./style.css"; export default { - extends: DefaultTheme, Layout: () => { return h(DefaultTheme.Layout, null, { }); diff --git a/.vitepress/theme/style.css b/.vitepress/theme/style.css index 64b54d394..3d62fb916 100644 --- a/.vitepress/theme/style.css +++ b/.vitepress/theme/style.css @@ -1,89 +1,93 @@ -/** - * Customize default theme styling by overriding CSS variables: - * https://github.com/vuejs/vitepress/blob/main/src/client/theme-default/styles/vars.css - */ - -/** - * Colors - * - * Each colors have exact same color scale system with 3 levels of solid - * colors with different brightness, and 1 soft color. - * - * - `XXX-1`: The most solid color used mainly for colored text. It must - * satisfy the contrast ratio against when used on top of `XXX-soft`. - * - * - `XXX-2`: The color used mainly for hover state of the button. - * - * - `XXX-3`: The color for solid background, such as bg color of the button. - * It must satisfy the contrast ratio with pure white (#ffffff) text on - * top of it. - * - * - `XXX-soft`: The color used for subtle background such as custom container - * or badges. It must satisfy the contrast ratio when putting `XXX-1` colors - * on top of it. - * - * The soft color must be semi transparent alpha channel. This is crucial - * because it allows adding multiple "soft" colors on top of each other - * to create a accent, such as when having inline code block inside - * custom containers. - * - * - `default`: The color used purely for subtle indication without any - * special meanings attched to it such as bg color for menu hover state. - * - * - `brand`: Used for primary brand colors, such as link text, button with - * brand theme, etc. - * - * - `tip`: Used to indicate useful information. The default theme uses the - * brand color for this by default. - * - * - `warning`: Used to indicate warning to the users. Used in custom - * container, badges, etc. - * - * - `danger`: Used to show error, or dangerous message to the users. Used - * in custom container, badges, etc. - * -------------------------------------------------------------------------- */ - :root { - --vp-c-default-1: var(--vp-c-gray-1); - --vp-c-default-2: var(--vp-c-gray-2); - --vp-c-default-3: var(--vp-c-gray-3); - --vp-c-default-soft: var(--vp-c-gray-soft); - - --vp-c-brand-1: var(--vp-c-indigo-1); - --vp-c-brand-2: var(--vp-c-indigo-2); - --vp-c-brand-3: var(--vp-c-indigo-3); - --vp-c-brand-soft: var(--vp-c-indigo-soft); - - --vp-c-tip-1: var(--vp-c-brand-1); - --vp-c-tip-2: var(--vp-c-brand-2); - --vp-c-tip-3: var(--vp-c-brand-3); - --vp-c-tip-soft: var(--vp-c-brand-soft); - - --vp-c-warning-1: var(--vp-c-yellow-1); - --vp-c-warning-2: var(--vp-c-yellow-2); - --vp-c-warning-3: var(--vp-c-yellow-3); - --vp-c-warning-soft: var(--vp-c-yellow-soft); - - --vp-c-danger-1: var(--vp-c-red-1); - --vp-c-danger-2: var(--vp-c-red-2); - --vp-c-danger-3: var(--vp-c-red-3); - --vp-c-danger-soft: var(--vp-c-red-soft); + --vp-c-brand: #7bc5e4; + --vp-c-brand-light: #a4d5ec; + --vp-c-brand-lighter: #c4e2f2; + --vp-c-brand-lightest: #e1f0f8; + --vp-c-brand-dark: #4882a7; + --vp-c-brand-darker: #36678c; + --vp-c-brand-dimm: rgba(123, 197, 228, 0.08); + --vp-button-brand-border: var(--vp-c-brand-light); + --vp-button-brand-text: var(--vp-c-white); + --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-white); + --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-white); + --vp-button-brand-active-bg: var(--vp-button-brand-bg); + --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); + --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); + --vp-c-green-light: #16a891; + --vp-button-alt-bg: #f5f5f5; + --vp-button-alt-text: rgb(75, 85, 99); + --vp-button-alt-hover-bg: #efeeee; + --vp-button-alt-hover-text: rgb(75, 85, 99); + --vp-c-bg-nav: rgba(255, 255, 255, 0.7); + --vp-c-bg-mark: rgb(232, 232, 232); + --vp-custom-block-info-bg: rgba(171, 210, 244, 0.05); + --vp-custom-block-info-border: #60c4fa; + --vp-custom-block-info-text: rgb(39, 115, 145); + --vp-custom-block-info-text-deep: rgb(18, 121, 162); + --vp-custom-block-tip-bg: rgba(137, 202, 176, 0.05); + --vp-custom-block-tip-border: rgba(34, 197, 94, 1); + --vp-custom-block-tip-text: rgb(10, 128, 90); + --vp-custom-block-tip-text-deep: rgb(11, 133, 94); + --vp-custom-block-warning-bg: rgba(250, 204, 21, 0.05); + --vp-custom-block-warning-border: rgba(245, 158, 11, 1); + --vp-custom-block-warning-text: rgb(166, 114, 35); + --vp-custom-block-warning-text-deep: rgb(199, 109, 6); + --vp-custom-block-danger-bg: rgba(220, 38, 38, 0.05); + --vp-custom-block-danger-border: rgba(248, 113, 113, 1); + --vp-custom-block-danger-text: rgb(196, 46, 46); + --vp-custom-block-danger-text-deep: rgba(220, 38, 38, 1); } -/** - * Component: Button - * -------------------------------------------------------------------------- */ +.dark { + --vp-c-bg: rgb(26, 26, 26); + --vp-c-bg-alt: rgb(23, 23, 23); + --vp-c-bg-nav: rgba(23, 23, 23, 0.8); + --vp-c-bg-mark: rgb(0, 0, 0); + --vp-button-brand-bg: var(--vp-c-brand-dark); + --vp-button-alt-bg: #484848; + --vp-button-alt-text: #f0eeee; + --vp-button-alt-hover-bg: #484848; + --vp-button-alt-hover-text: #f0eeee; + --vp-custom-block-info-bg: rgba(84, 110, 155, 0.1); + --vp-custom-block-info-border: #3686b1; + --vp-custom-block-info-text: #52b0e3; + --vp-custom-block-info-text-deep: #00b7ff; + --vp-custom-block-tip-bg: rgba(51, 130, 118, 0.1); + --vp-custom-block-tip-border: rgba(4, 120, 87, 1); + --vp-custom-block-tip-text: rgb(25, 190, 129); + --vp-custom-block-tip-text-deep: rgba(52, 211, 153, 1); + --vp-custom-block-warning-bg: rgba(253, 224, 71, 0.1); + --vp-custom-block-warning-border: rgba(202, 138, 4, 1); + --vp-custom-block-warning-text: rgba(234, 179, 8, 1); + --vp-custom-block-warning-text-deep: rgba(250, 204, 21, 1); + --vp-custom-block-danger-bg: rgba(239, 68, 68, 0.1); + --vp-custom-block-danger-border: rgba(127, 29, 29, 1); + --vp-custom-block-danger-text: rgba(248, 113, 113, 1); + --vp-custom-block-danger-text-deep: rgba(248, 113, 113, 1); +} -:root { - --vp-button-brand-border: transparent; - --vp-button-brand-text: var(--vp-c-white); - --vp-button-brand-bg: var(--vp-c-brand-3); - --vp-button-brand-hover-border: transparent; - --vp-button-brand-hover-text: var(--vp-c-white); - --vp-button-brand-hover-bg: var(--vp-c-brand-2); - --vp-button-brand-active-border: transparent; - --vp-button-brand-active-text: var(--vp-c-white); - --vp-button-brand-active-bg: var(--vp-c-brand-1); +.vp-doc a { + color: var(--vp-c-brand); + text-decoration: underline; + text-underline-offset: 4px; + text-decoration-style: solid; + text-decoration-color: transparent; + -webkit-text-decoration-color: transparent; + transition: text-decoration-color 0.25s; +} + +.vp-doc a:hover { + color: var(--vp-c-brand); + text-decoration-color: var(--vp-c-brand); + -webkit-text-decoration-color: var(--vp-c-brand); } /** diff --git a/index.md b/index.md index cde8fa456..9adb2d1e5 100644 --- a/index.md +++ b/index.md @@ -3,18 +3,18 @@ layout: home hero: name: "FMHY" - text: "site" - tagline: My great project tagline + text: "/r/freemediaheckyeah" + tagline: The Largest Collection Of Free Stuff On The Internet! image: src: /test.png - alt: FMHY + alt: FMHY Icon actions: - theme: brand - text: Beginners Guide + text: Get Started link: /Beginners-Guide - theme: alt - text: Deez nuts - link: /AI + text: Discord + link: https://discord.gg/Stz6y6NgNg features: - title: Feature A