☰

PoeStack compact UI

Compact PoeStack UI intended for computer screens

    /* ==UserStyle==
@name           PoeStack compact UI
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    Compact PoeStack UI intended for computer screens
@author         afkoncore
@license        MIT
==/UserStyle== */
    @-moz-document domain("poestack.com") {

        * {
            font-size: 0.978em
        }

        .w-full {
            width: auto;
        }

        ::-webkit-scrollbar {
            width: 0.5em;
        }

       /*HEADER*/
        .h-\[70px\] {
            height: 30px;
            font-size: 1.2vw;
        }
        .px-2 {
            padding-left: 0rem;
        }
        [alt="PoeStack"] {
            height: 2em;
            width: 2em;
        }

        .basis-\[15\%\].min-w-\[180px\] {
            display: none;
        }

        .pl-5 {
            padding-left: 0rem;
        }

        .pl-5 > a > div {
            /*"PoeStack" title*/
            font-size: 1.5em;
            margin-right: 1em;
        }

        [src="/logo_noname.png"] {
            display: none;
        }

        .relative.inline-block.text-left > div > button {
            padding: 0 0.1em;
        }

        .pr-2.pl-4 {
            padding: 0;
            padding-right: .1em;
        }

        .pr-2.pl-4 > div > div > div > button {
            border-radius: .3em;
            padding: 0;
            font-size: .9vw;
        }
        .pr-2.pl-4 > div > div > div > button > svg {
            width: 1em;
        }


        /*BODY*/
        div.flex-1.flex.flex-col.pb-\[150px\].min-h-screen.pt-4>div.text-center.pb-4{
            display:none;
        }
        .space-x-4 > :not([hidden]) ~ :not([hidden]) {
            margin-left: .2rem;
        }
        .pt-4 {
            padding-top: 0rem;
        }

        .p-3 {
            padding: 0.1em;
        }


        .mx-auto {
            padding-top: 0;
        }


        .space-x-4,
        .min-h-screen {
            padding-bottom: 0;
        }

        .gap-4 {
            gap: .4rem;
        }


        footer {
            padding: 0!important;
            padding-top: 0.5em!important;
            margin-top: 1em!important;
        }

       /*Stash list column*/
        .bg-gray-100 {
            background-color: rgba(255, 255, 255, .25);
        }
        .border-gray-300 {
            border-color: rgba(255, 255, 255, .25);
        }

        .flex.items-center.space-x-1 {
            margin: 0;
        }
        .flex.items-center.space-x-1 > label {
            font-size: 1.2em;
        }
        [id^=headlessui-listbox-button-] {
            padding: .1em .5em;
        }

       /*Graph*/
        [xmlns="http://www.w3.org/2000/svg"] {
            height: 1.5em;
        }
        .rounded.shadow-lg.bg-surface-primary.flex.flex-col.p-3.w-full > canvas {
            width: 70%!important;
            height: 88%!important;
            margin: 0 auto;
        }
        .flex.space-x-2 > button,
        button#headlessui-listbox-button-\:r3\: {
            font-size: 1em;
            height: 1.8em;
            width: auto;
            padding: 0 .5em;
            margin: 0;
            flex: none;
        }

        [aria-labelledby^="headlessui-listbox-button-"] > li,
        [aria-labelledby^="headlessui-listbox-button-"] {
            margin: 0;
            padding: 0 .3em;
            flex: none;
            width: auto;
        }
        #player, iframe{
            width: 99%!important;
        }
    }