Как настроить размеры столбцов таблицы на страницах индекса ActiveAdmin? - PullRequest
1 голос
/ 13 декабря 2011

Я пытаюсь настроить индексные страницы в разделе администратора, который я создал с помощью ActiveAdmin. Я хочу установить размер для каждого столбца в CSS2.

ActiveAdmin создает макет как:

<table [...] class="index_table">
  <thead>
    <tr>
      <th class="sortable"><a href="#">Field 1</a></th>
      <th class="sortable"><a href="#">Field 2</a></th>
      <th class="sortable"><a href="#">Field 3</a></th>
      <th class="sortable"><a href="#">Field 4</a></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>value 1</td>
      <td>value 2</td>
      <td>value 3</td>
      <td>value 4</td>
    </tr>
  </tbody>
</table>

Я хочу добавить класс или идентификатор для каждого <th> раздела, как:

<table [...] class="index_table">
  <thead>
    <tr>
      <th class="first sortable"><a href="#">Field 1</a></th>
      <th class="second sortable"><a href="#">Field 2</a></th>
      <th class="third sortable"><a href="#">Field 3</a></th>
      <th class="fourth sortable"><a href="#">Field 4</a></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>value 1</td>
      <td>value 2</td>
      <td>value 3</td>
      <td>value 4</td>
    </tr>
  </tbody>
</table>

Может быть, это не самый лучший способ сделать это?

Любая помощь приветствуется ...

1 Ответ

3 голосов
/ 13 декабря 2011

Хорошо, вот способ сделать это:

В active_admin.css.scss вы можете добавить несколько стилей для настройки индекса модели заголовка, например:

body.admin_headlines table.index_table thead tr th:nth-child(1) {
  width: 100px !important;
}

body.admin_headlines table.index_table thead tr th:nth-child(2) {
  width: 200px !important;
}

Ии так далее ...

...