You can copy past below code in your app editor css section if you want to customize Awesome forms or use this code as reference for other pages customization

Note: This CSS might not work, we have kept it for your reference.

//hide home bootom img
.awesome-forms .awesome-bg:after {
display:none;}


//change home bootom img
.awesome-forms .awesome-bg:after {
background-image:url('https://img.freepik.com/free-vector/businessman-holding-pencil-big-complete-checklist-with-tick-marks_1150-35019.jpg?w=1380&t=st=1697104049~exp=1697104649~hmac=ef526867422c025565339c6a9d8aeab837d95224b5f36de876d3dd21c2d7e7fd')!important;
height:250px; // set img height as per your requirements
width:100%; //set img width as per your requirements
}



//hide  lable on top of table
.awesome-forms .table thead tr:nth-child(odd) {display:none;}



//hide  search filter field on top of table
.awesome-forms .table tr:nth-child(even){
  display:none
}
.awesome-forms .scroll-view.scroll-xy,.awesome-forms .table{
width:100%;
}



//changing text on add button
.awesome-forms button.button.btn-add::after {
content: 'Text Change';
font-size: 15px;
   top: -1px;
  bottom: 0;
 left: 15px;

}
.awesome-forms button.button.btn-add{
font-size:0px;
 min-width:130px!important; // set as per your text
}



// for hiding awesome-forms add-new form screen (top) img*
ion-view[state="awesomeforms-view"].awesome-forms .description:after{
  display: none;
}
ion-view[state="awesomeforms-view"].awesome-forms .description {
  min-height: auto;}



//changea dd-new form screen (top) img
ion-view[state="awesomeforms-view"].awesome-forms .description:after {
background-image:url('https://img.freepik.com/free-vector/businessman-holding-pencil-big-complete-checklist-with-tick-marks_1150-35019.jpg?w=1380&t=st=1697104049~exp=1697104649~hmac=ef526867422c025565339c6a9d8aeab837d95224b5f36de876d3dd21c2d7e7fd')!important;
height:250px; // set img height as per your requirements
width:100%; //set img width as per your requirements
}
ion-view[state="awesomeforms-view"].awesome-forms .description {
  min-height: 250px; // set img height same as above img height
}

Code below is for very OLD version UI – if you are not updated

//hide graph

ion-view[state=”awesomeforms-list”] .item-custom img {display:none};
ion-view[state=”awesomeforms-list”] [class=”item item-custom item-select”] {display:none};

//hide field lable on top of table
ion-view[state=”awesomeforms-list”] .list:nth-child(2) {display:none};

// hide table data

ion-view[state=”awesomeforms-list”] [class=”table container ng-table”] {display:none};
ion-view[state=”awesomeforms-list”] [class=”ng-table-counts btn-group pull-right”] {display:none};
ion-view[state=”awesomeforms-list”] [class=”ng-binding”] {display:none};

//changing text on add button
ion-view[state=”awesomeforms-list”] button.button.button-block.button-custom.ng-binding::after {
content: “Add new Member”;
font-size: 15px;
}
ion-view[state=”awesomeforms-list”] button.button.button-block.button-custom.ng-binding{
font-size:0px;
}

//css for hiding any cloumn in table , change the number to fit your need

//hide header
ion-view[state="awesomeforms-list"] .table th:nth-child(2){
display: none;
}
//hide other rows of column
ion-view[state="awesomeforms-list"] .table td:nth-child(2) {
display: none;
}