Cut text off before the buttons in the dashboard edit list instead of having it fall on the next line

This commit is contained in:
Kevin MacMartin 2018-01-21 22:47:59 -05:00
parent 315a4893ec
commit 45e84497f1
2 changed files with 44 additions and 36 deletions

View file

@ -265,7 +265,16 @@ body {
@media (max-width: $screen-xs-max) { @media (max-width: $screen-xs-max) {
margin: 3px; margin: 3px;
padding-left: 60px; }
@media (min-width: $screen-sm-min) {
display: flex;
}
&.sortable {
@media (max-width: $screen-xs-max) {
padding-left: 50px;
}
} }
.title-column { .title-column {
@ -279,7 +288,9 @@ body {
} }
@media (min-width: $screen-sm-min) { @media (min-width: $screen-sm-min) {
float: left; overflow: hidden;
flex-grow: 1;
white-space: nowrap;
} }
.sort-icon { .sort-icon {
@ -316,15 +327,16 @@ body {
.button-column { .button-column {
padding-right: 0px; padding-right: 0px;
padding-left: 0px;
@media (max-width: $screen-xs-max) { @media (max-width: $screen-xs-max) {
padding-bottom: 5px; padding-bottom: 5px;
padding-left: 0px;
text-align: center; text-align: center;
} }
@media (min-width: $screen-sm-min) { @media (min-width: $screen-sm-min) {
float: right; padding-left: 5px;
flex-shrink: 0;
text-align: right; text-align: right;
} }

View file

@ -20,43 +20,39 @@
<ul id="edit-list" class="list-group edit-list list" data-model="{{ $model }}" data-path="{{ isset($path) ? $path : $model }}" {{ $sortcol != false ? "data-sort=$sortcol" : '' }}> <ul id="edit-list" class="list-group edit-list list" data-model="{{ $model }}" data-path="{{ isset($path) ? $path : $model }}" {{ $sortcol != false ? "data-sort=$sortcol" : '' }}>
@foreach($rows as $row) @foreach($rows as $row)
<li class="list-group-item" data-id="{{ $row['id'] }}"> <li class="list-group-item {{ $sortcol != false ? 'sortable' : '' }}" data-id="{{ $row['id'] }}">
<div class="container-fluid"> <div class="title-column">
<div class="row"> @if($sortcol != false)
<div class="title-column"> <div class="sort-icon">
@if($sortcol != false) <i class="fa fa-bars" title="Click and drag to reorder"></i>
<div class="sort-icon">
<i class="fa fa-bars" title="Click and drag to reorder"></i>
</div>
@endif
@if(is_array($column))
@foreach($column as $col)
@if($row[$col] != '')
<div class="column">{{ $row[$col] }}</div>
@if(!$loop->last)
<div class="spacer">|</div>
@endif
@endif
@endforeach
@else
{{ $row[$column] }}
@endif
</div> </div>
@endif
<div class="button-column"> @if(is_array($column))
@if(isset($button) && is_array($button)) @foreach($column as $col)
<button type="button" class="action-button btn btn-default" data-confirmation="{{ $button[1] }}" data-success="{{ $button[2] }}" data-error="{{ $button[3] }}" data-url="{{ $button[4] }}">{{ $button[0] }}</button> @if($row[$col] != '')
<div class="column">{{ $row[$col] }}</div>
@if(!$loop->last)
<div class="spacer">|</div>
@endif
@endif @endif
@endforeach
@else
{{ $row[$column] }}
@endif
</div>
<button type="button" class="edit-button btn btn-warning">Edit</button> <div class="button-column">
@if(isset($button) && is_array($button))
<button type="button" class="action-button btn btn-default" data-confirmation="{{ $button[1] }}" data-success="{{ $button[2] }}" data-error="{{ $button[3] }}" data-url="{{ $button[4] }}">{{ $button[0] }}</button>
@endif
@if($delete) <button type="button" class="edit-button btn btn-warning">Edit</button>
<button type="button" class="delete-button btn btn-danger">Delete</button>
@endif @if($delete)
</div> <button type="button" class="delete-button btn btn-danger">Delete</button>
</div> @endif
</div> </div>
</li> </li>
@endforeach @endforeach