/* Copyright 2012 The Chromium Authors
* Use of this source code is governed by a BSD-style license that can be
* found in the LICENSE file. */
#sync-search-query {
width: 16em;
}
#sync-search-query[error] {
background-color: rgb(255,170,170);
}
.sync-search-quicklink {
background-color: rgb(239,243,255);
padding-inline-end: 10px;
padding-inline-start: 10px;
}
#sync-search-status {
color: rgb(51,51,51);
font-style: italic;
}
#sync-results-container {
display: flex;
/* Should be > #sync-page's min-height. */
/* TODO(akalin): Find a less hacky way to do this. */
height: 750px;
}
#sync-results-list {
box-sizing: border-box;
display: block;
height: 100%;
margin: 0;
/* min-width and max-width are used by the split pane. */
max-width: 50%;
min-width: 50px;
outline: none;
overflow: auto;
padding: 5px;
position: relative; /* Make sure that item offsets are relative to the
list. */
width: 275px;
}
#sync-results-splitter {
background-color: rgb(235, 239, 249);
cursor: col-resize;
<if expr="is_win">
/* TODO(akalin): Make the BMM also use this style. */
cursor: e-resize;
</if>
width: 5px;
}
#sync-result-details-container {
flex: 1;
height: 100%;
overflow: auto;
/* TODO(akalin): Figure out why this is needed, even with box-flex: 1. */
width: 100%;
}
html {
--transparent-white: rgba(255, 255, 255, 0);
}
li {
background-color: var(--transparent-white);
border: 1px solid var(--transparent-white);
border-radius: 2px;
cursor: default;
display: block;
line-height: 20px;
overflow: hidden;
padding: 0 3px;
position: relative; /* to allow overlap */
text-overflow: ellipsis;
user-select: none;
white-space: pre;
}
li:hover {
background-color: hsl(214, 91%, 97%);
border-color: hsl(214, 91%, 85%);
z-index: 1;
}
li[selected] {
background-color: hsl(0, 0%, 90%);
background-image: linear-gradient(rgba(255, 255, 255, 0.8),
var(--transparent-white));
border-color: hsl(0, 0%, 85%);
z-index: 2;
}
#sync-results-list:focus > li[selected],
li[selected]:hover {
background-color: hsl(214, 91%, 87%);
border-color: hsl(214, 91%, 65%);
}