diff --git a/README.md b/README.md
index 545e3db..f86ecdd 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,4 @@
-# Version Calendar in SVG (1.0.2)
+# Version Calendar in SVG (2.0.1)
 
 > The original source code was taken from the [PHP supported versions](https://github.com/php/web-php/blob/master/images/supported-versions.php).
 
@@ -8,6 +8,6 @@
 + *Author*: [Joomla! Project](mailto:admin@joomla.org)
 + *Name*: [Version Calendar svg](http://www.joomla.org)
 + *First Build*: 3rd September, 2022
-+ *Version*: 1.0.2
++ *Version*: 2.0.1
 + *Copyright*: (C) 2022 Open Source Matters, Inc.
 + *License*: GNU General Public License version 2 or later; see LICENSE.txt
\ No newline at end of file
diff --git a/helper.php b/helper.php
index cb953ba..0bd62ef 100644
--- a/helper.php
+++ b/helper.php
@@ -39,6 +39,14 @@ class ModVersion_Calendar_svgHelper
 	 */
 	protected $branches;
 
+	/**
+	 * The Legend
+	 *
+	 * @var    array
+	 * @since  1.0
+	 */
+	protected $legend;
+
 	/**
 	 * The Width
 	 *
@@ -132,72 +140,102 @@ class ModVersion_Calendar_svgHelper
 	/**
 	 * Get Branches
 	 *
+	 * Fetches and processes the branches or versions from the parameters. 
+	 * It sanitizes the branch data, calculates their positions, sorts them, and then returns.
+	 * If no valid branches or versions are found, it throws an exception.
+	 *
 	 * @return array
-	 * @since 1.0.0
+	 *
+	 * @since 2.0.1
+	 * @throws Exception If no valid branches or versions are found.
 	 */
 	public function branches(): array
 	{
 		if (empty($this->branches))
 		{
-			$branches = (array) $this->params->get('dates',  null);
+			$branches = (array) $this->params->get('versions');
 
-			if (is_array($branches) && count($branches) > 0)
+			if (empty($branches))
 			{
-				$branch_height = $this->params->get('branch_height', 30);
-				$header_height = $this->params->get('header_height',  24);
-
-				$i = 0;
-
-				foreach ($branches as $k => &$branch)
-				{
-					$branch->top = $header_height + ($branch_height * $i++);
-				}
-
-				$this->branches = $branches;
+				throw new Exception("No versions found.");
 			}
-			else
+			$this->sanitize($branches);
+
+			if (empty($branches))
 			{
-				// we should add exception here
+				throw new Exception("No versions found.");
 			}
+
+			$this->setTop($branches);
+			$this->sort($branches);
+
+			$this->branches = $branches;
 		}
 
 		return $this->branches;
 	}
 
+	/**
+	 * Get Legend values (by color)
+	 *
+	 * @return array
+	 * @since 2.0.1
+	 */
+	public function legend(): array
+	{
+		if (empty($this->legend))
+		{
+			$branches = $this->branches();
+
+			foreach ($branches as $version)
+			{
+				foreach ($version->dates as $date)
+				{
+					$this->legend[$date->color] = $date;
+				}
+			}
+		}
+
+		return $this->legend;
+	}
+
 	/**
 	 * Current state of a branch
 	 *
-	 * @param stdClass  $branch  The branch values
+	 * @param array  $dates  The branch dates
 	 *
 	 * @return string|null
-	 * @since 1.0.0
+	 * @since 2.0.1
 	 */
-	public function state(stdClass $branch): ?string
+	public function state(array $dates): ?string
 	{
-		$initial = new DateTime($branch->start);
-		$security = new DateTime($branch->security);
-		$end = new DateTime($branch->end);
+		// Determine the current state.
+		$now = new DateTime();
 
-		if ($initial && $security)
+		// Check if today's date is before the earliest start date.
+		$earliestDate = DateTime::createFromFormat('d-m-Y', $dates[0]->start);
+		if ($now < $earliestDate)
 		{
-			$now = new DateTime;
+			return 'vcs-future';
+		}
 
-			if ($now >= $end)
+		// Check if today's date is after the latest end date.
+		$latestDate = DateTime::createFromFormat('d-m-Y', end($dates)->end);
+		if ($now > $latestDate)
+		{
+			return 'vcs-eol';
+		}
+
+		// Determine which state the current date falls under.
+		foreach ($dates as $date)
+		{
+			$initial = DateTime::createFromFormat('d-m-Y', $date->start);
+			$end = DateTime::createFromFormat('d-m-Y', $date->end);
+
+			if ($now >= $initial && $now <= $end)
 			{
-				return 'eol';
+				return $date->state;
 			}
-
-			if ($security && $now >= $security)
-			{
-				return 'security';
-			}
-
-			if ($now >= $initial)
-			{
-				return 'stable';
-			}
-
-			return 'future';
 		}
 
 		return null;
@@ -251,5 +289,120 @@ class ModVersion_Calendar_svgHelper
 				(365.24 / $this->params->get('year_width', 120))
 			);
 	}
-
+
+	/**
+	 * Sort Branches state's by date
+	 *
+	 * @param array  $branches  The branches
+	 *
+	 * @return void
+	 * @since 2.0.1
+	 */
+	protected function sort(array &$branches): void
+	{
+		foreach ($branches as $key => &$branch)
+		{
+			usort($branch->dates, function($a, $b) {
+				$startDateA = DateTime::createFromFormat('d-m-Y', $a->start);
+				$startDateB = DateTime::createFromFormat('d-m-Y', $b->start);
+
+				if ($startDateA == $startDateB)
+				{
+					$endDateA = DateTime::createFromFormat('d-m-Y', $a->end);
+					$endDateB = DateTime::createFromFormat('d-m-Y', $b->end);
+					return $endDateA <=> $endDateB;
+				}
+
+				return $startDateA <=> $startDateB;
+			});
+		}
+	}
+
+	/**
+	 * Set Top
+	 *
+	 * Calculates the top position for each branch based on parameters for branch height and header height.
+	 *
+	 * @param array $branches Reference to the branches array.
+	 *
+	 * @return void
+	 * @since 2.0.1
+	 */
+	protected function setTop(array &$branches): void
+	{
+		$branch_height = $this->params->get('branch_height', 30);
+		$header_height = $this->params->get('header_height', 24);
+
+		$i = 0;
+		foreach ($branches as $key => &$branch)
+		{
+			$branch->top = $header_height + ($branch_height * $i++);
+		}
+	}
+
+	/**
+	 * Sanitize
+	 *
+	 * Sanitizes the branches by checking the existence and type of 'dates' and 'date->state'. 
+	 * Also modifies the state of each date entry within a branch.
+	 *
+	 * @param array $branches Reference to the branches array.
+	 *
+	 * @return void
+	 * @since 2.0.1
+	 */
+	protected function sanitize(array &$branches): void
+	{
+		foreach ($branches as $key => &$branch)
+		{
+			if (empty($branch->dates) || !is_object($branch->dates))
+			{
+				unset($branches[$key]);
+				continue;
+			}
+
+			$branch->dates = (array) $branch->dates;
+
+			$remove = false;
+			foreach ($branch->dates as $k => &$date)
+			{
+				if (empty($date->state))
+				{
+					$remove = true;
+					continue;
+				}
+				$date->state = $this->makeSafe($key . '-' . $date->state);
+			}
+
+			if ($remove)
+			{
+				unset($branches[$key]);
+			}
+		}
+	}
+
+	/**
+	 * Get css safe class name
+	 *
+	 * @param string  $name  The string to make safe
+	 *
+	 * @return string
+	 * @since 2.0.1
+	 */
+	protected function makeSafe(string $name): string
+	{
+		// Ensure it doesn't start with a digit
+		if (preg_match('/^[0-9]/', $name))
+		{
+			$name = 'vcs-' . $name;
+		}
+
+		// Replace any non-alphanumeric characters with hyphens
+		$name = preg_replace('/[^a-zA-Z0-9]+/', '-', $name);
+
+		// Convert to lowercase
+		$name = strtolower($name);
+
+		return $name;
+	}
 }
