xref: /aosp_15_r20/external/perfetto/ui/src/assets/widgets/theme.scss (revision 6dbdd20afdafa5e3ca9b8809fa73465d530080dc)
1*6dbdd20aSAndroid Build Coastguard Worker// Copyright (C) 2023 The Android Open Source Project
2*6dbdd20aSAndroid Build Coastguard Worker//
3*6dbdd20aSAndroid Build Coastguard Worker// Licensed under the Apache License, Version 2.0 (the "License");
4*6dbdd20aSAndroid Build Coastguard Worker// you may not use this file except in compliance with the License.
5*6dbdd20aSAndroid Build Coastguard Worker// You may obtain a copy of the License at
6*6dbdd20aSAndroid Build Coastguard Worker//
7*6dbdd20aSAndroid Build Coastguard Worker//      http://www.apache.org/licenses/LICENSE-2.0
8*6dbdd20aSAndroid Build Coastguard Worker//
9*6dbdd20aSAndroid Build Coastguard Worker// Unless required by applicable law or agreed to in writing, software
10*6dbdd20aSAndroid Build Coastguard Worker// distributed under the License is distributed on an "AS IS" BASIS,
11*6dbdd20aSAndroid Build Coastguard Worker// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12*6dbdd20aSAndroid Build Coastguard Worker// See the License for the specific language governing permissions and
13*6dbdd20aSAndroid Build Coastguard Worker// limitations under the License.
14*6dbdd20aSAndroid Build Coastguard Worker
15*6dbdd20aSAndroid Build Coastguard Worker// Standard theme settings for widgets
16*6dbdd20aSAndroid Build Coastguard Worker
17*6dbdd20aSAndroid Build Coastguard Worker$pf-font: "Roboto Condensed", sans-serif;
18*6dbdd20aSAndroid Build Coastguard Worker$pf-border-radius: 2px;
19*6dbdd20aSAndroid Build Coastguard Worker$pf-anim-timing: 150ms cubic-bezier(0.4, 0, 0.2, 1);
20*6dbdd20aSAndroid Build Coastguard Worker
21*6dbdd20aSAndroid Build Coastguard Worker// Here we describe two colour schemes: primary and minimal
22*6dbdd20aSAndroid Build Coastguard Worker// It is assumed widgets exist on a light background
23*6dbdd20aSAndroid Build Coastguard Worker// Primary is to be used for things like buttons and checkboxes
24*6dbdd20aSAndroid Build Coastguard Worker// Minimal is to be used for things like inputs and labels
25*6dbdd20aSAndroid Build Coastguard Worker// Some controls (i.e. checkboxes) may mix and match both in the same widget.
26*6dbdd20aSAndroid Build Coastguard Worker// Other controls might use the primary scheme by default, but have a minimal
27*6dbdd20aSAndroid Build Coastguard Worker// configuration which makes them use the minimal colour scheme.
28*6dbdd20aSAndroid Build Coastguard Worker
29*6dbdd20aSAndroid Build Coastguard Worker$pf-primary-foreground: #fff;
30*6dbdd20aSAndroid Build Coastguard Worker$pf-primary-foreground-disabled: #aaa;
31*6dbdd20aSAndroid Build Coastguard Worker$pf-primary-border: #31466f;
32*6dbdd20aSAndroid Build Coastguard Worker$pf-primary-background: #3d5688;
33*6dbdd20aSAndroid Build Coastguard Worker$pf-primary-background-hover: #4966a2;
34*6dbdd20aSAndroid Build Coastguard Worker$pf-primary-background-active: #243e71;
35*6dbdd20aSAndroid Build Coastguard Worker$pf-primary-background-disabled: #666;
36*6dbdd20aSAndroid Build Coastguard Worker
37*6dbdd20aSAndroid Build Coastguard Worker$pf-minimal-foreground: #19212b;
38*6dbdd20aSAndroid Build Coastguard Worker$pf-minimal-foreground-disabled: #aaa;
39*6dbdd20aSAndroid Build Coastguard Worker$pf-minimal-border: #aaa;
40*6dbdd20aSAndroid Build Coastguard Worker$pf-minimal-background: none;
41*6dbdd20aSAndroid Build Coastguard Worker$pf-minimal-background-hover: #0001;
42*6dbdd20aSAndroid Build Coastguard Worker$pf-minimal-background-active: #0002;
43*6dbdd20aSAndroid Build Coastguard Worker$pf-minimal-background-disabled: none;
44*6dbdd20aSAndroid Build Coastguard Worker
45*6dbdd20aSAndroid Build Coastguard Worker$pf-colour-thin-border: #aaa;
46*6dbdd20aSAndroid Build Coastguard Worker
47*6dbdd20aSAndroid Build Coastguard Worker@mixin focus {
48*6dbdd20aSAndroid Build Coastguard Worker  outline: 2px auto #64b5f6;
49*6dbdd20aSAndroid Build Coastguard Worker}
50