Theme Documentation (#3415)

* adding self CREDITS.md

* add "theme" to link for easier navigation

* add documentation about themes and the files that go in them

* add admin documentation for themes

* fix markdown styling

* fix CSSJanus usage
This commit is contained in:
Lukas Vacula
2021-02-06 10:46:03 -05:00
committed by GitHub
parent 4a87f34bcf
commit a3f07d7d5e
4 changed files with 51 additions and 8 deletions

View File

@@ -9,6 +9,7 @@ Learn how to install, update, and backup FreshRSS, as well as how to use the com
## Tutorials and Examples
* [Backing up FreshRSS](05_Backup.md)
* [Installing themes](11_Themes.md)
* [Installation on Debian 9/Ubuntu 16.04](06_LinuxInstall.md)
* [Updating on Debian 9/Ubuntu 16.04](07_LinuxUpdate.md)
* [Setting Up Automatic Feed Updating](08_FeedUpdates.md)

View File

@@ -0,0 +1,17 @@
# Theming
**Note: Currently personal themes are not officially supported and may be overwritten when updating. Be sure to keep backups!**
**For small theme changes, the official [CustomCSS extension](https://github.com/FreshRSS/Extensions) is recommended.**
Themes should be installed at `FreshRSS/p/themes/theme-name`. Docker users can use
```
-v /home/you/my-theme/:/var/www/FreshRSS/p/themes/my-theme/
```
or a similar method to add their theme to their FreshRSS instance.
# Creating themes
Information on creating themes can be found in [the developer documentation.](/docs/en/developers/04_Frontend/02_Design)

View File

@@ -23,7 +23,7 @@ Start by creating your development environment. A guide to setting up FreshRSS's
## Frontend Development
* [View files](04_Frontend/01_View_files.md)
* [Design](04_Frontend/02_Design.md)
* [Design (Themes/Theming)](04_Frontend/02_Design.md)
## Minz
Minz is the homemade PHP framework used by FreshRSS. More information can be found [here](Minz/index.md).
Minz is the homemade PHP framework used by FreshRSS. More information can be found [here](Minz/index.md).

View File

@@ -1,11 +1,36 @@
# Template file
**TODO**
# Writing a new theme
**TODO**
**Note: Currently personal themes are not officially supported and may be overwritten when updating. Be sure to keep backups!**
**As of writing (02-02-2021), support for themes as extensions is under development.**
The easiest way to create a theme is by copying and modifying the base theme (or another of the pre-installed themes). The base theme can be found in [/p/themes/base-theme](https://github.com/FreshRSS/FreshRSS/tree/master/p/themes/base-theme). Themes require:
- a **metadata.json** file to describe the theme.
- a **loader.gif** file to use as a loading icon (assuming .loading's background has not been overridden)
- an **icons** folder containing .svg, .ico, and .png files to override existing icons
- a **thumbs** folder containing a file, **original.png** that will be used as the preview for the theme
"_template.css" is normally added to the metadata file as a fallback for missing aspects. The file is taken from the base theme. If submitting a pull request for a theme, please know that [pull request themes must include this file.](https://github.com/FreshRSS/FreshRSS/pull/2938#issuecomment-624085450)
## RTL Support
RTL (right-to-left) support for languages such as Hebrew and Arabic is handled through CSSJanus. To generate an RTL CSS file from your standard file, use `make rtl`. Be sure to commit the resulting file (filename.rtl.css).
# Overriding icons
**TODO**
To replace the default icons, add an "icons" folder to your theme's folder. Use files with the same name as the default icon to override them.
# Template file
metadata.json
```
{
"name": "Theme name",
"author": "Theme author",
"description": "Theme description",
"version": 0.1,
"files": ["_template.css", "file1.css", "file2.css"]
}
```
An example of a css theme file can be found at [/p/themes/base-theme/base.css](https://github.com/FreshRSS/FreshRSS/blob/master/p/themes/base-theme/base.css)