1/*
2 * Copyright (C) 2022 Huawei Device Co., Ltd.
3 * Licensed under the Apache License, Version 2.0 (the "License");
4 * you may not use this file except in compliance with the License.
5 * You may obtain a copy of the License at
6 *
7 *     http://www.apache.org/licenses/LICENSE-2.0
8 *
9 * Unless required by applicable law or agreed to in writing, software
10 * distributed under the License is distributed on an "AS IS" BASIS,
11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 * See the License for the specific language governing permissions and
13 * limitations under the License.
14 */
15
16export const SpSystemTraceHtml = `<!--suppress CssUnresolvedCustomProperty -->
17    <style>
18    :host{
19        display: block;
20        width: 100%;
21        height: 100%;
22    }
23    .timer-shaft{
24        width: 100%;
25        z-index: 2;
26    }
27    
28     .rows-pane{
29        overflow: overlay;
30        overflow-anchor: none;
31        flex: 1;
32        max-height: calc(100vh - 147px - 48px);
33    }
34    .rows{
35        color: #fff;
36        display: flex;
37        box-sizing: border-box;
38        flex-direction: column;
39        overflow-y: auto;
40        flex: 1;
41        width: 100%;
42        background: var(--dark-background4,#ffffff);
43    }
44    :host([disable]) .vessel{
45        pointer-events: none;
46    }
47    .vessel{
48        width: 100%;
49        box-sizing: border-box;
50        height: 100%;
51        display: flex;
52        flex-direction: column;
53        position:relative;
54    }
55    .panel-canvas{
56        position: absolute;
57        top: 0;
58        right: 0;
59        bottom: 0;
60        width: 100%;
61        height: 100%;
62        box-sizing: border-box;
63        z-index: 0;
64    }
65    
66    .panel-canvas-favorite{
67        width: 100% ;
68        display: block;
69        position: absolute;
70        height: 0;
71        top: 0;
72        right: 0;
73        box-sizing: border-box;
74        z-index: 100;
75    }
76    .trace-sheet{
77        cursor: default;
78    }
79    .tip{
80        z-index: 1001;
81        position: absolute;
82        top: 0;
83        left: 0;
84        /*height: 100%;*/
85        background-color: white;
86        border: 1px solid #f9f9f9;
87        width: auto;
88        font-size: 8px;
89        color: #50809e;
90        flex-direction: column;
91        justify-content: center;
92        align-items: flex-start;
93        padding: 2px 10px;
94        box-sizing: border-box;
95        display: none;
96        user-select: none;
97    }
98
99    </style>
100    <div class="vessel">
101        <timer-shaft-element class="timer-shaft" style="position: relative;top: 0"></timer-shaft-element>
102        <sp-chart-list id="favorite-chart-list"></sp-chart-list>
103        <div class="rows-pane" style="position: relative;flex-direction: column;overflow-x: hidden;">
104            <canvas id="canvas-panel" class="panel-canvas" ondragstart="return false"></canvas>
105            <div class="spacer" ondragstart="return false"></div>
106            <div class="rows" ondragstart="return false"></div>
107        </div>
108        <div id="tip" class="tip"></div>
109        <trace-sheet class="trace-sheet" mode="hidden" ondragstart="return false"></trace-sheet>
110    </div>
111        `;
112