From 05fa096e4f92c9dce731c27642bb5440a5091186 Mon Sep 17 00:00:00 2001 From: Lazaro Alonso Date: Sat, 11 Jan 2025 10:53:30 +0100 Subject: [PATCH 1/2] that green --- docs/src/.vitepress/theme/style.css | 9 +++++---- template/src/.vitepress/theme/style.css | 9 +++++---- 2 files changed, 10 insertions(+), 8 deletions(-) diff --git a/docs/src/.vitepress/theme/style.css b/docs/src/.vitepress/theme/style.css index 12c4de7e..b24a993b 100644 --- a/docs/src/.vitepress/theme/style.css +++ b/docs/src/.vitepress/theme/style.css @@ -56,9 +56,10 @@ pre, code { :root.dark { /* Greens */ - --vp-dark-green: #2a6e4f; /* Main accent green */ - --vp-dark-green-light: #3b8a65; - --vp-dark-green-lighter: #52a67b; + --vp-dark-green: #155f3e; /* Main accent green */ + --vp-dark-green-dark: #2b855c; + --vp-dark-green-light: #42d392; + --vp-dark-green-lighter: #35eb9a; --vp-dark-green-dimm: #2e3834; /* Complementary Colors */ @@ -87,7 +88,7 @@ pre, code { --vp-button-brand-bg: var(--vp-dark-green); --vp-button-brand-hover-border: var(--vp-dark-green-lighter); --vp-button-brand-hover-text: var(--vp-dark-text); - --vp-button-brand-hover-bg: var(--vp-dark-green-light); + --vp-button-brand-hover-bg: var(--vp-dark-green-dark); --vp-button-brand-active-border: var(--vp-dark-green-light); --vp-button-brand-active-text: var(--vp-dark-text); --vp-button-brand-active-bg: var(--vp-dark-green); diff --git a/template/src/.vitepress/theme/style.css b/template/src/.vitepress/theme/style.css index 12c4de7e..b24a993b 100644 --- a/template/src/.vitepress/theme/style.css +++ b/template/src/.vitepress/theme/style.css @@ -56,9 +56,10 @@ pre, code { :root.dark { /* Greens */ - --vp-dark-green: #2a6e4f; /* Main accent green */ - --vp-dark-green-light: #3b8a65; - --vp-dark-green-lighter: #52a67b; + --vp-dark-green: #155f3e; /* Main accent green */ + --vp-dark-green-dark: #2b855c; + --vp-dark-green-light: #42d392; + --vp-dark-green-lighter: #35eb9a; --vp-dark-green-dimm: #2e3834; /* Complementary Colors */ @@ -87,7 +88,7 @@ pre, code { --vp-button-brand-bg: var(--vp-dark-green); --vp-button-brand-hover-border: var(--vp-dark-green-lighter); --vp-button-brand-hover-text: var(--vp-dark-text); - --vp-button-brand-hover-bg: var(--vp-dark-green-light); + --vp-button-brand-hover-bg: var(--vp-dark-green-dark); --vp-button-brand-active-border: var(--vp-dark-green-light); --vp-button-brand-active-text: var(--vp-dark-text); --vp-button-brand-active-bg: var(--vp-dark-green); From 7d2b799df3de296e2c839d3c66c57266a94a257a Mon Sep 17 00:00:00 2001 From: Lazaro Alonso Date: Sat, 11 Jan 2025 18:22:02 +0100 Subject: [PATCH 2/2] done with green --- docs/src/.vitepress/theme/style.css | 27 +++++++++++++++++++------ docs/src/components/AsideTrustees.vue | 4 ++-- template/src/.vitepress/theme/style.css | 27 +++++++++++++++++++------ 3 files changed, 44 insertions(+), 14 deletions(-) diff --git a/docs/src/.vitepress/theme/style.css b/docs/src/.vitepress/theme/style.css index b24a993b..37e1cbde 100644 --- a/docs/src/.vitepress/theme/style.css +++ b/docs/src/.vitepress/theme/style.css @@ -52,9 +52,7 @@ pre, code { --vp-c-brand-dark: #535bf2; --vp-c-brand-darker: #454ce1; --vp-c-brand-dimm: #212425; -} - -:root.dark { + --vp-tip-bg: rgb(254, 254, 254); /* Greens */ --vp-dark-green: #155f3e; /* Main accent green */ --vp-dark-green-dark: #2b855c; @@ -65,7 +63,7 @@ pre, code { /* Complementary Colors */ --vp-dark-gray: #1e1e1e; --vp-dark-gray-soft: #2a2a2a; - --vp-dark-gray-mute: #383838; + --vp-dark-gray-mute: #242424; --vp-light-gray: #d1d5db; /* Text Colors */ @@ -76,9 +74,26 @@ pre, code { --vp-dark-bg: #121212; /* Main background */ --vp-dark-bg-alt: #1a1a1a; /* Alternative background */ --vp-dark-bg-dimm: #101010; - - /* Borders */ + + /* Borders */ --vp-dark-border: #3b8a65; + /* custom tip */ + --vp-custom-block-tip-border: var(--vp-c-brand-darker); + --vp-custom-block-tip-bg: var(--vp-tip-bg); + /* button */ + --vp-button-brand-border: var(--vp-dark-green-dark); + --vp-button-brand-bg: var(--vp-dark-green-dark); + --vp-button-brand-hover-border: var(--vp-dark-green-dark); + --vp-button-brand-hover-bg: var(--vp-dark-green); + --vp-button-brand-active-border: var(--vp-dark-green-light); + --vp-button-brand-active-bg: var(--vp-dark-green); +} + +:root.dark { + /* custom tip */ + --vp-custom-block-tip-border: var(--vp-dark-green-dark); + --vp-custom-block-tip-text: var(--vp-dark-subtext); + --vp-custom-block-tip-bg: var(--vp-dark-gray-mute); } /* Button */ diff --git a/docs/src/components/AsideTrustees.vue b/docs/src/components/AsideTrustees.vue index 8fff3d38..edd1c2ec 100644 --- a/docs/src/components/AsideTrustees.vue +++ b/docs/src/components/AsideTrustees.vue @@ -59,11 +59,11 @@ width: 100%; gap: 1rem; background-color: var(--vp-c-bg-alt); - border: 2px solid var(--vp-c-bg-alt); + border: 1.25px solid var(--vp-c-bg-alt); transition: border-color 0.5s; } .enjoyer:hover { - border: 2px solid var(--vp-c-brand-light); + border: 1.25px solid var(--vp-c-brand-1); } .enjoyer img { transition: transform 0.5s; diff --git a/template/src/.vitepress/theme/style.css b/template/src/.vitepress/theme/style.css index b24a993b..37e1cbde 100644 --- a/template/src/.vitepress/theme/style.css +++ b/template/src/.vitepress/theme/style.css @@ -52,9 +52,7 @@ pre, code { --vp-c-brand-dark: #535bf2; --vp-c-brand-darker: #454ce1; --vp-c-brand-dimm: #212425; -} - -:root.dark { + --vp-tip-bg: rgb(254, 254, 254); /* Greens */ --vp-dark-green: #155f3e; /* Main accent green */ --vp-dark-green-dark: #2b855c; @@ -65,7 +63,7 @@ pre, code { /* Complementary Colors */ --vp-dark-gray: #1e1e1e; --vp-dark-gray-soft: #2a2a2a; - --vp-dark-gray-mute: #383838; + --vp-dark-gray-mute: #242424; --vp-light-gray: #d1d5db; /* Text Colors */ @@ -76,9 +74,26 @@ pre, code { --vp-dark-bg: #121212; /* Main background */ --vp-dark-bg-alt: #1a1a1a; /* Alternative background */ --vp-dark-bg-dimm: #101010; - - /* Borders */ + + /* Borders */ --vp-dark-border: #3b8a65; + /* custom tip */ + --vp-custom-block-tip-border: var(--vp-c-brand-darker); + --vp-custom-block-tip-bg: var(--vp-tip-bg); + /* button */ + --vp-button-brand-border: var(--vp-dark-green-dark); + --vp-button-brand-bg: var(--vp-dark-green-dark); + --vp-button-brand-hover-border: var(--vp-dark-green-dark); + --vp-button-brand-hover-bg: var(--vp-dark-green); + --vp-button-brand-active-border: var(--vp-dark-green-light); + --vp-button-brand-active-bg: var(--vp-dark-green); +} + +:root.dark { + /* custom tip */ + --vp-custom-block-tip-border: var(--vp-dark-green-dark); + --vp-custom-block-tip-text: var(--vp-dark-subtext); + --vp-custom-block-tip-bg: var(--vp-dark-gray-mute); } /* Button */