diff --git a/language/en-GB/en-GB.mod_version_calendar_svg.ini b/language/en-GB/en-GB.mod_version_calendar_svg.ini
index 636cee7..b5aa66d 100644
--- a/language/en-GB/en-GB.mod_version_calendar_svg.ini
+++ b/language/en-GB/en-GB.mod_version_calendar_svg.ini
@@ -1,33 +1,29 @@
 MOD_VERSION_CALENDAR_SVG="Version Calendar Svg"
 MOD_VERSION_CALENDAR_SVG_DESCRIPTION="Version Calendar in SVG"
-MOD_VERSION_CALENDAR_SVG_XML_DESCRIPTION="<h1>Version Calendar Svg (v.1.0.2)</h1> <div style='clear: both;'></div><p>Version Calendar in SVG</p><p>Created by <a href='http://www.joomla.org' target='_blank'>Joomla! Project</a><br /><small>Development started 3rd September, 2022</small></p>"
+MOD_VERSION_CALENDAR_SVG_XML_DESCRIPTION="<h1>Version Calendar Svg (v.2.0.1)</h1> <div style='clear: both;'></div><p>Version Calendar in SVG</p><p>Created by <a href='http://www.joomla.org' target='_blank'>Joomla! Project</a><br /><small>Development started 3rd September, 2022</small></p>"
+MOD_VERSION_CALENDAR_SVG_TODAY="Today"
 MOD_VERSION_CALENDAR_SVG_PLANNED_RELEASE_SCHEDULE="Planned release schedule"
 MOD_VERSION_CALENDAR_SVG_FUTURE_RELEASES="Future Releases"
-MOD_VERSION_CALENDAR_SVG_STABLE_RELEASE_SCHEDULE_EXPECT_FULL_SUPPORT_AND_UPDATES="Stable release schedule - expect full support and updates"
-MOD_VERSION_CALENDAR_SVG_STABLE_RELEASE="Stable Release"
-MOD_VERSION_CALENDAR_SVG_SECURITY_SCHEDULE_EXPECT_ONLY_SECURITY_UPDATES="Security schedule - expect only security updates"
-MOD_VERSION_CALENDAR_SVG_SECURITY_RELEASE="Security Release"
 MOD_VERSION_CALENDAR_SVG_VERSION_END_OF_LIFE_SCHEDULE_EXPECT_NO_MORE_SUPPORT="Version End of Life schedule - expect no more support"
 MOD_VERSION_CALENDAR_SVG_VERSION_AT_END_OF_LIFE="Version at End of Life"
 MOD_VERSION_CALENDAR_SVG_DIMENTIONS="Dimentions"
 MOD_VERSION_CALENDAR_SVG_STYLES="Styles"
-MOD_VERSION_CALENDAR_SVG_DATES="Dates"
+MOD_VERSION_CALENDAR_SVG_VERSIONS="Versions"
 MOD_VERSION_CALENDAR_SVG_HEADER_HEIGHT_LABEL="Header Height"
 MOD_VERSION_CALENDAR_SVG_BRANCH_HEIGHT_LABEL="Branch Height"
 MOD_VERSION_CALENDAR_SVG_MARGIN_RIGHT_LABEL="Margin Right"
 MOD_VERSION_CALENDAR_SVG_MARGIN_LEFT_LABEL="Margin Left"
 MOD_VERSION_CALENDAR_SVG_YEAR_WIDTH_LABEL="Year Width"
 MOD_VERSION_CALENDAR_SVG_FOOTER_HEIGHT_LABEL="Footer Height"
