demos/journey.html

<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>Mermaid Quick Test Page</title>
	<link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=">
	<style>
		div.mermaid {
			/* font-family: 'trebuchet ms', verdana, arial; */
			font-family: 'Courier New', Courier, monospace !important;
		}
	</style>
</head>

<body>
	<div class="mermaid">
        journey
        title My day
        accDescription A user journey diagram of a typical day in my life
        section Go to work
          Make tea: 5: Me
          Go upstairs: 3: Me
          Do work: 1: Me, Cat
        section Go home
          Go downstairs: 5: Me
          Sit down: 5: Me
	</div>

	<script src="./mermaid.js"></script>
	<script>
		mermaid.initialize({
		  theme: 'forest',
		  logLevel: 3,
		  securityLevel: 'loose',
		  flowchart: { curve: 'basis' },
		  gantt: { axisFormat: '%m/%d/%Y' },
		  sequence: { actorMargin: 50 },
		});
	</script>

</body>

</html>