=== Dear Timeline ===
Contributors: ankit07721
Tags: timeline, responsive, vertical timeline, history, roadmap, blocks
Requires at least: 5.6
Tested up to: 7.0
Requires PHP: 7.4
Stable tag: 1.3.0
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

A premium, responsive vertical timeline for WordPress. Features a card-based flat layout, centralized editor, batch event creation, and custom image dimension controls.

== Description ==

DearTimeline allows you to create beautiful, responsive vertical timelines with automatic zigzag layouts. Unlike other timeline plugins that clutter your page with complex blocks, DearTimeline provides a simplified, centralized workspace designed for speed and clarity.

### Why DearTimeline Plugin for WordPress?
Most timeline plugins rely on the complex Block Editor, which can be overwhelming for simple event management. DearTimeline removes the noise and gives you a dedicated "Event Styling" dashboard. It's built for users who want a professional, high-end timeline without the configuration headache.

### Core Features (Explained)
*   **Centralized Workspace**: Say goodbye to the Block Editor. Manage titles, dates, descriptions, and images from a single, high-priority dashboard in your admin screen.
*   **Integrated Live Preview**: An embedded "Live Desktop Preview" appears directly below your editor, showing your changes instantly as you save.
*   **Frontend Batch Creation**: Use the unique "Add New Event" popup on your website to add multiple events at once using a repeater-style form.
*   **Precision Image Controls**: Every event image can have its own custom width and height, rendered with `object-fit: cover` to ensure professional cropping without distortion.
*   **Modern Card-Based Layout**: Events are displayed as sleek white cards with rounded corners and subtle shadows for a premium look.
*   **Zigzag Alternation**: Events automatically alternate left and right around a clean central spine with circular dot markers.
*   **Dual Layout Options**: Choose between the "Classic" (calendar-box style) and "Flat" (modern card-based) layouts.
*   **Scroll Reveal Animations**: Timeline items fade and slide in as the user scrolls, powered by IntersectionObserver.

### Best Use Cases
*   **Company History**: showcase your brand's journey from day one to today.
*   **Product Roadmaps**: Keep your customers informed about upcoming features and past milestones.
*   **Personal Portfolios**: Display your career progression or life story in a visually engaging way.
*   **Event Schedules**: Perfect for conferences or multi-day workshops.

== Installation ==

1. Upload the plugin files to the `/wp-content/plugins/deartimeline` directory, or install the plugin through the WordPress plugins screen directly.
2. Activate the plugin through the 'Plugins' screen in WordPress.
3. Use the `[deartimeline]` shortcode in any page or post.

== Usage ==

### Basic Shortcode
`[deartimeline]`

### Switching Layouts
- **Classic Layout**: `[deartimeline layout="classic"]` (Calendar-box style)
- **Flat Layout**: `[deartimeline layout="flat"]` (Modern cards with image)

### Animations
Choose from professional entrance effects:
- `[deartimeline animation="fade-in"]` (Default)
- `[deartimeline animation="flip-up"]`
- `[deartimeline animation="zoom"]`

== Screenshots ==

1. The centralized Event Styling workspace.
2. The batch creation repeater form.
3. Live Desktop Preview inside the editor.

== Changelog ==

= 1.3.0 =
* Complete flat layout overhaul: modern card-based UI with white cards, rounded corners, and subtle shadows.
* New CSS variables system for easy customization.
* Circular dot markers with indigo accent border instead of square nodes.
* Pill-shaped year separator labels.
* Soft gray central line (configurable).
* Responsive mobile layout: single-sided spine with stacked content.
* Scroll reveal animations via IntersectionObserver.
* Improved zigzag alternation with reliable flexbox ordering.

= 1.2.0 =
* Integrated Featured Image selector into the central meta box.
* Added custom Width and Height controls for event images.
* Added "Live Desktop Preview" directly to the Event Edit screen.
* Refactored frontend popup to support batch event creation.

= 1.1.0 =
* Improved zigzag layout with straight-line alignment.
* Standardized image heights (300px).
* Fixed text domain issues and compliance headers.

= 1.0.0 =
* Initial release.

== Frequently Asked Questions ==

= How do I use the shortcode? =
Simply add `[deartimeline]` to any page or post. By default, this will display all your published timeline events.

= Can I change the layout? =
Yes! You can choose between two professional styles:
- **Classic**: `[deartimeline layout="classic"]` (Calendar-style dates)
- **Flat**: `[deartimeline layout="flat"]` (Modern card-based layout)

= Are there any animation options? =
Absolutely. Use the `animation` parameter to pick your entrance effect:
- `[deartimeline animation="fade-in"]` (Subtle)
- `[deartimeline animation="flip-up"]` (Dynamic)
- `[deartimeline animation="zoom"]` (Engaging)

= How do I add multiple events at once? =
On the frontend of your site (when logged in as an admin), click the "Add New Event" button. Use the "+ Add Another Event" button in the popup to fill out multiple entries before hitting "Publish."

= Where do I set the image size? =
Inside the "Event Styling" box on the Edit screen, look for the "Image Width" and "Image Height" fields. You can use pixels (e.g., 300px) or percentages (e.g., 100%).

== Upgrade Notice ==

= 1.1.1 =
Complete visual overhaul for the flat layout: modern cards, circular dots, pill year labels, and responsive mobile support. See changelog for full details.
