equal
deleted
inserted
replaced
130 } |
130 } |
131 |
131 |
132 .note { |
132 .note { |
133 display: flex; |
133 display: flex; |
134 position: relative; |
134 position: relative; |
135 padding-left: 70px; |
135 padding: 10px 10px 10px 80px; |
136 margin-bottom: 20px; |
136 margin-bottom: 20px; |
137 min-height: ($line-height-computed * 3); |
137 cursor: pointer; |
|
138 min-height: ($line-height-computed * 4); |
|
139 border: 1px solid transparent; |
138 |
140 |
139 &:before { |
141 &:before { |
140 content: ""; |
142 content: ""; |
141 position: absolute; |
143 position: absolute; |
142 top: 0; |
144 top: 0; |
143 bottom: 0; |
145 bottom: 0; |
144 left: 27px; |
146 left: 37px; |
145 z-index: -1; |
147 z-index: -1; |
146 display: block; |
148 display: block; |
147 width: 2px; |
149 width: 2px; |
148 background-color: #e6ebf1; |
150 background-color: #e6ebf1; |
|
151 } |
|
152 |
|
153 &:hover { |
|
154 border: 1px solid #efefef; |
149 } |
155 } |
150 |
156 |
151 .start, .finish { |
157 .start, .finish { |
152 position: absolute; |
158 position: absolute; |
153 background-color: #fff; |
159 background-color: #fff; |
154 } |
160 } |
155 |
161 |
156 .start { |
162 .start { |
157 top: 0; |
163 top: 0; |
158 left: 0; |
164 left: 0; |
|
165 padding: 10px 0 0 10px; |
159 } |
166 } |
160 .finish { |
167 .finish { |
161 bottom: 0; |
168 bottom: 0; |
162 left: 0; |
169 left: 0; |
|
170 padding: 0 0 10px 10px; |
163 } |
171 } |
164 |
172 |
165 &-content { |
173 &-content { |
166 width: 66.6666%; |
174 width: 66.6666%; |
167 } |
175 } |