1
0
Fork 0
forked from OpenNeo/impress
impress/app/assets/stylesheets/items/sources.sass
Matchu 4e11ee4da7 Add paint brush images to Item Getting Guide
In the previous change, we started grouping PB items by color. But I
wanted to better express that the grouping itself *is* an item, and the
items below it are secondary!

The main change we make here is to leverage DTI's existing design
language that "thumbnail image means item", and record thumbnail URLs
as well as paint brush names now, too!

We're still not leveraging the full Item system here, just fields on
Color. Keeping it simple for now!

Here's the script I ran to add the paint brush images to all the
existing colors!

```rb
Color.find_by_name("Baby").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/babypaintbrush.gif")
Color.find_by_name("Biscuit").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_biscuit.gif")
Color.find_by_name("Blue").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/bluepntbrsh.gif")
Color.find_by_name("Brown").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/brownpntbrush.gif")
Color.find_by_name("Camouflage").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_camo.gif")
Color.find_by_name("Candy").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_candy.gif")
Color.find_by_name("Checkered").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/checkeredpntbrush.gif")
Color.find_by_name("Christmas").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/xmaspaintbrush.gif")
Color.find_by_name("Cloud").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/cloudpntbrush.gif")
Color.find_by_name("Darigan").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/pb_darigan.gif")
Color.find_by_name("Dimensional").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_dimensional.gif")
Color.find_by_name("Disco").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/discopntbrush.gif")
Color.find_by_name("Electric").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/electricbluepntbrush.gif")
Color.find_by_name("Eventide").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/eventidepaintbrush.gif")
Color.find_by_name("Faerie").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/faeriepntbrush.gif")
Color.find_by_name("Fire").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/firepntbrush.gif")
Color.find_by_name("Elderlyboy").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/pb_elderly.gif")
Color.find_by_name("Elderlygirl").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/pb_elderly.gif")
Color.find_by_name("Ghost").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/ghostpntbrush.gif")
Color.find_by_name("Glowing").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/glowingpntbrsh.gif")
Color.find_by_name("Gold").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/gold_pntbrush.gif")
Color.find_by_name("Green").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/greenpntbrsh.gif")
Color.find_by_name("Grey").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/greypntbrush.gif")
Color.find_by_name("Halloween").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/halloweenpntbrsh.gif")
Color.find_by_name("Invisible").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/invisiblepntbrsh.gif")
Color.find_by_name("Desert").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/desertpaintbrush.gif")
Color.find_by_name("Maractite").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/maractitepaintbrush.gif")
Color.find_by_name("Maraquan").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/maraquanpntbrush.gif")
Color.find_by_name("Marble").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_marble.gif")
Color.find_by_name("Island").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/islandpntbrush.gif")
Color.find_by_name("Oil Paint").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/oilpaintingpntbrsh.gif")
Color.find_by_name("Orange").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/orange_paint_brush.gif")
Color.find_by_name("Origami").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_origami.gif")
Color.find_by_name("Pastel").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_pastel.gif")
Color.find_by_name("Pink").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/pink_paint_brush.gif")
Color.find_by_name("Pirate").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/piratepntbrush.gif")
Color.find_by_name("Plushie").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/plushiepaintbrush.gif")
Color.find_by_name("Polka Dot").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_polkadot.gif")
Color.find_by_name("Purple").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/purplepntbrsh.gif")
Color.find_by_name("Rainbow").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/rainbowpntbrsh.gif")
Color.find_by_name("Red").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/redpntbrsh.gif")
Color.find_by_name("Relic").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/relic_pntbrush.gif")
Color.find_by_name("Royalboy").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_royal.gif")
Color.find_by_name("Royalgirl").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_royal.gif")
Color.find_by_name("Sketch").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/sketchpntbrush.gif")
Color.find_by_name("Shadow").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/shadowpntbrsh.gif")
Color.find_by_name("Silver").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/silverpntbrsh.gif")
Color.find_by_name("Skunk").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/skunkpntbrush.gif")
Color.find_by_name("Snow").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_snowman.gif")
Color.find_by_name("Speckled").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/greenwhitedotspntbrush.gif")
Color.find_by_name("Split").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/halfandhalfpntbrsh.gif")
Color.find_by_name("Spotted").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/spottedpntbrush.gif")
Color.find_by_name("Starry").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/starspntbrush.gif")
Color.find_by_name("Stealthy").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/pb_stealthy.gif")
Color.find_by_name("Steampunk").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_steampunk.gif")
Color.find_by_name("Strawberry").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/strawberrypntbrush.gif")
Color.find_by_name("Striped").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/stripedpntbrsh.gif")
Color.find_by_name("Swamp Gas").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/newpbsg2011color.gif")
Color.find_by_name("Toy").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_toy.gif")
Color.find_by_name("Transparent").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/transparentpaintbrush.gif")
Color.find_by_name("Tyrannian").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/tyrannianpntbrush.gif")
Color.find_by_name("Usuki Boy").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/usukipaintbrush.gif")
Color.find_by_name("Usuki Girl").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/usukipaintbrush.gif")
Color.find_by_name("Valentine").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_valentine.gif")
Color.find_by_name("Water").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_water.gif")
Color.find_by_name("White").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/whitepntbrsh.gif")
Color.find_by_name("Woodland").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_woodland.gif")
Color.find_by_name("Wraith").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_wraith.gif")
Color.find_by_name("Yellow").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/yellowpntbrsh.gif")
Color.find_by_name("Zombie").update!(pb_item_thumbnail_url: "https://images.neopets.com/items/paintbrush_zombie.gif")
```
2024-05-22 16:59:36 -07:00

72 lines
1.3 KiB
Sass

@import "../partials/clean/constants"
@import "../partials/clean/mixins"
.item-list
border-collapse: collapse
border: 1px solid $soft-border-color
width: 60%
table-layout: auto
margin-bottom: 2em
td, th
border-top: 1px solid $soft-border-color
border-bottom: 1px solid $soft-border-color
padding: .25em
vertical-align: middle
&:first-child
padding-left: .5em
&:last-child
padding-right: .5em
.thumbnail-cell
width: 2.5em
height: 2.5em
img
display: block
width: 100%
height: 100%
.name-cell a
text-decoration: none
&:hover, &:focus
text-decoration: underline
.actions-cell
text-align: right
padding-left: 1em
font-size: 85%
tbody
tr
&:hover, &:focus-within
background: rgba($module-bg-color, 0.5)
thead
background: $module-bg-color
th
text-align: left
.thumbnail-cell img
outline: 1px solid $soft-border-color
.actions-cell button
/* Bootstrap's Purple 600 */
+awesome-button-color(#59359a)
.special-color-explanation
text-wrap: balance
font-style: italic
/* For wearable items that belong to a specific set that all come together,
* like a Paint Brush. */
&[data-group-type="bundle"]
tbody
.thumbnail-cell
opacity: 0.65
tr:hover .thumbnail-cell
opacity: 0.85