gristlabs_grist-core/app/client/components/SearchBar.css
Paul Fitzpatrick 1654a2681f (core) move client code to core
Summary:
This moves all client code to core, and makes minimal fix-ups to
get grist and grist-core to compile correctly.  The client works
in core, but I'm leaving clean-up around the build and bundles to
follow-up.

Test Plan: existing tests pass; server-dev bundle looks sane

Reviewers: dsagal

Reviewed By: dsagal

Differential Revision: https://phab.getgrist.com/D2627
2020-10-02 13:24:21 -04:00

74 lines
1.4 KiB
CSS

.searchbar-box.grist-navbar-pfx.part-toolbar-group__item {
display: flex;
width: 15rem;
padding: 0;
color: grey;
}
.searchbar-box.grist-navbar-pfx.part-toolbar-group__item:focus-within {
box-shadow: 0 0 3px 2px var(--grist-color-cursor);
color: black;
}
.searchbar-box.grist-navbar-pfx.part-toolbar-group__item:hover {
/* undo the effect of hover in .part-toolbar-group__item */
background-color: var(--color-navbar-btn-bg);
}
.searchbar-button.grist-navbar-pfx.part-toolbar-group__item {
padding: 0 3px;
}
.searchbar-icon {
flex: none;
font-size: 1.2rem;
color: grey;
margin: 0 2px 0 4px;
top: 2px;
line-height: inherit;
}
.searchbar-icon-indicator {
animation: searchbar_flip 1s ease-in-out infinite;
}
.searchbar-input {
display: block;
border: none;
outline: none;
background-color: transparent;
height: 22px;
min-width: 0;
}
.searchbar-buttons {
flex: none;
align-self: center;
margin: 0 2px 0 0 !important;
}
.searchbar-buttons > .kf_button {
height: 1.6rem;
padding: 0.3rem 0.6rem;
}
.searchbar-buttons > .disabled {
opacity: 0.5;
}
@keyframes searchbar_flip {
0% { transform: scaleX(1); }
50% { transform: scaleX(-1); }
100% { transform: scaleX(1); }
}
/* applies to the cursor element, added and quickly removed to trigger a highlight animation */
.selected_cursor {
transition: background-color 500ms linear;
}
.search-match {
transition: none;
background-color: rgba(0, 255, 0, 0.4);
}