ActiveQuestUI_Fixed.uss 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202
  1. /* Unity UI Toolkit Compatible Active Quest UI Styles */
  2. /* Main quest tracker container */
  3. .quest-tracker {
  4. position: absolute;
  5. top: 20px;
  6. right: 20px;
  7. width: 300px;
  8. max-height: 500px;
  9. background-color: rgba(20, 20, 30, 0.9);
  10. border-radius: 8px;
  11. padding: 15px;
  12. border-width: 2px;
  13. border-color: rgba(100, 100, 150, 0.5);
  14. }
  15. /* Tracker header */
  16. .tracker-header {
  17. flex-direction: row;
  18. justify-content: space-between;
  19. align-items: center;
  20. margin-bottom: 15px;
  21. padding-bottom: 8px;
  22. border-bottom-width: 1px;
  23. border-bottom-color: rgba(100, 100, 150, 0.3);
  24. }
  25. .tracker-title {
  26. font-size: 16px;
  27. -unity-font-style: bold;
  28. color: rgb(255, 215, 0);
  29. }
  30. .tracker-toggle {
  31. width: 20px;
  32. height: 20px;
  33. background-color: rgba(100, 100, 150, 0.5);
  34. border-radius: 10px;
  35. font-size: 12px;
  36. -unity-font-style: bold;
  37. color: white;
  38. }
  39. /* Quest list in tracker */
  40. .quest-tracker-list {
  41. max-height: 350px;
  42. }
  43. /* Individual quest entries */
  44. .quest-entry {
  45. background-color: rgba(40, 40, 60, 0.8);
  46. margin-bottom: 8px;
  47. padding: 10px;
  48. border-radius: 4px;
  49. border-left-width: 3px;
  50. border-left-color: rgba(100, 100, 150, 0.7);
  51. }
  52. .quest-entry:hover {
  53. background-color: rgba(50, 50, 70, 0.9);
  54. }
  55. .quest-entry.selected {
  56. background-color: rgba(60, 60, 80, 1);
  57. border-left-color: rgb(255, 215, 0);
  58. }
  59. /* Quest entry content */
  60. .quest-entry-header {
  61. flex-direction: row;
  62. justify-content: space-between;
  63. align-items: flex-start;
  64. margin-bottom: 5px;
  65. }
  66. .quest-entry-title {
  67. font-size: 13px;
  68. -unity-font-style: bold;
  69. color: white;
  70. flex-grow: 1;
  71. }
  72. .quest-entry-time {
  73. font-size: 10px;
  74. color: rgb(255, 165, 0);
  75. -unity-text-align: middle-right;
  76. }
  77. .quest-entry-location {
  78. font-size: 11px;
  79. color: rgb(100, 200, 255);
  80. margin-bottom: 3px;
  81. }
  82. .quest-entry-progress {
  83. font-size: 10px;
  84. color: rgb(200, 200, 200);
  85. }
  86. /* Quest action buttons */
  87. .quest-actions {
  88. flex-direction: row;
  89. justify-content: space-around;
  90. margin-top: 8px;
  91. }
  92. .quest-action-btn {
  93. height: 25px;
  94. min-width: 60px;
  95. font-size: 10px;
  96. border-radius: 3px;
  97. background-color: rgba(100, 100, 150, 0.6);
  98. color: white;
  99. }
  100. .quest-action-btn:hover {
  101. background-color: rgba(120, 120, 170, 0.8);
  102. }
  103. /* Quest popup/detail view */
  104. .quest-popup {
  105. position: absolute;
  106. top: 50%;
  107. left: 50%;
  108. translate: -50% -50%;
  109. width: 400px;
  110. max-height: 500px;
  111. background-color: rgba(20, 20, 30, 0.95);
  112. border-radius: 8px;
  113. padding: 20px;
  114. border-width: 2px;
  115. border-color: rgb(100, 100, 150);
  116. }
  117. .popup-header {
  118. flex-direction: row;
  119. justify-content: space-between;
  120. align-items: center;
  121. margin-bottom: 15px;
  122. }
  123. .popup-title {
  124. font-size: 18px;
  125. -unity-font-style: bold;
  126. color: rgb(255, 215, 0);
  127. }
  128. .popup-close {
  129. width: 25px;
  130. height: 25px;
  131. background-color: rgba(139, 69, 19, 0.8);
  132. border-radius: 3px;
  133. font-size: 14px;
  134. -unity-font-style: bold;
  135. color: white;
  136. }
  137. .popup-content {
  138. flex-grow: 1;
  139. }
  140. .popup-section {
  141. margin-bottom: 15px;
  142. }
  143. .popup-section-title {
  144. font-size: 14px;
  145. -unity-font-style: bold;
  146. color: rgb(100, 200, 255);
  147. margin-bottom: 5px;
  148. }
  149. .popup-text {
  150. font-size: 12px;
  151. color: rgb(200, 200, 200);
  152. }
  153. /* Quest urgency indicators */
  154. .quest-entry.urgency-critical {
  155. border-left-color: rgb(255, 0, 0);
  156. }
  157. .quest-entry.urgency-high {
  158. border-left-color: rgb(255, 165, 0);
  159. }
  160. .quest-entry.urgency-medium {
  161. border-left-color: rgb(255, 255, 0);
  162. }
  163. .quest-entry.urgency-low {
  164. border-left-color: rgb(0, 255, 0);
  165. }
  166. /* Minimized state */
  167. .quest-tracker.minimized {
  168. height: 50px;
  169. }
  170. .quest-tracker.minimized .quest-tracker-list {
  171. display: none;
  172. }