impulsivefps
/
EU-Utility
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: Match Skills window UI exactly 

- Centered title with decorative lines like SKILLS window
- Orange left border (3px) on selected/active items
- Updated colors to match exact game palette:
  - Teal progress bars (#4ecdc4)
  - Orange window border
  - Better background colors
- Category label style like ALL CATEGORIES
- Clean sidebar with proper borders
- Match EU window aesthetic more closely
This commit is contained in:
LemonNexus 2026-02-13 15:41:54 +00:00
parent 2d8eb458bb
commit 58661fc85f
2 changed files with 60 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
projects/EU-Utility/core/eu_styles.py
View File

@ -5,35 +5,37 @@ Exact styling to match Entropia Universe game UI.
Based on screenshot analysis. Based on screenshot analysis.
""" """
# EU Color Palette from screenshots # EU Color Palette from screenshots - EXACT MATCH
EU_COLORS = { EU_COLORS = {
# Backgrounds # Backgrounds - from Skills window
'bg_dark': 'rgba(15, 20, 28, 230)', 'bg_dark': 'rgba(20, 25, 35, 245)', # Main window bg
'bg_panel': 'rgba(25, 30, 40, 220)', 'bg_panel': 'rgba(30, 35, 45, 230)', # Panel/content bg
'bg_header': 'rgba(35, 40, 55, 200)', 'bg_header': 'rgba(25, 30, 40, 240)', # Header bg
'bg_hover': 'rgba(45, 50, 70, 240)', 'bg_hover': 'rgba(40, 45, 60, 200)', # Hover state
'bg_selected': 'rgba(50, 55, 75, 180)', # Selected item
# Borders # Borders
'border_subtle': 'rgba(80, 90, 110, 80)', 'border_subtle': 'rgba(60, 70, 90, 100)',
'border_medium': 'rgba(100, 110, 130, 100)', 'border_medium': 'rgba(80, 90, 110, 120)',
'border_bright': 'rgba(120, 130, 150, 120)', 'border_window': 'rgba(255, 140, 66, 200)', # Orange window border
'border_orange': 'rgba(200, 130, 50, 150)', 'border_active': 'rgba(255, 140, 66, 255)', # Active/selected border
# Accents # Accents - EXACT from game
'accent_orange': '#ff8c42', 'accent_orange': '#ff8c42', # Main orange
'accent_orange_bright': '#ffa060', # Hover orange
'accent_teal': '#4ecdc4', # Progress bar teal
'accent_gold': '#ffc107', 'accent_gold': '#ffc107',
'accent_blue': '#4a9eff', 'accent_blue': '#4a9eff',
'accent_green': '#4caf50',
'accent_red': '#f44336',
# Text # Text
'text_primary': 'rgba(255, 255, 255, 240)', 'text_primary': 'rgba(255, 255, 255, 250)',
'text_secondary': 'rgba(255, 255, 255, 180)', 'text_secondary': 'rgba(255, 255, 255, 180)',
'text_muted': 'rgba(255, 255, 255, 120)', 'text_muted': 'rgba(255, 255, 255, 120)',
'text_orange': '#ff8c42', # Orange text for ranks
# Progress bars # Progress bars
'progress_bg': 'rgba(60, 70, 90, 150)', 'progress_bg': 'rgba(60, 70, 90, 150)',
'progress_fill': 'rgba(255, 140, 66, 200)', 'progress_fill': '#4ecdc4', # Teal like game
} }
# EU Border Radius - slightly rounded corners # EU Border Radius - slightly rounded corners

70
projects/EU-Utility/core/overlay_window.py
View File

@ -83,13 +83,13 @@ class OverlayWindow(QMainWindow):
layout.setContentsMargins(20, 20, 20, 20) layout.setContentsMargins(20, 20, 20, 20)
layout.setSpacing(0) layout.setSpacing(0)
# Main container # Main container with orange window border like Skills window
self.container = QFrame() self.container = QFrame()
self.container.setObjectName("euContainer") self.container.setObjectName("euContainer")
self.container.setStyleSheet(f""" self.container.setStyleSheet(f"""
#euContainer {{ #euContainer {{
background-color: {EU_COLORS['bg_dark']}; background-color: {EU_COLORS['bg_dark']};
border: 1px solid {EU_COLORS['border_medium']}; border: 1px solid {EU_COLORS['border_window']};
border-radius: 8px; border-radius: 8px;
}} }}
""") """)
@ -104,7 +104,7 @@ class OverlayWindow(QMainWindow):
container_layout.setContentsMargins(0, 0, 0, 0) container_layout.setContentsMargins(0, 0, 0, 0)
container_layout.setSpacing(0) container_layout.setSpacing(0)
# Clean header # Header with centered title like EU windows
header = QWidget() header = QWidget()
header.setStyleSheet(f""" header.setStyleSheet(f"""
QWidget {{ QWidget {{
@ -115,27 +115,38 @@ class OverlayWindow(QMainWindow):
}} }}
""") """)
header_layout = QHBoxLayout(header) header_layout = QHBoxLayout(header)
header_layout.setContentsMargins(20, 15, 20, 15) header_layout.setContentsMargins(15, 12, 15, 12)
header_layout.setSpacing(15) header_layout.setSpacing(10)
# App icon (actual icon, not emoji) # Left line (decorative)
left_line = QLabel()
left_line.setFixedHeight(2)
left_line.setStyleSheet(f"background-color: {EU_COLORS['border_medium']};")
header_layout.addWidget(left_line, 1)
# App icon
app_icon = QLabel() app_icon = QLabel()
app_icon_pixmap = self.icon_manager.get_pixmap("target", size=24) app_icon_pixmap = self.icon_manager.get_pixmap("target", size=20)
app_icon.setPixmap(app_icon_pixmap) app_icon.setPixmap(app_icon_pixmap)
app_icon.setFixedSize(24, 24) app_icon.setFixedSize(20, 20)
header_layout.addWidget(app_icon) header_layout.addWidget(app_icon)
# Title # Centered title like "SKILLS" in game
title = QLabel("EU-UTILITY") title = QLabel("EU-UTILITY")
title.setStyleSheet(f""" title.setStyleSheet(f"""
color: {EU_COLORS['accent_orange']}; color: {EU_COLORS['text_primary']};
font-size: 16px; font-size: 14px;
font-weight: bold; font-weight: bold;
letter-spacing: 1px; letter-spacing: 2px;
padding: 0 10px;
""") """)
header_layout.addWidget(title) header_layout.addWidget(title)
header_layout.addStretch() # Right line (decorative)
right_line = QLabel()
right_line.setFixedHeight(2)
right_line.setStyleSheet(f"background-color: {EU_COLORS['border_medium']};")
header_layout.addWidget(right_line, 1)
# View toggle buttons # View toggle buttons
view_group = QButtonGroup(self) view_group = QButtonGroup(self)
@ -144,14 +155,14 @@ class OverlayWindow(QMainWindow):
self.icon_view_btn = QPushButton("Grid") self.icon_view_btn = QPushButton("Grid")
self.icon_view_btn.setCheckable(True) self.icon_view_btn.setCheckable(True)
self.icon_view_btn.setChecked(True) self.icon_view_btn.setChecked(True)
self.icon_view_btn.setFixedSize(60, 28) self.icon_view_btn.setFixedSize(50, 24)
self.icon_view_btn.setStyleSheet(self._view_toggle_style()) self.icon_view_btn.setStyleSheet(self._view_toggle_style())
self.icon_view_btn.clicked.connect(lambda: self._set_view_mode("icons")) self.icon_view_btn.clicked.connect(lambda: self._set_view_mode("icons"))
header_layout.addWidget(self.icon_view_btn) header_layout.addWidget(self.icon_view_btn)
self.list_view_btn = QPushButton("List") self.list_view_btn = QPushButton("List")
self.list_view_btn.setCheckable(True) self.list_view_btn.setCheckable(True)
self.list_view_btn.setFixedSize(60, 28) self.list_view_btn.setFixedSize(50, 24)
self.list_view_btn.setStyleSheet(self._view_toggle_style()) self.list_view_btn.setStyleSheet(self._view_toggle_style())
self.list_view_btn.clicked.connect(lambda: self._set_view_mode("list")) self.list_view_btn.clicked.connect(lambda: self._set_view_mode("list"))
header_layout.addWidget(self.list_view_btn) header_layout.addWidget(self.list_view_btn)
@ -161,12 +172,12 @@ class OverlayWindow(QMainWindow):
# Close button # Close button
close_btn = QPushButton("×") close_btn = QPushButton("×")
close_btn.setFixedSize(28, 28) close_btn.setFixedSize(24, 24)
close_btn.setStyleSheet(f""" close_btn.setStyleSheet(f"""
QPushButton {{ QPushButton {{
background-color: transparent; background-color: transparent;
color: {EU_COLORS['text_muted']}; color: {EU_COLORS['text_muted']};
font-size: 18px; font-size: 16px;
font-weight: bold; font-weight: bold;
border: none; border: none;
border-radius: 4px; border-radius: 4px;
@ -220,22 +231,23 @@ class OverlayWindow(QMainWindow):
self._load_plugins() self._load_plugins()
def _setup_sidebar(self): def _setup_sidebar(self):
"""Setup sidebar with plugin selector.""" """Setup sidebar with plugin selector - EU style with orange left border."""
sidebar_layout = QVBoxLayout(self.sidebar) sidebar_layout = QVBoxLayout(self.sidebar)
sidebar_layout.setContentsMargins(0, 10, 0, 10) sidebar_layout.setContentsMargins(0, 0, 0, 0)
sidebar_layout.setSpacing(5) sidebar_layout.setSpacing(0)
# Plugins label # Category label like "ALL CATEGORIES" in Skills window
plugins_label = QLabel("PLUGINS") plugins_label = QLabel("PLUGINS")
plugins_label.setStyleSheet(f""" plugins_label.setStyleSheet(f"""
color: {EU_COLORS['text_muted']}; color: {EU_COLORS['text_muted']};
font-size: 10px; font-size: 10px;
font-weight: bold; font-weight: bold;
padding: 5px 15px; padding: 15px;
border-bottom: 1px solid {EU_COLORS['border_subtle']};
""") """)
sidebar_layout.addWidget(plugins_label) sidebar_layout.addWidget(plugins_label)
# Plugin list (for list view) # Plugin list (for list view) - EU style with orange left border
self.plugin_list = QListWidget() self.plugin_list = QListWidget()
self.plugin_list.setFrameShape(QFrame.Shape.NoFrame) self.plugin_list.setFrameShape(QFrame.Shape.NoFrame)
self.plugin_list.setStyleSheet(f""" self.plugin_list.setStyleSheet(f"""
@ -246,14 +258,16 @@ class OverlayWindow(QMainWindow):
}} }}
QListWidget::item {{ QListWidget::item {{
color: {EU_COLORS['text_secondary']}; color: {EU_COLORS['text_secondary']};
padding: 10px 15px; padding: 12px 15px;
border-left: 3px solid transparent; border-left: 3px solid transparent;
border-bottom: 1px solid {EU_COLORS['border_subtle']};
}} }}
QListWidget::item:hover {{ QListWidget::item:hover {{
background-color: rgba(255, 255, 255, 10); background-color: {EU_COLORS['bg_hover']};
color: {EU_COLORS['text_primary']};
}} }}
QListWidget::item:selected {{ QListWidget::item:selected {{
background-color: rgba(255, 140, 66, 30); background-color: {EU_COLORS['bg_selected']};
color: white; color: white;
border-left: 3px solid {EU_COLORS['accent_orange']}; border-left: 3px solid {EU_COLORS['accent_orange']};
}} }}
@ -265,8 +279,8 @@ class OverlayWindow(QMainWindow):
self.icon_grid = QWidget() self.icon_grid = QWidget()
self.icon_grid.setStyleSheet("background: transparent;") self.icon_grid.setStyleSheet("background: transparent;")
self.icon_grid_layout = QVBoxLayout(self.icon_grid) self.icon_grid_layout = QVBoxLayout(self.icon_grid)
self.icon_grid_layout.setSpacing(10) self.icon_grid_layout.setSpacing(0)
self.icon_grid_layout.setContentsMargins(10, 10, 10, 10) self.icon_grid_layout.setContentsMargins(0, 0, 0, 0)
sidebar_layout.addWidget(self.icon_grid) sidebar_layout.addWidget(self.icon_grid)
# Initially show icon grid # Initially show icon grid