Skip to content
Permalink
Browse files

fix(searchbar): allow setting of toolbar color and searchbar color (#…

…17474)

* fix(searchbar): allow setting of toolbar color and searchbar color

* fix test label typo
  • Loading branch information...
liamdebeasi committed Feb 12, 2019
1 parent f9cc2c5 commit ba4e117e558736c9c0ab50e8dc4207dcca470a14
@@ -156,11 +156,11 @@
// Searchbar in Toolbar Color
// -----------------------------------------

:host-context(ion-toolbar.ion-color) {
:host-context(ion-toolbar.ion-color):not(.ion-color) {
color: inherit;
}

:host-context(ion-toolbar.ion-color) .searchbar-cancel-button {
:host-context(ion-toolbar.ion-color):not(.ion-color) .searchbar-cancel-button {
color: currentColor;
}

@@ -170,13 +170,13 @@
opacity: $searchbar-ios-input-icon-opacity;
}

:host-context(ion-toolbar.ion-color) .searchbar-input {
:host-context(ion-toolbar.ion-color):not(.ion-color) .searchbar-input {
background: rgba(var(--ion-color-contrast-rgb), $searchbar-ios-input-background-color-alpha);
color: currentColor;
}

:host-context(ion-toolbar.ion-color) .searchbar-clear-button {
:host-context(ion-toolbar.ion-color):not(.ion-color) .searchbar-clear-button {
color: currentColor;

opacity: $searchbar-ios-input-icon-opacity;
}
}
@@ -78,6 +78,11 @@ <h5 padding-start padding-top> Search - Dark Toolbar </h5>
<ion-toolbar color="dark">
<ion-searchbar show-cancel-button placeholder="Filter Schedules"></ion-searchbar>
</ion-toolbar>

<h5 padding-start padding-top> Search - Dark Toolbar, Primary Search </h5>
<ion-toolbar color="dark">
<ion-searchbar show-cancel-button color="primary" placeholder="Filter Schedules"></ion-searchbar>
</ion-toolbar>

<ion-grid>
<ion-row>
@@ -138,4 +143,4 @@ <h5 padding-start padding-top> Search - Dark Toolbar </h5>
</style>
</body>

</html>
</html>

0 comments on commit ba4e117

Please sign in to comment.
You can’t perform that action at this time.