Skip to content

Commit c84ce95

Browse files
phiro56madolson
phiro56
and
madolson
authored
feat: add community page with navigation updates (#264)
- Create community page template and content - Update navigation menu to match new design and include Community page link ![screencapture-127-0-0-1-1111-community-2025-05-22-13_20_39](https://github.com/user-attachments/assets/973b0d1e-28bd-4cae-bca3-8a503e037183) --------- Signed-off-by: Daniel Phillips <phiro56@gmail.com> Signed-off-by: Madelyn Olson <madelyneolson@gmail.com> Co-authored-by: Madelyn Olson <madelyneolson@gmail.com>
1 parent 9d8abed commit c84ce95

File tree

11 files changed

+292
-15
lines changed

11 files changed

+292
-15
lines changed

‎content/community.md

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
+++
2+
title = "Community"
3+
description = "Join the Valkey community"
4+
template = "community.html"
5+
6+
[extra]
7+
cards = [
8+
{ icon = "icon-question.svg", title = "Ask Questions", description = "If you have any inquiries about Valkey, feel free to join the conversation on our GitHub discussions or chat with us on Slack.", links = [
9+
{ url = "https://github.com/orgs/valkey-io/discussions", text = "GitHub Repository" },
10+
{ url = "https://valkey-oss-developer.slack.com/join/shared_invite/zt-2nxs51chx-EB9hu9Qdch3GMfRcztTSkQ#/shared-invite/email", text = "Slack" }
11+
] },
12+
{ icon = "icon-bug.svg", title = "Report Bugs", description = "If you encounter any issues while using Valkey, please help us improve the project by filing a bug report at our GitHub repository.", links = [
13+
{ url = "https://github.com/valkey-io/valkey/issues/new?assignees=&labels=&projects=&template=bug_report.md&title=%5BBUG%5D", text = "GitHub Repository" }
14+
] },
15+
{ icon = "icon-users.svg", title = "Connect on Social Media", description = "Stay updated and connect with us on our social media platforms.", links = [
16+
{ url = "https://www.linkedin.com/company/valkey/", text = "LinkedIn" },
17+
{ url = "https://bsky.app/profile/valkeyio.bsky.social/", text = "Bluesky" },
18+
{ url = "https://twitter.com/valkey_io", text = "Twitter" }
19+
] },
20+
{ icon = "icon-bulb.svg", title = "Suggest Features", description = "We value your ideas! If you have a suggestion for a new feature, please submit a feature request on our GitHub.", links = [
21+
{ url = "https://github.com/valkey-io/valkey/issues/new?assignees=&labels=&projects=&template=feature_request.md&title=%5BNEW%5D", text = "GitHub" }
22+
] },
23+
{ icon = "icon-sheild.svg", title = "Security Concerns", description = "For any potential security issues, please refer to our Security Policy.", links = [
24+
{ url = "https://github.com/valkey-io/valkey/blob/unstable/SECURITY.md", text = "Learn more" }
25+
] },
26+
{ icon = "icon-book.svg", title = "Community Conduct", description = "If you experience any issues with community members behavior, kindly check our Code of Conduct for guidance.", links = [
27+
{ url = "/code_of_conduct", text = "Learn more" }
28+
] }
29+
]
30+
+++
31+
32+
# Community
33+
## How to Contribute with us?
34+
We welcome your involvement in the Valkey community! Here are several ways you can contribute:

‎sass/_valkey.scss

Lines changed: 144 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -172,8 +172,9 @@ p {
172172
}
173173

174174
>a {
175-
&:hover {
176-
border-color: inherit;
175+
&:hover,
176+
&.active {
177+
border-color: inherit;
177178
text-decoration: underline;
178179

179180
@include respond-min(768px) {
@@ -1393,3 +1394,144 @@ pre table {
13931394
}
13941395
}
13951396
}
1397+
1398+
// Community Page Styles
1399+
.community-hero {
1400+
background: linear-gradient(90deg, #4e3bbd 0%, #6983ff 100%);
1401+
padding: 3rem 0 2rem 0;
1402+
text-align: center;
1403+
}
1404+
1405+
.community-header {
1406+
1407+
h1 {
1408+
text-align: center;
1409+
background-image: linear-gradient(rgb(59, 42, 102), rgb(78, 81, 191));
1410+
padding: 80px;
1411+
margin: 0 0 5rem;
1412+
font-size: 4rem;
1413+
font-weight: 700;
1414+
line-height: 1;
1415+
color: #fff;
1416+
}
1417+
1418+
h2 {
1419+
color: #30176e;
1420+
font-size: 3.25rem;
1421+
font-weight: 700;
1422+
margin-bottom: 0;
1423+
}
1424+
1425+
p {
1426+
color: #30176e;
1427+
margin: 0 0 0;
1428+
1429+
}
1430+
}
1431+
1432+
.community-title {
1433+
color: #fff;
1434+
font-size: 3.2rem;
1435+
font-weight: 700;
1436+
margin: 0;
1437+
letter-spacing: 1px;
1438+
}
1439+
1440+
.community-section {
1441+
background: #e9eef7;
1442+
text-align: center;
1443+
padding-bottom: 6rem;
1444+
}
1445+
1446+
.community-card-grid {
1447+
display: grid;
1448+
grid-template-columns: repeat(3, 1fr);
1449+
gap: 2.5rem;
1450+
max-width: 1100px;
1451+
margin: 3rem auto 0;
1452+
@media (max-width: 1100px) {
1453+
padding: 0 3rem;
1454+
}
1455+
}
1456+
1457+
@media (max-width: 900px) {
1458+
.community-card-grid {
1459+
grid-template-columns: 1fr 1fr;
1460+
}
1461+
}
1462+
@media (max-width: 600px) {
1463+
.community-card-grid {
1464+
grid-template-columns: 1fr;
1465+
}
1466+
}
1467+
1468+
.community-card {
1469+
background: #fff;
1470+
border-radius: 18px;
1471+
box-shadow: 0 4px 24px 0 rgba(105, 131, 255, 0.10);
1472+
padding: 3rem;
1473+
display: flex;
1474+
flex-direction: column;
1475+
align-items: center;
1476+
transition: box-shadow 0.2s;
1477+
}
1478+
.community-card:hover {
1479+
box-shadow: 0 8px 32px 0 rgba(105, 131, 255, 0.18);
1480+
}
1481+
1482+
.community-card-icon {
1483+
width: 48px;
1484+
height: 48px;
1485+
margin-bottom: 1.2rem;
1486+
}
1487+
1488+
.community-card h3 {
1489+
font-size: 2rem;
1490+
font-weight: 700;
1491+
color: #2d2471;
1492+
margin: 0 0 0.7rem 0;
1493+
text-align: center;
1494+
}
1495+
1496+
.community-card p {
1497+
color: #3a3a4d;
1498+
font-size: 1.75rem;
1499+
margin: 0 0 1.5rem 0;
1500+
text-align: left;
1501+
}
1502+
1503+
.community-card-actions {
1504+
display: flex;
1505+
gap: 0.7rem;
1506+
flex-wrap: wrap;
1507+
justify-content: center;
1508+
width: 100%;
1509+
margin-top: auto;
1510+
}
1511+
1512+
.community-card .btn {
1513+
background: none;
1514+
color: #072150;
1515+
border: 1px solid #072150;
1516+
border-radius: 24px;
1517+
padding: 0.75rem 1.5rem;
1518+
font-size: 1.5rem;
1519+
font-weight: 600;
1520+
text-decoration: none;
1521+
display: flex;
1522+
align-items: center;
1523+
gap: 0.5rem;
1524+
transition: background 0.15s, color 0.15s, border 0.15s;
1525+
}
1526+
1527+
.community-card .btn:hover {
1528+
background: #072150;
1529+
color: #fff;
1530+
border: 1px solid #072150;
1531+
}
1532+
1533+
.icon-social {
1534+
width: 18px;
1535+
height: 18px;
1536+
margin-right: 0.3rem;
1537+
}

‎static/assets/js/nav.js

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,32 @@ window.toggleHeaderMenu = function() {
66
}
77
};
88

9+
// Set active menu item based on current URL
10+
function setActiveMenuItem() {
11+
const nav = document.querySelector('.header nav');
12+
if (!nav) return;
13+
14+
const currentPath = window.location.pathname;
15+
const menuItems = nav.querySelectorAll('a[role="menuitem"]');
16+
17+
menuItems.forEach(item => {
18+
const itemPath = item.getAttribute('href');
19+
// Remove trailing slash for comparison
20+
const normalizedItemPath = itemPath.replace(/\/$/, '');
21+
const normalizedCurrentPath = currentPath.replace(/\/$/, '');
22+
23+
// Check if current path starts with the menu item path
24+
if (normalizedCurrentPath.startsWith(normalizedItemPath) && normalizedItemPath !== '') {
25+
item.classList.add('active');
26+
} else {
27+
item.classList.remove('active');
28+
}
29+
});
30+
}
31+
32+
// Run when DOM is loaded
33+
document.addEventListener('DOMContentLoaded', setActiveMenuItem);
34+
935
// Class detection function that checks if an element with a given class name exists
1036
// This provides backwards compatibility for older browsers (IE6-8) that don't support getElementsByClassName
1137
// Used by the navigation menu to detect presence of certain UI elements

‎static/img/icon-book.svg

Lines changed: 3 additions & 0 deletions
Loading

‎static/img/icon-bug.svg

Lines changed: 11 additions & 0 deletions
Loading

‎static/img/icon-bulb.svg

Lines changed: 10 additions & 0 deletions
Loading

‎static/img/icon-question.svg

Lines changed: 10 additions & 0 deletions
Loading

‎static/img/icon-sheild.svg

Lines changed: 10 additions & 0 deletions
Loading

‎static/img/icon-users.svg

Lines changed: 10 additions & 0 deletions
Loading

‎templates/community.html

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
{% extends "default.html" %}
2+
3+
{% block content %}
4+
5+
<div class="community-section">
6+
<div class="community-header">
7+
{{ page.content | markdown | safe }}
8+
</div>
9+
{% if page.extra.cards %}
10+
<div class="community-card-grid">
11+
{% for card in page.extra.cards %}
12+
<div class="community-card">
13+
<img src="/img/{{ card.icon }}" alt="{{ card.title }}" class="community-card-icon" />
14+
<h3>{{ card.title }}</h3>
15+
<p>{{ card.description }}</p>
16+
<div class="community-card-actions">
17+
{% for link in card.links %}
18+
<a href="{{ link.url }}" class="btn" target="_blank">{{ link.text }}</a>
19+
{% endfor %}
20+
</div>
21+
</div>
22+
{% endfor %}
23+
</div>
24+
{% endif %}
25+
</div>
26+
{% endblock content %}

0 commit comments

Comments
 (0)