No description
## Major CSS/SCSS Improvements - ✅ Set up modular SCSS architecture with variables, mixins, and components - ✅ Created organized directory structure: src/scss/ with variables, mixins, pages/ - ✅ Removed ~300+ lines of inline CSS from admin.html - ✅ Added comprehensive design system with consistent spacing, colors, typography - ✅ Created reusable mixins for buttons, cards, tables, forms, and layouts - ✅ Implemented responsive breakpoint mixins for mobile/tablet/desktop - ✅ Added utility classes for common layouts and spacing ## Build System - ✅ Added sass and concurrently as dev dependencies - ✅ Created npm scripts: build-css, watch-css, dev-with-css - ✅ Automated SCSS compilation to compressed CSS - ✅ Set up development workflow with CSS watching ## Admin Panel Enhancements - ✅ Added complete tab navigation system (Location Reports + Profanity Filter) - ✅ Integrated profanity management UI with forms and tables - ✅ Consistent styling across all components using SCSS mixins - ✅ Improved responsive design for mobile devices ## Benefits - 🎯 Maintainable: All styles centralized in modular SCSS files - 📱 Responsive: Better mobile experience with consistent breakpoints - 🎨 Consistent: Design system ensures visual consistency - ⚡ Efficient: Compressed CSS output, no inline styles - 🔧 Developer-friendly: Easy to extend and modify styles The application now has professional-grade CSS architecture that's easy to maintain and extend. |
||
---|---|---|
.github/workflows | ||
public | ||
scripts | ||
src/scss | ||
.env.example | ||
.gitignore | ||
original-style.css | ||
package-lock.json | ||
package.json | ||
README.md | ||
s3-bucket-policy.json | ||
server.js |
Great Lakes Ice Report
A community-driven web application for tracking winter road conditions and icy hazards in the Great Lakes region. Reports automatically expire after 48 hours to maintain current information.
Features
- 🗺️ Interactive Map - Real-time location tracking centered on Grand Rapids
- ⚡ Fast Geocoding - Lightning-fast address lookup with MapBox API
- 🔄 Auto-Expiration - Reports automatically removed after 24 hours
- 👨💼 Admin Panel - Manage and moderate location reports
- 📱 Responsive Design - Works on desktop and mobile devices
- 🔒 Privacy-Focused - No user tracking, community safety oriented
Quick Start
Prerequisites
- Node.js 18+
- MapBox API token (free tier available)
Local Development
-
Clone the repository:
git clone git@github.com:deco/ice.git cd ice
-
Install dependencies:
npm install
-
Configure environment variables:
cp .env.example .env # Edit .env with your MapBox token
-
Start the server:
npm start
-
Visit the application:
http://localhost:3000
Environment Variables
# Required for fast geocoding
MAPBOX_ACCESS_TOKEN=pk.your_mapbox_token_here
# Admin panel access
ADMIN_PASSWORD=your_secure_password
# Server configuration
PORT=3000
Deployment
Automated Deployment (Debian 12 ARM64)
-
Run the deployment script on your server:
curl -sSL https://ice-puremichigan-lol.s3.amazonaws.com/scripts/deploy.sh | bash
-
Deploy your application:
git clone git@github.com:deco/ice.git /opt/ice cd /opt/ice npm install
-
Configure environment:
cp .env.example .env nano .env # Add your API keys
-
Start services:
sudo systemctl enable ice sudo systemctl start ice sudo systemctl enable caddy sudo systemctl start caddy
Manual Deployment
See docs/deployment.md
for detailed manual deployment instructions.
API Endpoints
GET /api/locations
- Get active location reportsPOST /api/locations
- Submit new location reportGET /api/config
- Get API configurationGET /admin
- Admin panel (password protected)
Technology Stack
- Backend: Node.js, Express.js, SQLite
- Frontend: Vanilla JavaScript, Leaflet.js
- Geocoding: MapBox API (with Nominatim fallback)
- Reverse Proxy: Caddy (automatic HTTPS)
- Database: SQLite (lightweight, serverless)
Contributing
- Fork the repository
- Create a feature branch
- Make your changes
- Test thoroughly
- Submit a pull request
Security
- API keys are stored in environment variables
- Admin routes are password protected
- Database queries use parameterized statements
- HTTPS enforced in production
License
MIT License - see LICENSE file for details
Support
This is a community safety tool. For issues or questions:
- Create a GitHub issue
- Check existing documentation
- Review security guidelines
⚠️ Safety Notice: This tool is for community awareness. Always prioritize personal safety and know your rights.