Skip to content

Commit

Permalink
Added responsive-table-wrapper class; Updated all table-responsive oc…
Browse files Browse the repository at this point in the history
…currence; #1509
  • Loading branch information
TheMaaarc committed Oct 5, 2017
1 parent ee58faa commit e613537
Show file tree
Hide file tree
Showing 9 changed files with 210 additions and 170 deletions.
2 changes: 1 addition & 1 deletion modules/admin/src/dashboard/TableDashboardObject.php
Original file line number Diff line number Diff line change
Expand Up @@ -25,5 +25,5 @@ class TableDashboardObject extends BasicDashboardObject
/**
* @inheritdoc
*/
public $outerTemplate = '<div class="card-header">{{title}}</div><div class="card-body"><table class="table table-responsive table-hover">{{template}}</table></div>';
public $outerTemplate = '<div class="card-header">{{title}}</div><div class="card-body"><div class="table-responsive-wrapper"><table class="table table-hover">{{template}}</table></div></div>';
}
2 changes: 1 addition & 1 deletion modules/admin/src/resources/dist/css/admin.css

Large diffs are not rendered by default.

13 changes: 13 additions & 0 deletions modules/admin/src/resources/scss/components/_luya.scss
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,19 @@
}
}

.luya-main-wrapper {
display: block;
width: 100%;

@media (min-width:$mobile-nav-breakpoint) {
max-width: calc(100% - #{$mainnav-width});

.luya-mainnav-small + & {
max-width: calc(100% - #{$mainnav-width-small});
}
}
}

.luya-subnav {
background-color: map-get($grays, 100);
color: color('gray');
Expand Down
16 changes: 15 additions & 1 deletion modules/admin/src/resources/scss/components/_table.scss
Original file line number Diff line number Diff line change
Expand Up @@ -86,7 +86,7 @@

.table-responsive {

@media (max-width:$reponsive-table-breakpoint) {
@media (max-width: $reponsive-table-breakpoint) {
display: block;
width: 100%;
overflow-x: auto;
Expand All @@ -97,4 +97,18 @@
border: 0;
}
}
}

.table-responsive-wrapper {
display: block;
overflow: hidden;
overflow-x: scroll;
width: 100%;

table,
.table-responsive {
display: table;
overflow: hidden;
width: 100%;
}
}
1 change: 1 addition & 0 deletions modules/admin/src/views/layouts/_angulardirectives.php
Original file line number Diff line number Diff line change
Expand Up @@ -231,6 +231,7 @@
</div>
</div>
<div class="filemanager-files-table">
<div class="table-responsive-wrapper"></div>
<table class="table table-hover table-responsive table-striped table-align-middle mt-4">
<thead class="thead-default">
<tr>
Expand Down
168 changes: 87 additions & 81 deletions modules/admin/src/views/layouts/main.php
Original file line number Diff line number Diff line change
Expand Up @@ -188,97 +188,103 @@

<div class="debug-network-items">
<button type="button" ng-click="AdminDebugBar.clear()" class="btn btn-icon"><i class="material-icons">clear</i></button>
<table class="table table-striped table-sm table-hover table-bordered table-responsive">
<thead>
<tr>
<th>URL</th>
<th>Status</th>
<th>Time (ms)</th>
<th>Detail</th>
<div class="table-responsive-wrapper">
<table class="table table-striped table-sm table-hover table-bordered">
<thead>
<tr>
<th>URL</th>
<th>Status</th>
<th>Time (ms)</th>
<th>Detail</th>
</tr>
</thead>
<tr ng-repeat="(key, item) in AdminDebugBar.data | reverse">
<td>{{ item.url }}</td>
<td>{{ item.responseStatus }}</td>
<td>{{ item.parseTime }}</td>
<td><button class="btn btn-sm btn-secondary btn-icon" type="button" ng-click="loadDebugDetail(item, key)"><i class="material-icons">search</i></button></td>
</tr>
</thead>
<tr ng-repeat="(key, item) in AdminDebugBar.data | reverse">
<td>{{ item.url }}</td>
<td>{{ item.responseStatus }}</td>
<td>{{ item.parseTime }}</td>
<td><button class="btn btn-sm btn-secondary btn-icon" type="button" ng-click="loadDebugDetail(item, key)"><i class="material-icons">search</i></button></td>
</tr>
</table>
</table>
</div>
</div>

<div class="debug-network-detail">

<table class="table table-striped table-bordered table-responsive">
<tr>
<th scope="col" colspan="2">Request</th>
</tr>
<tr>
<th scope="row">URL</th>
<td>{{debugDetail.url}}</td>
</tr>
<tr>
<th scope="row">Time</th>
<td>
<span ng-if="debugDetail.parseTime">{{debugDetail.parseTime}}</span>
<span ng-if="!debugDetail.parseTime">-</span>
</td>
</tr>
<tr>
<th scope="row">Data</th>
<td>
<code ng-if="debugDetail.requestData">{{debugDetail.requestData}}</code>
<code ng-if="!debugDetail.requestData">-</code>
</td>
</tr>
<tr>
<td colspan="2">&nbsp;</td>
</tr>
<tr>
<th scope="col">Response</th>
</tr>
<tr>
<th scope="row">Status</th>
<td>
<span ng-if="debugDetail.responseStatus">{{debugDetail.responseStatus}}</span>
<span ng-if="!debugDetail.responseStatus">-</span>
</td>
</tr>
<tr>
<th scope="row">Data</th>
<td>
<code ng-if="debugDetail.responseData">{{debugDetail.responseData}}</code>
<code ng-if="!debugDetail.responseData">-</code>
</td>
</tr>
</table>
<div class="table-responsive-wrapper">
<table class="table table-striped table-bordered">
<tr>
<th scope="col" colspan="2">Request</th>
</tr>
<tr>
<th scope="row">URL</th>
<td>{{debugDetail.url}}</td>
</tr>
<tr>
<th scope="row">Time</th>
<td>
<span ng-if="debugDetail.parseTime">{{debugDetail.parseTime}}</span>
<span ng-if="!debugDetail.parseTime">-</span>
</td>
</tr>
<tr>
<th scope="row">Data</th>
<td>
<code ng-if="debugDetail.requestData">{{debugDetail.requestData}}</code>
<code ng-if="!debugDetail.requestData">-</code>
</td>
</tr>
<tr>
<td colspan="2">&nbsp;</td>
</tr>
<tr>
<th scope="col">Response</th>
</tr>
<tr>
<th scope="row">Status</th>
<td>
<span ng-if="debugDetail.responseStatus">{{debugDetail.responseStatus}}</span>
<span ng-if="!debugDetail.responseStatus">-</span>
</td>
</tr>
<tr>
<th scope="row">Data</th>
<td>
<code ng-if="debugDetail.responseData">{{debugDetail.responseData}}</code>
<code ng-if="!debugDetail.responseData">-</code>
</td>
</tr>
</table>
</div>

</div>
</div>

<div class="debug-panel" ng-if="debugTab==2">
<table class="table table-striped table-sm table-bordered table-responsive">
<thead>
<tr>
<th><?= Admin::t('layout_debug_table_key'); ?></th>
<th><?= Admin::t('layout_debug_table_value'); ?></th>
</tr>
</thead>
<tr><td><?= Admin::t('layout_debug_luya_version'); ?>:</td><td><?= \luya\Boot::VERSION; ?></td></tr>
<tr><td><?= Admin::t('layout_debug_id'); ?>:</td><td><?= Yii::$app->id ?></td></tr>
<tr><td><?= Admin::t('layout_debug_sitetitle'); ?>:</td><td><?= Yii::$app->siteTitle ?></td></tr>
<tr><td><?= Admin::t('layout_debug_remotetoken'); ?>:</td><td><?= $this->context->colorizeValue(Yii::$app->remoteToken, true); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_assetmanager_forcecopy'); ?>:</td><td><?= $this->context->colorizeValue(Yii::$app->assetManager->forceCopy); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_transfer_exceptions'); ?>:</td><td><?= $this->context->colorizeValue(Yii::$app->errorHandler->transferException); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_caching'); ?>:</td><td><?= (Yii::$app->has('cache')) ? Yii::$app->cache->className() : $this->context->colorizeValue(false); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_yii_debug'); ?>:</td><td><?= $this->context->colorizeValue(YII_DEBUG); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_yii_env'); ?>:</td><td><?= YII_ENV; ?></td></tr>
<tr><td><?= Admin::t('layout_debug_yii_timezone'); ?>:</td><td><?= Yii::$app->timeZone; ?></td></tr>
<tr><td><?= Admin::t('layout_debug_php_timezone'); ?>:</td><td><?= date_default_timezone_get(); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_php_ini_memory_limit'); ?>:</td><td><?= ini_get('memory_limit'); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_php_ini_max_exec'); ?>:</td><td><?= ini_get('max_execution_time'); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_php_ini_post_max_size'); ?>:</td><td><?= ini_get('post_max_size'); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_php_ini_upload_max_file'); ?>:</td><td><?= ini_get('upload_max_filesize'); ?></td></tr>
</table>
<div class="table-responsive-wrapper">
<table class="table table-striped table-sm table-bordered">
<thead>
<tr>
<th><?= Admin::t('layout_debug_table_key'); ?></th>
<th><?= Admin::t('layout_debug_table_value'); ?></th>
</tr>
</thead>
<tr><td><?= Admin::t('layout_debug_luya_version'); ?>:</td><td><?= \luya\Boot::VERSION; ?></td></tr>
<tr><td><?= Admin::t('layout_debug_id'); ?>:</td><td><?= Yii::$app->id ?></td></tr>
<tr><td><?= Admin::t('layout_debug_sitetitle'); ?>:</td><td><?= Yii::$app->siteTitle ?></td></tr>
<tr><td><?= Admin::t('layout_debug_remotetoken'); ?>:</td><td><?= $this->context->colorizeValue(Yii::$app->remoteToken, true); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_assetmanager_forcecopy'); ?>:</td><td><?= $this->context->colorizeValue(Yii::$app->assetManager->forceCopy); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_transfer_exceptions'); ?>:</td><td><?= $this->context->colorizeValue(Yii::$app->errorHandler->transferException); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_caching'); ?>:</td><td><?= (Yii::$app->has('cache')) ? Yii::$app->cache->className() : $this->context->colorizeValue(false); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_yii_debug'); ?>:</td><td><?= $this->context->colorizeValue(YII_DEBUG); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_yii_env'); ?>:</td><td><?= YII_ENV; ?></td></tr>
<tr><td><?= Admin::t('layout_debug_yii_timezone'); ?>:</td><td><?= Yii::$app->timeZone; ?></td></tr>
<tr><td><?= Admin::t('layout_debug_php_timezone'); ?>:</td><td><?= date_default_timezone_get(); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_php_ini_memory_limit'); ?>:</td><td><?= ini_get('memory_limit'); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_php_ini_max_exec'); ?>:</td><td><?= ini_get('max_execution_time'); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_php_ini_post_max_size'); ?>:</td><td><?= ini_get('post_max_size'); ?></td></tr>
<tr><td><?= Admin::t('layout_debug_php_ini_upload_max_file'); ?>:</td><td><?= ini_get('upload_max_filesize'); ?></td></tr>
</table>
</div>
</div>

</div>
Expand Down
Loading

0 comments on commit e613537

Please sign in to comment.