bug(angular | searchbar): placeholder font-size is not getting applied

[indraraj26]

Bug Report

Ionic version:

[ ] 4.x [x] 5.x

Current behavior:

placeholder font-size is not getting applied on searchbar even i placed css on global.scss home.component.html

    <ion-searchbar
        placeholder="Searchbar placeholder"
        class="search-foo"
    ></ion-searchbar>

home.component.css

.searchbar-foo .searchbar-input-container input::placeholder {
    font-size: 5px;
    color: rebeccapurple;
}

global.scss

.searchbar-foo .searchbar-input-container input::placeholder {
    font-size: 5px;
    color: rebeccapurple;
}

Expected behavior:

It should apply font-size on placeholder on searchbar

Steps to reproduce:

Related code:

Repo: https://github.com/indraraj26/ionic5-starter-tabs-sidemenu/tree/searchbar-placeholder-test Branch: searchbar-placeholder-test

Other information:

Ionic info:

ionic info

Ionic:

   Ionic CLI                     : 5.4.4 (C:\Users\indra26\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework               : @ionic/angular 5.3.1
   @angular-devkit/build-angular : 0.901.4
   @angular-devkit/schematics    : 9.1.4
   @angular/cli                  : 9.1.4
   @ionic/angular-toolkit        : 2.3.0

Cordova:

   Cordova CLI       : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms : android 8.1.0
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.2.1, (and 5 other plugins)

Utility:

   cordova-res : 0.8.0 (update available: 0.15.1)
   native-run  : 0.2.9 (update available: 1.0.0)

System:

   NodeJS : v10.16.3 (C:\Program Files\nodejs\node.exe)
   npm    : 6.9.0
   OS     : Windows 10

[liamdebeasi]

Thanks for the issue. I am going to close this as this is not a bug in Ionic Framework. You are targeting the wrong class. You need to target .search-foo, not .searchbar-foo like you have in your repo.

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.