diff --git a/README.md b/README.md index 287d580..798c4e2 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,4 @@ -

- 中文 | - English -

- -# Gitea GitHub Theme +# Gitea Banana Theme > [!TIP] > @@ -35,13 +30,13 @@ Gitea 理论上小版本号变更不会修改前端布局, 所以主题的小版 > > 自动颜色主题需要亮色和暗色的主题文件 -例: 主题文件名为 `theme-github-dark.css`，则添加 `github-dark` 到 `THEMES` 末尾 +例: 主题文件名为 `theme-Banana-dark.css`，则添加 `Banana-dark` 到 `THEMES` 末尾 `gitea/conf/app.ini` 例: ```ini [ui] -THEMES = gitea-auto, gitea-light, gitea-dark, github-auto, github-light, github-dark, github-soft-dark +THEMES = gitea-auto, gitea-light, gitea-dark, Banana-auto, Banana-light, Banana-dark, Banana-soft-dark ``` 详细请查看 Gitea 文档 @@ -54,47 +49,47 @@ THEMES = gitea-auto, gitea-light, gitea-dark, github-auto, github-light, github- ### 基本主题 ```ini -THEMES = github-auto, github-light, github-dark, github-soft-dark +THEMES = Banana-auto, Banana-light, Banana-dark, Banana-soft-dark ```
Base -

theme-github-light.css

+

theme-Banana-light.css

-

theme-github-dark.css

+

theme-Banana-dark.css

-

theme-github-soft-dark.css

+

theme-Banana-soft-dark.css

### 色盲主题 ( Beta ) ```ini -THEMES = github-colorblind-auto, github-colorblind-light, github-colorblind-dark -THEMES = github-tritanopia-auto, github-tritanopia-light, github-tritanopia-dark +THEMES = Banana-colorblind-auto, Banana-colorblind-light, Banana-colorblind-dark +THEMES = Banana-tritanopia-auto, Banana-tritanopia-light, Banana-tritanopia-dark ```
Colorblind & Tritanopia (红绿色盲 & 蓝色盲) -

theme-github-colorblind-light.css & theme-github-tritanopia-light.css

+

theme-Banana-colorblind-light.css & theme-Banana-tritanopia-light.css

-

theme-github-colorblind-dark.css & theme-github-tritanopia-dark.css

+

theme-Banana-colorblind-dark.css & theme-Banana-tritanopia-dark.css

### 粉色主题 ```ini -THEMES = github-pink-auto, github-pink-light, github-pink-dark, github-pink-soft-dark +THEMES = Banana-pink-auto, Banana-pink-light, Banana-pink-dark, Banana-pink-soft-dark ```
Pink -

theme-github-pink-light.css

+

theme-Banana-pink-light.css

-

theme-github-pink-dark.css

+

theme-Banana-pink-dark.css

-

theme-github-pink-soft-dark.css

+

theme-Banana-pink-soft-dark.css

@@ -142,7 +137,7 @@ THEMES = github-pink-auto, github-pink-light, github-pink-dark, github-pink-soft ```bash git clone https://github.com/lutinglt/gitea-github-theme.git -cd gitea-github-theme +cd gitea-Banana-theme npm install npm run build ``` diff --git a/README_EN.md b/README_EN.md deleted file mode 100644 index 8bc1f5f..0000000 --- a/README_EN.md +++ /dev/null @@ -1,159 +0,0 @@ -

- 中文 | - English -