-MOD_VERSION_CALENDAR_SVG_TEXT_COLOR_LABEL="Default Text Color"
-MOD_VERSION_CALENDAR_SVG_FUTURE_COLOR_LABEL="Future Background Color"
-MOD_VERSION_CALENDAR_SVG_STABLE_COLOR_LABEL="Stable Background Color"
-MOD_VERSION_CALENDAR_SVG_SECURITY_COLOR_LABEL="Security Background Color"
-MOD_VERSION_CALENDAR_SVG_END_OF_LIFE_COLOR_LABEL="End of Life Background Color"
-MOD_VERSION_CALENDAR_SVG_END_OF_LIFE_TEXT_COLOR_LABEL="End of Life Text Color"
-MOD_VERSION_CALENDAR_SVG_YEARS_LINE_COLOR_LABEL="Years Line Color"
-MOD_VERSION_CALENDAR_SVG_YEARS_TEXT_COLOR_LABEL="Years Text Color"
-MOD_VERSION_CALENDAR_SVG_TODAY_LINE_COLOR_LABEL="Today Line Color"
-MOD_VERSION_CALENDAR_SVG_TODAY_TEXT_COLOR_LABEL="Today Text Color"
+MOD_VERSION_CALENDAR_SVG_TEXT_COLOR_LABEL="Default Text Colour"
+MOD_VERSION_CALENDAR_SVG_FUTURE_TEXT_COLOR_LABEL="Future Text Colour"
+MOD_VERSION_CALENDAR_SVG_FUTURE_COLOR_LABEL="Future Background Colour"
+MOD_VERSION_CALENDAR_SVG_END_OF_LIFE_TEXT_COLOR_LABEL="End of Life Text Colour"
+MOD_VERSION_CALENDAR_SVG_END_OF_LIFE_COLOR_LABEL="End of Life Background Colour"
+MOD_VERSION_CALENDAR_SVG_YEARS_LINE_COLOR_LABEL="Years Line Colour"
+MOD_VERSION_CALENDAR_SVG_YEARS_TEXT_COLOR_LABEL="Years Text Colour"
+MOD_VERSION_CALENDAR_SVG_TODAY_LINE_COLOR_LABEL="Today Line Colour"
+MOD_VERSION_CALENDAR_SVG_TODAY_TEXT_COLOR_LABEL="Today Text Colour"
 MOD_VERSION_CALENDAR_SVG_SHOW_LEGEND_LABEL="Show Legend"
 MOD_VERSION_CALENDAR_SVG_SHOW_LEGEND_DESCRIPTION="Allow the legend to be shown below the calendar."
 MOD_VERSION_CALENDAR_SVG_YES="Yes"
@@ -36,14 +32,21 @@ MOD_VERSION_CALENDAR_SVG_LEGEND_BACKGROUND_COLOR_LABEL="Legend Background Colour
 MOD_VERSION_CALENDAR_SVG_LEGEND_TEXT_COLOR_LABEL="Legend Text Colour"
 MOD_VERSION_CALENDAR_SVG_MAX_YEARS_LABEL="Max Years"
 MOD_VERSION_CALENDAR_SVG_MIN_YEARS_LABEL="Min Years"
-MOD_VERSION_CALENDAR_SVG_DATES_LABEL="Dates"
+MOD_VERSION_CALENDAR_SVG_VERSIONS_LABEL="Versions"
 MOD_VERSION_CALENDAR_SVG_VERSION_LABEL="Version"
 MOD_VERSION_CALENDAR_SVG_VERSION_DESCRIPTION="Name"
 MOD_VERSION_CALENDAR_SVG_VERSION_MESSAGE="Error! Please add version here."
 MOD_VERSION_CALENDAR_SVG_VERSION_HINT="1.0.0"
+MOD_VERSION_CALENDAR_SVG_DATES_LABEL="Dates"
+MOD_VERSION_CALENDAR_SVG_STATE_LABEL="State"
+MOD_VERSION_CALENDAR_SVG_STATE_HINT="stable"
+MOD_VERSION_CALENDAR_SVG_LABEL_LABEL="Label"
+MOD_VERSION_CALENDAR_SVG_LABEL_HINT="State label"
+MOD_VERSION_CALENDAR_SVG_DESCRIPTION_LABEL="Description"
+MOD_VERSION_CALENDAR_SVG_DESCRIPTION_HINT="Describe the state"
+MOD_VERSION_CALENDAR_SVG_COLOR_LABEL="Background"
+MOD_VERSION_CALENDAR_SVG_COLOR_DESCRIPTION="Color"
 MOD_VERSION_CALENDAR_SVG_START_LABEL="Start Date"
 MOD_VERSION_CALENDAR_SVG_START_MESSAGE="Error! Please add date here."
-MOD_VERSION_CALENDAR_SVG_SECURITY_LABEL="Security Support Date"
-MOD_VERSION_CALENDAR_SVG_SECURITY_MESSAGE="Error! Please add date here."
 MOD_VERSION_CALENDAR_SVG_END_LABEL="End Date"
 MOD_VERSION_CALENDAR_SVG_END_MESSAGE="Error! Please add date here."
\ No newline at end of file
diff --git a/language/en-GB/en-GB.mod_version_calendar_svg.sys.ini b/language/en-GB/en-GB.mod_version_calendar_svg.sys.ini
index 636cee7..b5aa66d 100644
--- a/language/en-GB/en-GB.mod_version_calendar_svg.sys.ini
+++ b/language/en-GB/en-GB.mod_version_calendar_svg.sys.ini
@@ -1,33 +1,29 @@
 MOD_VERSION_CALENDAR_SVG="Version Calendar Svg"
 MOD_VERSION_CALENDAR_SVG_DESCRIPTION="Version Calendar in SVG"
-MOD_VERSION_CALENDAR_SVG_XML_DESCRIPTION="<h1>Version Calendar Svg (v.1.0.2)</h1> <div style='clear: both;'></div><p>Version Calendar in SVG</p><p>Created by <a href='http://www.joomla.org' target='_blank'>Joomla! Project</a><br /><small>Development started 3rd September, 2022</small></p>"
+MOD_VERSION_CALENDAR_SVG_XML_DESCRIPTION="<h1>Version Calendar Svg (v.2.0.1)</h1> <div style='clear: both;'></div><p>Version Calendar in SVG</p><p>Created by <a href='http://www.joomla.org' target='_blank'>Joomla! Project</a><br /><small>Development started 3rd September, 2022</small></p>"
+MOD_VERSION_CALENDAR_SVG_TODAY="Today"
 MOD_VERSION_CALENDAR_SVG_PLANNED_RELEASE_SCHEDULE="Planned release schedule"
 MOD_VERSION_CALENDAR_SVG_FUTURE_RELEASES="Future Releases"
