web changes

This commit is contained in:
admin 2025-05-14 20:00:51 -06:00
parent d2f99c51ea
commit 26ea26753f
4 changed files with 96 additions and 25 deletions

View File

@ -67,7 +67,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">dashboard</span>Homepage</h3>
<p>Main dashboard for Changemaker V5. Your central command center for all services.</p>
</div>
<a href="{{ 'apps/homepage/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/homepage.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -75,7 +75,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">code</span>Code Server</h3>
<p>Visual Studio Code in your browser. Develop and edit code from any device.</p>
</div>
<a href="{{ 'apps/code-server/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/code-server.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -83,7 +83,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">edit_note</span>Flatnotes</h3>
<p>Simple, markdown-based note-taking, directly connected to your blog.</p>
</div>
<a href="{{ 'apps/flatnotes/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/flatnotes.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -91,7 +91,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">mail</span>Listmonk</h3>
<p>Self-hosted newsletter and mailing list manager for full control over campaigns.</p>
</div>
<a href="{{ 'apps/listmonk/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/listmonk.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -99,7 +99,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">table_chart</span>NocoDB</h3>
<p>Open Source Airtable Alternative. Turn any database into a smart spreadsheet.</p>
</div>
<a href="{{ 'apps/nocodb/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/nocodb.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -107,7 +107,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">question_answer</span>Answer</h3>
<p>Self-hosted Q&A platform for teams to share knowledge internally.</p>
</div>
<a href="{{ 'apps/answer/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/answer.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -115,7 +115,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">draw</span>Excalidraw</h3>
<p>Virtual whiteboard for sketching and collaborative diagramming.</p>
</div>
<a href="{{ 'apps/excalidraw/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/excalidraw.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -123,7 +123,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">apps</span>Ferdium</h3>
<p>All-in-one desktop app that helps you organize multiple social media services in one place.</p>
</div>
<a href="{{ 'apps/ferdium/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/ferdium.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -131,7 +131,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">source</span>Gitea</h3>
<p>Lightweight, self-hosted Git service for managing repositories and collaboration.</p>
</div>
<a href="{{ 'apps/gitea/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/gitea.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -139,7 +139,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">article</span>MkDocs Material</h3>
<p>Create beautiful documentation sites with Markdown (like this one!).</p>
</div>
<a href="{{ 'apps/mkdocs-material/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/mkdocs-material.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -147,7 +147,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">people</span>Monica CRM</h3>
<p>Personal relationship management system to organize interactions with your contacts.</p>
</div>
<a href="{{ 'apps/monica-crm/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/monica-crm.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -155,7 +155,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">integration_instructions</span>n8n</h3>
<p>Workflow automation tool that connects various apps and services together.</p>
</div>
<a href="{{ 'apps/n8n/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/n8n.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -163,7 +163,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">smart_toy</span>Ollama</h3>
<p>Run open-source large language models locally for AI-powered assistance.</p>
</div>
<a href="{{ 'apps/ollama/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/ollama.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -171,7 +171,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">chat</span>OpenWebUI</h3>
<p>Web interface for interacting with your Ollama AI models.</p>
</div>
<a href="{{ 'apps/openwebui/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/openwebui.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -179,7 +179,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">sailing</span>Portainer</h3>
<p>Container management platform that simplifies deploying and managing Docker environments.</p>
</div>
<a href="{{ 'apps/portainer/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/portainer.md" class="button">Learn More</a>
</div>
<div class="app-card">
@ -187,7 +187,7 @@ docker compose up -d</code></pre>
<h3><span class="material-icons" style="vertical-align: bottom; margin-right: 8px;">forum</span>Rocket.Chat</h3>
<p>Self-hosted team communication platform with real-time chat and collaboration.</p>
</div>
<a href="{{ 'apps/rocketchat/' | url }}" class="button">Learn More</a>
<a href="/cm/apps/rocketchat.md" class="button">Learn More</a>
</div>
</div>
</div>

View File

