From 6d2c43f10f4509da8eca3eaadedab89581141bed Mon Sep 17 00:00:00 2001 From: Guennadi Maximov C Date: Fri, 17 Oct 2025 17:25:09 -0600 Subject: [PATCH] docs: added `README_EN.md` for English users and improved `README` Signed-off-by: Guennadi Maximov C --- README.md | 31 ++++++++++++++++------- README_EN.md | 69 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 91 insertions(+), 9 deletions(-) create mode 100644 README_EN.md diff --git a/README.md b/README.md index cf233f7..e03c709 100644 --- a/README.md +++ b/README.md @@ -1,16 +1,23 @@ -> Translate this file into your native language using `Google Translate` or a [similar service](https://immersivetranslate.com). +> The English version of this file can be found [here](./README_EN.md). +> +> You may also translate this file into your native language using `Google Translate` or a [similar service](https://immersivetranslate.com). # CSSVarViewer -Este plugin para **Neovim** te permite identificar fácilmente el valor de las variables CSS que has definido previamente en tus archivos de estilo, como `main.css` o `style.css`. Cuando el plugin detecta una variable CSS en estos archivos, la muestra en un texto virtual, lo que facilita su visualización desde cualquier otro archivo. +Esta extensión para **Neovim** permite identificar fácilmente el valor de las variables CSS +que se hayan definido previamente en tus archivos de estilo (_stylesheets_), +tales como `main.css` ó `style.css`. +Cuando el plugin detecta una variable CSS en estos archivos la mostrará en un texto virtual, +facilitando su visualización desde cualquier otro archivo. -> La idea de este plugin es que centralices tus variables CSS en un solo archivo, para tener un mejor control a la hora de editar tus estilos. +> La idea de esta extensión es permitirle al usuario centralizar sus variables CSS en un solo archivo +> para tener así un mejor control a la hora de editar tus _stylesheets_. ## 🗒️ Requerimientos -* [`Neovim`](https://github.com/neovim/neovim): Versión 0.7 o superior. +* [`Neovim`](https://github.com/neovim/neovim): Versión 0.7 ó superior. -### Instalación +## Instalación Usando [`folke/lazy.nvim`](https://github.com/folke/lazy.nvim): @@ -44,17 +51,23 @@ require('CSSVarViewer').setup({ | `CSSVarViewer` `toggle()` | `Normal` | `cv` | Activa el plugin | | `paste_value()` | `Visual` | `cv` | Pega el texto virtual en el cursor | ->[!NOTE] +> [!IMPORTANT] > Para actualizar los datos, debes guardar el archivo que contiene tus variables CSS. -Puedes ampliar la búsqueda de archivos hacia un directorio específico o analizar otros archivos utilizando el comando `:CSSVarViewer`, cuya sintaxis es la misma que la utilizada en [`CSSVarHighlight`](https://github.com/farias-hecdin/CSSVarHighlight#comandos-y-atajos-de-teclado). Es decir: +Puedes ampliar la búsqueda de archivos hacia un directorio específico +o analizar otros archivos utilizando el comando `:CSSVarViewer`, +cuya sintaxis es la misma que la utilizada en [`CSSVarHighlight`](https://github.com/farias-hecdin/CSSVarHighlight#comandos-y-atajos-de-teclado). + +Por ejemplo: ```sh :CSSVarViewer ``` -Si deseas pegar el valor del texto virtual, selecciona la variable CSS en modo visual (por ejemplo, `var(--primary-rgb)`) y luego presiona `cv` o utiliza el comando `:CSSVarViewer`. +Si deseas pegar el valor del texto virtual, selecciona la variable CSS en modo visual +(por ejemplo, `var(--primary-rgb)`) y luego presiona `cv` ó utiliza el comando `:CSSVarViewer`. ## 🛡️ Licencia -CSSVarViewer está bajo la licencia MIT. Consulta el archivo `LICENSE` para obtener más información. +CSSVarViewer está bajo la licencia MIT. +Consulta el archivo [`LICENSE`](./LICENSE) para obtener más información. diff --git a/README_EN.md b/README_EN.md new file mode 100644 index 0000000..44c4d2a --- /dev/null +++ b/README_EN.md @@ -0,0 +1,69 @@ +# CSSVarViewer + +This **Neovim** plugin allows the user to identify the value of +CSS variables that had been previously defined in a stylesheet file +(e.g. `main.css`, `style.css`). +Whenever this plugin detects a CSS variable a virtual text will be shown, +making it easier to visualize from any other file. + +> The aim of this plugin is to allow users to centralize their CSS variables +> within a single file. This is to give a better control of editing stylesheets. + +## 🗒️ Requirements + +* [`Neovim`](https://github.com/neovim/neovim): 0.7 or higher. + +## Installing + +Using [`folke/lazy.nvim`](https://github.com/folke/lazy.nvim): + +```lua +{ + 'farias-hecdin/CSSVarViewer', + ft = "css", + config = true, + -- If you want to configure some options, replace the previous line with: + -- config = function() + -- end, +} +``` + +## 🗒️ Configuration + +These are the default configuration values: + +```lua +require('CSSVarViewer').setup({ + parent_search_limit = 5,-- Parent search limit (number of levels to search upwards). + filename_to_track = "main", -- Name of the file to track (e.g. "main" for main.css). + disable_keymaps = false, -- Indicates whether keymaps are disabled. +}) +``` + +### Mappings + +| Commands/API | Mode | Keymaps | Description | +| ------------------------- | -------- | ------------ | ------------------------------------------ | +| `CSSVarViewer` `toggle()` | `Normal` | `cv` | Toggles the plugin | +| `paste_value()` | `Visual` | `cv` | Will paste the virtual text at the cursor | + +> [!IMPORTANT] +> The data will only be updated when the files containing the CSS variables are saved. + +You can search other files/directories using the `:CSSVarViewer` command, +which uses similar syntax as [`CSSVarHighlight`](https://github.com/farias-hecdin/CSSVarHighlight#comandos-y-atajos-de-teclado). + +For example: + +```sh +:CSSVarViewer +``` + +If you wish to paste the value of the virtual text you must select the CSS variable **on Visual +mode** (e.g. `var(--primary-rgb)`), then either press `cv` or using the `:CSSVarViewer` +command. + +## 🛡️ License + +`CSSVarViewer` is licensed under the MIT License. +See [`LICENSE`](./LICENSE) for more info.