Skip to content

Flight Rising: AH Sell Search by meow

Screenshot of Flight Rising: AH Sell Search

Details

Authormeow

LicenseNo License

CategoryFlight Rising

Created

Updated

Size1.5 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Tired of scrolling through your massive hoard and trying to find the item you want to sell by sight alone? This is a simple, completely CSS-based 'search' for your hoard in sell tabs in the Auction House.

Notes

See this imgur album for screenshots of the two different display styles.

INSTALLATION INSTRUCTIONS:

  1. This style is also on Userstyles.org/The USO Archive. Installing via Userstyles.world is the best method, as it will give you the additional ability to toggle between Case Insensitive and Case Sensitive searches due being able to set the case insensitive value via a dropdown (CSSLint will say there are syntax errors when viewing the code in Stylus, but it will function just fine). If you choose to install via the USO archive, you must edit the code once in order to fix a userstyles.org-specific bug, so go to step 2.
  2. After installing via the USO Archive, open the style in the style manager to edit the style. Find the following in the code: /*i*/ and uncomment it (/*i*/ → i). Due to an error with Userstyle's syntax checker, it will not let me save the style unless this is commented out. If you do not have this uncommented your searches will be case-sensitive.
  3. Navigate to the AH selling page of your choice. To disable/enable the style, change your search term, change the search style, etc. please see these pages for instructions on how to customize userstyles. Changing the text input will change the items shown. I recommend having 'save on change' checked or you will have to click save every time you change something.

How it works:

In the site code for the area that displays the items you can list for sale, each icon also has its full name included in the code under a value called "data-name." Using a CSS [attribute="value"] selector, you can use css to make a simple item filter.

Other Notes:

  • One of the limitations of using only css is that I can't make it ignore the styling if the search has nothing in the string, so you have to disable the style when you're done searching and want to look through your items normally, and enable it again when you want to use the style to search for particular items.
  • No, I will not make this into a userscript. You know why.

Source code

/* ==UserStyle==
@name           Flight Rising: AH Sell Search
@namespace      userstyles.world/user/meow
@version        1.2.0
@description    `Tired of scrolling through your massive hoard and trying to find the item you want to sell by sight alone? This is a simple, completely CSS-based 'search' for your hoard in sell tabs in the Auction House.`
@author         userstyles.world/user/meow

@advanced text search "Search Query" "EditMe"
@advanced dropdown case "Case" {
case1 "Insensitive" <<<EOT i EOT;
case2 "Sensitive" <<<EOT EOT;
}
@advanced dropdown style "Display Style" {
style1 "Style 1" <<<EOT 
    .itemicon.itemicon-small.ah-sell-item {
        display: none;
    }
EOT;
style2 "Style 2" <<<EOT 
    .itemicon.itemicon-small.ah-sell-item {
        opacity: 0.5;
    }
EOT;
}
==/UserStyle== */

@-moz-document url-prefix("https://www1.flightrising.com/auction-house/sell/") {
    /*[[style]]*/

    /*Change AH item container to display grid in order to use order property for Style 2*/
    .ah-sell-item-padcontainer {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    }
    /*Ensure item images are 40x40*/
    .ah-sell-item-padcontainer div.itemicon img {
        width: 40px;
        height: 40px;
    }
    /* Change search term via customizing the style's text input */
    .itemicon.itemicon-small.ah-sell-item[data-name*="/*[[search]]*/" /*[[case]]*/] {
        display: inline-block;
        opacity: 1;
        order: -1;
    }
}

Reviews

No reviews yet.