@ -108,7 +108,20 @@
}
.about-stats {
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
grid-template-columns: 1fr; /* Change to single column for vertical stacking */
gap: 25px; /* Increase gap for better separation */
}
/* Fix the stat items to remove any rotation and ensure consistency */
.about-stats .stat-item {
max-width: 100%;
width: 100%;
margin: 0 auto;
transform: rotate(0deg) !important; /* Remove any rotation */
}
.about-stats .stat-item:hover {
transform: scale(1.03) !important; /* Only scale on hover, no rotation */
}
.emoji-sticker {
@ -139,6 +152,39 @@
padding: 10px 10px 40px 10px;
margin: 0 auto 20px;
}
/* Make hero elements stack vertically instead of horizontal scrolling */
.hero .flex-container {
flex-direction: column;
flex-wrap: wrap;
overflow-x: visible;
justify-content: center;
align-items: center;
gap: 25px;
}
.hero .flex-container > div {
width: 100%;
max-width: 300px;
margin: 0 auto;
}
/* Remove the horizontal scrollbar styling as it's no longer needed */
.hero .flex-container::-webkit-scrollbar {
display: initial;
}
.hero .flex-container {
-ms-overflow-style: initial;
scrollbar-width: initial;
}
/* Ensure post-its have consistent styling */
.hero .post-it {
width: 100% !important;
max-width: 100% !important;
box-sizing: border-box;
}
}
/* Small devices (landscape phones, 576px and up) */
@ -198,7 +244,21 @@
}
.polaroid {
max-width: 180px;
padding: 8px 8px 35px 8px;
max-width: 220px;
}
/* Adjust about stats spacing for smaller screens */
.about-stats {
gap: 20px; /* Slightly reduce gap on very small screens */
}
.about-stats .stat-item {
padding: 15px; /* Reduce padding on very small screens */
}
/* Further adjust sizes for smaller screens */
.hero .flex-container > div {
max-width: 100%;
width: 100%;
}
}

View File

@ -393,6 +393,17 @@ section {
border-radius: 2px;
}
/* Add base styles for the flex container */
.hero .flex-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 20px;
margin-top: 40px;
width: 100%;
position: relative;
}
.hero p {
font-size: 1.2rem;
margin-bottom: 30px;

View File

@ -37,7 +37,7 @@
<h1>The Bunker Operations</h1>
<p>Community Strategy, Tactics, and Technology</p>
<div class="mt-12 flex flex-wrap justify-center gap-6" style="display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; margin-top: 40px;">
<div class="mt-12 flex-container flex flex-wrap justify-center gap-6" style="display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; margin-top: 40px;">
<!-- Polaroid-style logo moved to be in the same row -->
<div class="polaroid" style="margin: 0; max-width: 250px;">
<div class="polaroid-inner">
@ -98,7 +98,7 @@
<li style="margin-bottom: 8px;"><span style="color: var(--primary-color); margin-right: 8px;"></span>Corporation-free infrastructure</li>
</ul>
<div style="margin-top: 20px; text-align: left;">
<a href="https://repo.bnkops.com/" style="display: inline-block;">View Project →</a>
<a href="https://docs.bnkops.com/" style="display: inline-block;">View Project →</a>
</div>
</div>
<div class="service-card post-it post-it-white">
@ -112,7 +112,7 @@
<li style="margin-bottom: 8px;"><span style="color: var(--primary-color); margin-right: 8px;"></span>Save thousands in yearly bills</li>
</ul>
<div style="margin-top: 20px; text-align: left;">
<a href="https://changemaker.bnkops.com/" style="display: inline-block;">View Project →</a>
<a href="https://docs.bnkops.com/cm/" style="display: inline-block;">View Project →</a>
</div>
</div>
</div>
@ -157,7 +157,7 @@
</div>
</div>
<div style="margin-top: 40px; text-align: center;">
<a href="https://repo.bnkops.com/" class="btn btn-primary">Visit our repository</a>
<a href="https://docs.bnkops.com/" class="btn btn-primary">Visit our repository</a>
</div>
</div>
</section>
@ -180,9 +180,9 @@
<i class="fas fa-globe"></i>
changemaker.bnkops.com
</a>
<a href="https://repo.bnkops.com/" style="display: flex; align-items: center; gap: 10px;">
<a href="https://docs.bnkops.com/" style="display: flex; align-items: center; gap: 10px;">
<i class="fas fa-book"></i>
repo.bnkops.com
docs.bnkops.com
</a>
</div>