Astro Military Theme

Astro Military Theme is a dark-mode-first Astro starter template built on Astro 5.x and Tailwind CSS 4.x, designed to produce a static multi-page website for military units, government agencies, and other institutional organizations.

What is Astro Military Theme?

Astro Military Theme is a starter template that converts centralized content files into a static site with four pages: a landing page, a history page (sejarah.astro), an organization structure page (struktur.astro), and a photo gallery (galeri.astro). The site takes its content from src/data/siteConfig.ts and src/data/content.ts; editing these TypeScript files is the primary customization path. It runs on Astro's static-first architecture and ships zero JavaScript by default, with an MIT license.

Key Features

• Dark Mode — Automatic detection and a manual toggle with no flash on page load.
• i18n (ID/EN) — Built-in Indonesian and English translations, switchable with a one-click language toggle.
• Tactical Design System — Military-inspired color palette, typography, and components defined in src/styles/global.css.
• Fully Responsive — Mobile-first layout optimized for all screen sizes.
• Scroll Reveal Animations — Fade, slide, and scale effects triggered on scroll.
• SEO Ready — Dynamic meta tags, Open Graph support, and semantic HTML.
• Centralized Data — All site content is stored in src/data/ for one-place editing.
• Fast — Static-first Astro architecture with zero client-side JavaScript by default.

Who is it for?

Astro Military Theme is for military units that need an official web presence covering history, structure, and galleries; government agencies that want a bilingual (Indonesian/English) institutional site with SEO-ready pages; and developers who want a pre-built Astro + Tailwind starting point with components such as Card, Gallery, and Timeline.

What can you do with Astro Military Theme?

• Military units — Publish organizational history, structure, and photo galleries with a tactical visual style.
• Government agencies — Present public information in both Indonesian and English with responsive design and dynamic meta tags.
• Developers — Use it as a boilerplate to build a fast institutional site or to learn how Astro generates pages from centralized data files.

How does Astro Military Theme work?

After cloning the repository, you run npm install and npm run dev to start the dev server at localhost:4321. The repository includes a step-by-step customization guide: edit siteConfig.ts for site name, address, and SEO; replace content in content.ts; swap sample images in src/assets/; update translations in src/i18n/translations.js; and adjust color tokens in src/styles/global.css. A production build is made with npm run build, outputting a dist/ folder suitable for deployment on Vercel or Netlify.

FAQ

Is Astro Military Theme free?

Yes, the project is licensed under the MIT License, so it can be freely used, modified, and distributed.

Does it have dark mode?

Yes, it includes automatic dark mode detection and a manual toggle, implemented with a no-flash script to avoid color flashing on page load.

What Astro version does it use?

The template targets Astro 5.x and Tailwind CSS 4.x, as stated in the repository metadata.

What languages are supported?

Built-in translations are provided for Indonesian and English, switchable via a one-click language toggle in the navigation.

How do I change the color scheme?

Edit the CSS custom properties in src/styles/global.css under the @theme block for light mode and the .dark block for dark mode.