Arranges plugin to fit into typo3.org

Classes/Controller/RoadmapController.php

@@ -92,7 +92,6 @@ class RoadmapController extends \TYPO3\CMS\Extbase\Mvc\Controller\ActionControll
 		var chart = AmCharts.makeChart("charts", {
 			"type": "gantt",
 			"theme": "light",
-//			"marginRight": 70,
 			"period": "YYYY",
 			"dataDateFormat": "YYYY-MM-DD",
 			"columnWidth": 0.65,
@@ -140,10 +139,7 @@ class RoadmapController extends \TYPO3\CMS\Extbase\Mvc\Controller\ActionControll
 				"valueZoomable": true
 			},
 			"export": {
-				"enabled": true,
-				"divId": "exportContainer",
-                "position": "bottom-right",
-                "fileName": "typo3-support-times",
+				"enabled": false,
 				"menu": [
 				    "PNG","PDF", "SVG"
 				]

Configuration/TypoScript/constants.txt

@@ -4,4 +4,8 @@ plugin.tx_typo3roadmap_roadmap {
 		partialRootPath = EXT:typo3_roadmap/Resources/Private/Partials/
 		layoutRootPath = EXT:typo3_roadmap/Resources/Private/Layouts/
 	}
-}
\ No newline at end of file
+
+	persistence {
+		storagePid = 185
+	}
+}

Configuration/TypoScript/setup.txt

@@ -4,4 +4,7 @@ plugin.tx_typo3roadmap_roadmap {
         partialRootPath = {$plugin.tx_typo3roadmap_roadmap.view.partialRootPath}
         layoutRootPath = {$plugin.tx_typo3roadmap_roadmap.view.layoutRootPath}
     }
-}
\ No newline at end of file
+    persistence {
+        storagePid = {$plugin.tx_typo3roadmap_roadmap.persistence.storagePid}
+    }
+}

Resources/Private/Templates/Roadmap.html

 {namespace roadmap=T3o\Typo3Roadmap\ViewHelpers}
-<div class="b-tabs">
-	<ul class="tabs lite-tabs">
-		<f:for each="{majors}" as="majorsTabs" key="keyTab" iteration="tabIteratorTabs">
-			<li class="{f:if(condition: tabIteratorTabs.isFirst, then: 'act')}"><a href="#{ceUid}_{keyTab}">{majorsTabs.title}</a></li>
+<section class="container">
+	<ul class="nav nav-tabs" role="tablist">
+		<f:for each="{majorVersions}" as="majorsTabs" key="keyTab" iteration="tabIteratorTabs">
+			<li class="nav-item">
+				<a class="nav-link{f:if(condition: tabIteratorTabs.isFirst, then: ' active')}" data-toggle="tab" role="tab" href="#major_{majorsTabs.uid}">{majorsTabs.title}</a>
+			</li>
 		</f:for>
 	</ul>
-	<div class="tab-panes">
-		<f:for each="{majors}" as="major" key="key" iteration="tabIterator">
-			<a id="{ceUid}_{keyTab}"></a>
-			<div class="tab-content {f:if(condition: tabIterator.isFirst, then: ' show-tab', else: 'hide-tab')}">
+	<div class="tab-content">
+		<f:for each="{majorVersions}" as="major" key="key" iteration="tabIterator">
+			<div id="major_{major.uid}" role="tabpanel" class="card tab-pane{f:if(condition: tabIterator.isFirst, then: ' active')}">
 				<h2>{major.title}</h2>
 				<f:format.html>{major.bodyText}</f:format.html>
 				<h3>Releases</h3>
-				<table class="contenttable-0">
+				<table class="table table-striped">
 					<thead>
 					<tr>
 						<th scope="col">Version</th>
@@ -37,10 +38,12 @@
 							<td>
 								<f:if condition="{minor.released} > 1">
 									<f:then>
-										Released: <f:format.date format="Y-m-d">@{minor.released}</f:format.date>
+										Released:
+										<f:format.date format="Y-m-d">@{minor.released}</f:format.date>
 									</f:then>
 									<f:else>
-										Estimated: <f:format.date format="Y-m-d">@{minor.estimated}</f:format.date>
+										Estimated:
+										<f:format.date format="Y-m-d">@{minor.estimated}</f:format.date>
 									</f:else>
 								</f:if>
 							</td>
@@ -51,50 +54,49 @@
 			</div>
 		</f:for>
 	</div>
-</div>
 
-<h3>Support Times</h3>
-<div id="charts" style="height: 300px;"></div>
-<h3>
-	You can find further information about our Extended Support
-	Plans on <a href="https://typo3.com/our-services/extended-support/" target="_blank">TYPO3.com</a>
-</h3>
-<div id="legend"></div>
-<div id="exportContainer">Download Chart as</div>
+	<h3>Support Times</h3>
+	<div id="charts" style="height: 300px;"></div>
+	<h3>
+		You can find further information about our Extended Support
+		Plans on <a href="https://typo3.com/our-services/extended-support/" target="_blank">TYPO3.com</a>
+	</h3>
+	<div id="legend"></div>
 
-<h3>PHP Compatibility Chart</h3>
-<table border="1">
-	<thead>
-		<tr>
-			<th>PHP versions</th>
-			<f:for each="{majorVersions}" as="majorVersion">
-				<th>
-					<strong>TYPO3 {majorVersion.title}</strong><br>
-					{f:format.date(date:majorVersion.developmentStart,format:'Y')}
-					- {f:format.date(date:majorVersion.regularSupport,format:'Y')}
-				</th>
-			</f:for>
-		</tr>
-	</thead>
-	<tbody>
-		<f:for each="{phpVersions}" as="phpVersion">
+	<h3>PHP Compatibility Chart</h3>
+	<table class="table table-bordered">
+		<thead>
 			<tr>
-				<td>
-					PHP {phpVersion.version}
-				</td>
+				<th>PHP versions</th>
 				<f:for each="{majorVersions}" as="majorVersion">
-					<td>
-						<roadmap:condition.inArray needle="{phpVersion.uid}" array="{majorVersion.phpVersions}" arrayPath="uid">
-							<f:then>
-								<b>Yes</b>
-							</f:then>
-							<f:else>
-								no
-							</f:else>
-						</roadmap:condition.inArray>
-					</td>
+					<th>
+						<strong>TYPO3 {majorVersion.title}</strong><br>
+						{f:format.date(date:majorVersion.developmentStart,format:'Y')}
+						- {f:format.date(date:majorVersion.regularSupport,format:'Y')}
+					</th>
 				</f:for>
 			</tr>
-		</f:for>
-	</tbody>
-</table>
+		</thead>
+		<tbody>
+			<f:for each="{phpVersions}" as="phpVersion">
+				<tr>
+					<td>
+						PHP {phpVersion.version}
+					</td>
+					<f:for each="{majorVersions}" as="majorVersion">
+						<td>
+							<roadmap:condition.inArray needle="{phpVersion.uid}" array="{majorVersion.phpVersions}" arrayPath="uid">
+								<f:then>
+									<b>Yes</b>
+								</f:then>
+								<f:else>
+									no
+								</f:else>
+							</roadmap:condition.inArray>
+						</td>
+					</f:for>
+				</tr>
+			</f:for>
+		</tbody>
+	</table>
+</section>