Client: responsive design

4 files changed, 30 insertions, 44 deletions

diff --git a/client/src/app/+admin/friends/friend-list/friend-list.component.html b/client/src/app/+admin/friends/friend-list/friend-list.component.html
index 254d0c65e..e15ecde14 100644
--- a/client/src/app/+admin/friends/friend-list/friend-list.component.html
+++ b/client/src/app/+admin/friends/friend-list/friend-list.component.html
@@ -2,10 +2,10 @@
 
 <ng2-smart-table [settings]="tableSettings" [source]="friendsSource"></ng2-smart-table>
 
-<a *ngIf="hasFriends()" class="add-user btn btn-danger pull-left" (click)="quitFriends()">
+<a *ngIf="hasFriends()" class="btn btn-danger pull-left" (click)="quitFriends()">
   Quit friends
 </a>
 
-<a *ngIf="!hasFriends()" class="add-user btn btn-success pull-right" [routerLink]="['/admin/friends/add']">
+<a *ngIf="!hasFriends()" class="btn btn-success pull-right" [routerLink]="['/admin/friends/add']">
   Make friends
 </a>
diff --git a/client/src/app/+admin/friends/friend-list/friend-list.component.scss b/client/src/app/+admin/friends/friend-list/friend-list.component.scss
index cb597e12b..0a0f621c6 100644
--- a/client/src/app/+admin/friends/friend-list/friend-list.component.scss
+++ b/client/src/app/+admin/friends/friend-list/friend-list.component.scss
@@ -1,3 +1,3 @@
-table {
-  margin-bottom: 40px;
+.btn {
+  margin-top: 10px;
 }
diff --git a/client/src/app/+admin/requests/request-stats/request-stats.component.html b/client/src/app/+admin/requests/request-stats/request-stats.component.html
index ca531258c..f35da6535 100644
--- a/client/src/app/+admin/requests/request-stats/request-stats.component.html
+++ b/client/src/app/+admin/requests/request-stats/request-stats.component.html
@@ -1,37 +1,38 @@
 <h3>Requests stats</h3>
 
-<div *ngFor="let requestSchedulerName of statsTitles | keys">
-  <div class="block" *ngIf="stats[requestSchedulerName] !== null">
-    <h4>{{ statsTitles[requestSchedulerName] }}</h4>
+<div *ngFor="let requestSchedulerName of statsTitles | keys" class="col-lg-4 col-md-12">
+  <div class="panel panel-default" *ngIf="stats[requestSchedulerName] !== null">
+    <div class="panel-heading">{{ statsTitles[requestSchedulerName] }}</div>
 
-    <div class="requests-general">
-      <div>
-        <span class="label-description">Remaining requests:</span>
-        {{ stats[requestSchedulerName].totalRequests }}
-      </div>
+    <div class="panel-body">
+      <div class="requests-general">
+        <div>
+          <span class="label-description">Remaining requests:</span>
+          {{ stats[requestSchedulerName].totalRequests }}
+        </div>
 
-      <div>
-        <span class="label-description">Interval seconds between requests:</span>
-        {{ stats[requestSchedulerName].secondsInterval }}
-      </div>
+        <div>
+          <span class="label-description">Interval seconds between requests:</span>
+          {{ stats[requestSchedulerName].secondsInterval }}
+        </div>
 
-      <div>
-        <span class="label-description">Remaining time before the scheduled request:</span>
-        {{ stats[requestSchedulerName].remainingSeconds }}
+        <div>
+          <span class="label-description">Remaining time before the scheduled request:</span>
+          {{ stats[requestSchedulerName].remainingSeconds }}
+        </div>
       </div>
-    </div>
 
-    <div class="requests-limit">
-      <div>
-        <span class="label-description">Maximum number of different pods for a scheduled request:</span>
-        {{ stats[requestSchedulerName].requestsLimitPods }}
-      </div>
+      <div class="requests-limit">
+        <div>
+          <span class="label-description">Maximum number of different pods for a scheduled request:</span>
+          {{ stats[requestSchedulerName].requestsLimitPods }}
+        </div>
 
-      <div>
-        <span class="label-description">Maximum number of requests per pod for a scheduled request:</span>
-        {{ stats[requestSchedulerName].requestsLimitPerPod }}
+        <div>
+          <span class="label-description">Maximum number of requests per pod for a scheduled request:</span>
+          {{ stats[requestSchedulerName].requestsLimitPerPod }}
+        </div>
       </div>
     </div>
-
   </div>
 </div>
diff --git a/client/src/app/+admin/requests/request-stats/request-stats.component.scss b/client/src/app/+admin/requests/request-stats/request-stats.component.scss
index c9f724604..b2c413259 100644
--- a/client/src/app/+admin/requests/request-stats/request-stats.component.scss
+++ b/client/src/app/+admin/requests/request-stats/request-stats.component.scss
@@ -1,23 +1,8 @@
-.block {
-  margin-bottom: 40px;
-}
-
 .label-description {
-  display: inline-block;
   font-weight: bold;
   color: black;
 }
 
-.requests-general {
-  .label-description {
-    width: 320px;
-  }
-}
-
 .requests-limit {
   margin-top: 20px;
-
-  .label-description {
-    width: 430px;
-  }
 }