No description
Find a file
Deco Vander f83e087541 Optimize CSS architecture with SCSS modular system
## 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.
2025-07-04 11:30:34 -04:00
.github/workflows Update deploy scripts to create a PR 2025-07-03 22:53:53 -04:00
public Optimize CSS architecture with SCSS modular system 2025-07-04 11:30:34 -04:00
scripts Update HTML files to use Bunny.net CDN for static assets 2025-07-03 20:44:16 -04:00
src/scss Optimize CSS architecture with SCSS modular system 2025-07-04 11:30:34 -04:00
.env.example Update HTML files to use Bunny.net CDN for static assets 2025-07-03 20:44:16 -04:00
.gitignore Initial commit: ICE Watch Michigan community safety tool 2025-07-02 23:27:22 -04:00
original-style.css Remove unused Sass/SCSS setup 2025-07-03 21:56:26 -04:00
package-lock.json Optimize CSS architecture with SCSS modular system 2025-07-04 11:30:34 -04:00
package.json Optimize CSS architecture with SCSS modular system 2025-07-04 11:30:34 -04:00
README.md Update README repository URLs from great-lakes-ice-report to ice 2025-07-04 11:20:25 -04:00
s3-bucket-policy.json Update HTML files to use Bunny.net CDN for static assets 2025-07-03 20:44:16 -04:00
server.js Remove unused Sass/SCSS setup 2025-07-03 21:56:26 -04:00

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

  1. Clone the repository:

    git clone git@github.com:deco/ice.git
    cd ice
    
  2. Install dependencies:

    npm install
    
  3. Configure environment variables:

    cp .env.example .env
    # Edit .env with your MapBox token
    
  4. Start the server:

    npm start
    
  5. 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)

  1. Run the deployment script on your server:

    curl -sSL https://ice-puremichigan-lol.s3.amazonaws.com/scripts/deploy.sh | bash
    
  2. Deploy your application:

    git clone git@github.com:deco/ice.git /opt/ice
    cd /opt/ice
    npm install
    
  3. Configure environment:

    cp .env.example .env
    nano .env  # Add your API keys
    
  4. 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 reports
  • POST /api/locations - Submit new location report
  • GET /api/config - Get API configuration
  • GET /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

  1. Fork the repository
  2. Create a feature branch
  3. Make your changes
  4. Test thoroughly
  5. 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.