DH3 Compact

The compact look for DH3

当前为 2021-01-24 提交的版本,查看 最新版本

  1. /* ==UserStyle==
  2. @name DH3 Compact
  3. @description The compact look for DH3
  4. @namespace https://github.com/lbrustad
  5. @version 1.1.3
  6. @author Lasse Brustad
  7. ==/UserStyle== */
  8.  
  9. @-moz-document url-prefix("https://dh3.diamondhunt.co/") {
  10.  
  11. body {
  12. font-size: 16px;
  13. }
  14.  
  15. /* fixes annoying top bar putting text on a new line because of too much text */
  16. .top-top-bar {
  17. font-size: 13px;
  18. width: 100vw;
  19. position: fixed;
  20. z-index: 999;
  21. }
  22.  
  23. .center {
  24. font-size: 0;
  25. }
  26.  
  27. td.center {
  28. font-size: inherit;
  29. }
  30.  
  31. /* makes levels a bit nicer! */
  32. td>div#top-bar-skills.not-table-top-main-skills {
  33. padding: 0;
  34. margin: 0;
  35. display: grid;
  36. grid-template-columns: repeat(9, 1fr);
  37. justify-items: stretch;
  38. }
  39.  
  40. td>div#top-bar-skills.not-table-top-main-skills:hover {
  41. padding: 0;
  42. margin: 0;
  43. }
  44.  
  45. /* this one is for side chat users */
  46. div#top-bar-skills.not-table-top-main-skills > div {
  47. min-width: 0;
  48. }
  49.  
  50. div#top-bar-skills.not-table-top-main-skills > div > table {
  51. transform: scale(0.9);
  52. width: 100%
  53. }
  54.  
  55. div#top-bar-skills.not-table-top-main-skills > div > table > tbody > tr {
  56. display: grid;
  57. grid-template-columns: 1fr;
  58. justify-items: center;
  59. }
  60.  
  61. div#top-bar-skills.not-table-top-main-skills > div > table > tbody > tr img {
  62. margin: 0 2rem;
  63. }
  64.  
  65. div.not-table-top-main-skills-item {
  66. padding: 0;
  67. }
  68.  
  69. .not-table-top-main-skills-item table:last-child tr>td:last-child {
  70. display: grid;
  71. grid-template-columns: 6fr 5fr;
  72. }
  73.  
  74. .not-table-top-main-skills-item table:last-child tr>td:last-child :nth-child(1) {
  75. grid-area: 1 / 1;
  76. justify-self: right;
  77. line-height: 1.4rem;
  78. text-shadow: black 2px 1px;
  79. }
  80.  
  81. .not-table-top-main-skills-item table:last-child tr>td:last-child :nth-child(2) {
  82. grid-area: 1 / 2;
  83. justify-self: left;
  84. line-height: 1.4rem;
  85. text-shadow: black 1px 1px;
  86. }
  87.  
  88. .not-table-top-main-skills-item table:last-child tr>td:last-child :nth-child(4) {
  89. grid-area: 1 / 1 / 2 / 3;
  90. justify-self: center;
  91. }
  92.  
  93. .not-table-top-main-skills-item table:last-child tr>td:last-child :nth-child(6),
  94. .not-table-top-main-skills-item table:last-child tr>td:last-child :nth-child(7) {
  95. grid-area: 3 / 1 / 4 / 3;
  96. justify-self: center;
  97. }
  98.  
  99. .not-table-top-main-skills-item table:last-child tr>td:last-child br {
  100. display: none;
  101. }
  102.  
  103. .not-table-top-main-skills-item table:last-child tr>td:last-child span {
  104. transform: scale(0.9);
  105. zoom: 0.9;
  106. }
  107.  
  108. div.xp-bar,
  109. div.xp-bar-inner {
  110. height: 1.2rem;
  111. }
  112.  
  113. /* tiny modification to the navbar */
  114. .navigate-button {
  115. display: grid !important;
  116. grid-template-rows: auto auto;
  117. grid-template-columns: auto;
  118. justify-items: center;
  119. }
  120.  
  121. .navigate-button br {
  122. display: none;
  123. }
  124.  
  125. /* less empty space caused by br tags... stop using it Smitty... */
  126. #game > br,
  127. div.right-panel > div > br {
  128. display: none;
  129. }
  130.  
  131. table.table-top-main-items {
  132. margin-top: 36px;
  133. padding: 0 8px;
  134. }
  135.  
  136. /* images should be tinyyy */
  137. img.img-50 {
  138. width: 35px;
  139. height: 35px;
  140. }
  141.  
  142. img.img-100 {
  143. width: 70px;
  144. height: 70px;
  145. }
  146.  
  147. /* tiny lvls too ofc... */
  148. div#top-bar-skills.not-table-top-main-skills {
  149. margin-top: 4px;
  150. padding: 0 8px;
  151. }
  152.  
  153. /* notifications and that shit can be a little tinyyyer */
  154. div#notification-area {
  155. margin-bottom: 4px;
  156. }
  157.  
  158. /* game area */
  159.  
  160. /* annoying height with lots of empty space .... gone! */
  161. div.right-panel {
  162. min-height: 0;
  163. }
  164.  
  165. /* just for the item boxes because they lost that much space */
  166. div.right-panel > div > div {
  167. padding: 4px;
  168. }
  169.  
  170. /* less empty space between item boxes, it's not nessessary with that space duh */
  171. div.item-box {
  172. margin: 4px;
  173. width: 120px;
  174. height: 120px;
  175. }
  176. div.item-box >:first-child,
  177. div.item-box >:last-child {
  178. font-size: 8pt !important;
  179. height: 15px;
  180. margin-top: 5px;
  181. }
  182. #item-box-honeyStew-image {
  183. margin-bottom: -8px;
  184. }
  185.  
  186. /* dialogues */
  187.  
  188. /* tradables - sell item */
  189. #dialogue-tradables.dialogue {
  190. left: 23% !important;
  191. max-width: 54% !important;
  192. margin-top: 150px;
  193. margin-left: 0 !important;
  194. }
  195.  
  196. /* hdie useless stuff */
  197. #item-box-snow {
  198. display: none;
  199. }
  200. }