Boris Yumankulov
37782d4375
All checks were successful
Code check / Check code (push) Successful in 1m32s
Signed-off-by: Boris Yumankulov <boria138@altlinux.org>
120 lines
2.7 KiB
Markdown
120 lines
2.7 KiB
Markdown
📘 Эта документация также доступна на [русском](README.ru.md)
|
|
|
|
---
|
|
|
|
## 📋 Contents
|
|
- [Overview](#overview)
|
|
- [Creating the Theme Folder](#creating-the-theme-folder)
|
|
- [Style File](#style-file)
|
|
- [Animation configuration](#animation-configuration)
|
|
- [Metadata](#metadata)
|
|
- [Screenshots](#screenshots)
|
|
- [Fonts and Icons](#fonts-and-icons)
|
|
|
|
---
|
|
|
|
## 📖 Overview
|
|
|
|
Themes in `PortProtonQT` allow customizing the UI appearance. Themes are stored under:
|
|
|
|
- `~/.local/share/PortProtonQT/themes`.
|
|
|
|
---
|
|
|
|
## 📁 Creating the Theme Folder
|
|
|
|
```bash
|
|
mkdir -p ~/.local/share/PortProtonQT/themes/my_custom_theme
|
|
```
|
|
|
|
---
|
|
|
|
## 🎨 Style File (`styles.py`)
|
|
|
|
Create a `styles.py` in the theme root. It should define variables or functions that return CSS.
|
|
|
|
**Example:**
|
|
```python
|
|
def custom_button_style(color1, color2):
|
|
return f"""
|
|
QPushButton {{
|
|
background: qlineargradient(x1:0, y1:0, x2:1, y2:0,
|
|
stop:0 {color1}, stop:1 {color2});
|
|
}}
|
|
"""
|
|
```
|
|
|
|
---
|
|
|
|
## 🎥 Animation configuration
|
|
|
|
The `GAME_CARD_ANIMATION` dictionary controls all animation parameters for game cards:
|
|
|
|
```python
|
|
GAME_CARD_ANIMATION = {
|
|
# Animation type when transitioning to a detailed page
|
|
# Available values: "fade", "slide_left", "slide_right", "slide_up", "slide_down", "bounce", "none"
|
|
"detail_page_animation_type": "fade",
|
|
|
|
# Border width settings (in pixels)
|
|
"default_border_width": 2,
|
|
"hover_border_width": 8,
|
|
"focus_border_width": 12,
|
|
"pulse_min_border_width": 8,
|
|
"pulse_max_border_width": 10,
|
|
|
|
# Animation duration (in milliseconds)
|
|
"thickness_anim_duration": 300,
|
|
"pulse_anim_duration": 800,
|
|
"gradient_anim_duration": 3000,
|
|
|
|
# Gradient animation angles (in degrees)
|
|
"gradient_start_angle": 360,
|
|
"gradient_end_angle": 0,
|
|
|
|
# Smoothing curves for smooth animations
|
|
"thickness_easing_curve": "OutBack",
|
|
"thickness_easing_curve_out": "InBack",
|
|
|
|
# Gradient colors for animated stroke
|
|
"gradient_colors": [
|
|
{"position": 0, "color": "#00fff5"},
|
|
{"position": 0.33, "color": "#FF5733"},
|
|
{"position": 0.66, "color": "#9B59B6"},
|
|
{"position": 1, "color": "#00fff5"}
|
|
],
|
|
|
|
# Duration of transitions to the detailed page
|
|
"detail_page_fade_duration": 350,
|
|
"detail_page_slide_duration": 500,
|
|
"detail_page_zoom_duration": 400
|
|
}
|
|
```
|
|
|
|
---
|
|
|
|
## 📝 Metadata (`metainfo.ini`)
|
|
|
|
```ini
|
|
[Metainfo]
|
|
name = My Custom Theme
|
|
author = Your Name
|
|
author_link = https://example.com
|
|
description = Description of your theme.
|
|
```
|
|
|
|
---
|
|
|
|
## 🖼 Screenshots
|
|
|
|
Folder: `images/screenshots/` — place UI screenshots there.
|
|
|
|
---
|
|
|
|
## 🔡 Fonts and Icons (optional)
|
|
|
|
- Fonts: `fonts/*.ttf` or `.otf`
|
|
- Icons: `images/icons/*.svg/.png`
|
|
|
|
---
|