Quote Generator

A simple web application that displays random inspirational quotes and allows users to share them on Twitter.

Features

• Random Quote Display – Fetches and displays random quotes from an external API
• Dynamic Author Attribution – Shows the quote author or "Unknown" if unavailable
• Responsive Typography – Automatically adjusts font size for longer quotes
• Twitter Share – One-click sharing of quotes directly to Twitter
• Loading Indicator – Visual spinner while fetching quotes
• Animated UI – Smooth button animations and hover effects

Technologies Used

• HTML5 – Semantic markup and structure
• CSS3 – Modern styling with flexbox, animations, and responsive design
• JavaScript (ES6) – Async/await, DOM manipulation, and event handling
• Font Awesome – Icons for Twitter and quote styling
• Google Fonts – "Oi" custom font for unique typography

Project Structure

quote-generator/
├── index.html      # HTML markup and structure
├── script.js       # Core JavaScript logic
├── style.css       # Styling and animations
└── README.md       # This file

How to Use

1. Open index.html in your web browser
2. Click the "New Quote" button to display a random quote
3. Share the quote on Twitter using the Twitter icon button
4. Enjoy inspirational quotes on demand!

API Used

Quotes are fetched from: Jacinto Design - Quotes API

Installation & Running

No installation required! Simply:

1. Clone or download this repository
2. Open index.html in your browser
3. Start generating quotes

Features Details

• Loading Spinner – Shows while fetching quotes from the API
• Long Quote Styling – Font size reduces automatically for quotes longer than 120 characters
• Twitter Integration – Pre-fills Twitter with the quote text and author
• Responsive Design – Works on desktop and mobile devices

Browser Compatibility

Works on all modern browsers supporting ES6 JavaScript (Chrome, Firefox, Safari, Edge)

License

Open source project for educational purposes.