{"id":29170255,"url":"https://github.com/mendixlabs/mendix-vertical-timeline","last_synced_at":"2025-07-01T12:39:43.441Z","repository":{"id":53083422,"uuid":"244016440","full_name":"mendixlabs/mendix-vertical-timeline","owner":"mendixlabs","description":"Show a vertical timeline in your Mendix app","archived":false,"fork":false,"pushed_at":"2021-04-07T12:52:52.000Z","size":944,"stargazers_count":2,"open_issues_count":3,"forks_count":2,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-04-13T17:55:37.252Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://appstore.home.mendix.com/link/app/113187/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mendixlabs.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-02-29T18:01:55.000Z","updated_at":"2022-12-13T13:34:23.000Z","dependencies_parsed_at":"2022-09-12T12:24:39.080Z","dependency_job_id":null,"html_url":"https://github.com/mendixlabs/mendix-vertical-timeline","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"purl":"pkg:github/mendixlabs/mendix-vertical-timeline","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mendixlabs%2Fmendix-vertical-timeline","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mendixlabs%2Fmendix-vertical-timeline/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mendixlabs%2Fmendix-vertical-timeline/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mendixlabs%2Fmendix-vertical-timeline/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mendixlabs","download_url":"https://codeload.github.com/mendixlabs/mendix-vertical-timeline/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mendixlabs%2Fmendix-vertical-timeline/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":262964055,"owners_count":23391942,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-07-01T12:39:34.890Z","updated_at":"2025-07-01T12:39:43.346Z","avatar_url":"https://github.com/mendixlabs.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![Apache License](https://img.shields.io/badge/license-Apache%202.0-orange.svg)](http://www.apache.org/licenses/LICENSE-2.0)\n[![Dependencies](https://david-dm.org/JelteMX/mendix-vertical-timeline.svg)]([https://david-dm.org/JelteMX/mendix-vertical-timeline](https://david-dm.org/JelteMX/mendix-vertical-timeline))\n[![DevDependencies](https://david-dm.org/JelteMX/mendix-vertical-timeline/dev-status.svg)]([https://david-dm.org/JelteMX/mendix-vertical-timeline?type=dev](https://david-dm.org/JelteMX/mendix-vertical-timeline?type=dev))\n[![Support](https://img.shields.io/badge/Support-Community%20(no%20active%20support)-orange.svg)](https://docs.mendix.com/developerportal/app-store/app-store-content-support)\n![WM](https://img.shields.io/badge/Webmodeler%20compatible-NO-red.svg)\n[![Studio](https://img.shields.io/badge/Studio%20version-8.7%2B-blue.svg)](https://appstore.home.mendix.com/link/modeler/)\n[![GitHub release](https://img.shields.io/github/release/JelteMX/mendix-vertical-timeline)](https://github.com/JelteMX/mendix-vertical-timeline/releases/latest)\n[![GitHub issues](https://img.shields.io/github/issues/JelteMX/mendix-vertical-timeline)](https://github.com/JelteMX/mendix-vertical-timeline/issues)\n[![Available](https://img.shields.io/badge/Test%20Project-available-green.svg)](https://github.com/JelteMX/widget-test-projects)\n\n# Vertical Timeline\n\n![logo](/assets/AppStoreIcon.png)\n\nWant to show a vertical timeline in your Mendix App? These pluggable widgets (**Mendix 8.7 and higher**) will help you accomplish that.\n\n![screenshot](/assets/screenshot.png)\n\n\u003e See it in action [here](https://pluggabletimeline-sandbox.mxapps.io/)\n\n\u003e Extremely light widgets, totalling about 10Kb when running in the cloud\n\n## Features\n\n### Container\n- Show a vertical timeline, with a datasource you can choose\n- Make it 1- or 2-column\n- Supports conditional visibility\n\n### Element\n- Onclick icon\n- Model the content of your Timeline Element in Mendix Studio\n- Supports conditional visibility\n\n## Usage\n\nThis setup involves 2 widgets that work together:\n\n![setup](/assets/setup.png)\n\n- Add the **Vertical Timeline Container** to your page\n- Select a Datasource for the container. This will automatically set the context for the content field of the container\n- Add the **Vertical Timeline Element** inside the container\n- Inside the element, you can model out how you want it to look\n- If you want to style it quickly (the background is grey), add the following class name to the container **_surrounding_** the Vertical Timeline Container: `vertical-timeline-wrapper`\n\nThe following things can be configured:\n\n- **Date** : this is a string that will be shown on the opposite of the element, or underneath\n- **Icon** : this is the icon that appears inside the round\n- **Icon class** : If you are going to do some styling, you might want to set the class based on a textTemplate\n- **OnClick Icon** : When you click the icon itself, you can open a page, execute nanoflow/microflow etc.\n\n## Configuration\n\n### Container\n\n![container1](/assets/container1.png)\n![container2](/assets/container2.png)\n\n### Element\n\n![element1](/assets/element1.png)\n\n## Demo project\n\nDemo project will be released later, but this is very simple.\n\n## Issues, suggestions and feature requests\n\n\u003e **Note 1 (29/02/2020)**: Due to limitations, pluggable widgets that have content panes, do not accept other widgets like data views in their panes. This is currently a PLATFORM limitation, do not report this as an issue.\n\nPlease report your issues [here](https://github.com/JelteMX/mendix-vertical-timeline/issues)\n\n## License\n\nApache 2\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmendixlabs%2Fmendix-vertical-timeline","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmendixlabs%2Fmendix-vertical-timeline","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmendixlabs%2Fmendix-vertical-timeline/lists"}