From 42b65162ae2b6ce22c0b3b173fe3399ba28c25f1 Mon Sep 17 00:00:00 2001
From: Long Alan <julong@microsoft.com>
Date: Fri, 28 Feb 2020 21:11:10 +0800
Subject: [PATCH 1/2] Add header tag

---
 .../visual-designer/src/components/nodes/Trigger.tsx   | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/Composer/packages/extensions/visual-designer/src/components/nodes/Trigger.tsx b/Composer/packages/extensions/visual-designer/src/components/nodes/Trigger.tsx
index 82435f8dbd..aa92b7c7cb 100644
--- a/Composer/packages/extensions/visual-designer/src/components/nodes/Trigger.tsx
+++ b/Composer/packages/extensions/visual-designer/src/components/nodes/Trigger.tsx
@@ -35,13 +35,15 @@ export const Trigger = ({ data, onClick = () => {} }): JSX.Element => {
   const label = getLabel(data);
 
   return (
-    <div css={triggerContainerStyle}>
-      <div css={triggerContentStyle}>
-        <div css={titleStyle}>
+    <div css={triggerContainerStyle} className="trigger">
+      <div css={triggerContentStyle} className="trigger__content">
+        <div css={titleStyle} className="trigger__content-header">
           <Icon iconName="Flow" style={triggerIconStyle} />
           <span>{name}</span>
         </div>
-        <div css={subtitleStyle}>{label}</div>
+        <div css={subtitleStyle} className="trigger__content-label">
+          {label}
+        </div>
       </div>
     </div>
   );

From fa2e92f7ed683e380f010e79d4759208cbb7bdae Mon Sep 17 00:00:00 2001
From: Long Alan <julong@microsoft.com>
Date: Sat, 29 Feb 2020 20:29:16 +0800
Subject: [PATCH 2/2] use header tag for trigger

---
 .../visual-designer/src/components/nodes/Trigger.tsx     | 9 +++++----
 .../src/components/nodes/triggerStyles.ts                | 5 +++++
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/Composer/packages/extensions/visual-designer/src/components/nodes/Trigger.tsx b/Composer/packages/extensions/visual-designer/src/components/nodes/Trigger.tsx
index aa92b7c7cb..2747730c35 100644
--- a/Composer/packages/extensions/visual-designer/src/components/nodes/Trigger.tsx
+++ b/Composer/packages/extensions/visual-designer/src/components/nodes/Trigger.tsx
@@ -14,6 +14,7 @@ import {
   titleStyle,
   subtitleStyle,
   triggerIconStyle,
+  titleContentStyle,
 } from './triggerStyles';
 
 function getLabel(data: any): string {
@@ -35,11 +36,11 @@ export const Trigger = ({ data, onClick = () => {} }): JSX.Element => {
   const label = getLabel(data);
 
   return (
-    <div css={triggerContainerStyle} className="trigger">
-      <div css={triggerContentStyle} className="trigger__content">
-        <div css={titleStyle} className="trigger__content-header">
+    <div css={triggerContainerStyle}>
+      <div css={triggerContentStyle}>
+        <div css={titleStyle}>
           <Icon iconName="Flow" style={triggerIconStyle} />
-          <span>{name}</span>
+          <h4 css={titleContentStyle}>{name}</h4>
         </div>
         <div css={subtitleStyle} className="trigger__content-label">
           {label}
diff --git a/Composer/packages/extensions/visual-designer/src/components/nodes/triggerStyles.ts b/Composer/packages/extensions/visual-designer/src/components/nodes/triggerStyles.ts
index 392068703a..57cc3b154f 100644
--- a/Composer/packages/extensions/visual-designer/src/components/nodes/triggerStyles.ts
+++ b/Composer/packages/extensions/visual-designer/src/components/nodes/triggerStyles.ts
@@ -28,8 +28,13 @@ export const titleStyle: any = {
   fontSize: '18px',
   lineHeight: '24px',
   fontWeight: 600,
+  display: 'flex',
 };
 
+export const titleContentStyle = {
+  fontWeight: 600,
+  margin: '0px',
+};
 export const subtitleStyle: any = {
   whiteSpace: 'nowrap',
   color: ObiColors.LightGray,