-MOD_VERSION_CALENDAR_SVG_STABLE_RELEASE_SCHEDULE_EXPECT_FULL_SUPPORT_AND_UPDATES="Stable release schedule - expect full support and updates"
-MOD_VERSION_CALENDAR_SVG_STABLE_RELEASE="Stable Release"
-MOD_VERSION_CALENDAR_SVG_SECURITY_SCHEDULE_EXPECT_ONLY_SECURITY_UPDATES="Security schedule - expect only security updates"
-MOD_VERSION_CALENDAR_SVG_SECURITY_RELEASE="Security Release"
 MOD_VERSION_CALENDAR_SVG_VERSION_END_OF_LIFE_SCHEDULE_EXPECT_NO_MORE_SUPPORT="Version End of Life schedule - expect no more support"
 MOD_VERSION_CALENDAR_SVG_VERSION_AT_END_OF_LIFE="Version at End of Life"
 MOD_VERSION_CALENDAR_SVG_DIMENTIONS="Dimentions"
 MOD_VERSION_CALENDAR_SVG_STYLES="Styles"
-MOD_VERSION_CALENDAR_SVG_DATES="Dates"
+MOD_VERSION_CALENDAR_SVG_VERSIONS="Versions"
 MOD_VERSION_CALENDAR_SVG_HEADER_HEIGHT_LABEL="Header Height"
 MOD_VERSION_CALENDAR_SVG_BRANCH_HEIGHT_LABEL="Branch Height"
 MOD_VERSION_CALENDAR_SVG_MARGIN_RIGHT_LABEL="Margin Right"
 MOD_VERSION_CALENDAR_SVG_MARGIN_LEFT_LABEL="Margin Left"
 MOD_VERSION_CALENDAR_SVG_YEAR_WIDTH_LABEL="Year Width"
 MOD_VERSION_CALENDAR_SVG_FOOTER_HEIGHT_LABEL="Footer Height"
-MOD_VERSION_CALENDAR_SVG_TEXT_COLOR_LABEL="Default Text Color"
-MOD_VERSION_CALENDAR_SVG_FUTURE_COLOR_LABEL="Future Background Color"
-MOD_VERSION_CALENDAR_SVG_STABLE_COLOR_LABEL="Stable Background Color"
-MOD_VERSION_CALENDAR_SVG_SECURITY_COLOR_LABEL="Security Background Color"
-MOD_VERSION_CALENDAR_SVG_END_OF_LIFE_COLOR_LABEL="End of Life Background Color"
-MOD_VERSION_CALENDAR_SVG_END_OF_LIFE_TEXT_COLOR_LABEL="End of Life Text Color"
-MOD_VERSION_CALENDAR_SVG_YEARS_LINE_COLOR_LABEL="Years Line Color"
-MOD_VERSION_CALENDAR_SVG_YEARS_TEXT_COLOR_LABEL="Years Text Color"
-MOD_VERSION_CALENDAR_SVG_TODAY_LINE_COLOR_LABEL="Today Line Color"
-MOD_VERSION_CALENDAR_SVG_TODAY_TEXT_COLOR_LABEL="Today Text Color"
+MOD_VERSION_CALENDAR_SVG_TEXT_COLOR_LABEL="Default Text Colour"
+MOD_VERSION_CALENDAR_SVG_FUTURE_TEXT_COLOR_LABEL="Future Text Colour"
+MOD_VERSION_CALENDAR_SVG_FUTURE_COLOR_LABEL="Future Background Colour"
+MOD_VERSION_CALENDAR_SVG_END_OF_LIFE_TEXT_COLOR_LABEL="End of Life Text Colour"
+MOD_VERSION_CALENDAR_SVG_END_OF_LIFE_COLOR_LABEL="End of Life Background Colour"
+MOD_VERSION_CALENDAR_SVG_YEARS_LINE_COLOR_LABEL="Years Line Colour"
+MOD_VERSION_CALENDAR_SVG_YEARS_TEXT_COLOR_LABEL="Years Text Colour"
+MOD_VERSION_CALENDAR_SVG_TODAY_LINE_COLOR_LABEL="Today Line Colour"
+MOD_VERSION_CALENDAR_SVG_TODAY_TEXT_COLOR_LABEL="Today Text Colour"
 MOD_VERSION_CALENDAR_SVG_SHOW_LEGEND_LABEL="Show Legend"
 MOD_VERSION_CALENDAR_SVG_SHOW_LEGEND_DESCRIPTION="Allow the legend to be shown below the calendar."
 MOD_VERSION_CALENDAR_SVG_YES="Yes"
@@ -36,14 +32,21 @@ MOD_VERSION_CALENDAR_SVG_LEGEND_BACKGROUND_COLOR_LABEL="Legend Background Colour
 MOD_VERSION_CALENDAR_SVG_LEGEND_TEXT_COLOR_LABEL="Legend Text Colour"
 MOD_VERSION_CALENDAR_SVG_MAX_YEARS_LABEL="Max Years"
 MOD_VERSION_CALENDAR_SVG_MIN_YEARS_LABEL="Min Years"
-MOD_VERSION_CALENDAR_SVG_DATES_LABEL="Dates"
+MOD_VERSION_CALENDAR_SVG_VERSIONS_LABEL="Versions"
 MOD_VERSION_CALENDAR_SVG_VERSION_LABEL="Version"
 MOD_VERSION_CALENDAR_SVG_VERSION_DESCRIPTION="Name"
 MOD_VERSION_CALENDAR_SVG_VERSION_MESSAGE="Error! Please add version here."
 MOD_VERSION_CALENDAR_SVG_VERSION_HINT="1.0.0"
