diff --git a/SETUP.md b/SETUP.md
index ff636ca..1324dae 100644
--- a/SETUP.md
+++ b/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
diff --git a/package.json b/package.json
index 47e470b..61754d6 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
{
- "name": "laforceit-blog",
+ "name": "argobox-astro",
"type": "module",
"version": "0.0.1",
"scripts": {
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index dd209e8..fc73191 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -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 = [
|
Terms of Use
|
+Contact
+ |
Sitemap
diff --git a/src/components/Header.astro b/src/components/Header.astro
index 123c1b6..6794dc2 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -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
diff --git a/src/components/KnowledgeGraph.astro b/src/components/KnowledgeGraph.astro
index 5b947ab..12c00b4 100644
--- a/src/components/KnowledgeGraph.astro
+++ b/src/components/KnowledgeGraph.astro
@@ -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;
+ }
+ }
\ No newline at end of file
diff --git a/src/pages/blog/index.astro b/src/pages/blog/index.astro
index bd6622d..ac3e82c 100644
--- a/src/pages/blog/index.astro
+++ b/src/pages/blog/index.astro
@@ -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') ||