style.qss 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773
  1. /* 森林多模态灾害监测系统样式表 */
  2. /* 全局变量 */
  3. * {
  4. font-family: "Microsoft YaHei", "SimHei", "Arial", sans-serif;
  5. outline: none;
  6. }
  7. /* 主窗口 */
  8. QMainWindow {
  9. background-color: #102030;
  10. color: #d0d0d0;
  11. }
  12. /* 状态栏 */
  13. QStatusBar {
  14. background-color: #0a1520;
  15. color: #d0d0d0;
  16. border-top: 1px solid #2a3a4a;
  17. min-height: 22px;
  18. }
  19. QStatusBar::item {
  20. border: none;
  21. }
  22. /* 菜单栏 */
  23. QMenuBar {
  24. background-color: #0a1520;
  25. color: #d0d0d0;
  26. border-bottom: 1px solid #2a3a4a;
  27. }
  28. QMenuBar::item {
  29. background: transparent;
  30. padding: 4px 8px;
  31. }
  32. QMenuBar::item:selected {
  33. background: #2a4a6a;
  34. border-radius: 2px;
  35. }
  36. QMenu {
  37. background-color: #152535;
  38. color: #d0d0d0;
  39. border: 1px solid #2a3a4a;
  40. }
  41. QMenu::item {
  42. padding: 5px 20px 5px 20px;
  43. border-radius: 2px;
  44. }
  45. QMenu::item:selected {
  46. background-color: #2a4a6a;
  47. }
  48. QMenu::separator {
  49. height: 1px;
  50. background-color: #2a3a4a;
  51. margin: 4px 8px;
  52. }
  53. /* 工具栏 */
  54. QToolBar {
  55. background-color: #152535;
  56. border-bottom: 1px solid #2a3a4a;
  57. spacing: 2px;
  58. padding: 2px;
  59. }
  60. QToolBar::separator {
  61. width: 1px;
  62. background-color: #2a3a4a;
  63. margin: 0 4px;
  64. }
  65. QToolButton {
  66. background-color: transparent;
  67. border-radius: 2px;
  68. padding: 3px;
  69. margin: 1px;
  70. }
  71. QToolButton:hover {
  72. background-color: #2a4a6a;
  73. }
  74. QToolButton:pressed {
  75. background-color: #1a3a5a;
  76. }
  77. /* 标签页 */
  78. QTabWidget::pane {
  79. border: 1px solid #2a3a4a;
  80. background-color: #102030;
  81. }
  82. QTabWidget::tab-bar {
  83. left: 5px;
  84. }
  85. QTabBar::tab {
  86. background-color: #152535;
  87. color: #b0b0b0;
  88. border: 1px solid #2a3a4a;
  89. border-bottom: none;
  90. border-top-left-radius: 4px;
  91. border-top-right-radius: 4px;
  92. padding: 5px 10px;
  93. min-width: 80px;
  94. }
  95. QTabBar::tab:selected {
  96. background-color: #203040;
  97. color: #00ccff;
  98. border-bottom: none;
  99. }
  100. QTabBar::tab:!selected {
  101. margin-top: 2px;
  102. }
  103. /* 滚动条 */
  104. QScrollBar:vertical {
  105. border: none;
  106. background: #152535;
  107. width: 10px;
  108. margin: 0px;
  109. }
  110. QScrollBar::handle:vertical {
  111. background: #2a4a6a;
  112. min-height: 20px;
  113. border-radius: 5px;
  114. }
  115. QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical {
  116. border: none;
  117. background: none;
  118. height: 0px;
  119. }
  120. QScrollBar:horizontal {
  121. border: none;
  122. background: #152535;
  123. height: 10px;
  124. margin: 0px;
  125. }
  126. QScrollBar::handle:horizontal {
  127. background: #2a4a6a;
  128. min-width: 20px;
  129. border-radius: 5px;
  130. }
  131. QScrollBar::add-line:horizontal, QScrollBar::sub-line:horizontal {
  132. border: none;
  133. background: none;
  134. width: 0px;
  135. }
  136. /* 按钮 */
  137. QPushButton {
  138. background-color: #2a4a6a;
  139. color: #d0d0d0;
  140. border: 1px solid #3a5a7a;
  141. border-radius: 3px;
  142. padding: 5px 10px;
  143. min-width: 60px;
  144. }
  145. QPushButton:hover {
  146. background-color: #3a5a7a;
  147. border: 1px solid #4a6a8a;
  148. }
  149. QPushButton:pressed {
  150. background-color: #1a3a5a;
  151. }
  152. QPushButton:disabled {
  153. background-color: #1a2a3a;
  154. color: #707070;
  155. border: 1px solid #2a3a4a;
  156. }
  157. /* 输入框 */
  158. QLineEdit, QTextEdit, QPlainTextEdit {
  159. background-color: #0a1520;
  160. color: #d0d0d0;
  161. border: 1px solid #2a3a4a;
  162. border-radius: 3px;
  163. padding: 3px;
  164. selection-background-color: #2a4a6a;
  165. }
  166. QLineEdit:focus, QTextEdit:focus, QPlainTextEdit:focus {
  167. border: 1px solid #4a6a8a;
  168. }
  169. /* 下拉框 */
  170. QComboBox {
  171. background-color: #152535;
  172. color: #d0d0d0;
  173. border: 1px solid #2a3a4a;
  174. border-radius: 3px;
  175. padding: 3px 18px 3px 3px;
  176. min-width: 6em;
  177. }
  178. QComboBox:on {
  179. background-color: #1a3a5a;
  180. }
  181. QComboBox::drop-down {
  182. subcontrol-origin: padding;
  183. subcontrol-position: top right;
  184. width: 15px;
  185. border-left: 1px solid #2a3a4a;
  186. }
  187. QComboBox::down-arrow {
  188. image: url(ui/assets/dropdown_arrow.png);
  189. width: 10px;
  190. height: 10px;
  191. }
  192. QComboBox QAbstractItemView {
  193. background-color: #152535;
  194. color: #d0d0d0;
  195. border: 1px solid #2a3a4a;
  196. selection-background-color: #2a4a6a;
  197. }
  198. /* 滑块 */
  199. QSlider::groove:horizontal {
  200. border: 1px solid #2a3a4a;
  201. height: 6px;
  202. background: #0a1520;
  203. margin: 2px 0;
  204. border-radius: 3px;
  205. }
  206. QSlider::handle:horizontal {
  207. background: #3a5a7a;
  208. border: 1px solid #4a6a8a;
  209. width: 14px;
  210. height: 14px;
  211. margin: -4px 0;
  212. border-radius: 7px;
  213. }
  214. QSlider::sub-page:horizontal {
  215. background: qlineargradient(x1: 0, y1: 0.5, x2: 1, y2: 0.5, stop: 0 #00a0e0, stop: 1 #00e0a0);
  216. border: 1px solid #2a3a4a;
  217. height: 6px;
  218. border-radius: 3px;
  219. }
  220. /* 进度条 */
  221. QProgressBar {
  222. border: 1px solid #2a3a4a;
  223. border-radius: 3px;
  224. background-color: #0a1520;
  225. text-align: center;
  226. color: #d0d0d0;
  227. }
  228. QProgressBar::chunk {
  229. background-color: qlineargradient(x1: 0, y1: 0.5, x2: 1, y2: 0.5, stop: 0 #00a0e0, stop: 1 #00e0a0);
  230. border-radius: 2px;
  231. }
  232. /* 复选框 */
  233. QCheckBox {
  234. color: #d0d0d0;
  235. spacing: 5px;
  236. }
  237. QCheckBox::indicator {
  238. width: 15px;
  239. height: 15px;
  240. }
  241. QCheckBox::indicator:unchecked {
  242. background-color: #0a1520;
  243. border: 1px solid #2a3a4a;
  244. border-radius: 2px;
  245. }
  246. QCheckBox::indicator:checked {
  247. background-color: #2a4a6a;
  248. border: 1px solid #3a5a7a;
  249. border-radius: 2px;
  250. image: url(ui/assets/checkbox_checked.png);
  251. }
  252. /* 单选框 */
  253. QRadioButton {
  254. color: #d0d0d0;
  255. spacing: 5px;
  256. }
  257. QRadioButton::indicator {
  258. width: 15px;
  259. height: 15px;
  260. }
  261. QRadioButton::indicator:unchecked {
  262. background-color: #0a1520;
  263. border: 1px solid #2a3a4a;
  264. border-radius: 7px;
  265. }
  266. QRadioButton::indicator:checked {
  267. background-color: #2a4a6a;
  268. border: 1px solid #3a5a7a;
  269. border-radius: 7px;
  270. image: url(ui/assets/radio_checked.png);
  271. }
  272. /* 分组框 */
  273. QGroupBox {
  274. background-color: #102030;
  275. color: #00ccff;
  276. border: 1px solid #2a3a4a;
  277. border-radius: 5px;
  278. margin-top: 20px;
  279. font-weight: bold;
  280. }
  281. QGroupBox::title {
  282. subcontrol-origin: margin;
  283. subcontrol-position: top left;
  284. left: 10px;
  285. padding: 0 5px;
  286. }
  287. /* 表格 */
  288. QTableView, QTableWidget {
  289. background-color: #102030;
  290. color: #d0d0d0;
  291. gridline-color: #2a3a4a;
  292. selection-background-color: #2a4a6a;
  293. selection-color: #ffffff;
  294. alternate-background-color: #152535;
  295. }
  296. QTableView QHeaderView::section, QTableWidget QHeaderView::section {
  297. background-color: #1a2a3a;
  298. color: #00ccff;
  299. border: 1px solid #2a3a4a;
  300. padding: 4px;
  301. }
  302. /* 列表 */
  303. QListView, QListWidget {
  304. background-color: #102030;
  305. color: #d0d0d0;
  306. border: 1px solid #2a3a4a;
  307. border-radius: 3px;
  308. selection-background-color: #2a4a6a;
  309. }
  310. QListView::item, QListWidget::item {
  311. padding: 5px;
  312. }
  313. QListView::item:selected, QListWidget::item:selected {
  314. background-color: #2a4a6a;
  315. }
  316. /* 树视图 */
  317. QTreeView, QTreeWidget {
  318. background-color: #102030;
  319. color: #d0d0d0;
  320. border: 1px solid #2a3a4a;
  321. selection-background-color: #2a4a6a;
  322. }
  323. QTreeView::branch:has-siblings:!adjoins-item {
  324. border-image: url(ui/assets/branch_line.png) 0;
  325. }
  326. QTreeView::branch:has-siblings:adjoins-item {
  327. border-image: url(ui/assets/branch_more.png) 0;
  328. }
  329. QTreeView::branch:!has-children:!has-siblings:adjoins-item {
  330. border-image: url(ui/assets/branch_end.png) 0;
  331. }
  332. QTreeView::branch:has-children:!has-siblings:closed,
  333. QTreeView::branch:closed:has-children:has-siblings {
  334. border-image: none;
  335. image: url(ui/assets/branch_closed.png);
  336. }
  337. QTreeView::branch:open:has-children:!has-siblings,
  338. QTreeView::branch:open:has-children:has-siblings {
  339. border-image: none;
  340. image: url(ui/assets/branch_open.png);
  341. }
  342. /* 日期选择器 */
  343. QDateEdit, QTimeEdit, QDateTimeEdit {
  344. background-color: #152535;
  345. color: #d0d0d0;
  346. border: 1px solid #2a3a4a;
  347. border-radius: 3px;
  348. padding: 3px;
  349. }
  350. QDateEdit::drop-down, QTimeEdit::drop-down, QDateTimeEdit::drop-down {
  351. subcontrol-origin: padding;
  352. subcontrol-position: top right;
  353. width: 15px;
  354. border-left: 1px solid #2a3a4a;
  355. }
  356. /* 控制面板特殊样式 */
  357. #controlPanel {
  358. background-color: #152535;
  359. border-radius: 5px;
  360. border: 1px solid #2a3a4a;
  361. }
  362. #controlPanel QLabel {
  363. color: #00ccff;
  364. font-weight: bold;
  365. }
  366. /* 告警面板特殊样式 */
  367. #alertPanel {
  368. background-color: #152535;
  369. border-radius: 5px;
  370. border: 1px solid #2a3a4a;
  371. }
  372. #alertPanel QTableWidget {
  373. selection-background-color: #2a4a6a;
  374. }
  375. /* 数据分析面板样式 */
  376. #analysisPanel {
  377. background-color: #152535;
  378. border-radius: 5px;
  379. border: 1px solid #2a3a4a;
  380. }
  381. /* 摄像头视图样式 */
  382. #cameraView {
  383. border: 2px solid #2a4a6a;
  384. border-radius: 5px;
  385. }
  386. /* 地图视图样式 */
  387. #mapView {
  388. border: 2px solid #2a4a6a;
  389. border-radius: 5px;
  390. }
  391. /* 数据标签特殊样式 */
  392. .dataLabel {
  393. color: #00e0a0;
  394. font-size: 14px;
  395. font-weight: bold;
  396. }
  397. /* 告警标签特殊样式 */
  398. .alertLabel {
  399. color: #ff5050;
  400. font-size: 14px;
  401. font-weight: bold;
  402. }
  403. /* 为特定告警类型设置颜色 */
  404. .fireAlert {
  405. color: #ff5050;
  406. }
  407. .animalAlert {
  408. color: #ffaa00;
  409. }
  410. .landslideAlert {
  411. color: #aa5500;
  412. }
  413. .forestAlert {
  414. color: #00cc00;
  415. }
  416. /* 亮色主题变量 */
  417. .light {
  418. /* 主窗口 */
  419. QMainWindow {
  420. background-color: #f0f0f0;
  421. color: #303030;
  422. }
  423. /* 状态栏 */
  424. QStatusBar {
  425. background-color: #e0e0e0;
  426. color: #303030;
  427. border-top: 1px solid #c0c0c0;
  428. }
  429. /* 菜单栏 */
  430. QMenuBar {
  431. background-color: #e0e0e0;
  432. color: #303030;
  433. border-bottom: 1px solid #c0c0c0;
  434. }
  435. QMenuBar::item:selected {
  436. background: #c0d0e0;
  437. }
  438. QMenu {
  439. background-color: #f0f0f0;
  440. color: #303030;
  441. border: 1px solid #c0c0c0;
  442. }
  443. QMenu::item:selected {
  444. background-color: #c0d0e0;
  445. }
  446. QMenu::separator {
  447. background-color: #c0c0c0;
  448. }
  449. /* 工具栏 */
  450. QToolBar {
  451. background-color: #e0e0e0;
  452. border-bottom: 1px solid #c0c0c0;
  453. }
  454. QToolBar::separator {
  455. background-color: #c0c0c0;
  456. }
  457. QToolButton:hover {
  458. background-color: #c0d0e0;
  459. }
  460. QToolButton:pressed {
  461. background-color: #a0b0c0;
  462. }
  463. /* 标签页 */
  464. QTabWidget::pane {
  465. border: 1px solid #c0c0c0;
  466. background-color: #f0f0f0;
  467. }
  468. QTabBar::tab {
  469. background-color: #e0e0e0;
  470. color: #505050;
  471. border: 1px solid #c0c0c0;
  472. }
  473. QTabBar::tab:selected {
  474. background-color: #f0f0f0;
  475. color: #0080c0;
  476. }
  477. /* 滚动条 */
  478. QScrollBar:vertical, QScrollBar:horizontal {
  479. background: #e0e0e0;
  480. }
  481. QScrollBar::handle:vertical, QScrollBar::handle:horizontal {
  482. background: #b0b0b0;
  483. }
  484. /* 按钮 */
  485. QPushButton {
  486. background-color: #d0d0d0;
  487. color: #303030;
  488. border: 1px solid #b0b0b0;
  489. }
  490. QPushButton:hover {
  491. background-color: #c0d0e0;
  492. border: 1px solid #a0b0c0;
  493. }
  494. QPushButton:pressed {
  495. background-color: #a0b0c0;
  496. }
  497. QPushButton:disabled {
  498. background-color: #e0e0e0;
  499. color: #a0a0a0;
  500. border: 1px solid #c0c0c0;
  501. }
  502. /* 输入框 */
  503. QLineEdit, QTextEdit, QPlainTextEdit {
  504. background-color: #ffffff;
  505. color: #303030;
  506. border: 1px solid #c0c0c0;
  507. selection-background-color: #c0d0e0;
  508. }
  509. QLineEdit:focus, QTextEdit:focus, QPlainTextEdit:focus {
  510. border: 1px solid #a0b0c0;
  511. }
  512. /* 下拉框 */
  513. QComboBox {
  514. background-color: #ffffff;
  515. color: #303030;
  516. border: 1px solid #c0c0c0;
  517. }
  518. QComboBox:on {
  519. background-color: #e0e0e0;
  520. }
  521. QComboBox::drop-down {
  522. border-left: 1px solid #c0c0c0;
  523. }
  524. QComboBox QAbstractItemView {
  525. background-color: #ffffff;
  526. color: #303030;
  527. border: 1px solid #c0c0c0;
  528. selection-background-color: #c0d0e0;
  529. }
  530. /* 滑块 */
  531. QSlider::groove:horizontal {
  532. border: 1px solid #c0c0c0;
  533. background: #e0e0e0;
  534. }
  535. QSlider::handle:horizontal {
  536. background: #b0b0b0;
  537. border: 1px solid #909090;
  538. }
  539. QSlider::sub-page:horizontal {
  540. background: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0, stop: 0 #0080c0, stop: 1 #00c080);
  541. border: 1px solid #c0c0c0;
  542. }
  543. /* 进度条 */
  544. QProgressBar {
  545. border: 1px solid #c0c0c0;
  546. background-color: #e0e0e0;
  547. color: #303030;
  548. }
  549. QProgressBar::chunk {
  550. background-color: qlineargradient(x1: 0, y1: 0.5, x2: 1, y2: 0.5, stop: 0 #0080c0, stop: 1 #00c080);
  551. }
  552. /* 复选框 */
  553. QCheckBox {
  554. color: #303030;
  555. }
  556. QCheckBox::indicator:unchecked {
  557. background-color: #ffffff;
  558. border: 1px solid #c0c0c0;
  559. }
  560. QCheckBox::indicator:checked {
  561. background-color: #c0d0e0;
  562. border: 1px solid #a0b0c0;
  563. }
  564. /* 单选框 */
  565. QRadioButton {
  566. color: #303030;
  567. }
  568. QRadioButton::indicator:unchecked {
  569. background-color: #ffffff;
  570. border: 1px solid #c0c0c0;
  571. }
  572. QRadioButton::indicator:checked {
  573. background-color: #c0d0e0;
  574. border: 1px solid #a0b0c0;
  575. }
  576. /* 分组框 */
  577. QGroupBox {
  578. background-color: #f0f0f0;
  579. color: #0080c0;
  580. border: 1px solid #c0c0c0;
  581. }
  582. /* 表格 */
  583. QTableView, QTableWidget {
  584. background-color: #ffffff;
  585. color: #303030;
  586. gridline-color: #c0c0c0;
  587. selection-background-color: #c0d0e0;
  588. selection-color: #000000;
  589. alternate-background-color: #f5f5f5;
  590. }
  591. QTableView QHeaderView::section, QTableWidget QHeaderView::section {
  592. background-color: #e0e0e0;
  593. color: #0080c0;
  594. border: 1px solid #c0c0c0;
  595. }
  596. /* 列表 */
  597. QListView, QListWidget {
  598. background-color: #ffffff;
  599. color: #303030;
  600. border: 1px solid #c0c0c0;
  601. selection-background-color: #c0d0e0;
  602. }
  603. /* 树视图 */
  604. QTreeView, QTreeWidget {
  605. background-color: #ffffff;
  606. color: #303030;
  607. border: 1px solid #c0c0c0;
  608. selection-background-color: #c0d0e0;
  609. }
  610. /* 控制面板特殊样式 */
  611. #controlPanel {
  612. background-color: #f5f5f5;
  613. border: 1px solid #c0c0c0;
  614. }
  615. #controlPanel QLabel {
  616. color: #0080c0;
  617. }
  618. /* 告警面板特殊样式 */
  619. #alertPanel {
  620. background-color: #f5f5f5;
  621. border: 1px solid #c0c0c0;
  622. }
  623. /* 数据分析面板样式 */
  624. #analysisPanel {
  625. background-color: #f5f5f5;
  626. border: 1px solid #c0c0c0;
  627. }
  628. /* 摄像头视图样式 */
  629. #cameraView {
  630. border: 2px solid #a0b0c0;
  631. }
  632. /* 地图视图样式 */
  633. #mapView {
  634. border: 2px solid #a0b0c0;
  635. }
  636. /* 数据标签特殊样式 */
  637. .dataLabel {
  638. color: #00a080;
  639. }
  640. /* 告警标签特殊样式 */
  641. .alertLabel {
  642. color: #ff0000;
  643. }
  644. }