Added align property to list columns definition (#3509)

Documented in https://github.com/octobercms/docs/pull/289; credit to @tobias-kuendig
This commit is contained in:
Tobias Kündig 2018-04-18 07:34:08 +02:00 committed by Luke Towers
parent 5acbdb12fe
commit 2b22b26676
5 changed files with 37 additions and 2 deletions

View File

@ -91,6 +91,11 @@ class ListColumn
*/
public $path;
/**
* @var string Specifies the alignment of this column.
*/
public $align;
/**
* @var array Raw field configuration.
*/
@ -163,6 +168,9 @@ class ListColumn
if (isset($config['path'])) {
$this->path = $config['path'];
}
if (isset($config['align']) && \in_array($config['align'], ['left', 'right', 'center'])) {
$this->align = $config['align'];
}
return $config;
}
@ -194,6 +202,15 @@ class ListColumn
return HtmlHelper::nameToId($id);
}
/**
* Returns the column specific aligment css class.
* @return string
*/
public function getAlignClass()
{
return $this->align ? 'list-cell-align-' . $this->align : '';
}
/**
* Returns this columns value from a supplied data set, which can be
* an array or a model or another generic collection.

View File

@ -18,7 +18,7 @@
<?php $index = $url = 0; foreach ($columns as $key => $column): ?>
<?php $index++; ?>
<td class="list-cell-index-<?= $index ?> list-cell-name-<?= $column->getName() ?> list-cell-type-<?= $column->type ?> <?= $column->clickable ? '' : 'nolink' ?> <?= $column->cssClass ?>">
<td class="list-cell-index-<?= $index ?> list-cell-name-<?= $column->getName() ?> list-cell-type-<?= $column->type ?> <?= $column->clickable ? '' : 'nolink' ?> <?= $column->getAlignClass() ?> <?= $column->cssClass ?>">
<?php if ($column->clickable && !$url && ($url = $this->getRecordUrl($record))): ?>
<a <?= $this->getRecordOnClick($record) ?> href="<?= $url ?>">
<?= $this->getColumnValue($record, $column) ?>

View File

@ -18,7 +18,7 @@
<?php if ($showSorting && $column->sortable): ?>
<th
<?php if ($column->width): ?>style="width: <?= $column->width ?>"<?php endif ?>
class="<?= $this->sortColumn==$column->columnName?'sort-'.$this->sortDirection.' active':'sort-desc' ?> list-cell-name-<?= $column->getName() ?> list-cell-type-<?= $column->type ?>"
class="<?= $this->sortColumn==$column->columnName?'sort-'.$this->sortDirection.' active':'sort-desc' ?> list-cell-name-<?= $column->getName() ?> list-cell-type-<?= $column->type ?> <?= $column->getAlignClass() ?>"
>
<a
href="javascript:;"

View File

@ -290,6 +290,21 @@ table.table.data {
text-align: right;
}
th.list-cell-align-left,
td.list-cell-align-left {
text-align: left;
}
th.list-cell-align-right,
td.list-cell-align-right {
text-align: right;
}
th.list-cell-align-center,
td.list-cell-align-center {
text-align: center;
}
//
// Labels
//

View File

@ -2665,6 +2665,9 @@ table.table.data tfoot a{color:#666666;text-decoration:none}
table.table.data tfoot td,table.table.data tfoot th{border-color:#d4d8da;padding:10px 15px}
table.table.data th.list-cell-type-switch,table.table.data td.list-cell-type-switch{text-align:center}
table.table.data th.list-cell-type-number,table.table.data td.list-cell-type-number{text-align:right}
table.table.data th.list-cell-align-left,table.table.data td.list-cell-align-left{text-align:left}
table.table.data th.list-cell-align-right,table.table.data td.list-cell-align-right{text-align:right}
table.table.data th.list-cell-align-center,table.table.data td.list-cell-align-center{text-align:center}
table.table.data .list-badge{display:inline-block;position:relative;top:0;margin:0 5px 0 0;padding:1px 0 0 0;font-size:10px;width:15px;height:15px;text-align:center;border-radius:3px;color:#fff}
table.table.data .list-badge > i{position:relative;top:-1px}
table.table.data .list-badge.badge-default{background:#999999}