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
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
|
.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
.hide-element
display:none !important
.user-details
display:inline-block
.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
.rules-back
display: block
overflow: auto
margin-top: 15px
margin-bottom: 5px
button
display: inline-block
float: right
margin: auto
margin-right:14px
.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-inline-button
font-size: 16px
display: inline;
padding: 6px;
border: 1px solid #eee
border-radius: 4px
box-shadow: inset -1px -1px 3px rgba(0,0,0,.05)
&:hover, &.is-active
box-shadow: 0 0 0 2px darken(white, 60%) inset
.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-button.trigger-button-person
right:-40px
.trigger-button.trigger-button-color
top: unset
position: unset
transform: unset
font-size: 16px
width:auto
padding-left: 10px
padding-right: 10px
height:40px
.trigger-item.trigger-item-mail
height:300px
|