2020-06-29 19:21:56 +00:00
|
|
|
<!-- Copyright 2020 the V8 project authors. All rights reserved.
|
|
|
|
Use of this source code is governed by a BSD-style license that can be
|
|
|
|
found in the LICENSE file. -->
|
|
|
|
|
2020-08-25 06:31:43 +00:00
|
|
|
<head>
|
|
|
|
<link href="./index.css" rel="stylesheet">
|
|
|
|
</head>
|
2020-06-29 19:21:56 +00:00
|
|
|
<style>
|
2020-08-25 06:31:43 +00:00
|
|
|
#timelineOverview {
|
|
|
|
width: 100%;
|
|
|
|
height: 50px;
|
|
|
|
position: relative;
|
|
|
|
margin-top: -50px;
|
|
|
|
margin-bottom: 10px;
|
|
|
|
background-size: 100% 100%;
|
2020-09-16 08:37:11 +00:00
|
|
|
border: 1px var(--primary-color) solid;
|
2020-08-25 06:31:43 +00:00
|
|
|
border-width: 1px 0 1px 0;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
|
|
|
|
|
|
|
#timelineOverviewIndicator {
|
|
|
|
height: 100%;
|
|
|
|
position: absolute;
|
2020-09-16 08:37:11 +00:00
|
|
|
box-shadow: 0px 2px 20px -5px var(--primary-color) inset;
|
2020-08-25 06:31:43 +00:00
|
|
|
top: 0px;
|
|
|
|
cursor: ew-resize;
|
|
|
|
}
|
|
|
|
|
|
|
|
#timelineOverviewIndicator .leftMask,
|
|
|
|
#timelineOverviewIndicator .rightMask {
|
2020-09-16 08:37:11 +00:00
|
|
|
background-color: rgba(240, 230, 230, 0.3);
|
2020-08-25 06:31:43 +00:00
|
|
|
width: 10000px;
|
|
|
|
height: 100%;
|
|
|
|
position: absolute;
|
|
|
|
top: 0px;
|
|
|
|
}
|
|
|
|
|
|
|
|
#timelineOverviewIndicator .leftMask {
|
|
|
|
right: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
#timelineOverviewIndicator .rightMask {
|
|
|
|
left: 100%;
|
|
|
|
}
|
2020-06-29 19:21:56 +00:00
|
|
|
</style>
|
2020-07-13 18:02:52 +00:00
|
|
|
<div class="panel">
|
|
|
|
<h2>Timeline Panel</h2>
|
|
|
|
<h3>Timeline</h3>
|
2020-07-28 12:46:10 +00:00
|
|
|
<div>
|
|
|
|
<slot></slot>
|
2020-07-13 18:02:52 +00:00
|
|
|
</div>
|
|
|
|
<div id="timelineOverview">
|
|
|
|
<div id="timelineOverviewIndicator">
|
|
|
|
<div class="leftMask"></div>
|
|
|
|
<div class="rightMask"></div>
|
2020-06-29 19:21:56 +00:00
|
|
|
</div>
|
2020-07-13 18:02:52 +00:00
|
|
|
</div>
|
2020-06-29 19:21:56 +00:00
|
|
|
</div>
|