feat: Update contact and homelab links in nav/footer
This commit is contained in:
parent
8b66bdaab9
commit
5eb4f4c504
6
SETUP.md
6
SETUP.md
|
|
@ -3,9 +3,9 @@
|
|||
## Quick Start
|
||||
```bash
|
||||
# Clone and initialize the blog repository
|
||||
git clone https://git.argobox.com/KeyArgo/laforceit-blog.git
|
||||
cd laforceit-blog
|
||||
./scripts/init-blog-repo.sh
|
||||
git clone https://gitea.argobox.com/InovinLabs/argobox.git # Updated URL
|
||||
cd argobox # Updated directory name
|
||||
# ./scripts/init-blog-repo.sh # This script might need review/removal depending on its purpose
|
||||
```
|
||||
|
||||
## What This Does
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"name": "laforceit-blog",
|
||||
"name": "argobox-astro",
|
||||
"type": "module",
|
||||
"version": "0.0.1",
|
||||
"scripts": {
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ const categories = [
|
|||
{
|
||||
title: 'Projects',
|
||||
links: [
|
||||
{ name: 'HomeLab Setup', url: 'https://argobox.com' },
|
||||
{ name: 'HomeLab Setup', path: '/homelab' },
|
||||
{ name: 'Tech Stack', url: 'https://argobox.com/#services' },
|
||||
{ name: 'Github Repos', path: '/projects/github' },
|
||||
{ name: 'Live Services', path: '/projects/services' },
|
||||
|
|
@ -175,6 +175,8 @@ const services = [
|
|||
<span class="link-divider">|</span>
|
||||
<a href="/terms" class="meta-link">Terms of Use</a>
|
||||
<span class="link-divider">|</span>
|
||||
<a href="/contact" class="meta-link">Contact</a>
|
||||
<span class="link-divider">|</span>
|
||||
<a href="/sitemap.xml" class="meta-link">Sitemap</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ const navItems = [
|
|||
{ name: 'Home Lab', url: '/homelab' }, // Updated URL
|
||||
{ name: 'Resources', url: '/resources' },
|
||||
{ name: 'About', url: 'https://ArgoBox.com' },
|
||||
{ name: 'Contact', url: 'https://ArgoBox.com/index.html#contact' }
|
||||
{ name: 'Contact', url: '/contact' }
|
||||
];
|
||||
|
||||
// Get current URL path for active nav item highlighting
|
||||
|
|
|
|||
|
|
@ -413,6 +413,49 @@ const nodeTypeCounts = {
|
|||
setTimeout(() => { loadingEl.classList.add('hidden'); }, 500);
|
||||
}
|
||||
|
||||
// --- Fullscreen Toggle Functionality ---
|
||||
if (fullscreenToggle) {
|
||||
fullscreenToggle.addEventListener('click', toggleFullscreen);
|
||||
}
|
||||
|
||||
// Toggle fullscreen function
|
||||
function toggleFullscreen() {
|
||||
isFullscreen = !isFullscreen;
|
||||
|
||||
if (isFullscreen) {
|
||||
// Enable fullscreen mode
|
||||
graphWrapper.classList.add('fullscreen');
|
||||
fullscreenEnterIcon.classList.add('hidden');
|
||||
fullscreenExitIcon.classList.remove('hidden');
|
||||
|
||||
// Hide the node details panel if it's visible
|
||||
if (nodeDetailsEl) nodeDetailsEl.classList.remove('active');
|
||||
|
||||
// In fullscreen, we adjust the cytoscape layout to fit
|
||||
setTimeout(() => {
|
||||
cy.resize();
|
||||
cy.fit(null, 30);
|
||||
}, 300); // Wait for transition to complete
|
||||
} else {
|
||||
// Disable fullscreen mode
|
||||
graphWrapper.classList.remove('fullscreen');
|
||||
fullscreenEnterIcon.classList.remove('hidden');
|
||||
fullscreenExitIcon.classList.add('hidden');
|
||||
|
||||
// Hide the full post content panel
|
||||
if (fullPostContent) {
|
||||
fullPostContent.classList.remove('active');
|
||||
// Ensure display is set back to none if needed, though CSS handles visibility
|
||||
// fullPostContent.style.display = 'none';
|
||||
}
|
||||
|
||||
// Reset the cytoscape layout
|
||||
setTimeout(() => {
|
||||
cy.resize();
|
||||
cy.fit(null, 30);
|
||||
}, 300); // Wait for transition to complete
|
||||
}
|
||||
}
|
||||
// --- Fullscreen Toggle Functionality ---
|
||||
if (fullscreenToggle) {
|
||||
fullscreenToggle.addEventListener('click', toggleFullscreen);
|
||||
|
|
@ -764,6 +807,7 @@ const nodeTypeCounts = {
|
|||
if (nodeDetailsEl) nodeDetailsEl.classList.remove('active');
|
||||
if (isFullscreen && fullPostContent) {
|
||||
fullPostContent.classList.remove('active');
|
||||
fullPostContent.style.display = 'none'; // Ensure display is none
|
||||
}
|
||||
cy.elements().removeClass('selected highlighted faded');
|
||||
}
|
||||
|
|
@ -776,6 +820,17 @@ const nodeTypeCounts = {
|
|||
cy.elements().removeClass('highlighted faded');
|
||||
});
|
||||
}
|
||||
// Close full post panel button
|
||||
if (closeFullPostBtn) {
|
||||
closeFullPostBtn.addEventListener('click', () => {
|
||||
if (fullPostContent) {
|
||||
fullPostContent.classList.remove('active');
|
||||
fullPostContent.style.display = 'none'; // Ensure display is none
|
||||
}
|
||||
cy.$(':selected').unselect();
|
||||
cy.elements().removeClass('highlighted faded');
|
||||
});
|
||||
}
|
||||
|
||||
// Close full post panel button
|
||||
if (closeFullPostBtn) {
|
||||
|
|
@ -1979,4 +2034,350 @@ const nodeTypeCounts = {
|
|||
@keyframes spin {
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
/* Fullscreen mode styles */
|
||||
.graph-container-wrapper.fullscreen {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
max-height: 100vh;
|
||||
z-index: 9999;
|
||||
margin: 0;
|
||||
padding: 20px;
|
||||
background: var(--bg-primary);
|
||||
backdrop-filter: blur(10px);
|
||||
display: flex;
|
||||
border-radius: 0;
|
||||
transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
|
||||
}
|
||||
|
||||
/* Adjust graph container in fullscreen mode */
|
||||
.graph-container-wrapper.fullscreen .graph-container {
|
||||
position: relative;
|
||||
width: 60%;
|
||||
height: 100%;
|
||||
border-radius: 12px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
/* Fullscreen Toggle Button */
|
||||
.fullscreen-toggle {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 8px;
|
||||
background: rgba(30, 41, 59, 0.7);
|
||||
border: 1px solid var(--border-primary);
|
||||
color: var(--text-primary);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
z-index: 4;
|
||||
transition: all 0.2s ease;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.fullscreen-toggle:hover {
|
||||
background: rgba(30, 41, 59, 0.9);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.graph-container-wrapper.fullscreen .fullscreen-toggle {
|
||||
top: 25px;
|
||||
right: 25px;
|
||||
}
|
||||
|
||||
/* Hide one of the fullscreen icons */
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Full Post Content Panel */
|
||||
.full-post-content {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 0;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);
|
||||
background: var(--bg-secondary);
|
||||
border-radius: 12px;
|
||||
opacity: 0;
|
||||
z-index: 4;
|
||||
border: 1px solid var(--card-border);
|
||||
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
|
||||
visibility: hidden;
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Full post panel in fullscreen mode */
|
||||
.graph-container-wrapper.fullscreen .full-post-content {
|
||||
position: relative;
|
||||
width: 40%;
|
||||
height: 100%;
|
||||
background: rgba(30, 41, 59, 0.7);
|
||||
backdrop-filter: blur(10px);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.graph-container-wrapper.fullscreen .full-post-content.active {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.full-post-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
padding: 1.5rem;
|
||||
border-bottom: 1px solid var(--border-primary);
|
||||
}
|
||||
|
||||
.full-post-title {
|
||||
font-size: 1.5rem;
|
||||
margin: 0;
|
||||
color: var(--text-primary);
|
||||
font-weight: 600;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.full-post-metadata {
|
||||
padding: 1rem 1.5rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
|
||||
.full-post-category {
|
||||
display: inline-block;
|
||||
padding: 0.25rem 0.75rem;
|
||||
border-radius: 20px;
|
||||
font-size: 0.85rem;
|
||||
font-weight: 500;
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
||||
.full-post-tags {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.post-tag {
|
||||
background: rgba(16, 185, 129, 0.1);
|
||||
color: #10B981;
|
||||
padding: 0.25rem 0.5rem;
|
||||
border-radius: 4px;
|
||||
font-size: 0.75rem;
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
||||
.full-post-container {
|
||||
flex: 1;
|
||||
padding: 1.5rem;
|
||||
overflow-y: auto;
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.full-post-container::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
.full-post-container::-webkit-scrollbar-track {
|
||||
background: rgba(30, 41, 59, 0.5);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.full-post-container::-webkit-scrollbar-thumb {
|
||||
background: rgba(226, 232, 240, 0.1);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.full-post-container::-webkit-scrollbar-thumb:hover {
|
||||
background: rgba(226, 232, 240, 0.2);
|
||||
}
|
||||
|
||||
.full-post-placeholder {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--text-secondary);
|
||||
text-align: center;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.full-post-placeholder svg {
|
||||
margin-bottom: 1rem;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.post-content {
|
||||
line-height: 1.7;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.post-content h1, .post-content h2, .post-content h3,
|
||||
.post-content h4, .post-content h5, .post-content h6 {
|
||||
margin-top: 1.5rem;
|
||||
margin-bottom: 1rem;
|
||||
color: var(--text-primary);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.post-content p {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
.post-content a {
|
||||
color: var(--accent-primary);
|
||||
text-decoration: none;
|
||||
border-bottom: 1px dotted var(--accent-primary);
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.post-content a:hover {
|
||||
color: var(--accent-secondary);
|
||||
border-bottom-style: solid;
|
||||
}
|
||||
|
||||
.post-content pre {
|
||||
background: rgba(15, 23, 42, 0.6);
|
||||
padding: 1rem;
|
||||
border-radius: 6px;
|
||||
overflow-x: auto;
|
||||
margin: 1.5rem 0;
|
||||
border: 1px solid var(--border-primary);
|
||||
}
|
||||
|
||||
.post-content code {
|
||||
font-family: var(--font-mono);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.post-content img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
margin: 1.5rem 0;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.post-content blockquote {
|
||||
border-left: 4px solid var(--accent-primary);
|
||||
padding-left: 1rem;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
font-style: italic;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
.post-content ul, .post-content ol {
|
||||
padding-left: 1.5rem;
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
.post-content li {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.full-post-link {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.5rem;
|
||||
padding: 1rem;
|
||||
background: linear-gradient(90deg, var(--accent-primary), var(--accent-secondary));
|
||||
color: var(--bg-primary);
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.full-post-link:hover {
|
||||
background: linear-gradient(90deg, var(--accent-secondary), var(--accent-primary));
|
||||
}
|
||||
|
||||
/* Media Queries */
|
||||
@media screen and (max-width: 992px) {
|
||||
/* Adjust fullscreen layout for smaller screens */
|
||||
.graph-container-wrapper.fullscreen {
|
||||
flex-direction: column;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.graph-container-wrapper.fullscreen .graph-container {
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
margin-right: 0;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.graph-container-wrapper.fullscreen .full-post-content {
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.fullscreen-toggle {
|
||||
top: 15px;
|
||||
right: 15px;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
.graph-container-wrapper.fullscreen .graph-container {
|
||||
height: 40%;
|
||||
}
|
||||
|
||||
.graph-container-wrapper.fullscreen .full-post-content {
|
||||
height: 60%;
|
||||
}
|
||||
|
||||
.full-post-header {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.full-post-title {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.full-post-metadata {
|
||||
padding: 0.75rem 1rem;
|
||||
}
|
||||
|
||||
.full-post-container {
|
||||
padding: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
.graph-container-wrapper.fullscreen {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.graph-container-wrapper.fullscreen .graph-container {
|
||||
height: 35%;
|
||||
}
|
||||
|
||||
.graph-container-wrapper.fullscreen .full-post-content {
|
||||
height: 65%;
|
||||
}
|
||||
|
||||
.full-post-title {
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -99,17 +99,17 @@ sortedPosts
|
|||
// Terminal commands for tech effect
|
||||
const commands = [
|
||||
{
|
||||
prompt: "[laforceit@argobox]$ ",
|
||||
prompt: "[user@argobox]$ ",
|
||||
command: "find ./posts -type f -name \"*.md\" | sort -n | wc -l",
|
||||
output: [`${allPosts.length} posts found`]
|
||||
},
|
||||
{
|
||||
prompt: "[laforceit@argobox]$ ",
|
||||
prompt: "[user@argobox]$ ",
|
||||
command: "ls -la ./tags",
|
||||
output: allTags.map(tag => `${tag}`)
|
||||
},
|
||||
{
|
||||
prompt: "[laforceit@argobox]$ ",
|
||||
prompt: "[user@argobox]$ ",
|
||||
command: "grep -r \"kubernetes\" --include=\"*.md\" ./posts | wc -l",
|
||||
output: [`${allPosts.filter(post =>
|
||||
post.data.tags?.includes('kubernetes') ||
|
||||
|
|
|
|||
Loading…
Reference in New Issue