sHa
9c3024c61d
- Add Rollup configuration for building and serving the application. - Implement logo scanning script to generate logos.json from logo files. - Create main App component to manage logo display and search functionality. - Develop LogoGrid and LogoList components for different viewing modes. - Add LogoModal component for logo preview with details. - Implement URL copying and logo downloading features. - Style components for improved user experience and responsiveness.
Logo Gallery
A collection of company and brand logos hosted on GitHub Pages. This project provides an easy way to access and use various brand logos in SVG and PNG formats with a user-friendly interface.
Features
- Browse logos in grid or list view
- Search functionality to find specific logos
- Copy direct URL to any logo with one click
- Download logos directly
- Responsive design that works on mobile and desktop
Project Setup
Running with Docker (Recommended)
The easiest way to run the project locally is using Docker, which doesn't require installing Node.js or npm packages directly on your system:
- Clone this repository:
git clone https://github.com/yourusername/logos.git
cd logos
- Start the Docker container:
docker-compose up
The application will be available at http://localhost:5000 with live reloading enabled.
Running Manually (Alternative)
If you prefer to run the project without Docker:
- Clone this repository:
git clone https://github.com/yourusername/logos.git
cd logos
- Install dependencies:
npm install
- Start the development server:
npm run dev
- Build for production deployment:
npm run build
Deploying to GitHub Pages
- Build the project:
npm run build
- Push the contents to your GitHub repository's
gh-pagesbranch.
Adding New Logos
To add new logos to the collection:
- Add the logo file (SVG or PNG) to the
public/logos/directory - Run the logo scan script:
make scan-logos-dev
(This runs npm run scan-logos inside the dev container)
3. The application will automatically rebuild with the new logos
Directory Structure
logos/
├── public/ # Static assets
│ ├── assets/
│ │ └── logos/ # Logo files
│ └── global.css # Global styles
├── src/ # Application source code
│ ├── components/ # Svelte components
│ ├── data/ # Data files
│ ├── App.svelte # Main app component
│ └── main.js # App entry point
└── index.html # HTML entry point
License
This project is MIT licensed. Please note that the logos themselves are property of their respective owners and should be used according to their brand guidelines.