mirror of
https://github.com/alextselegidis/easyappointments.git
synced 2024-12-26 08:33:21 +03:00
Refactored CSS with common backend rules for services page.
This commit is contained in:
parent
362aaf0498
commit
fe215e8be6
5 changed files with 39 additions and 89 deletions
|
@ -27,7 +27,7 @@
|
|||
});
|
||||
</script>
|
||||
|
||||
<div id="services-page" class="container-fluid">
|
||||
<div id="services-page" class="container-fluid backend-page">
|
||||
<ul class="nav nav-tabs">
|
||||
<li role="presentation" class="services-tab tab active"><a><?php echo $this->lang->line('services'); ?></a></li>
|
||||
<li role="presentation" class="categories-tab tab"><a><?php echo $this->lang->line('categories'); ?></a></li>
|
||||
|
@ -60,7 +60,7 @@
|
|||
<div class="results"></div>
|
||||
</div>
|
||||
|
||||
<div class="details column col-xs-12 col-sm-7">
|
||||
<div class="record-details column col-xs-12 col-sm-7">
|
||||
<div class="btn-toolbar">
|
||||
<div class="add-edit-delete-group btn-group">
|
||||
<button id="add-service" class="btn btn-primary">
|
||||
|
@ -157,7 +157,7 @@
|
|||
<div class="results"></div>
|
||||
</div>
|
||||
|
||||
<div class="details col-xs-12 col-sm-7">
|
||||
<div class="record-details col-xs-12 col-sm-7">
|
||||
<div class="btn-toolbar">
|
||||
<div class="add-edit-delete-group btn-group">
|
||||
<button id="add-category" class="btn btn-primary">
|
||||
|
|
|
@ -249,6 +249,13 @@ body .jspTrack {
|
|||
cursor: default;
|
||||
}
|
||||
|
||||
.record-details input:read-only,
|
||||
.record-details select:disabled,
|
||||
.record-details textarea:read-only {
|
||||
opacity: 0.85;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
|
||||
/* BACKEND CALENDAR PAGE
|
||||
-------------------------------------------------------------------- */
|
||||
|
@ -455,43 +462,14 @@ body .form-horizontal .controls {
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
#services-page .filter-records {
|
||||
max-width: 350px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
#services-page .filter-records .results {
|
||||
overflow-y: auto;
|
||||
max-height: 650px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
#services-page .service-row {
|
||||
padding: 10px 7px;
|
||||
}
|
||||
|
||||
#services-page .service-row:hover:not(.selected-row) {
|
||||
cursor: pointer;
|
||||
background-color: #F3F3F3;
|
||||
}
|
||||
|
||||
#services-page .selected-row {
|
||||
background-color: #F4F4F4;
|
||||
border-right: 5px solid #35B66F;
|
||||
}
|
||||
|
||||
#services-page .filter-records .results hr {
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
#services-page .details .ui-spinner {
|
||||
#services-page .record-details .ui-spinner {
|
||||
border: none;
|
||||
margin-bottom: 10px;
|
||||
display: block;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
#services-page .details .ui-state-disabled {
|
||||
#services-page .record-details .ui-state-disabled {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
|
@ -499,38 +477,10 @@ body .form-horizontal .controls {
|
|||
margin: 0px;
|
||||
}
|
||||
|
||||
#services-page .details .ui-spinner a {
|
||||
#services-page .record-details .ui-spinner a {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#services-page .details input,
|
||||
#services-page .details select,
|
||||
#services-page .details textarea {
|
||||
background-color: white;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#services-page #categories .category-row {
|
||||
padding: 10px 7px;
|
||||
}
|
||||
|
||||
#services-page #categories .category-row:hover:not(.selected-row) {
|
||||
background-color: #F3F3F3;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.details input:read-only,
|
||||
.details select:disabled,
|
||||
.details textarea:read-only {
|
||||
opacity: 0.85;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#services-page .details {
|
||||
max-width: 450px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
/* BACKEND USERS PAGE
|
||||
-------------------------------------------------------------------- */
|
||||
#users-page h2 {
|
||||
|
|
|
@ -45,7 +45,7 @@
|
|||
*/
|
||||
$('#filter-categories form').submit(function() {
|
||||
var key = $('#filter-categories .key').val();
|
||||
$('.selected-row').removeClass('selected-row');
|
||||
$('.selected').removeClass('selected');
|
||||
instance.resetForm();
|
||||
instance.filter(key);
|
||||
return false;
|
||||
|
@ -72,8 +72,8 @@
|
|||
});
|
||||
|
||||
instance.display(category);
|
||||
$('#filter-categories .selected-row').removeClass('selected-row');
|
||||
$(this).addClass('selected-row');
|
||||
$('#filter-categories .selected').removeClass('selected');
|
||||
$(this).addClass('selected');
|
||||
$('#edit-category, #delete-category').prop('disabled', false);
|
||||
});
|
||||
|
||||
|
@ -84,7 +84,7 @@
|
|||
instance.resetForm();
|
||||
$('#categories .add-edit-delete-group').hide();
|
||||
$('#categories .save-cancel-group').show();
|
||||
$('#categories .details').find('input, textarea').prop('readonly', false);
|
||||
$('#categories .record-details').find('input, textarea').prop('readonly', false);
|
||||
$('#filter-categories button').prop('disabled', true);
|
||||
$('#filter-categories .results').css('color', '#AAA');
|
||||
});
|
||||
|
@ -95,7 +95,7 @@
|
|||
$('#edit-category').click(function() {
|
||||
$('#categories .add-edit-delete-group').hide();
|
||||
$('#categories .save-cancel-group').show();
|
||||
$('#categories .details').find('input, textarea').prop('readonly', false);
|
||||
$('#categories .record-details').find('input, textarea').prop('readonly', false);
|
||||
|
||||
$('#filter-categories button').prop('disabled', true);
|
||||
$('#filter-categories .results').css('color', '#AAA');
|
||||
|
@ -259,7 +259,7 @@
|
|||
* @param {Object} category Contains the category data.
|
||||
*/
|
||||
CategoriesHelper.prototype.validate = function(category) {
|
||||
$('#categories .details').find('input, textarea').css('border', '');
|
||||
$('#categories .record-details').find('input, textarea').css('border', '');
|
||||
|
||||
try {
|
||||
var missingRequired = false;
|
||||
|
@ -287,11 +287,11 @@
|
|||
CategoriesHelper.prototype.resetForm = function() {
|
||||
$('#categories .add-edit-delete-group').show();
|
||||
$('#categories .save-cancel-group').hide();
|
||||
$('#categories .details').find('input, textarea').val('');
|
||||
$('#categories .details').find('input, textarea').prop('readonly', true);
|
||||
$('#categories .record-details').find('input, textarea').val('');
|
||||
$('#categories .record-details').find('input, textarea').prop('readonly', true);
|
||||
$('#edit-category, #delete-category').prop('disabled', true);
|
||||
|
||||
$('#filter-categories .selected-row').removeClass('selected-row');
|
||||
$('#filter-categories .selected').removeClass('selected');
|
||||
$('#filter-categories .results').css('color', '');
|
||||
$('#filter-categories button').prop('disabled', false);
|
||||
};
|
||||
|
@ -305,7 +305,7 @@
|
|||
*/
|
||||
CategoriesHelper.prototype.getFilterHtml = function(category) {
|
||||
var html =
|
||||
'<div class="category-row" data-id="' + category.id + '">' +
|
||||
'<div class="category-row entry" data-id="' + category.id + '">' +
|
||||
'<strong>' + category.name + '</strong>' +
|
||||
'</div><hr>';
|
||||
|
||||
|
@ -324,11 +324,11 @@
|
|||
CategoriesHelper.prototype.select = function(id, display) {
|
||||
display = display || false;
|
||||
|
||||
$('#filter-categories .selected-row').removeClass('selected-row');
|
||||
$('#filter-categories .selected').removeClass('selected');
|
||||
|
||||
$('#filter-categories .category-row').each(function() {
|
||||
if ($(this).attr('data-id') === id) {
|
||||
$(this).addClass('selected-row');
|
||||
$(this).addClass('selected');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
|
|
@ -53,7 +53,7 @@ window.BackendServices = window.BackendServices || {};
|
|||
});
|
||||
|
||||
// Instantiate helper object (service helper by default).
|
||||
helper = new ServicesHelper();
|
||||
helper = servicesHelper;
|
||||
helper.resetForm();
|
||||
helper.filter('');
|
||||
|
||||
|
|
|
@ -34,7 +34,7 @@
|
|||
*/
|
||||
$('#filter-services form').submit(function(event) {
|
||||
var key = $('#filter-services .key').val();
|
||||
$('#filter-services .selected-row').removeClass('selected-row');
|
||||
$('#filter-services .selected').removeClass('selected');
|
||||
instance.resetForm();
|
||||
instance.filter(key);
|
||||
return false;
|
||||
|
@ -70,8 +70,8 @@
|
|||
});
|
||||
|
||||
instance.display(service);
|
||||
$('#filter-services .selected-row').removeClass('selected-row');
|
||||
$(this).addClass('selected-row');
|
||||
$('#filter-services .selected').removeClass('selected');
|
||||
$(this).addClass('selected');
|
||||
$('#edit-service, #delete-service').prop('disabled', false);
|
||||
});
|
||||
|
||||
|
@ -82,8 +82,8 @@
|
|||
instance.resetForm();
|
||||
$('#services .add-edit-delete-group').hide();
|
||||
$('#services .save-cancel-group').show();
|
||||
$('#services .details').find('input, textarea').prop('readonly', false);
|
||||
$('#services .details').find('select').prop('disabled', false);
|
||||
$('#services .record-details').find('input, textarea').prop('readonly', false);
|
||||
$('#services .record-details').find('select').prop('disabled', false);
|
||||
$('#service-duration').spinner('enable');
|
||||
|
||||
$('#filter-services button').prop('disabled', true);
|
||||
|
@ -138,8 +138,8 @@
|
|||
$('#edit-service').click(function() {
|
||||
$('#services .add-edit-delete-group').hide();
|
||||
$('#services .save-cancel-group').show();
|
||||
$('#services .details').find('input, textarea').prop('readonly', false);
|
||||
$('#services .details select').prop('disabled', false);
|
||||
$('#services .record-details').find('input, textarea').prop('readonly', false);
|
||||
$('#services .record-details select').prop('disabled', false);
|
||||
$('#service-duration').spinner('enable');
|
||||
|
||||
$('#filter-services button').prop('disabled', true);
|
||||
|
@ -251,16 +251,16 @@
|
|||
* Resets the service tab form back to its initial state.
|
||||
*/
|
||||
ServicesHelper.prototype.resetForm = function() {
|
||||
$('#services .details').find('input, textarea').val('');
|
||||
$('#services .record-details').find('input, textarea').val('');
|
||||
$('#service-category').val('null');
|
||||
$('#services .add-edit-delete-group').show();
|
||||
$('#services .save-cancel-group').hide();
|
||||
$('#edit-service, #delete-service').prop('disabled', true);
|
||||
$('#services .details').find('input, textarea').prop('readonly', true);
|
||||
$('#services .record-details').find('input, textarea').prop('readonly', true);
|
||||
$('#service-category').prop('disabled', true);
|
||||
$('#service-duration').spinner('disable');
|
||||
|
||||
$('#filter-services .selected-row').removeClass('selected-row');
|
||||
$('#filter-services .selected').removeClass('selected');
|
||||
$('#filter-services button').prop('disabled', false);
|
||||
$('#filter-services .results').css('color', '');
|
||||
};
|
||||
|
@ -335,7 +335,7 @@
|
|||
*/
|
||||
ServicesHelper.prototype.getFilterHtml = function(service) {
|
||||
var html =
|
||||
'<div class="service-row" data-id="' + service.id + '">' +
|
||||
'<div class="service-row entry" data-id="' + service.id + '">' +
|
||||
'<strong>' + service.name + '</strong><br>' +
|
||||
service.duration + ' min - ' +
|
||||
service.price + ' ' + service.currency + '<br>' +
|
||||
|
@ -354,11 +354,11 @@
|
|||
ServicesHelper.prototype.select = function(id, display) {
|
||||
display = display || false;
|
||||
|
||||
$('#filter-services .selected-row').removeClass('selected-row');
|
||||
$('#filter-services .selected').removeClass('selected');
|
||||
|
||||
$('#filter-services .service-row').each(function() {
|
||||
if ($(this).attr('data-id') === id) {
|
||||
$(this).addClass('selected-row');
|
||||
$(this).addClass('selected');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue