1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
|
.rules-list
overflow:hidden
overflow-y:scroll
max-height: 400px
.rules-lists-item
display: block
position: relative
overflow: auto
p
display: inline-block
float: left
margin: revert
.rules-btns-group
position: absolute
right: 0
top: 50%
transform: translateY(-50%)
button
margin: auto
.rules-add
display: block
overflow: auto
margin-top: 15px
margin-bottom: 5px
input
display: inline-block
float: right
margin: auto
margin-right: 10px
button
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
height: intrinsic
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:40px
margin-bottom:5px
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-text.trigger-text-email
margin-left: 5px;
margin-top: 10px;
margin-bottom: 10px;
.trigger-dropdown
display:inline-block
select
width:auto
height:30px
margin:0px
margin-left:5px
input
display: inline-block
width: 80px;
margin: 0;
.trigger-content-mail
left:20px
right:100px
.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%)
&:hover, &.is-active
box-shadow: 0 0 0 2px darken(white, 60%) inset
.trigger-button.trigger-button-email
top:30px
.trigger-item.trigger-item-mail
height:300px
|