A modern, responsive landing page built with Ionic Angular, showcasing the z-control QR Code app and serving as a central hub for future applications.
- Modern Design: Clean, professional interface following Ionic design principles
- Dark Mode Support: Automatic light/dark theme switching with proper contrast
- Mobile Responsive: Optimized for all devices from mobile to desktop
- Multi-language Support: Privacy policies available in German and English
- Version Management: Built-in changelog system with user-friendly updates
- Firebase Ready: Configured for Firebase hosting and deployment
- Accessibility: WCAG compliant with keyboard navigation and screen reader support
π View Live Site
- Web App: Try directly in browser without installation
- Android App: Available on Google Play Store (currently in internal testing)
- Source Code: GitHub Repository
- Features: QR code generation, offline functionality, multi-language support
- Framework: Ionic 8 with Angular 18
- Language: TypeScript
- Styling: SCSS with Ionic CSS Variables
- Hosting: Firebase Hosting
- Build Tool: Angular CLI
- Icons: Ionicons
landing-page/
βββ src/
β βββ app/
β β βββ home/ # Main landing page
β β βββ privacy/ # Privacy policy system
β β βββ services/ # Application services
β β βββ ui/
β β βββ components/ # Reusable UI components
β βββ assets/ # Static assets (including logs/change-logs)
β β βββ logs/
β β βββ change-logs/ # Changelogs for each app (e.g., CHANGELOG_LANDING-PAGE.md, CHANGELOG_QR-CODE.md)
β βββ environments/ # Environment configurations
β βββ theme/ # Global styling
βββ tools/ # Project-wide dev tools (e.g. CHANGELOG-Templates)
βββ docs/ # Technical documentation
βββ firebase.json # Firebase configuration
βββ README.md # This file
- Node.js (v18 or higher)
- npm or yarn
- Ionic CLI
-
Clone the repository
git clone https://github.com/yourusername/z-control-landing-page.git cd z-control-landing-page
-
Install dependencies
npm install
-
Install Ionic CLI (if not already installed)
npm install -g @ionic/cli
-
Start development server
ionic serve
-
Open in browser
http://localhost:8100
# Development server
ionic serve
# Build for production
ionic build
# Run tests
ng test
# Lint code
ng lint
# Build and preview
ionic build && ionic serve --prod
Update version information in src/environments/environment.ts
:
export const environment = {
production: false,
version: {
major: 1,
minor: 1,
date: "2025-07-01",
},
};
-
Install Firebase CLI
npm install -g firebase-tools
-
Login to Firebase
firebase login
-
Initialize project (first time only)
firebase init hosting
-
Build and deploy
ionic build firebase deploy
For detailed deployment instructions, see docs/FIREBASE_DEPLOYMENT_GUIDE.md.
The app uses Ionic CSS Variables for consistent theming. Main theme files:
src/theme/variables.scss
- Color definitionssrc/global.scss
- Global styles- Component-specific SCSS files for custom styling
- Update changelog: Modify
src/services/changelog-simple.service.ts
- Add new apps: Update home page content and routing
- Customize styling: Use Ionic CSS variables for theme consistency
Technical documentation is available in the /docs
folder:
- Dark Mode Guide - Implementation details for dark mode support
- Firebase Security - Security configuration and best practices
- Privacy Policy Architecture - Multi-language privacy system details
Changelogs for each app are stored in src/assets/logs/change-logs/
:
CHANGELOG_LANDING-PAGE.md
β for the landing pageCHANGELOG_QR-CODE.md
β for the z-control QR Code Generator app
# Run unit tests
ng test
# Run e2e tests
ng e2e
# Check code coverage
ng test --code-coverage
This landing page showcases the z-control ion-title { text-align: center; width: 100%; justify-content: center; display: flex; } mobile application. The mobile app is now available on the Google Play Store (currently in internal testing). For updates and source code, see the z-control QR Code Generator app in GitHub repository.
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature
) - Commit your changes (
git commit -m 'Add some amazing feature'
) - Push to the branch (
git push origin feature/amazing-feature
) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
Hans ZΓΆchbauer
- Email: hans.zoechbauer@gmail.com
- GitHub: zoechbauer
- Built with Ionic Framework
- Icons by Ionicons
- Hosted on Firebase
- β Landing Page: Complete and deployed
- β Privacy Policy System: Complete
- β Dark Mode Support: Complete
- β Firebase Hosting: Complete
- π Mobile App: in testing mode
- π Google Play Store: in testing mode
Built with β€οΈ using Ionic and Angular