+MOD_VERSION_CALENDAR_SVG_DATES_LABEL="Dates"
+MOD_VERSION_CALENDAR_SVG_STATE_LABEL="State"
+MOD_VERSION_CALENDAR_SVG_STATE_HINT="stable"
+MOD_VERSION_CALENDAR_SVG_LABEL_LABEL="Label"
+MOD_VERSION_CALENDAR_SVG_LABEL_HINT="State label"
+MOD_VERSION_CALENDAR_SVG_DESCRIPTION_LABEL="Description"
+MOD_VERSION_CALENDAR_SVG_DESCRIPTION_HINT="Describe the state"
+MOD_VERSION_CALENDAR_SVG_COLOR_LABEL="Background"
+MOD_VERSION_CALENDAR_SVG_COLOR_DESCRIPTION="Color"
 MOD_VERSION_CALENDAR_SVG_START_LABEL="Start Date"
 MOD_VERSION_CALENDAR_SVG_START_MESSAGE="Error! Please add date here."
-MOD_VERSION_CALENDAR_SVG_SECURITY_LABEL="Security Support Date"
-MOD_VERSION_CALENDAR_SVG_SECURITY_MESSAGE="Error! Please add date here."
 MOD_VERSION_CALENDAR_SVG_END_LABEL="End Date"
 MOD_VERSION_CALENDAR_SVG_END_MESSAGE="Error! Please add date here."
\ No newline at end of file
diff --git a/mod_version_calendar_svg.php b/mod_version_calendar_svg.php
index df2f96c..b83c5b7 100644
--- a/mod_version_calendar_svg.php
+++ b/mod_version_calendar_svg.php
@@ -14,17 +14,25 @@ defined('_JEXEC') or die('Restricted access');
 // Include the helper functions only once
 JLoader::register('ModVersion_Calendar_svgHelper', __DIR__ . '/helper.php');
 
-// Get the Helper class
-$helper = new ModVersion_Calendar_svgHelper($params);
+try
+{
+	// Get the Helper class
+	$helper = new ModVersion_Calendar_svgHelper($params);
 
-// set the branches
-$branches = $helper->branches();
+	// set the branches
+	$branches = $helper->branches();
 
-// set branch qty
-$qty = count($branches);
+	// set branch qty
+	$qty = count($branches);
 
-// get the module class sfx (local)
-$moduleclass_sfx = htmlspecialchars($params->get('moduleclass_sfx'), ENT_COMPAT, 'UTF-8');
+	// get the module class sfx (local)
+	$moduleclass_sfx = htmlspecialchars($params->get('moduleclass_sfx'), ENT_COMPAT, 'UTF-8');
 
-// load the default Tmpl
-require JModuleHelper::getLayoutPath('mod_version_calendar_svg', $params->get('layout', 'default'));
+	// load the default Tmpl
+	require JModuleHelper::getLayoutPath('mod_version_calendar_svg', $params->get('layout', 'default'));
+} 
+catch (Exception $e) 
+{
+	// Output a warning message along with the exception message
+	echo "Warning: " . $e->getMessage();
+}
diff --git a/mod_version_calendar_svg.xml b/mod_version_calendar_svg.xml
index 086354d..51eafa4 100644
--- a/mod_version_calendar_svg.xml
+++ b/mod_version_calendar_svg.xml
@@ -1,13 +1,13 @@
 <?xml version="1.0" encoding="utf-8"?>
 <extension type="module" version="4" client="site" method="upgrade">
 	<name>MOD_VERSION_CALENDAR_SVG</name>
-	<creationDate>10th August, 2023</creationDate>
+	<creationDate>11th August, 2023</creationDate>
 	<author>Joomla! Project</author>
 	<authorEmail>admin@joomla.org</authorEmail>
 	<authorUrl>http://www.joomla.org</authorUrl>
 	<copyright>(C) 2020 Open Source Matters, Inc.</copyright>
 	<license>GNU General Public License version 2 or later; see LICENSE.txt</license>
-	<version>1.0.2</version>
+	<version>2.0.1</version>
 	<description>MOD_VERSION_CALENDAR_SVG_XML_DESCRIPTION</description>
 
 	<!-- Scripts to run on installation -->
@@ -132,6 +132,14 @@
 			label="MOD_VERSION_CALENDAR_SVG_TEXT_COLOR_LABEL"
 			required="true"
 		/>
+		<!-- Future_text_color Field. Type: Color. (joomla) -->
+		<field
+			type="color"
+			name="future_text_color"
+			default="#fbf3ef"
+			label="MOD_VERSION_CALENDAR_SVG_FUTURE_TEXT_COLOR_LABEL"
+			required="true"
+		/>
 		<!-- Future_color Field. Type: Color. (joomla) -->
 		<field
 			type="color"
@@ -140,20 +148,12 @@
 			label="MOD_VERSION_CALENDAR_SVG_FUTURE_COLOR_LABEL"
 			required="true"
 		/>
-		<!-- Stable_color Field. Type: Color. (joomla) -->
+		<!-- End_of_life_text_color Field. Type: Color. (joomla) -->
 		<field
 			type="color"
-			name="stable_color"
-			default="#7ac143"
-			label="MOD_VERSION_CALENDAR_SVG_STABLE_COLOR_LABEL"
-			required="true"
-		/>
-		<!-- Security_color Field. Type: Color. (joomla) -->
-		<field
-			type="color"
-			name="security_color"
-			default="#f9a541"
-			label="MOD_VERSION_CALENDAR_SVG_SECURITY_COLOR_LABEL"
+			name="end_of_life_text_color"
+			default="#ffffff"
+			label="MOD_VERSION_CALENDAR_SVG_END_OF_LIFE_TEXT_COLOR_LABEL"
 			required="true"
 		/>
 		<!-- End_of_life_color Field. Type: Color. (joomla) -->
@@ -164,14 +164,6 @@
 			label="MOD_VERSION_CALENDAR_SVG_END_OF_LIFE_COLOR_LABEL"
 			required="true"
 		/>
-		<!-- End_of_life_text_color Field. Type: Color. (joomla) -->
-		<field
-			type="color"
-			name="end_of_life_text_color"
-			default="#ffffff"
-			label="MOD_VERSION_CALENDAR_SVG_END_OF_LIFE_TEXT_COLOR_LABEL"
-			required="true"
-		/>
 		<!-- Years_line_color Field. Type: Color. (joomla) -->
 		<field
 			type="color"
