• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1// Copyright (C) 2025 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.explore-page {
16  position: relative;
17  overflow: auto;
18  padding: 0.25rem;
19
20  &__header {
21    display: flex;
22    align-items: center;
23  }
24
25  .pf-chart-card {
26    border-radius: $pf-border-radius;
27    border: solid 1px $pf-colour-thin-border;
28    display: grid;
29    grid-template-columns: repeat(3, 1fr);
30
31    &__chart {
32      grid-row: 2;
33      grid-column: 1 / 4;
34    }
35
36    &__button {
37      grid-column: 4;
38      grid-row: 1;
39    }
40  }
41
42  .pf-vertical-split-container {
43    display: flex;
44    flex-direction: row;
45    height: 100%;
46
47    &__left-pane {
48      position: relative;
49      display: flex;
50      flex-direction: row;
51
52      &__content {
53        flex: 1;
54        overflow: auto;
55      }
56
57      &__resize-handle {
58        display: block;
59        height: 100%;
60        width: 5px;
61        background-color: darkgrey;
62
63        // Ensures that the resize-handler is overlayed
64        // on top of content and stays in a fixed
65        // position at the right of the left-pane
66        z-index: 2;
67        position: absolute;
68        right: 0;
69        cursor: col-resize;
70      }
71    }
72
73    &__right-pane {
74      flex: 1;
75    }
76  }
77
78  &__rowish {
79    position: relative;
80    display: flex;
81    flex-direction: row;
82
83    & > * {
84      width: 50%;
85    }
86  }
87
88  &__columnar {
89    position: relative;
90  }
91}
92
93.pf-column-controller-fixed-size {
94  max-height: 300px;
95}
96
97.pf-column-controller-panel {
98  font-family: $pf-font;
99  display: flex;
100  flex-direction: column;
101  align-items: stretch;
102  width: 280px;
103  & > .pf-search-bar {
104    margin-bottom: 8px;
105    display: flex;
106    & > .pf-search-box {
107      flex-grow: 1;
108    }
109  }
110  .pf-column-controller-item {
111    // display: block; // Put each item on a new line
112    margin-top: 5px;
113  }
114
115  .pf-column-controller-item-on-hover {
116    float: right;
117  }
118
119  .pf-column-controller-header {
120    align-items: baseline;
121    display: flex;
122    position: sticky;
123    top: 0;
124    font-size: 1em;
125    z-index: 1;
126    font-size: 0.75em;
127    padding-bottom: 2px;
128    min-width: max-content;
129    margin-right: auto;
130  }
131  .pf-column-controller-container {
132    position: relative;
133    margin-bottom: 16px;
134  }
135}
136