stylus/popup/search-results.css
derv82 1daa12b59f Search userstyles by-category. Fetch only when needed.
* Discovers category via userstyles request.
* Disables navigation while loading results.
* Navigation above search results
* Handles styles without screenshots (blank img).
2017-12-02 03:29:12 -08:00

94 lines
1.5 KiB
CSS
Executable File

#disable-all-wrapper {
border-bottom: solid 1px #000;
margin-bottom: 5px;
}
#searchResults,
#load-search-results {
display: block;
}
#searchResults.hidden,
#searchResults-error.hidden,
#load-search-results.hidden {
display: none;
}
#searchResults-error {
background-color: rgba(255, 0, 0, 0.4);
font-weight: bold;
padding: 5px;
text-align: center;
margin-right: 20px;
}
#searchResults, #searchResults-list {
max-width: 200px;
overflow: hidden;
}
.searchResult {
padding: 5px;
}
.searchResult:hover {
background-color: rgba(50, 150, 255, 0.5);
}
.searchResult.loading {
opacity: 0.5;
}
.searchResult img {
display: block;
max-width: 180px;
max-height: 180px;
}
.searchResult-screenshot.no-screenshot {
width: 180px;
height: 40px;
}
.searchResult-title {
display: block;
font-weight: bold;
}
.searchResult-description {
overflow: hidden;
font-style: italic;
}
.searchResult > * {
overflow-x: hidden;
white-space: nowrap;
}
.searchResult-install {
width: 100%;
}
#searchResultsNav {
flex-direction: row;
text-align: center;
word-break: keep-all;
opacity: 1.0;
}
#searchResultsNav.loading {
opacity: 0.5;
}
#searchResultsNav label {
width: 40px;
display: inline-block;
word-break: keep-all;
}
#searchResultsNav button {
text-align: center;
}
#searchResultsNav-prev[disabled],
#searchResultsNav-next[disabled] {
cursor: not-allowed;
background-image: linear-gradient(rgba(90, 90, 90, 0.5), rgba(90, 90, 90, 0.5));
}