- -# Gitea GitHub Theme - -> [!TIP] -> -> Recommend using Catppuccin file icon browser plugin together for better performance. -> [web-file-explorer-icons](https://github.com/catppuccin/web-file-explorer-icons) - -## Version Number Explanation - -The theme version number is kept consistent with the Gitea version number - -Gitea version number format: `1.major.minor` - -Theoretically, minor version changes in Gitea do not modify the frontend layout, so the minor version of the theme is -applicable to all Gitea versions with the same major version number. - -For example: Theme version `1.24.5` is applicable to Gitea versions `>=1.24.0` `<1.25.0` - -Only the latest released Gitea version is maintained. Issues and PRs for other older theme versions will not be -accepted. - -> Development stage theme version number format: `1.major.minor.timestamp` - -## Installation - -1. Download the latest CSS theme file from the release page and place it in the `gitea/public/assets/css` directory -2. Modify `gitea/conf/app.ini` and append the CSS filename without the `theme-` prefix to the end of `THEMES` under the - `[ui]` section -3. Restart Gitea -4. Check the theme in the settings - -> [!IMPORTANT] -> -> Automatic color theme requires both light and dark theme files. - -Example: If the theme filename is `theme-github-dark.css`, add `github-dark` to the end of `THEMES` - -Example `gitea/conf/app.ini`: - -```ini -[ui] -THEMES = gitea-auto, gitea-light, gitea-dark, github-auto, github-light, github-dark, github-soft-dark -``` - -For details, please refer to the Gitea documentation -[Gitea docs](https://docs.gitea.com/next/administration/customizing-gitea#customizing-the-look-of-gitea) - -## Screenshots - -![Dashboard](screenshots/en/dashboard-en.png) - -### Basic Themes - -```ini -THEMES = github-auto, github-light, github-dark, github-soft-dark -``` - -
-Base -

theme-github-light.css

- -

theme-github-dark.css

- -

theme-github-soft-dark.css

- -
- -### Colorblind Themes (Beta) - -```ini -THEMES = github-colorblind-auto, github-colorblind-light, github-colorblind-dark -THEMES = github-tritanopia-auto, github-tritanopia-light, github-tritanopia-dark -``` - -
-Colorblind & Tritanopia -

theme-github-colorblind-light.css & theme-github-tritanopia-light.css

- -

theme-github-colorblind-dark.css & theme-github-tritanopia-dark.css

- -
- -### Pink Themes - -```ini -THEMES = github-pink-auto, github-pink-light, github-pink-dark, github-pink-soft-dark -``` - -
-Pink -

theme-github-pink-light.css

- -

theme-github-pink-dark.css

- -

theme-github-pink-soft-dark.css

- -
- -## Custom CSS Variables - -You can customize parts of the theme style according to your preferences - -### Usage Method - -Add the following code at the beginning or end of the theme's CSS file - -```css -:root { - --custom-clone-menu-width: 150px; - ... -} -``` - -> [!IMPORTANT] -> -> Please ensure to add custom variables in the `:root` selector, otherwise they will not take effect -> -> Variables are separated by `;` -> -> It is recommended to place custom variables in a separate file and append them to the theme file using shell commands -> or other methods - -### CSS Variables - -| Variable Name | Description | Default | Github | Recommend | Min | Max | -| :-------------------------------- | :------------------------------------------------------- | :------ | :----- | :-------- | :---- | :---- | -| --custom-branch-menu-width | Branch menu width | 320px | 320px | 320px | Gitea | 640px | -| --custom-clone-menu-width | Clone button menu width | Gitea | 332px | 200px | 150px | 400px | -| --custom-user-menu-width | User menu width | 192px | 200px | | Gitea | 320px | -| --custom-explore-repolist-columns | Number of repository list columns on explore page | 2 | 2 | 2 | | | -| --custom-explore-userlist-columns | Number of user/organization list columns on explore page | 3 | 1 | 2/3 | | | -| --custom-user-repolist-columns | Number of repository list columns on user page | 2 | 2 | 1/2 | | | -| --custom-org-repolist-columns | Number of repository list columns on organization page | 1 | 1 | 1/2 | | | -| --custom-org-userlist-columns | Number of user list columns on organization page | 2 | 1 | 1/2 | | | - -## Using Development Version of the Theme - -You might want to use the development version of the theme instead of the released version - -Please ensure you have Node.js environment installed, Node.js 20 or above is recommended - -```bash -git clone https://github.com/lutinglt/gitea-github-theme.git -cd gitea-github-theme -npm install -npm run build -``` - -After compilation, theme files will be generated in the `dist` directory. You can place the theme files into the -`gitea/public/assets/css` directory, then add the theme name to the end of `THEMES` in `gitea/conf/app.ini` - -## Contribution - -Please refer to [CONTRIBUTING](CONTRIBUTING.md)