mirror of
https://github.com/github/awesome-copilot.git
synced 2026-03-12 12:15:12 +00:00
Add contribution CTA to all listing pages (#850)
* Add contribution CTA to all listing/search pages Add a reusable ContributeCTA component that encourages visitors to contribute their own resources. The CTA appears at the bottom of every resource listing page (agents, instructions, skills, hooks, workflows, plugins, tools) with: - Contextual text that adapts to the resource type - 'Contribute yours' primary button linking to CONTRIBUTING.md - 'Request a resource' outline button linking to new issue creation - Gradient top bar matching existing card design patterns - Responsive layout that stacks on mobile Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com> * Add Contribute button to page header on all listing pages Place an outlined Contribute button in each page-header section so it's immediately visible without scrolling. Uses accent purple border that fills on hover with a glow effect. Stacks below description on mobile via a 600px breakpoint. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com> * Add screenshots for contribution CTA PR Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com> * didn't mean to commit them * Extract PageHeader component to deduplicate header markup Address PR review feedback: the header Contribute link (URL, SVG icon, classes) was duplicated across all 7 listing pages. Extract into a reusable PageHeader.astro component that accepts title and description props, with a slot for rich HTML descriptions (used by workflows page). 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:
@@ -1076,6 +1076,49 @@ a:hover {
|
||||
color: var(--color-text-muted);
|
||||
}
|
||||
|
||||
.page-header-row {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.page-header-row > div:first-child {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.page-header .contribute-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
margin-top: 6px;
|
||||
padding: 8px 16px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: var(--color-accent);
|
||||
border: 1px solid var(--color-accent);
|
||||
border-radius: var(--border-radius);
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
transition: var(--transition);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.page-header .contribute-link:hover {
|
||||
background: var(--color-accent);
|
||||
color: #fff;
|
||||
box-shadow: var(--shadow-glow);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.page-header-row {
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.page-content {
|
||||
padding: 40px 0 80px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user