1 files changed, 103 insertions, 3 deletions

diff --git a/client/components/rules/rules.styl b/client/components/rules/rules.styl
index 2aab1b40..48a175a5 100644
--- a/client/components/rules/rules.styl
+++ b/client/components/rules/rules.styl
@@ -1,5 +1,7 @@
 .rules-list
-  overflow-y: scroll
+  overflow:hidden
+  overflow-y:scroll
+  max-height: 400px
 .rules-lists-item
   display: block
   position: relative
@@ -19,7 +21,7 @@
 .rules-add
   display: block
   overflow: auto
-  margin-top: 25px
+  margin-top: 15px
   margin-bottom: 5px
   input
   	display: inline-block
@@ -30,5 +32,103 @@
   	display: inline-block
   	float: right
   	margin: auto
+.flex
+  display: -webkit-box
+  display: -moz-box
+  display: -webkit-flex
+  display: -moz-flex
+  display: -ms-flexbox
+  display: flex
+
+.triggers-content
+  color: #727479
+  background: #dedede
+  .triggers-body
+    display flex
+    padding-top 15px
+    height 100%
+
+    .triggers-side-menu
+      background-color: #f7f7f7;
+      border: 1px solid #f0f0f0;
+      border-radius: 4px;
+      box-shadow: inset -1px -1px 3px rgba(0,0,0,.05);
+
+      ul
+
+        li
+          margin: 0.1rem 0.2rem;
+          width:50px
+          height:50px
+          text-align:center
+          font-size: 25px
+          position: relative
+          
+          i
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            box-shadow: none
+            transform: translate(-50%,-50%);
+
+
+          &.active
+            background #fff
+            box-shadow 0 1px 2px rgba(0,0,0,0.15);
+
+          &:hover
+            background #fff
+            box-shadow 0 1px 2px rgba(0,0,0,0.15);
+          a
+            @extends .flex
+            padding: 1rem 0 1rem 1rem
+            width: 100% - 5rem
+
+
+            span
+              font-size: 13px
+    .triggers-main-body
+      padding: 0.1em 1em
+      width:100%
+      .trigger-item
+        overflow:auto
+        padding:10px
+        height:30px
+        border-radius: 3px
+        position: relative
+        background-color: white
+        .trigger-content
+            position:absolute
+            top:50%
+            transform: translateY(-50%)
+            left:10px
+            .trigger-text
+              font-size: 16px
+              display:inline-block
+            .trigger-dropdown
+              display:inline-block
+              select
+                width:100px
+                height:30px
+                margin:0px
+        .trigger-button
+          position:absolute
+          top:50%
+          transform: translateY(-50%)
+          width:30px
+          height:30px
+          border: 1px solid #eee;
+          border-radius: 4px;
+          box-shadow: inset -1px -1px 3px rgba(0,0,0,.05);
+          text-align:center
+          font-size: 20px
+          right:10px
+          i
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            box-shadow: none
+            transform: translate(-50%,-50%);
+              
+
 
-  	
\ No newline at end of file