You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@trafficcontrol.apache.org by mi...@apache.org on 2018/10/04 19:53:41 UTC
[trafficcontrol] 14/14: CSS adjustments to responsiveness
This is an automated email from the ASF dual-hosted git repository.
mitchell852 pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/trafficcontrol.git
commit 023a1c0216d2138718f771d9e31565787496d552
Author: cgillo000 <ch...@cable.comcast.com>
AuthorDate: Thu Oct 4 08:21:03 2018 -0600
CSS adjustments to responsiveness
---
.../widget/deliveryServices/_widget.deliveryServices.scss | 9 ++++-----
.../widget/deliveryServices/widget.deliveryServices.tpl.html | 12 ++++++------
2 files changed, 10 insertions(+), 11 deletions(-)
diff --git a/traffic_portal/app/src/common/modules/widget/deliveryServices/_widget.deliveryServices.scss b/traffic_portal/app/src/common/modules/widget/deliveryServices/_widget.deliveryServices.scss
index 2673dd4..171d142 100644
--- a/traffic_portal/app/src/common/modules/widget/deliveryServices/_widget.deliveryServices.scss
+++ b/traffic_portal/app/src/common/modules/widget/deliveryServices/_widget.deliveryServices.scss
@@ -19,6 +19,8 @@
#deliveryServicesContainer {
max-height: 552px;
margin-bottom: 0;
+ float: left;
+ width:100%;
.list-group-item {
background-color: transparent;
}
@@ -59,8 +61,8 @@
}
.delivery-services-search-form {
float: right;
- width: 200px;
- margin-bottom: 10px;
+ min-width: 100px;
+ max-width: 220px;
}
}
.dsWidgetPagination {
@@ -79,9 +81,6 @@
.dsWidgetGreen {
color: #32CD32;
}
-.dsmin {
- min-width: 422px;
-}
#deliveryServicesLoadingContainer {
height: 555px;
background-color: transparent;
diff --git a/traffic_portal/app/src/common/modules/widget/deliveryServices/widget.deliveryServices.tpl.html b/traffic_portal/app/src/common/modules/widget/deliveryServices/widget.deliveryServices.tpl.html
index f6378ea..b805b59 100644
--- a/traffic_portal/app/src/common/modules/widget/deliveryServices/widget.deliveryServices.tpl.html
+++ b/traffic_portal/app/src/common/modules/widget/deliveryServices/widget.deliveryServices.tpl.html
@@ -23,7 +23,7 @@ under the License.
</div>
<div class="x_content">
<div class="row">
- <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12 dsmin">
+ <div class="col-lg-5 col-md-6 col-sm-12 col-xs-12">
<div id="delivery-services-outer-container">
<div class="dsWidgetPagination">
<div ng-show="(deliveryServices | filter:search:strict).length > 0">
@@ -38,7 +38,7 @@ under the License.
ng-model="search.displayName">
<span class="filter-input-group-btn input-group-btn">
<button class="btn btn-default" type="button"><i class="fa fa-search"></i></button>
- </span>
+ </span>
</div>
</div>
<div id="deliveryServicesContainer">
@@ -49,11 +49,11 @@ under the License.
<a class="delivery-services-health list-group-item widgetTable"
ng-repeat="ds in deliveryServices | filter:search:strict | offsetFilter:(currentDeliveryServicesPage-1)*deliveryServicesPerPage | limitTo:deliveryServicesPerPage track by $index"
ng-click="getChartData(ds, ds.idx)">
- <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 whitespace" title="{{ds.displayName}} ({{ds.xmlId}})">{{ds.displayName}}
+ <div class="col-lg-6 col-md-5 col-sm-5 col-xs-4 whitespace" style="float:left;" title="{{ds.displayName}} ({{ds.xmlId}})">{{ds.displayName}}
<small>({{ds.xmlId}})<br>{{ds.tenant}}</small>
</div>
- <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3 whitespace" title="{{ds.type}}">{{ds.type}}</div>
- <div class="col-lg-1 col-md-1 col-sm-1 col-xs-1 whitespace" style="margin-top:8px;">
+ <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4 whitespace" style="float:left;" title="{{ds.type}}">{{ds.type}}</div>
+ <div class="col-lg-2 col-md-3 col-sm-3 col-xs-4 whitespace" style="margin-top:8px; float:left;">
<i class="fa fa-check pull-right dsWidgetGreen" ng-show="ds.idx == selectedIndex"></i>
<i class="fa fa-square pull-right dsWidgetGray" ng-show="ds.idx != selectedIndex"></i>
</div>
@@ -62,7 +62,7 @@ under the License.
</div>
</div>
</div>
- <div class="col-lg-8 col-md-8 col-sm-12 col-xs-12">
+ <div class="col-lg-7 col-md-6 col-sm-12 col-xs-12">
<div ng-show="!isRequested">Select a Delivery Service to view bandwidth chart.</div>
<div class="alert alert-info" ng-show="isLoading">Loading data
for {{selectedDeliveryService.displayName}}</div>