Responsive design refactoring for the backend/users page.

This commit is contained in:
Alex Tselegidis 2016-07-14 21:08:36 +02:00
parent e3eba5cd8a
commit 05ac409c0f
2 changed files with 37 additions and 19 deletions

View file

@ -60,7 +60,7 @@
?>
<div id="admins" class="tab-content">
<div class="row">
<div id="filter-admins" class="filter-records column col-md-4">
<div id="filter-admins" class="filter-records column col-xs-12 col-sm-5">
<form class="input-append">
<input class="key" type="text" />
<div class="btn-group">
@ -77,7 +77,7 @@
<div class="results"></div>
</div>
<div class="details column col-md-7">
<div class="details column col-xs-12 col-sm-7">
<div class="btn-toolbar">
<div class="add-edit-delete-group btn-group">
<button id="add-admin" class="btn btn-primary">
@ -112,7 +112,7 @@
<input type="hidden" id="admin-id" class="record-id" />
<div class="">
<div class="row">
<div class="admin-details col-md-6">
<div class="form-group">
<label for="first-name"><?php echo $this->lang->line('first_name'); ?> *</label>
@ -201,7 +201,7 @@
?>
<div id="providers" class="tab-content" style="display:none;">
<div class="row">
<div id="filter-providers" class="filter-records column col-md-7">
<div id="filter-providers" class="filter-records column col-xs-12 col-sm-5">
<form class="input-append">
<input class="key" type="text" />
<div class="btn-group">
@ -218,7 +218,7 @@
<div class="results"></div>
</div>
<div class="details column col-md-7">
<div class="details column col-xs-12 col-sm-7">
<div class="pull-left">
<div class="add-edit-delete-group btn-group">
<button id="add-provider" class="btn btn-primary">
@ -262,7 +262,7 @@
<input type="hidden" id="provider-id" class="record-id" />
<div>
<div class="row">
<div class="provider-details col-md-6">
<div class="form-group">
<label for="provider-first-name"><?php echo $this->lang->line('first_name'); ?> *</label>
@ -475,7 +475,7 @@
?>
<div id="secretaries" class="tab-content" style="display:none;">
<div class="row">
<div id="filter-secretaries" class="filter-records column col-md-4">
<div id="filter-secretaries" class="filter-records column col-xs-12 col-sm-5">
<form class="input-append">
<input class="key" type="text" />
<div class="btn-group">
@ -492,7 +492,7 @@
<div class="results"></div>
</div>
<div class="details column col-md-7">
<div class="details column col-xs-12 col-sm-7">
<div class="btn-toolbar">
<div class="add-edit-delete-group btn-group">
<button id="add-secretary" class="btn btn-primary">
@ -527,7 +527,7 @@
<input type="hidden" id="secretary-id" class="record-id" />
<div class="">
<div class="row">
<div class="secretary-details col-md-6">
<div class="form-group">
<label for="secretary-first-name"><?php echo $this->lang->line('first_name');?> *</label>

View file

@ -201,6 +201,7 @@ body .jspTrack {
.backend-page .filter-records {
max-width: 350px;
margin-bottom: 20px;
}
.backend-page .filter-records form {
@ -239,6 +240,7 @@ body .jspTrack {
.record-details {
max-width: 800px;
margin-bottom: 20px;
}
.record-details input,
@ -455,6 +457,7 @@ body .form-horizontal .controls {
#services-page .filter-records {
max-width: 350px;
margin-bottom: 20px;
}
#services-page .filter-records .results {
@ -525,6 +528,7 @@ body .form-horizontal .controls {
#services-page .details {
max-width: 450px;
margin-bottom: 20px;
}
/* BACKEND USERS PAGE
@ -533,14 +537,9 @@ body .form-horizontal .controls {
color: #525252;
}
#users-page .tab-content {
margin: 15px;
}
#users-page .nav {
margin: 15px;
background-color: #F4F4F4;
border-radius: 4px;
margin-bottom: 15px;
}
#users-page .nav li {
@ -548,7 +547,8 @@ body .form-horizontal .controls {
}
#users-page .filter-records {
width: 380px;
max-width: 380px;
margin-bottom: 20px;
}
#users-page .filter-records .results {
@ -592,10 +592,12 @@ body .form-horizontal .controls {
#users-page #secretary-providers,
#users-page #provider-services {
border: 4px solid #ccc;
width: 315px;
max-width: 315px;
width: 100%;
height: 387px;
overflow-y: scroll;
padding: 7px;
margin-bottom: 20px;
}
#users-page #providers .switch-view {
@ -656,11 +658,12 @@ body .form-horizontal .controls {
}
#users-page .details {
max-width: 700px;
max-width: 800px;
margin-bottom: 20px;
}
#users-page .working-plan td input[type="text"] {
width: 85px;
width: 55px;
margin: 10px 0;
}
@ -825,4 +828,19 @@ body .form-horizontal .controls {
#calendar-page #calendar-filter select {
min-width: auto;
}
#users-page #providers .switch-view {
margin: 20px 0;
}
#users-page #providers .switch-view strong {
display: block;
width: 100%;
text-align: center;
margin: 16px 0;
}
#users-page #providers .switch-view div {
width: 48%;
}
}