new template

server/src/templates/unifiedNotification.mjml

@@ -0,0 +1,95 @@
+<mjml>
+	<mj-head>
+		<mj-font
+			name="Roboto"
+			href="https://fonts.googleapis.com/css?family=Roboto:300,500"
+		></mj-font>
+		<mj-attributes>
+			<mj-all font-family="Roboto, Helvetica, sans-serif"></mj-all>
+			<mj-text
+				font-weight="300"
+				font-size="16px"
+				color="#616161"
+				line-height="24px"
+			></mj-text>
+			<mj-section padding="0px"></mj-section>
+		</mj-attributes>
+	</mj-head>
+	<mj-body>
+		<mj-section padding="20px 0">
+			<mj-column width="100%">
+				<mj-text
+					align="left"
+					font-size="10px"
+				>
+					Message from Checkmate Service
+				</mj-text>
+			</mj-column>
+			<mj-column
+				width="45%"
+				padding-top="20px"
+			>
+				<mj-text
+					align="center"
+					font-weight="500"
+					padding="0px"
+					font-size="18px"
+					color="{{headerColor}}"
+				>
+					{{ title }}
+				</mj-text>
+				<mj-divider
+					border-width="2px"
+					border-color="#616161"
+				></mj-divider>
+			</mj-column>
+		</mj-section>
+		<mj-section>
+			<mj-column width="100%">
+				<mj-text>
+					<p>Hello!</p>
+					<p>{{ summary }}</p>
+					<p><b>Monitor name:</b> {{ monitorName }}</p>
+					<p><b>URL:</b> {{ monitorUrl }}</p>
+					<p><b>Type:</b> {{ monitorType }}</p>
+					<p><b>Status:</b> {{ monitorStatus }}</p>
+					{{#if thresholds}}
+					<p><b>Threshold Breaches:</b></p>
+					<ul>
+						{{#each thresholds}}
+						<li>
+							<b>{{ metric }}:</b> {{ formattedValue }} (threshold: {{ threshold }}{{ unit }})
+						</li>
+						{{/each}}
+					</ul>
+					{{/if}}
+					{{#if details}}
+					<p><b>Additional Details:</b></p>
+					<ul>
+						{{#each details}}
+						<li>{{ this }}</li>
+						{{/each}}
+					</ul>
+					{{/if}}
+				</mj-text>
+			</mj-column>
+			<mj-column width="100%">
+				<mj-divider
+					border-width="1px"
+					border-color="#E0E0E0"
+				></mj-divider>
+				{{#if incidentUrl}}
+				<mj-button
+					background-color="#1570EF"
+					href="{{incidentUrl}}"
+				>
+					View incident details
+				</mj-button>
+				{{/if}}
+				<mj-text font-size="12px">
+					<p>This email was sent by Checkmate.</p>
+				</mj-text>
+			</mj-column>
+		</mj-section>
+	</mj-body>
+</mjml>