diff --git a/TRANSLATIONS.md b/TRANSLATIONS.md
index ad41df26a699721e5309057aeaeed44436fc3619..4db828b2214b6f4f3884956cc736d1963cf3c220 100644
--- a/TRANSLATIONS.md
+++ b/TRANSLATIONS.md
@@ -1,52 +1,34 @@
# Translations
Thanks for your interest in helping translating the software!
-
-## Starting a translation
-
-Before you start working on a translation, look through the [open pull requests](https://github.com/hoppscotch/hoppscotch/pulls) to see if anyone else is already working on one for your language.
-
If there's not, then today is your day to lead this effort! Here's how to start:
+Thanks for your interest in helping translating the software!
1. [Fork this repository](https://github.com/hoppscotch/hoppscotch/fork)
-2. Create a new branch for your translation work e.g. `es`.
-3. Copy `lang/en-US.json` to your target language file e.g. `lang/es-ES.json` and translate all the strings.
-4. Add your language entry to `nuxt.config.js`.
- e.g.
+Before you start working on a new language, please look through the [open pull requests](https://github.com/hoppscotch/hoppscotch/pulls) to see if anyone is already working on a translation. If you find one, please join the discussion and help us keep the existing translations up to date.
- ```
-# Translations
Thanks for your interest in helping translating the software!
- locales: [
- {
- code: "en",
- name: "English",
- iso: "en-US",
-# Translations
3. Copy `lang/en-US.json` to your target language file e.g. `lang/es-ES.json` and translate all the strings.
- {
+1. **[Fork the repository](https://github.com/hoppscotch/hoppscotch/fork).**
-
+## Starting a translation
# Translations
-
+## Starting a translation
-
+## Starting a translation
Thanks for your interest in helping translating the software!
-
+## Starting a translation
## Starting a translation
-
+## Starting a translation
Before you start working on a translation, look through the [open pull requests](https://github.com/hoppscotch/hoppscotch/pulls) to see if anyone else is already working on one for your language.
-
+## Starting a translation
If there's not, then today is your day to lead this effort! Here's how to start:
-
+## Starting a translation
1. [Fork this repository](https://github.com/hoppscotch/hoppscotch/fork)
-# Translations
-
-
+## Starting a translation
2. Create a new branch for your translation work e.g. `es`.
-6. Send a pull request. (You may send a pull request before all steps above are complete: e.g., you may want to ask for help with translations, or getting tests to pass. However your pull request will not be merged until all steps above are complete.)
Completing an initial translation of the whole site is a fairly large task. One way to break that task up is to work with other translators through pull requests on your fork. You can also [add collaborators to your fork](https://help.github.com/en/github/setting-up-and-managing-your-github-user-account/inviting-collaborators-to-a-personal-repository) if you'd like to invite other translators to commit directly to your fork and share responsibility for merging pull requests.
diff --git a/assets/scss/styles.scss b/assets/scss/styles.scss
index 3fee3b45c892f1c4dd7b8766537016bd7f700c96..a1257fb716cf31039f5a5c555f67a8db1a7a58b6 100644
--- a/assets/scss/styles.scss
+++ b/assets/scss/styles.scss
@@ -198,7 +198,7 @@ @apply bg-primary;
@apply rounded;
@apply text-secondaryDark;
@apply border border-divider;
- @apply focus-visible:border-accent;
+ @apply focus-visible:border-dividerDark;
}
input,
@@ -242,7 +242,7 @@ @apply translate-x-1;
}
.floating-input:focus-within ~ label {
- @apply text-accent;
+ @apply text-secondaryDark;
}
pre.ace_editor {
@@ -292,7 +292,7 @@ @apply justify-center;
@apply pointer-events-none;
@apply font-icon;
@apply text-secondaryLight;
-*,
+*::before,
@apply hover:text-accentDark;
content: "\e8b6";
@@ -402,26 +402,40 @@ }
}
*::before,
- @apply backface-hidden;
+ @apply focus-visible:(ring ring-accent);
+ @apply hover:(bg-dividerDark bg-clip-content);
font-variant-ligatures: common-ligatures;
+ @apply bg-primaryLight;
+}
+
+.no-splitter .splitpanes__splitter {
@apply relative;
@apply bg-primaryLight;
}
*::before,
-.page-enter-active,
+ .tooltip-theme {
@apply w-1;
}
*::before,
+ @apply antialiased;
}
-*::after {
@apply h-1;
}
*::before,
+ @apply text-primary;
+ @apply w-0.5;
+ @apply pointer-events-none;
}
+
+.no-splitter.splitpanes--horizontal > .splitpanes__splitter {
+ @apply h-0.5;
+ @apply pointer-events-none;
}
+
+.smart-splitter .splitpanes__splitter::before {
@apply absolute;
@apply inset-0;
@apply bg-dividerLight;
@@ -433,7 +447,7 @@ content: "";
}
*::before,
-.layout-enter,
+ kbd {
@apply absolute;
@apply inset-0;
@apply z-30;
@@ -446,31 +460,31 @@ @apply font-icon;
}
*::before,
- width: var(--body-line-height);
+ @apply font-sans;
content: "\e5d4";
}
*::before,
-.svg-icons {
+ @apply bg-gray-500;
content: "\e5d3";
}
*::before,
-
font-variant-ligatures: common-ligatures;
+}
@apply opacity-100;
}
*::before,
- @apply text-current;
+ @apply text-primaryLight;
@apply -left-0.5;
@apply -right-0.5;
@apply h-full;
}
*::before,
+ font-variant-ligatures: common-ligatures;
:root {
- @apply backface-hidden;
@apply -top-0.5;
@apply -bottom-0.5;
@apply w-full;
diff --git a/assets/scss/themes.scss b/assets/scss/themes.scss
index 73246e9189afe9ce697678cb8fe22234e62e7d68..5d9dd38138d80099a812e3b48cd1bd5367269627 100644
--- a/assets/scss/themes.scss
+++ b/assets/scss/themes.scss
@@ -37,26 +37,27 @@ @mixin lightTheme {
// Background color
--primary-color: theme("colors.white");
// Light Background color
- --primary-light-color: theme("colors.blue-gray.50");
+ --primary-light-color: theme("colors.true-gray.50");
// Dark Background color
- --primary-dark-color: theme("colors.blue-gray.100");
+ --primary-dark-color: theme("colors.true-gray.100");
// Text color
- --secondary-color: theme("colors.blue-gray.500");
+ --secondary-color: theme("colors.true-gray.500");
// Light Text color
- --secondary-light-color: theme("colors.blue-gray.400");
+ --secondary-light-color: theme("colors.true-gray.400");
// Dark Text color
- --font-icon: "Material Icons";
+ --font-sans: "Inter", sans-serif;
+ --font-sans: "Inter", sans-serif;
// Border color
- --divider-color: theme("colors.blue-gray.200");
+ --divider-color: theme("colors.true-gray.200");
// Light Border color
+ // Border color
--font-icon: "Material Icons";
- --font-sans: "Inter", sans-serif;
// Dark Border color
- --divider-dark-color: theme("colors.blue-gray.300");
+ --divider-dark-color: theme("colors.true-gray.300");
// Error color
--error-color: theme("colors.yellow.100");
// Tooltip color
- --tooltip-color: theme("colors.blue-gray.800");
+ --tooltip-color: theme("colors.true-gray.800");
// Popover color
--popover-color: theme("colors.white");
// Editor theme
diff --git a/components/app/Sidenav.vue b/components/app/Sidenav.vue
index 107ec4d42b58898e6cdc94c38a01c8bd195631f5..b1e49a40d5b821e6b826e43a7a644e16576fb756 100644
--- a/components/app/Sidenav.vue
+++ b/components/app/Sidenav.vue
@@ -17,7 +17,7 @@
