* Factor out the post navbar into a component. The post navbar is the part of the post containing the current search, the list of pools, and the list of favgroups, along with next/prev navigation links. * Change navbar markup: remove various unused CSS classes/IDs, change pools to use same markup as favgroups, replace nested <div>'s with flat <ul>/<li> list. * Use CSS to truncate long searches/pool names/favgroup names if they're too wide for the screen (especially on mobile).
32 lines
532 B
SCSS
32 lines
532 B
SCSS
.post-notice-search {
|
|
li {
|
|
display: flex;
|
|
|
|
&[data-selected="true"] {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.first, .prev, .next, .last {
|
|
flex: 0;
|
|
margin: 0 0.25em;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.first, .last {
|
|
flex-basis: 1em;
|
|
}
|
|
|
|
&.search-navbar .prev, &.search-navbar .next {
|
|
margin: 0 1.75em;
|
|
}
|
|
|
|
.pool-name, .favgroup-name, .search-name {
|
|
flex: 1;
|
|
text-align: center;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
}
|
|
}
|