@@ -235,8 +227,8 @@
 			showon="show_legend:1"
 		/>
 	</fieldset>
-	<!-- default paths of dates fieldset points to the module -->
-	<fieldset name="dates" label="MOD_VERSION_CALENDAR_SVG_DATES"
+	<!-- default paths of versions fieldset points to the module -->
+	<fieldset name="versions" label="MOD_VERSION_CALENDAR_SVG_VERSIONS"
 		addrulepath="/modules/mod_version_calendar_svg/rules"
 		addfieldpath="/modules/mod_version_calendar_svg/fields"
 	>
@@ -266,18 +258,18 @@
 			step="1"
 			validate="number"
 		/>
-		<!-- Dates Field. Type: Subform. (joomla) -->
+		<!-- Versions Field. Type: Subform. (joomla) -->
 		<field
 			type="subform"
-			name="dates"
-			label="MOD_VERSION_CALENDAR_SVG_DATES_LABEL"
+			name="versions"
+			label="MOD_VERSION_CALENDAR_SVG_VERSIONS_LABEL"
 			layout="joomla.form.field.subform.repeatable"
 			multiple="true"
 			buttons="add,remove,move"
 			icon="list"
-			max="50"
+			max="10"
 			min="1">
-			<form hidden="true" name="list_dates_modal" repeat="true">
+			<form hidden="true" name="list_versions_modal" repeat="true">
 				<!-- Version Field. Type: Text. (joomla) -->
 				<field
 					type="text"
@@ -293,39 +285,91 @@
 					message="MOD_VERSION_CALENDAR_SVG_VERSION_MESSAGE"
 					hint="MOD_VERSION_CALENDAR_SVG_VERSION_HINT"
 				/>
-				<!-- Start Field. Type: Calendar. (joomla) -->
+				<!-- Dates Field. Type: Subform. (joomla) -->
 				<field
-					type="calendar"
-					name="start"
-					label="MOD_VERSION_CALENDAR_SVG_START_LABEL"
-					format="%d-%m-%Y"
-					filter="CMD"
-					message="MOD_VERSION_CALENDAR_SVG_START_MESSAGE"
-					size="40"
-					required="true"
-				/>
-				<!-- Security Field. Type: Calendar. (joomla) -->
-				<field
-					type="calendar"
-					name="security"
-					label="MOD_VERSION_CALENDAR_SVG_SECURITY_LABEL"
-					format="%d-%m-%Y"
-					filter="CMD"
-					message="MOD_VERSION_CALENDAR_SVG_SECURITY_MESSAGE"
-					size="40"
-					required="false"
-				/>
-				<!-- End Field. Type: Calendar. (joomla) -->
-				<field
-					type="calendar"
-					name="end"
-					label="MOD_VERSION_CALENDAR_SVG_END_LABEL"
-					format="%d-%m-%Y"
-					filter="CMD"
-					message="MOD_VERSION_CALENDAR_SVG_END_MESSAGE"
-					size="40"
-					required="true"
-				/>
+					type="subform"
+					name="dates"
+					label="MOD_VERSION_CALENDAR_SVG_DATES_LABEL"
+					layout="joomla.form.field.subform.repeatable"
+					multiple="true"
+					buttons="add,remove,move"
+					icon="list"
+					max="10"
+					min="1"
+					nested_depth="1">
+					<form hidden="true" name="list_dates_modal" repeat="true">
+						<!-- State Field. Type: Text. (joomla) -->
+						<field
+							type="text"
+							name="state"
+							label="MOD_VERSION_CALENDAR_SVG_STATE_LABEL"
+							size="10"
+							maxlength="50"
+							class="text_area"
+							required="true"
+							filter="WORD"
+							hint="MOD_VERSION_CALENDAR_SVG_STATE_HINT"
+							autocomplete="on"
+						/>
+						<!-- Label Field. Type: Text. (joomla) -->
+						<field
+							type="text"
+							name="label"
+							label="MOD_VERSION_CALENDAR_SVG_LABEL_LABEL"
+							size="40"
+							maxlength="50"
+							class="text_area"
+							required="true"
+							filter="STRING"
+							hint="MOD_VERSION_CALENDAR_SVG_LABEL_HINT"
+							autocomplete="on"
+						/>
+						<!-- Description Field. Type: Text. (joomla) -->
+						<field
+							type="text"
+							name="description"
+							label="MOD_VERSION_CALENDAR_SVG_DESCRIPTION_LABEL"
+							size="50"
+							maxlength="150"
+							class="text_area"
+							required="false"
+							filter="STRING"
+							hint="MOD_VERSION_CALENDAR_SVG_DESCRIPTION_HINT"
+							autocomplete="on"
+						/>
+						<!-- Color Field. Type: Color. (joomla) -->
+						<field
+							type="color"
+							name="color"
+							default="#5091cd"
+							label="MOD_VERSION_CALENDAR_SVG_COLOR_LABEL"
+							description="MOD_VERSION_CALENDAR_SVG_COLOR_DESCRIPTION"
+							required="true"
+						/>
+						<!-- Start Field. Type: Calendar. (joomla) -->
+						<field
+							type="calendar"
+							name="start"
+							label="MOD_VERSION_CALENDAR_SVG_START_LABEL"
+							format="%d-%m-%Y"
+							filter="CMD"
+							message="MOD_VERSION_CALENDAR_SVG_START_MESSAGE"
+							size="40"
+							required="true"
+						/>
+						<!-- End Field. Type: Calendar. (joomla) -->
+						<field
+							type="calendar"
+							name="end"
+							label="MOD_VERSION_CALENDAR_SVG_END_LABEL"
+							format="%d-%m-%Y"
+							filter="CMD"
+							message="MOD_VERSION_CALENDAR_SVG_END_MESSAGE"
+							size="40"
+							required="true"
+						/>
+					</form>
+				</field>
 			</form>
 		</field>
 	</fieldset>
