while i love the new update to the item pages, i'd personally like to find a way to make them not so big/clunky on my end;

here's what i'm talking about

i don't know if it looks as big for everybody or if its just me, but if there's any customCSS that can make these a bit smaller or more akin to how small it looked before but with the same visual I'd love to hear about them. i know near to nothing about working with CSS so help would be much appreciated! thanks in advance

Here's what I'm currently using; the result is minimalist and aggressively small.

Some aspects may break due to continued updates to the page (or cases I haven't encountered). Let me know if you have problems or questions.

ahh thank you! i actually really like that change; it got rid of the way it'd squish all the text into the middle, and i'm able to reach the 'donate' and 'delete' buttons alot easier now than before. i did a bit of tinkering with the code to add the borders back on and i really like it this way.

how it looks now:

comparison; after and before:

/* item menu ui / a[href="/inventory.php"] ~ .container .col-6 { flex: unset; max-width: 550px; } a[href="/inventory.php"] ~ .container .card { margin: 0 0 1em 0 !important; font-size: 11px; background-color:# !important; border: 1.5px solid ; } a[href="/inventory.php"] ~ .container .card-title { margin: 0 0 .25em 0; font-size: 1.25em; font-weight: bold; } a[href="/inventory.php"] ~ .container br + b { font-weight: initial; font-style: italic; display: table; / evil / margin: -1.25em 0 .25em 0; } a[href="/inventory.php"] ~ .container .card-body { padding: 0.5em; } a[href="/inventory.php"] ~ .container .row p:first-of-type { margin: 0.5em; } a[href="/inventory.php"] ~ .container .row img { margin: 0.5em; } a[href="/inventory.php"] ~ .container .row p:nth-of-type(2) { margin-bottom: 0.5em; } a[href="/inventory.php"] ~ .container .card > p:first-of-type, a[href="/inventory.php"] ~ .container .card > .card-title + p, a[href="/inventory.php"] ~ .container b:not(:first-child) + br, a[href="/inventory.php"] ~ .container .card-body center + br, a[href="/inventory.php"] ~ .container .card * .card-body br + br { display: none; } / slide closed, not just open */ a[href="/inventory.php"] ~ .container .collapse, a[href="/inventory.php"] ~ .container .collapsing { display: block !important; transition: height .45s ease; overflow: hidden; } a[href="/inventory.php"] ~ .container .collapse:not(.show) { height: 0 !important; } a[href="/inventory.php"] ~ .container .collapse .card-body, a[href="/inventory.php"] ~ .container .collapsing .card-body { padding-top: .25em; }

it's not terribly small for me at all but if i do encounter any problems with it i'll be sure to let you know. thanks so much.