☰

DH3 Compact

The compact look for DH3

当前为 2021-01-03 提交的版本，查看 最新版本。

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