diff --git a/tmpl/default.php b/tmpl/default.php
index d71bd82..ee4a669 100644
--- a/tmpl/default.php
+++ b/tmpl/default.php
@@ -21,50 +21,53 @@ defined('_JEXEC') or die('Restricted access');
 			font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
 			font-size: <?php echo (2 / 3) * $params->get('header_height', 24); ?>px;
 		}
-		g.future rect,
-		.branches rect.future {
-			fill: <?php echo $params->get('future_color', '#000'); ?>;
+		g.vcs-future rect,
+		.vcs-branches rect.vcs-future {
+			fill: <?php echo $params->get('future_color', '#5091cd'); ?>;
 		}
-		g.eol rect,
-		.branches rect.eol {
+		g.vcs-future text {
+			fill: <?php echo $params->get('future_text_color', '#fff'); ?>;
+		}
+		g.vcs-eol rect,
+		.vcs-branches rect.vcs-eol {
 			fill: <?php echo $params->get('end_of_life_color', '#f33'); ?>;
 		}
-		g.eol text {
+		g.vcs-eol text {
 			fill: <?php echo $params->get('end_of_life_text_color', '#fff'); ?>;
 		}
-		g.security rect,
-		.branches rect.security {
-			fill: <?php echo $params->get('security_color', '#f93'); ?>;
-		}
-		g.stable rect,
-		.branches rect.stable {
-			fill: <?php echo $params->get('stable_color', '#9c9'); ?>;
-		}
-		.branch-labels text {
+		<?php foreach ($branches as $version): ?>
+			<?php foreach ($version->dates as $date): ?>
+				g.<?php echo $date->state; ?> rect,
+				.vcs-branches rect.<?php echo $date->state; ?> {
+					fill: <?php echo $date->color; ?>;
+				}
+			<?php endforeach; ?>
+		<?php endforeach; ?>
+		.vcs-branch-labels text {
 		dominant-baseline: central;
 			text-anchor: middle;
 		}
-		.today line {
+		.vcs-today line {
 			stroke: <?php echo $params->get('today_line_color', '#f33'); ?>;
 			stroke-dasharray: 7, 7;
 			stroke-width: 3px;
 		}
-		.today text {
+		.vcs-today text {
 			fill: <?php echo $params->get('today_text_color', '#f33'); ?>;
 			text-anchor: middle;
 		}
-		.years line {
+		.vcs-years line {
 			stroke: <?php echo $params->get('years_line_color', '#000'); ?>;
 		}
-		.years text {
+		.vcs-years text {
 			fill: <?php echo $params->get('years_text_color', '#000'); ?>;
 			text-anchor: middle;
 		}
 	</style>
 	<!-- Branch labels -->
-	<g class="branch-labels">
-		<?php foreach ($branches as $branch): ?>
-			<g class="<?php echo $helper->state($branch); ?>">
+	<g class="vcs-branch-labels">
+		<?php foreach ($branches as $key => $branch): ?>
+			<g class="<?php echo $helper->state($branch->dates); ?>">
 				<rect x="0" y="<?php echo $branch->top; ?>" width="<?php echo 0.5 * $params->get('margin_left', 80); ?>"
 					height="<?php echo $params->get('branch_height', 30); ?>"/>
 				<text x="<?php echo 0.25 * $params->get('margin_left', 80); ?>" y="<?php echo $branch->top + (0.5 * $params->get('branch_height', 30)); ?>">
@@ -74,21 +77,31 @@ defined('_JEXEC') or die('Restricted access');
 		<?php endforeach; ?>
 	</g>
 	<!-- Branch blocks -->
-	<g class="branches">
-		<?php foreach ($branches as $branch): ?>
+	<g class="vcs-branches">
+		<?php foreach ($branches as $key => $version): ?>
 			<?php
-				$x_release = $helper->coordinates(new DateTime($branch->start));
-				$x_eol = $helper->coordinates(new DateTime($branch->end));
-				$x_security = (empty($branch->security)) ? $x_eol : $helper->coordinates(new DateTime($branch->security));
+				$y = $version->top;
+				$height = $params->get('branch_height', 30);
 			?>
-			<rect class="stable" x="<?php echo $x_release; ?>" y="<?php echo $branch->top; ?>"
-				width="<?php echo $x_security - $x_release; ?>" height="<?php echo $params->get('branch_height', 30); ?>"/>
-			<rect class="security" x="<?php echo $x_security; ?>" y="<?php echo $branch->top; ?>"
-				width="<?php echo $x_eol - $x_security; ?>" height="<?php echo $params->get('branch_height', 30); ?>"/>
+			<?php foreach ($version->dates as $date): ?>
+				<?php
+					$x_start = $helper->coordinates(new DateTime($date->start));
+					$x_end = $helper->coordinates(new DateTime($date->end));
+				?>
+				<g class="<?php echo $date->state; ?>">
+					<rect
+						x="<?php echo $x_start; ?>"
+						y="<?php echo $y; ?>"
+						width="<?php echo $x_end - $x_start; ?>"
+						height="<?php echo $height; ?>">
+							<title><?php echo htmlspecialchars($date->label); ?></title>
+					</rect>
+				</g>
+			<?php endforeach; ?>
 		<?php endforeach; ?>
 	</g>
 	<!-- Year lines -->
-	<g class="years">
+	<g class="vcs-years">
 		<?php foreach ($helper->years() as $date): ?>
 			<line x1="<?php echo $helper->coordinates($date); ?>" y1="<?php echo $params->get('header_height', 24); ?>"
 				x2="<?php echo $helper->coordinates($date); ?>"
@@ -99,7 +112,7 @@ defined('_JEXEC') or die('Restricted access');
 		<?php endforeach; ?>
 	</g>
 	<!-- Today -->
-	<g class="today">
+	<g class="vcs-today">
 		<?php
 			$now = new DateTime;
 			$x = $helper->coordinates($now);
@@ -108,96 +121,97 @@ defined('_JEXEC') or die('Restricted access');
 			y2="<?php echo $params->get('header_height', 24) + ($qty * $params->get('branch_height', 30)); ?>"/>
 		<text x="<?php echo $x; ?>"
 			y="<?php echo $params->get('header_height', 24) + ($qty * $params->get('branch_height', 30)) + (0.8 * $params->get('footer_height', 24)); ?>">
-			<?php echo 'Today: ' . $now->format('j M Y'); ?>
+			<?php echo JText::_('MOD_VERSION_CALENDAR_SVG_TODAY') . ': ' . $now->format('j M Y'); ?>
 		</text>
 	</g>
 </svg>
 <?php if ($params->get('show_legend', 0) == 1): ?>
+<?php 
+// get the legend values
+$legend = $helper->legend();
+?>
 <style type="text/css">
 	/* Box Shadow */
-	.vdm-box-shadow-medium {
+	.vcs-box-shadow-medium {
 		box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15), 0 0.5rem 1.5rem rgba(0, 0, 0, 0.25);
 	}
 	/* Card Styles */
-	.vdm-card {
+	.vcs-card {
 		border-radius: 4px;
 		margin-top: 15px;
 	}
-	.vdm-card-legend {
+	.vcs-card-legend {
 		background-color: <?php echo $params->get('legend_background_color', '#494444'); ?>;
 		color: <?php echo $params->get('legend_text_color', '#fbf3ef'); ?>;
 	}
-	.vdm-card-body {
+	.vcs-card-body {
 		padding: 4px;
 	}
 	/* Grid Styles */
-	.vdm-grid {
+	.vcs-grid {
 		display: flex;
 		flex-wrap: wrap;
 	}
-	.vdm-grid-match > div {
+	.vcs-grid-match > div {
 		padding: 5px;
 		min-height: 1px;
 		margin: 10px;
 	}
 	/* Flexbox Styles */
-	.vdm-flex {
+	.vcs-flex {
 		display: flex;
 		align-items: center;
 		justify-content: space-between;
 	}
-	.vdm-flex-middle {
+	.vcs-flex-middle {
 		align-items: center;
 	}
 	/* Color Box Styles */
-	.vdm-color-box {
+	.vcs-color-box {
 		width: 20px;
 		height: 20px;
 		display: inline-block;
 		margin-right: 5px;
 	}
-	.vdm-future { background-color: <?php echo $params->get('future_color', '#000'); ?>; }
-	.vdm-stable { background-color: <?php echo $params->get('stable_color', '#9c9'); ?>; }
-	.vdm-security { background-color: <?php echo $params->get('security_color', '#f93'); ?>; }
-	.vdm-end-of-life { background-color: <?php echo $params->get('end_of_life_color', '#f33'); ?>; }
+	.vcs-future { background-color: <?php echo $params->get('future_color', '#000'); ?>; }
+	.vcs-eol { background-color: <?php echo $params->get('end_of_life_color', '#f33'); ?>; }
+	<?php foreach ($legend as $state): ?>
+		.<?php echo $state->state; ?> { background-color: <?php echo $state->color; ?>; }
+	<?php endforeach; ?>
 	/* Media Query for smaller screens */
 	@media (max-width: 768px) {
-		.vdm-grid {
+		.vcs-grid {
 			flex-direction: column;
 		}
-		.vdm-flex {
+		.vcs-flex {
 			display: block;
 		}
-		.vdm-grid-match > div {
+		.vcs-grid-match > div {
 			margin: 4px;
 			padding: 0;
 		}
 	}
 </style>
-<div class="vdm-box-shadow-medium">
-	<div class="vdm-card vdm-card-legend vdm-card-body">
-		<div class="vdm-grid-match vdm-grid">
-			<div class="vdm-flex vdm-flex-middle">
+<div class="vcs-box-shadow-medium">
+	<div class="vcs-card vcs-card-legend vcs-card-body">
+		<div class="vcs-grid-match vcs-grid">
+			<div class="vcs-flex vcs-flex-middle">
 				<span
-					class="vdm-color-box vdm-future hasTooltip"
+					class="vcs-color-box vcs-future hasTooltip"
 					title="<?php echo JText::_('MOD_VERSION_CALENDAR_SVG_PLANNED_RELEASE_SCHEDULE'); ?>"
 				></span><?php echo JText::_('MOD_VERSION_CALENDAR_SVG_FUTURE_RELEASES'); ?>
 			</div>
-			<div class="vdm-flex vdm-flex-middle">
+			<?php foreach ($legend as $state): ?>
+				<div class="vcs-flex vcs-flex-middle">
+					<span
+						class="vcs-color-box <?php echo $state->state; ?> hasTooltip"
+						title="<?php echo $state->description ?? ''; ?>"
+					></span><?php echo $state->label; ?>
+				</div>
+			<?php endforeach; ?>
+			<div class="vcs-flex vcs-flex-middle">
 				<span
-					class="vdm-color-box vdm-stable hasTooltip"
-					title="<?php echo JText::_('MOD_VERSION_CALENDAR_SVG_STABLE_RELEASE_SCHEDULE_EXPECT_FULL_SUPPORT_AND_UPDATES'); ?>"
-				></span><?php echo JText::_('MOD_VERSION_CALENDAR_SVG_STABLE_RELEASE'); ?>
-			</div>
-			<div class="vdm-flex vdm-flex-middle">
-				<span
-					class="vdm-color-box vdm-security hasTooltip"
-					title="<?php echo JText::_('MOD_VERSION_CALENDAR_SVG_SECURITY_SCHEDULE_EXPECT_ONLY_SECURITY_UPDATES'); ?>"
-				></span><?php echo JText::_('MOD_VERSION_CALENDAR_SVG_SECURITY_RELEASE'); ?>
-			</div>
-			<div class="vdm-flex vdm-flex-middle">
-				<span
-					class="vdm-color-box vdm-end-of-life hasTooltip"
+					class="vcs-color-box vcs-eol hasTooltip"
 					title="<?php echo JText::_('MOD_VERSION_CALENDAR_SVG_VERSION_END_OF_LIFE_SCHEDULE_EXPECT_NO_MORE_SUPPORT'); ?>"
 				></span><?php echo JText::_('MOD_VERSION_CALENDAR_SVG_VERSION_AT_END_OF_LIFE'); ?>
 			</div>