File tree Expand file tree Collapse file tree 4 files changed +90
-22
lines changed Expand file tree Collapse file tree 4 files changed +90
-22
lines changed Original file line number Diff line number Diff line change @@ -123,22 +123,51 @@ span.xpassed,
123
123
$extra-height : 240px ;
124
124
$extra-media-width : 320px ;
125
125
126
- .log {
127
- background-color : #e6e6e6 ;
128
- border : $border-width solid #e6e6e6 ;
129
- color : black ;
130
- display : block ;
131
- font-family : ' Courier New' , Courier , monospace ;
132
- max-height : $extra-height - 2 * $spacing ;
133
- overflow-y : scroll ;
134
- padding : $spacing ;
135
- white-space : pre-wrap ;
136
-
137
- & :only-child {
138
- height : inherit ;
126
+ .logwrapper {
127
+ max-height : $extra-height - 2 * $spacing ;
128
+ overflow-y : scroll ;
129
+ background-color : #e6e6e6 ;
130
+ & .expanded {
131
+ max-height : none ;
132
+ .logexpander {
133
+ & :after {
134
+ content : ' collapse [-]' ;
135
+ }
136
+ }
137
+ }
138
+ .logexpander {
139
+ z-index : 1 ;
140
+ position : sticky ;
141
+ top : 10px ;
142
+ width : max-content ;
143
+ border : 1px solid ;
144
+ border-radius : 3px ;
145
+ padding : 5px 7px ;
146
+ margin : 10px 0 10px calc (100% - 80px );
147
+ cursor : pointer ;
148
+ background-color : #e6e6e6 ;
149
+ & :after {
150
+ content : ' expand [+]' ;
151
+ }
152
+ & :hover {
153
+ color : #000 ;
154
+ border-color : #000 ;
155
+ }
156
+ }
157
+ .log {
158
+ min-height : 40px ;
159
+ position : relative ;
160
+ top : -50px ;
161
+ height : calc (100% + 50px );
162
+ border : $border-width solid #e6e6e6 ;
163
+ color : black ;
164
+ display : block ;
165
+ font-family : ' Courier New' , Courier , monospace ;
166
+ padding : $spacing ;
167
+ padding-right : 80px ;
168
+ white-space : pre-wrap ;
139
169
}
140
170
}
141
-
142
171
div .media {
143
172
border : $border-width solid #e6e6e6 ;
144
173
float : right ;
@@ -200,6 +229,7 @@ div.media {
200
229
}
201
230
202
231
.col-result {
232
+ width : 130px ;
203
233
& :hover ::after {
204
234
content : ' (hide details)' ;
205
235
}
Original file line number Diff line number Diff line change 53
53
<div class =" media__name" ></div >
54
54
<div class =" media__counter" ></div >
55
55
</div >
56
- <div class =" log" ></div >
56
+ <div class =" logwrapper" >
57
+ <div class =" logexpander" ></div >
58
+ <div class =" log" ></div >
59
+ </div >
57
60
</td >
58
61
</tr >
59
62
</tbody >
Original file line number Diff line number Diff line change 1
- const { dom, findAll } = require ( './dom.js' )
1
+ const { dom, find , findAll } = require ( './dom.js' )
2
2
const { manager } = require ( './datamanager.js' )
3
3
const { doSort } = require ( './sort.js' )
4
4
const { doFilter } = require ( './filter.js' )
@@ -67,6 +67,9 @@ const renderContent = (tests) => {
67
67
rows . forEach ( ( row ) => {
68
68
if ( ! ! row ) {
69
69
findAll ( '.collapsible td:not(.col-links' , row ) . forEach ( addItemToggleListener )
70
+ find ( '.logexpander' , row ) . addEventListener ( 'click' ,
71
+ ( evt ) => evt . target . parentNode . classList . toggle ( 'expanded' ) ,
72
+ )
70
73
newTable . appendChild ( row )
71
74
}
72
75
} )
You can’t perform that action at this time.
0 commit comments