akveo/ngx-admin

ng2-smart-table dropdown filter or editor gets bigger than text inputs.

Open

#1827 opened on Aug 19, 2018

View on GitHub
 (8 comments) (3 reactions) (0 assignees)TypeScript (24,990 stars) (7,916 forks)batch import
help wanted

Description

Hi everyone. I'm facing an styling issue on ng2-smart-table.

  • bug report
  • feature request
  • question about the decisions made in the repository

Issue description

When setting.column.filter.type or setting.column.editor.type set to list, the size of dropdown gets bigger than text inputs like image below. image

Steps to reproduce: Simply changing type to list like this.

settings: {
   columns: {
      age: {
        title: 'Age',
        editor: {
          type: 'list',
          config: {
            selectText: 'Select',
            list: [
              {value: '1', title:'Option 1'},
              {value: '2', title:'Option 2'},
              {value: '3', title:'Option 3'},
              {value: '4', title:'Option 4'},
            ],
          },
        }
        filter: {
          type: 'list',
          config: {
            selectText: 'Select',
            list: [
              {value: '1', title:'Option 1'},
              {value: '2', title:'Option 2'},
              {value: '3', title:'Option 3'},
              {value: '4', title:'Option 4'},
            ],
          },
        },
      },
   }
}

I fixed this problem using these CSS:

.ng2-smart-filter select {
  height: calc(2rem + 4px) !important;
  padding: 0 10px !important;
}

table-cell-default-editor select-editor select {
  height: calc(2rem + 8px) !important;
  padding: 0 10px !important;
}

and here is the result. screenshot1

but I'm not sure if it's the best way.

I will be very happy if I know that how can I fix this issue on main project.

Contributor guide