Compact Shops mod for Sixty Four

Readme.md

Compact Shop

This is a mod that make the shop even more compact when you use the compact shop button

Follow modding instruction on Sixty Four wiki

CompactShop.js

label = 'Compact Shop';
description = ' Make the shop even more compact when you use the compact shop button';

(function () {
  let c = typeof configuration === 'object' ? configuration : {};
  if (!c?.enabled) return;
  
  document.head.appendChild(document.createElement("style")).innerText = `
    .shop.minimized .shopItem {
      padding: 0.4em 0.6em;
      min-height: 89px;
    }
    .shop.minimized .shopItem .imageVessel {
      position: absolute;
      top: 0.4em;
      opacity: 25%;
    }
    .shop.minimized .shopItem .itemPrice {
      display: flex;
      flex-direction: row;
    }
    .shop.minimized .shopItem .itemPrice > * {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    .shop.minimized .shopItem .itemPrice .priceString {
      writing-mode: vertical-rl;
      text-orientation: mixed;
      text-shadow: 0 0 5px white;
      margin: 13px 0 0;
      position: relative;
      z-index: 1;
    }
    .shop.minimized .shopItem .itemHeader {
      position: relative;
      z-index: 1;
    }
    .shop.minimized .shopItem .existed {
      opacity: 0;
    }
    .shop.minimized .shopItem.newItem {
      box-shadow: 0 0 30px inset #ffe978;
    }
    .shop.minimized .shopItem.disabled {
      opacity: 100%;
      -webkit-filter: brightness(66%);
      filter: brightness(66%);
    }
  `;
})();