blob: f49057a4406d3ff0fae840cc83dc55cf3e301159 [file] [log] [blame]
/*
* Copyright (C) 2006, 2007, 2008 Apple Inc. All rights reserved.
* Copyright (C) 2009 Anthony Ricaud <rik@webkit.org>
*
* Redistribution and use in source and binary forms, with or without
* modification, are permitted provided that the following conditions
* are met:
*
* 1. Redistributions of source code must retain the above copyright
* notice, this list of conditions and the following disclaimer.
* 2. Redistributions in binary form must reproduce the above copyright
* notice, this list of conditions and the following disclaimer in the
* documentation and/or other materials provided with the distribution.
* 3. Neither the name of Apple Computer, Inc. ("Apple") nor the names of
* its contributors may be used to endorse or promote products derived
* from this software without specific prior written permission.
*
* THIS SOFTWARE IS PROVIDED BY APPLE AND ITS CONTRIBUTORS "AS IS" AND ANY
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
* WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
* DISCLAIMED. IN NO EVENT SHALL APPLE OR ITS CONTRIBUTORS BE LIABLE FOR ANY
* DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
* (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
* LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
* ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
* (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF
* THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*/
:root {
height: 100%;
overflow: hidden;
}
:root {
--accent-color: #1a73e8;
--accent-fg-color: #1a73e8;
--accent-color-hover: #3b86e8;
--active-control-bg-color: #5a5a5a;
--focus-bg-color: hsl(214, 40%, 92%);
--input-validation-error: #db1600;
--toolbar-bg-color: #f3f3f3;
--toolbar-hover-bg-color: #eaeaea;
--selection-fg-color: white;
--selection-inactive-fg-color: #5a5a5a;
--selection-inactive-bg-color: #dadada;
--tab-selected-fg-color: #333;
--tab-selected-bg-color: var(--toolbar-bg-color);
--drop-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05),
0 2px 4px rgba(0, 0, 0, 0.2),
0 2px 6px rgba(0, 0, 0, 0.1);
--divider-color: #d0d0d0;
--focus-ring-inactive-shadow: 0 0 0 1px #e0e0e0;
--item-selection-bg-color: #cfe8fc;
--item-selection-inactive-bg-color: #e0e0e0;
}
.-theme-with-dark-background {
--accent-color: #0e639c;
--accent-fg-color: #cccccc;
--accent-color-hover: rgb(17, 119, 187);
--active-control-bg-color: #cdcdcd;
--focus-bg-color: hsl(214, 19%, 27%);
--toolbar-bg-color: #333333;
--toolbar-hover-bg-color: #202020;
--selection-fg-color: #cdcdcd;
--selection-inactive-fg-color: #cdcdcd;
--selection-inactive-bg-color: hsl(0, 0%, 28%);
--tab-selected-fg-color: #eaeaea;
--tab-selected-bg-color: black;
--drop-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2),
0 2px 4px 2px rgba(0, 0, 0, 0.2),
0 2px 6px 2px rgba(0, 0, 0, 0.1);
--divider-color: #525252;
--focus-ring-inactive-shadow: 0 0 0 1px #5a5a5a;
--item-selection-bg-color: hsl(207, 88%, 22%);
--item-selection-inactive-bg-color: #454545;
}
:root {
--focus-ring-active-shadow: 0 0 0 1px var(--accent-color);
--selection-bg-color: var(--accent-color);
--divider-border: 1px solid var(--divider-color);
--item-hover-color: rgba(56, 121, 217, 0.1);
}
body {
height: 100%;
width: 100%;
position: relative;
overflow: hidden;
margin: 0;
cursor: default;
font-family: '.SFNSDisplay-Regular', 'Helvetica Neue', 'Lucida Grande', sans-serif;
font-size: 12px;
tab-size: 4;
user-select: none;
color: #222;
background: white;
}
.platform-linux {
color: rgb(48, 57, 66);
font-family: Roboto, Ubuntu, Arial, sans-serif;
}
.platform-mac {
color: rgb(48, 57, 66);
font-family: '.SFNSDisplay-Regular', 'Helvetica Neue', 'Lucida Grande', sans-serif;
}
.platform-windows {
font-family: 'Segoe UI', Tahoma, sans-serif;
}
.panel {
display: flex;
overflow: hidden;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 0;
background-color: white;
}
.panel-sidebar {
overflow-x: hidden;
background-color: var(--toolbar-bg-color);
}
iframe.extension {
flex: auto;
width: 100%;
height: 100%;
}
iframe.panel.extension {
display: block;
height: 100%;
}