xref: /aosp_15_r20/external/perfetto/ui/src/assets/widgets/treetable.scss (revision 6dbdd20afdafa5e3ca9b8809fa73465d530080dc)
1// Copyright (C) 2023 The Android Open Source Project
2//
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@import "theme";
16
17$chevron-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='8' width='8'%3E%3Cline x1='2' y1='0' x2='6' y2='4' stroke='black'/%3E%3Cline x1='6' y1='4' x2='2' y2='8' stroke='black'/%3E%3C/svg%3E");
18
19.pf-treetable {
20  font-family: $pf-font;
21  border-collapse: collapse;
22  text-align: left;
23  th {
24    text-align: left;
25    padding: 2px 8px;
26    border-bottom: solid 1px grey;
27    font-weight: bolder;
28  }
29  td {
30    padding: 2px 8px;
31    text-align: left;
32    padding-left: calc(var(--indentation-level) * 12px + 4px);
33    .pf-treetable-gutter {
34      display: inline;
35      &::before {
36        content: " ";
37        display: inline-block;
38        position: relative;
39        width: 12px;
40      }
41    }
42  }
43  td.pf-treetable-maincol {
44    font-weight: bolder;
45  }
46  td.pf-treetable-node {
47    .pf-treetable-gutter {
48      &::before {
49        content: $chevron-svg;
50        display: inline-block;
51        cursor: pointer;
52        width: 12px;
53        rotate: 90deg;
54      }
55    }
56    &.pf-collapsed {
57      .pf-treetable-gutter {
58        &::before {
59          rotate: 0deg;
60        }
61      }
62    }
63  }
64}
65