Matchu
bb0d219508
A funny table-layout bug, where the item "Portal to the Unknown" had a
very long Owls listing ("Owls listing: Buyable - Magic Lens + Blank
Grey Tome (NP)"), and so the table layout tried to give it more room by
decreasing the width of the action cell and wrapping the "NC Trades"
action button text onto multiple lines.
The fix: don't allow that! The table layout will figure out how to
handle this being disallowed, and give the actions cell an appropriate
minimum width.
88 lines
1.6 KiB
Sass
88 lines
1.6 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%
|
|
|
|
a, button
|
|
/* When item names get long, don't let the buttons wrap to give the
|
|
* item names more space. The names should wrap more instead! */
|
|
text-wrap: nowrap
|
|
|
|
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
|
|
|
|
.subtitle
|
|
font-size: 85%
|
|
opacity: .85
|
|
|
|
a[title]
|
|
text-decoration-line: underline
|
|
text-decoration-style: dotted
|
|
|
|
&:hover, &:focus
|
|
text-decoration-style: solid
|
|
|
|
/* 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
|