FV Giving Tree Condenser

Easily view items in the Giving Tree at once

/* ==UserStyle==
@name        FV Giving Tree Condenser
@namesake    https://greasyfork.org/en/scripts/407411-fv-giving-tree-condenser
@description Easily view items in the Giving Tree at once
@version     1.0.2
@namespace https://greasyfork.org/users/319295
==/UserStyle== */
/* ==UserStyle==
@name        FV Giving Tree Condenser
@namesake    https://greasyfork.org/en/scripts/407411-fv-giving-tree-condenser
@description Easily view items in the Giving Tree at once
@version     1.0.1
@namespace https://greasyfork.org/users/319295
==/UserStyle== */

@-moz-document url-prefix("https://www.furvilla.com/tree") {
/* hiding unnecessary content - alerts, logo, header, ads, shopkeeper*/
/* (logo and breadcrumbs removed because both link to Town Hall - which already has a link) */
.margin-10px, .content h1, #logo {
    display: none;
}

/* hiding unnecessary content but preserving spacing - "Home >> Giving Tree" */
.breadcrumbs {
    height: 20px;
    font-size: 0;
}

/*shrinks notifications widget*/
.notifications-widget {
    height: 32px;
    width: 116px;
    overflow: hidden;
    position: absolute;
    left: -74px;
    top: 54px;
    -ms-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
    z-index: 10;
}

/*expands notifications widget on mouseover*/
.notifications-widget:hover {
    height: auto;
    width: auto;
    left: -32px;
    top: 0;
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    padding: 10px 10px 0 42px;
}

/*keeps notifications header still on mouseover*/
.notifications-widget:hover .widget-header {
    -ms-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
    position: absolute;
    z-index: 10;
    left: -42px;
    top: 54px;
    border: 0;
}

/*keeps notifications header visible on smaller screens*/
@media screen and (max-width: 1054px)
  {
    .notifications-widget {
        transform: none;
    top: -32px;
    left: 400px;
  }

  .notifications-widget:hover .widget-header
  {
    transform: none;
    left: 432px;
    top: -32px;
  }
}

/* moves right column to the side, makes it scroll*/
.content .right-column {
    position: absolute;
    right: -232px;
    width: 232px;
    height: 830px;
    overflow: scroll;
}

/* making the main content bigger */
.content .left-column {
    width: 100%;
}

/* prevents chaos when tree is empty */
.content {
    min-height: 830px;
}

/* moves gift points tally to the bottom */
.shop-keeper + div + hr + .list-unstyled {
    position: absolute;
    bottom: 0;
    margin: 0 auto;
    left: 0;
    right: 0;
}

/* moves pagination to the top, centers it */
.content .pagination {
    position: absolute;
    top: 18px;
    left: 0;
    right: 0;
}

/* stops previous page button from jumping around */
.content .pagination li:first-child [rel] {
    position: absolute;
    left: 150px;
    top: 0;
}

/* stops next page button from jumping around */
.content .pagination li:last-child [rel] {
    position: absolute;
    right: 150px;
    top: 0;
}

/* shrinks items at the tree to 8 per line*/
.col-xs-4 {
    width: 11%;
    padding: 0;
    margin: 0 5px;
    height: 200px !important;
    position: relative;
}

/* condenses item boxes */
.col-xs-4 > div {
    height: 188px !important;
}
    
/* condenses item boxes */
.panel-body {
    padding: 6px;
    height: 188px;
    position: relative;
}

/* fixes "take" button in place */
.panel-body .btn {
    position: absolute;
    bottom: 6px;
    right: 17px;
}

/* removes "Anonymous" and username */
.col-xs-4 p, .col-xs-4 .name + p a {
    font-size: 0;
    line-height: normal;
    margin: 0;
}

/* places donor's village in upper right corner */
.col-xs-4 .fas {
    position: absolute;
    top: 3px;
    right: 3px;
    font-size: 12pt;
}

/* shrinks the image */
.col-xs-4 img {
    width: 65px;
}

/* keeps item name visible */
.col-xs-4 a {
    font-size: 9pt;
}

/* makes the item count less obnoxious */
b .counter {
    font-size: 9pt;
    padding: 0 2px;
    border-color: #aaa;
}

/* shrinks the header */
header {
    height: 78px;
}

/* shrinks the header (moving top part of navigation to proper position) */
header nav {
    top: 0;
    border-radius: 0;
}

/* moves the search bar to where the logo used to be */
header .search-form {
    top: 6px;
    left: 6px;
}
}