doneit-web/src/app/shared/chat/new-group/new-group.page.scss

@import '~src/function.scss';

ion-content{
    --background:transparent;
}
.header-toolbar{
   --background:transparent;
   --opacity: 1;
}
.div-top-header{
    width: 400px;
    margin: 0 auto;
    background-color: #0782c9;
    overflow: auto;
    padding-top: 15px;
    border: 0!important;

    .div-search{
      font-size: rem(45);
      float: left;
      margin: 0 0 0 10px
    }
    .div-logo{
      background: transparent;
      width: 140px;
      margin: 5px 0 0px 71px;
      float: left;
    }
    .div-logo img{
      width: 100%;
    }
    .div-profile{
      font-size: rem(45);
      float: right;
      margin-right: 10px;
    }
    
  }
  .main-header{
    width: 100%; /* 400px */
    height: 100%;
    font-family: Roboto;
    border-top-left-radius: 25px;
    border-top-right-radius: 25px;
    background-color: #fff;
    overflow:hidden;
    padding: 30px 20px 0px 20px;
    color:#000;
    transform: translate3d(0, 1px, 0);
    
    .title-content{
      //width: 360px;
      margin: 0px auto;
      overflow: auto;
      padding: 0 !important;
      background: #fff;

      .left{
        width: 37px;
        float: left;
        font-size: rem(35);
        overflow: auto;
       }
       .middle{
        padding: 0!important;
        float: left;
        width: 221px;
        //margin: 2.5px 0 0 5px;
      }
      .btn-criar{
        padding: 0!important;
        float: right;
        font-size: rem(15);
        color: var(--font-awesome);
        margin: 8px 5px 0 5px;
      }
      .right{
        padding: 0!important;
        float: right;
        font-size: rem(15);
        color: #0782c9;
        margin: 8px 0 0 5px;
      }
    }

    .title{
      font-size: rem(25);
    }
    .div-icon{
      width: rem(40);
      float: right;
      font-size: rem(35);
      overflow: auto;
      padding: 1px;
    }
    .div-icon ion-icon{
      float: right;
      padding-left: 20px;
    }
    
 
  }
  .main-content{
    width: 100%; /* 400px */
    height: 100%;
    font-family: Roboto;
    margin: 0 auto;
    background-color: #fff;
    overflow:auto;
    padding: 15px 20px 0 20px;

    .item-container{
        //width: 360px;
        margin: 15px auto;
        border: 1px solid #ebebeb;
        border-radius: 5px;
        padding-left: 10px;
      }

      .item-container-no-border{
        display: flex;
        //width: 360px;
        margin: 25px auto;
        border-radius: 5px;
        align-items: center;
      }

      .item-container-no-border ion-label{
          padding-left: 10px;
          font-size: rem(12);
          color: #000;
      }
  }

  .container-div{
    width: 100%;
    margin-bottom: 15px;
    overflow: auto;

    .ion-item-class-2{
        width: 100%;
        margin: 0px auto;

        .ion-icon-class{
            width: 5%;
            height: rem(45);
            float: left;
            padding: 10px;
            font-size: rem(25);
          }
      }
      .ion-input-class{
        width: 93%;
        height: rem(45);
        border: 1px solid #ebebeb;
        border-radius: 5px;
        padding-left: 5px;
        padding-right: 10px;
        margin-left: 2%;
        float: left;
      }
  }