Style does not effect input


#1

Hi,

I am trying a login page for my app. But style does not work as I wish, here is the photo from problem

Here is the html codes

<ion-content class="app-content padding main-bg text-center">
  <div class="logo animated pulse infinite">
      <img src="../../assets/imgs/logo1.png" />
  </div>
  <form class="app-form">
      <div class="list list-inset">
          <label class="item item-input sec-main-text">
              <input type="text" class="text-center" placeholder="username">
          </label>
          <label class="item item-input sec-main-text">
              <input type="password" class="text-center" placeholder="Password">
          </label>
      </div>
      <button class="button button-block button-clear main-btn main-bg-color" ng-click="goto('/app/home')">Login</button>
      <a href="#/register" class="main-text-color">Register</a>
      <p class="forget" ng-click="forget_password()">Forget Password?</p>
  </form>
</ion-content>

And scss codes

  .app-form .list-inset {
    margin-left: 0;
    margin-right: 0;
    background: none;
  }

.app-form {
    .item-input {
      margin-bottom: 20px;
      background: none;
      border: 1px solid;
      border-radius: 30px;
      padding: 5px 10px;
    }
    .list-inset .item {
      border-radius: 30px;
      height: 46px;
      &.item-input input {
        padding: 0;
        color: white;
      }
    }
    input {
      &::-webkit-input-placeholder, &:-moz-placeholder {
        color: white;
        text-transform: capitalize;
      }
    }
  }


.app-form .item-select {
    select {
      width: 100%;
      max-width: 100%;
      background: none;
      text-align-last: center;
      padding: 0;
      text-align: -moz-center;
      text-align: -webkit-center;
      text-align-last: -moz-center;
      text-align-last: -webkit-center;
      direction: ltr;
    }
    &:after {
      top: 60%;
      right: 55px;
    }
  }

And what I want :slight_smile:

!!!UPLOAD!!!

Here is the one more photo from browser (original html file)

And my app’s


#2

Did you check the sass variables for ion-input?


#3

I checked some values, but I couldn’t find any problem. Maybe you can say where must I check? Thank you