497 lines
13 KiB
Python
497 lines
13 KiB
Python
#!/usr/bin/env python3
|
||
# -*- coding: utf-8 -*-
|
||
"""
|
||
MetaCore 应用程序样式表定义
|
||
|
||
本文件包含了 MetaCore 项目管理平台的完整 UI 样式定义,采用现代化的深色主题设计。
|
||
样式表使用 Qt StyleSheet (QSS) 语法,类似于 CSS,为应用程序提供统一的视觉风格。
|
||
|
||
主要特色:
|
||
- 深色主题设计,护眼且现代
|
||
- 紫色主色调 (#8b5cf6),体现科技感
|
||
- 丰富的交互效果和动画
|
||
- 响应式设计,支持不同屏幕尺寸
|
||
- 完整的组件样式覆盖
|
||
|
||
作者: MetaCore Team
|
||
版本: 1.0.0
|
||
更新日期: 2024
|
||
"""
|
||
|
||
class StyleSheet:
|
||
"""
|
||
样式表管理类
|
||
|
||
这个类负责管理整个应用程序的样式表,提供统一的样式获取接口。
|
||
采用静态方法设计,方便在应用程序的任何地方调用。
|
||
|
||
主要功能:
|
||
- 提供完整的应用程序样式表
|
||
- 统一管理颜色主题和设计规范
|
||
- 支持未来的主题切换扩展
|
||
"""
|
||
|
||
@staticmethod
|
||
def get_main_style():
|
||
"""
|
||
获取主样式表
|
||
|
||
返回完整的 QSS 样式表字符串,包含所有 UI 组件的样式定义。
|
||
样式表采用分层设计,从全局样式到具体组件样式,确保样式的一致性和可维护性。
|
||
|
||
样式表结构:
|
||
1. 全局样式 - 基础颜色、字体等
|
||
2. 主窗口样式 - 窗口背景等
|
||
3. 侧边栏样式 - 导航、按钮等
|
||
4. 项目区域样式 - 工具栏、搜索等
|
||
5. 项目卡片样式 - 卡片布局和交互
|
||
6. 对话框样式 - 弹窗和表单
|
||
7. 通用组件样式 - 滚动条、菜单等
|
||
|
||
Returns:
|
||
str: 完整的 QSS 样式表字符串
|
||
"""
|
||
return """
|
||
/* ---------- Base Theme ---------- */
|
||
QWidget {
|
||
background-color: #0f1115;
|
||
color: #f3f4f8;
|
||
font-family: "Inter", "Microsoft YaHei", "Segoe UI", sans-serif;
|
||
font-size: 14px;
|
||
}
|
||
|
||
QMainWindow {
|
||
background-color: #0f1115;
|
||
}
|
||
|
||
#sidebar {
|
||
background-color: #000000;
|
||
border-right: 1px solid #1c2029;
|
||
width: 313px;
|
||
}
|
||
|
||
#logoWidget {
|
||
background-color: transparent;
|
||
border-bottom: 1px solid rgba(84, 89, 98, 0.8);
|
||
margin: 0 46px 0 37px;
|
||
}
|
||
|
||
#logoIcon {
|
||
background-color: #2a2f3b;
|
||
border: 1px solid #303543;
|
||
border-radius: 4px;
|
||
min-width: 80px;
|
||
min-height: 80px;
|
||
}
|
||
|
||
#logoText {
|
||
background-color: transparent;
|
||
color: #FFFFFF;
|
||
font-family: "Inter";
|
||
font-size: 24px;
|
||
font-weight: 500; /* Medium weight in Qt */
|
||
letter-spacing: 0.4px;
|
||
}
|
||
|
||
#quickActions {
|
||
background-color: transparent;
|
||
}
|
||
|
||
QPushButton#createBtn,
|
||
QPushButton#sidebarImportBtn {
|
||
background-color: rgba(84, 89, 98, 0.2);
|
||
border: 1px solid #979fad;
|
||
border-radius: 6px;
|
||
color: #ffffff;
|
||
font-family: "Inter";
|
||
font-weight: 300;
|
||
font-size: 16px;
|
||
letter-spacing: 0.8px;
|
||
padding: 0px 16px;
|
||
text-align: center;
|
||
min-height: 36px;
|
||
max-height: 36px;
|
||
}
|
||
|
||
QPushButton#createBtn:hover,
|
||
QPushButton#sidebarImportBtn:hover {
|
||
background-color: rgba(84, 89, 98, 0.3);
|
||
border-color: #a5abb8;
|
||
}
|
||
|
||
QPushButton#createBtn:pressed,
|
||
QPushButton#sidebarImportBtn:pressed {
|
||
background-color: rgba(84, 89, 98, 0.4);
|
||
border-color: #b0b6c3;
|
||
}
|
||
|
||
#navScrollArea {
|
||
background-color: #000000;
|
||
border: none;
|
||
}
|
||
|
||
#navWidget {
|
||
background-color: #000000;
|
||
}
|
||
|
||
#navSection {
|
||
margin-top: 0px;
|
||
}
|
||
|
||
QPushButton#navSectionTitle {
|
||
border: none;
|
||
background: #000000;
|
||
color: #ffffff;
|
||
font-family: "Inter";
|
||
font-size: 16px;
|
||
font-weight: 500;
|
||
letter-spacing: 0.8px;
|
||
padding: 0px 37px;
|
||
text-align: left;
|
||
min-height: 20px;
|
||
max-height: 20px;
|
||
}
|
||
|
||
QWidget#navItems {
|
||
background: #000000;
|
||
}
|
||
|
||
QPushButton#navItem {
|
||
border: none;
|
||
border-left: 3px solid transparent;
|
||
border-radius: 0px;
|
||
background: #000000;
|
||
color: #ebebeb;
|
||
font-family: "Inter";
|
||
font-size: 14px;
|
||
font-weight: 300;
|
||
letter-spacing: 0.7px;
|
||
padding: 0px 46px 0px 67px;
|
||
text-align: left;
|
||
min-height: 26px;
|
||
max-height: 26px;
|
||
}
|
||
|
||
QPushButton#navItem:hover {
|
||
background-color: #000000;
|
||
color: #ffffff;
|
||
}
|
||
|
||
QPushButton#navItem:checked {
|
||
background-color: #000000;
|
||
color: #ffffff;
|
||
border-left: 3px solid transparent;
|
||
font-weight: 300;
|
||
}
|
||
|
||
QPushButton#navItem::icon {
|
||
padding-right: 8px;
|
||
}
|
||
|
||
/* ---------- Content Area ---------- */
|
||
#projectArea {
|
||
background-color: #000000;
|
||
}
|
||
|
||
#contentHeader {
|
||
background: transparent;
|
||
border-bottom: 1px solid #1f2532;
|
||
}
|
||
|
||
#breadcrumbContainer {
|
||
background: 19191b;
|
||
}
|
||
|
||
#breadcrumbBase {
|
||
background: transparent;
|
||
color: rgba(255, 255, 255, 0.7);
|
||
font-family: "Inter";
|
||
font-size: 20px;
|
||
font-weight: 400;
|
||
letter-spacing: 1px;
|
||
}
|
||
|
||
#breadcrumbSeparator {
|
||
background: transparent;
|
||
color: rgba(255, 255, 255, 0.7);
|
||
padding: 0 8px;
|
||
font-family: "Inter";
|
||
font-size: 20px;
|
||
font-weight: 400;
|
||
letter-spacing: 1px;
|
||
}
|
||
|
||
#breadcrumbCurrent {
|
||
background: transparent;
|
||
color: #ffffff;
|
||
font-family: "Inter";
|
||
font-size: 24px;
|
||
font-weight: 500;
|
||
letter-spacing: 1.2px;
|
||
}
|
||
|
||
QLineEdit#searchInput {
|
||
background-color: rgba(84, 89, 98, 0.2);
|
||
border: 1px solid rgba(92, 97, 105, 0.8);
|
||
border-radius: 4px;
|
||
color: #5c6169;
|
||
font-family: "Inter";
|
||
font-size: 18px;
|
||
font-weight: 300;
|
||
letter-spacing: 0.9px;
|
||
padding: 0px 16px 0px 10px;
|
||
min-height: 39px;
|
||
max-height: 39px;
|
||
}
|
||
|
||
QLineEdit#searchInput:focus {
|
||
border-color: rgba(92, 97, 105, 1.0);
|
||
background-color: rgba(84, 89, 98, 0.25);
|
||
}
|
||
|
||
QLineEdit#searchInput::placeholder {
|
||
color: #5c6169;
|
||
font-family: "Inter";
|
||
font-size: 18px;
|
||
font-weight: 300;
|
||
letter-spacing: 0.9px;
|
||
}
|
||
|
||
QScrollArea#projectScrollArea {
|
||
background: transparent;
|
||
border: none;
|
||
}
|
||
|
||
#projectsContainer {
|
||
background-color: transparent;
|
||
}
|
||
|
||
#projectCard {
|
||
background-color: transparent;
|
||
border: none;
|
||
border-radius: 5px;
|
||
min-width: 276px;
|
||
max-width: 276px;
|
||
min-height: 191px;
|
||
max-height: 191px;
|
||
}
|
||
|
||
#projectCard:hover {
|
||
/* 悬停效果通过子组件实现 */
|
||
}
|
||
|
||
#projectHeader {
|
||
background: transparent;
|
||
border-bottom: none;
|
||
}
|
||
|
||
#projectTitle {
|
||
color: #d4d4d4;
|
||
font-family: "Inter";
|
||
font-size: 17.3px;
|
||
font-weight: 500;
|
||
letter-spacing: 0.865px;
|
||
}
|
||
|
||
QPushButton#menuBtn {
|
||
background: #424347;
|
||
border: 1px solid rgba(235, 235, 235, 0.2);
|
||
color: #ebebeb;
|
||
padding: 0px;
|
||
border-radius: 1px;
|
||
}
|
||
|
||
QPushButton#menuBtn:hover {
|
||
background-color: rgba(235, 235, 235, 0.1);
|
||
border-color: rgba(235, 235, 235, 0.3);
|
||
}
|
||
|
||
/* 新的覆盖按钮样式 - 完全去掉外层圈 */
|
||
QPushButton#overlayInfoBtn, QPushButton#overlayDeleteBtn {
|
||
background-color: transparent;
|
||
border: none;
|
||
border-radius: 0px;
|
||
color: #ffffff;
|
||
font-size: 12px;
|
||
font-weight: 400;
|
||
outline: none;
|
||
padding: 0px;
|
||
margin: 0px;
|
||
}
|
||
|
||
QPushButton#overlayInfoBtn:hover, QPushButton#overlayDeleteBtn:hover {
|
||
background-color: transparent;
|
||
border: none;
|
||
outline: none;
|
||
}
|
||
|
||
QPushButton#overlayInfoBtn:pressed, QPushButton#overlayDeleteBtn:pressed {
|
||
background-color: transparent;
|
||
border: none;
|
||
outline: none;
|
||
}
|
||
|
||
QPushButton#overlayInfoBtn:focus, QPushButton#overlayDeleteBtn:focus {
|
||
background-color: transparent;
|
||
border: none;
|
||
outline: none;
|
||
}
|
||
|
||
QPushButton#overlayDeleteBtn {
|
||
color: #ff6b6b;
|
||
}
|
||
|
||
QPushButton#overlayDeleteBtn:hover {
|
||
background-color: rgba(255, 107, 107, 0.1);
|
||
border-color: rgba(255, 107, 107, 0.3);
|
||
}
|
||
|
||
#projectImageContainer {
|
||
padding: 0 20px;
|
||
}
|
||
|
||
#projectImage {
|
||
background-color: #292f3d;
|
||
border-radius: 5px;
|
||
min-height: 140px;
|
||
}
|
||
|
||
#projectIcon {
|
||
font-size: 36px;
|
||
color: #596074;
|
||
}
|
||
|
||
#projectFooter {
|
||
background: #424347;
|
||
border-top: none;
|
||
margin-top: 0px;
|
||
padding: 12px 20px;
|
||
min-height: 53px;
|
||
max-height: 53px;
|
||
}
|
||
|
||
#projectDate {
|
||
color: #d4d4d4;
|
||
font-family: "Inter";
|
||
font-size: 12.36px;
|
||
font-weight: 300;
|
||
letter-spacing: 0.618px;
|
||
}
|
||
|
||
/* 新的覆盖层样式 */
|
||
#overlayProjectTitle {
|
||
color: #d4d4d4;
|
||
font-family: "Inter", sans-serif;
|
||
font-size: 17px;
|
||
font-weight: 500;
|
||
background: transparent;
|
||
}
|
||
|
||
#overlayProjectDate, #overlayProjectSize {
|
||
color: #d4d4d4;
|
||
font-family: "Inter", sans-serif;
|
||
font-size: 12px;
|
||
font-weight: 300;
|
||
background: transparent;
|
||
}
|
||
|
||
#bottomOverlay {
|
||
background-color: rgba(66, 67, 71, 0.9);
|
||
border-radius: 0px;
|
||
}
|
||
|
||
/* ---------- Scrollbars ---------- */
|
||
QScrollBar:vertical {
|
||
background: transparent;
|
||
width: 12px;
|
||
margin: 8px 0;
|
||
}
|
||
|
||
QScrollBar::handle:vertical {
|
||
background: #2b313f;
|
||
border-radius: 6px;
|
||
min-height: 32px;
|
||
}
|
||
|
||
QScrollBar::handle:vertical:hover {
|
||
background: #3a4254;
|
||
}
|
||
|
||
QScrollBar::add-line:vertical,
|
||
QScrollBar::sub-line:vertical {
|
||
height: 0;
|
||
}
|
||
|
||
QScrollBar:horizontal {
|
||
background: transparent;
|
||
height: 12px;
|
||
margin: 0 8px;
|
||
}
|
||
|
||
QScrollBar::handle:horizontal {
|
||
background: #2b313f;
|
||
border-radius: 6px;
|
||
min-width: 32px;
|
||
}
|
||
|
||
QScrollBar::handle:horizontal:hover {
|
||
background: #3a4254;
|
||
}
|
||
|
||
QScrollBar::add-line:horizontal,
|
||
QScrollBar::sub-line:horizontal {
|
||
width: 0;
|
||
}
|
||
|
||
QToolTip {
|
||
background-color: #1c202b;
|
||
color: #f5f6f9;
|
||
border: 1px solid #2a303d;
|
||
padding: 6px 8px;
|
||
}
|
||
"""
|
||
|
||
@staticmethod
|
||
def get_card_style():
|
||
return """
|
||
#projectCard {
|
||
background-color: #1b1f2a;
|
||
border: 1px solid #242a38;
|
||
border-radius: 18px;
|
||
}
|
||
|
||
#projectCard:hover {
|
||
background-color: #212634;
|
||
border-color: #2d3343;
|
||
}
|
||
|
||
#projectHeader {
|
||
background: transparent;
|
||
border-bottom: none;
|
||
}
|
||
|
||
#projectTitle {
|
||
color: #f2f4f9;
|
||
font-size: 15px;
|
||
font-weight: 600;
|
||
}
|
||
|
||
#projectImage {
|
||
background-color: #292f3d;
|
||
border-radius: 5px;
|
||
min-height: 140px;
|
||
}
|
||
|
||
#projectFooter {
|
||
background: transparent;
|
||
border-top: 1px solid #232838;
|
||
margin-top: 12px;
|
||
padding-top: 12px;
|
||
}
|
||
|
||
#projectDate {
|
||
color: #9aa1b3;
|
||
font-size: 12px;
|
||
}
|
||
"""
|