mirror of
https://github.com/github/awesome-copilot.git
synced 2026-04-30 12:15:56 +00:00
Simplify website search and listing controls (#1553)
* Removing search from the home pageThis was a little confusing because there are two searches, but the overall site search is a lot more powerful * Prefilter website search by resource page Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com> * small error handling and formatting * Simplify website listing controls Remove per-page text search, trim page-specific controls, and move remaining sort/filter controls into compact flyouts. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com> --------- Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
@@ -1428,15 +1428,135 @@ body:has(#main-content) {
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-bottom: 16px;
|
||||
padding: 10px 14px;
|
||||
background: var(--color-glass);
|
||||
backdrop-filter: blur(10px);
|
||||
border: 1px solid var(--color-glass-border);
|
||||
border-radius: var(--border-radius-lg);
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.listing-toolbar-row {
|
||||
display: flex;
|
||||
flex: 1 1 100%;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.listing-toolbar .results-count {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.listing-controls {
|
||||
position: relative;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.listing-controls[open] {
|
||||
z-index: 20;
|
||||
}
|
||||
|
||||
.listing-controls-trigger {
|
||||
list-style: none;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 8px;
|
||||
min-height: 36px;
|
||||
padding: 7px 12px;
|
||||
border: 1px solid var(--color-glass-border);
|
||||
border-radius: 999px;
|
||||
background: var(--color-glass);
|
||||
color: var(--color-text-muted);
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
line-height: 1.2;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
transition: border-color var(--transition), background-color var(--transition), color var(--transition), box-shadow var(--transition);
|
||||
}
|
||||
|
||||
.listing-controls-trigger::-webkit-details-marker {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.listing-controls-trigger::after {
|
||||
content: '▾';
|
||||
font-size: 11px;
|
||||
line-height: 1;
|
||||
color: var(--color-text-muted);
|
||||
transition: transform var(--transition), color var(--transition);
|
||||
}
|
||||
|
||||
.listing-controls-trigger:hover,
|
||||
.listing-controls[open] .listing-controls-trigger {
|
||||
background: var(--color-bg-secondary);
|
||||
border-color: var(--color-border);
|
||||
color: var(--color-text-primary);
|
||||
}
|
||||
|
||||
.listing-controls[open] .listing-controls-trigger {
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.listing-controls[open] .listing-controls-trigger::after {
|
||||
transform: rotate(180deg);
|
||||
color: var(--color-text-primary);
|
||||
}
|
||||
|
||||
.listing-controls-panel {
|
||||
position: absolute;
|
||||
top: calc(100% + 8px);
|
||||
right: 0;
|
||||
width: min(336px, calc(100vw - 32px));
|
||||
padding: 14px;
|
||||
background: var(--color-card-bg);
|
||||
border: 1px solid var(--color-glass-border);
|
||||
border-radius: var(--border-radius-lg);
|
||||
backdrop-filter: blur(18px);
|
||||
box-shadow: var(--shadow-md);
|
||||
}
|
||||
|
||||
.listing-controls-panel .filters-bar {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.listing-controls-panel .filter-group {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.listing-controls-panel .filters-bar .filter-group > label:not(.checkbox-label) {
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: var(--color-text-primary);
|
||||
}
|
||||
|
||||
.listing-controls-panel .filter-group select,
|
||||
.listing-controls-panel .filter-group .choices {
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.listing-controls-panel .filter-group .choices {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.listing-controls-panel .choices__inner {
|
||||
min-height: 40px;
|
||||
}
|
||||
|
||||
.listing-controls-panel .filters-bar button {
|
||||
align-self: flex-end;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.search-bar {
|
||||
display: contents;
|
||||
}
|
||||
@@ -1673,6 +1793,23 @@ body:has(#main-content) {
|
||||
.listing-toolbar {
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.listing-toolbar-row {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.listing-controls {
|
||||
width: 100%;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.listing-controls-trigger {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.listing-controls-panel {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* Resource List */
|
||||
|
||||
Reference in New Issue
Block a user