File: /home/barbeatleanalyti/public_html/barisnew.beatleanalytics.com/site/template/auditorslist.php
<?php
// Declare new object
$objProfile = object;
// Assing object
$objProfile = $objDB->objController;
// Assign all variable's value
$pg = $objProfile->pg;
$acn = $objProfile->acn;
$Email = $objProfile->Email;
$Password = $objProfile->Password;
$error = $objProfile->error;
$msg = $objProfile->msg;
$p = $objProfile->p;
$m = $objProfile->m;
$y = $objProfile->y;
$FromDate = $objProfile->FromDate;
$ToDate = $objProfile->ToDate;
$PageID = $objProfile->PageID;
$PageConID = $objProfile->PageConID;
$atype = $objProfile->atype;
$BranchID = $objProfile->BranchID;
$IndustryID = $objProfile->IndustryID;
$NoData = $objProfile->NoData;
if(!method_exists($objProfile,$acn)){
ReturnPostFormData($ValidateArr = array(),"error.html","<span class='error-msg'>Method <strong>".$acn."</strong> does not exist in <strong>".$pg."</strong> file !</span>",2);
}
$rsUserData = $objProfile->FetchUserData();
$auditorData = $objProfile->FetchAuditorsData();
// echo "<pre>";
// print_r($rsUserData);
/*echo "<pre>";
print_r($perforArr['wfbtotal']);
echo "<pre>"*/
?>
<!--
data table
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/fixedheader/3.1.5/css/fixedHeader.dataTables.min.css">
--->
<link href="https://fonts.googleapis.com/css2?family=Varela+Round&display=swap" rel="stylesheet">
<link rel="stylesheet" href="<?php echo $curImagePath?>/dist/css/Custom.css">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="r/RGraph.svg.common.core.js"></script>
<script src="r/RGraph.svg.common.tooltips.js"></script>
<script src="r/RGraph.svg.pie.js"></script>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<section class="content-header">
<!-- <h1>
Dashboard
<small>Control panel</small>
</h1>-->
<!--<ol class="breadcrumb">
<li><a href="#"><i class="fa fa-dashboard"></i> Dashboard</a></li>
<li class="active"></li>
</ol>
</section>-->
<?php
?>
<!-- Main content -->
<section class="content">
<div class="auditor_list">
<table id="example" class="display " style="width:100%">
<thead>
<tr>
<th>Sr No</th>
<th>Username</th>
<th>Full Name</th>
<th>Mobile</th>
<th>Email address</th>
<!-- <th>Password</th> -->
<th>Designation</th>
<th>Divisional office</th>
<th>Station </th>
<th>Station Id</th>
<th>Edit </th>
<th>Delete </th>
</tr>
</thead>
<tbody>
<?php $no = 1; foreach ($auditorData as $key => $value) { ?>
<tr id="rowid_<?php echo $value['userId']; ?>">
<td><?php echo $no++; ?></td>
<td><?php echo $value['db_username']; ?></td>
<td><?php echo $value['db_userLoginName']; ?></td>
<td><?php echo $value['db_phone']; ?></td>
<td><?php echo $value['db_email']; ?></td>
<!-- <td>123456789</td> -->
<td><?php echo $value['db_designation']; ?></td>
<td><?php echo $objProfile->FetchDivisionById($value['DivisionId'])[0]['DivisionName']; ?></td>
<td><?php echo $objProfile->FetchStationIdById($value['StationId'])[0]['stationName']; ?></td>
<td><?php echo $objProfile->FetchStationIdById($value['StationId'])[0]['db_stLoginId']; ?></td>
<th> <a href="javascript:;" data-toggle="modal" data-target="#edit-auditor<?php echo $value['userId'];?>"> <i class="fa fa-fw fa-edit"></i> </a> </th>
<th> <a class="deluser" href="javascript:;" data-uid="<?php echo $value['userId'];?>"> <i class="fa fa-fw fa-trash"></i> </a> </th>
</tr>
<!-- Modal -->
<div class="modal fade" id="edit-auditor<?php echo $value['userId'];?>" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Create Auditor </h4>
</div>
<div class="modal-body">
<form method="POST" id="form_auditor_edit<?php echo $value['userId'];?>">
<p class="cust_filed">Divisional office<span class="ans"><?php echo $rsUserData[0]['DivisionName'] ?></span></p>
<p class="cust_filed">Station <span class="ans"><?php echo $rsUserData[0]['stationName'] ?></span></p>
<input type="hidden" name="acn" value="editAuditorDetails">
<input type="hidden" name="userId" value="<?php echo $value['userId'];?>">
<div class="form-group">
<label for="text">Username:</label>
<input type="text" class="form-control" id="audi_username_edit" name="audi_username_edit" required="" value="<?php echo $value['db_username']; ?>">
</div>
<div class="form-group">
<label for="text">Full Name:</label>
<input type="text" class="form-control" id="audi_fullname_edit" name="audi_fullname_edit" required="" value="<?php echo $value['db_userLoginName']; ?>">
</div>
<div class="form-group">
<label for="tal">Mobile:</label>
<input type="tal" class="form-control" id="audi_contact_number_edit" name="audi_contact_number_edit" maxlength="10" required="" value="<?php echo $value['db_phone']; ?>">
</div>
<div class="form-group">
<label for="email">Email address:</label>
<input type="email" class="form-control" id="audi_email_edit" name="audi_email_edit" required="" value="<?php echo $value['db_email']; ?>">
</div>
<div class="form-group">
<label for="pwd">Password:</label>
<input type="password" class="form-control" id="audi_password_edit" name="audi_password_edit">
</div>
<div class="form-group">
<label for="pwd">Confirm Password:</label>
<input type="password" class="form-control" id="audi_conpassword_edit" name="audi_conpassword_edit">
</div>
<div class="form-group">
<label for="text">Designation:</label>
<input type="text" class="form-control" id="audi_designation_edit" name="audi_designation_edit" required="" value="<?php echo $value['db_designation']; ?>">
</div>
<div class="form-group">
<label for="text">Type:</label>
<input type="text" class="form-control" id="audi_designation_edit" name="audi_designation_edit" required="" value="<?php echo $value['db_designation']; ?>">
</div>
<center>
<button type="submit" class="btn btn-default" onclick="editauditor('<?php echo $value['userId'];?>')">Submit</button>
</center>
</form>
</div>
</div>
</div>
</div>
<!-- end Modal -->
<?php } ?>
</tbody>
</table>
<div class="col-md-12 btn_blu">
<button class="btn" data-toggle="modal" data-target="#create-auditor"> <i class="fa fa-user" aria-hidden="true"></i>
Create New Auditor</button>
</div>
<div class="auditorslist_edit" style="display: none;" >
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<div class="box box-primary" style="min-height: 978px;">
<div class="box-body">
<div class="profie-02" id="edit-pro">
<div class="header-auditorslist">
<h3>Create Your Profile</h3>
</div>
<div class="col-md-4 col-sm-12 col-xs-12">
<div class="auditorslist_pic_changis">
<div class="auditorslist_pic_show">
<div class="circle">
<!-- User Profile Image -->
<img class="auditorslist-pic" src="http://manage.beatleanalytics.com/theme/black/images/noimage_responsive.png">
<!-- Default Image -->
<!-- <i class="fa fa-user fa-5x"></i> -->
</div>
<div class="p-image">
<i class="fa fa-camera upload-button"></i>
<input class="file-upload" type="file" accept="image/*" />
</div>
</div>
<p class="auditorslist_size">(Maximum File size 500KB)</p>
<div class="complete_auditorslist">
<h3> Profile Completeness : <span style="color:#096">80%</span></h3>
<div class="sparkbar" data-color="#00a65a" data-height="">
<div class="progress progress-xs progress-striped active">
<div class="progress-bar progress-bar-success" style="width: 80%"></div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-8 col-sm-12 col-xs-12 filled-section-right">
<div class="--">
<!-- /.box-header -->
<!-- form start -->
<form class="form-horizontal">
<div class="box-body">
<div class="form-group">
<label for="Choose Id" class="col-sm-2 control-label">Choose Id : </label>
<div class="col-sm-10">
<input type="text" class="form-control" id="username" placeholder="Choose Id ">
</div>
</div>
<div class="form-group">
<label for="Full Name" class="col-sm-2 control-label">Full Name : </label>
<div class="col-sm-10">
<input type="text" class="form-control" id="Full Name" placeholder="Full Name">
</div>
</div>
<div class="form-group">
<label for="email" class="col-sm-2 control-label">Email Id : </label>
<div class="col-sm-10">
<input type="email" class="form-control" id="email" placeholder="Email Id">
</div>
</div>
<div class="form-group">
<label for="Phone No" class="col-sm-2 control-label">Phone No : </label>
<div class="col-sm-10">
<input type="tel" class="form-control" id="contact_number" placeholder="contact_number">
</div>
</div>
<div class="form-group">
<label for="Address" class="col-sm-2 control-label">Address : </label>
<div class="col-sm-10">
<textarea class="form-control" rows="2" placeholder="Address ..."></textarea>
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">PIN Code : </label>
<div class="col-sm-10">
<input type="text" class="form-control" id="PIN Code" placeholder="PIN Code">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">State : </label>
<div class="col-sm-10">
<select class="form-control select2" style="width: 100%;">
<option selected="selected">State 1</option>
<option>State 2</option>
<option>State 3</option>
</select>
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">City : </label>
<div class="col-sm-10">
<select class="form-control select2" style="width: 100%;">
<option selected="selected">City 1</option>
<option>City 2</option>
<option>City 3</option>
</select>
</div>
</div>
<div class="form-group">
<label for="Address" class="col-sm-2 control-label">About Me : </label>
<div class="col-sm-10">
<textarea class="form-control" rows="2" placeholder="Write something about you here...."></textarea>
</div>
</div>
</div>
<!-- /.box-body -->
<div class="box-footer">
<button type="submit" onclick="javascript: return validateFrom();" id="show" class="btn pr-save">Save</button>
<button type="button" class="btn pass_chang" data-toggle="modal" data-target="#modal-warning">
Change Password
</button>
</div>
<!-- /.box-footer -->
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<!-- /.content-wrapper -->
<!-- Modal -->
<div class="modal fade" id="create-auditor" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Create Auditor </h4>
</div>
<div class="modal-body">
<form method="POST" id="form_auditor_create">
<p class="cust_filed">Divisional office <span class="ans"><?php echo $rsUserData[0]['DivisionName'] ?></span></p>
<p class="cust_filed">Station <span class="ans"><?php echo $rsUserData[0]['stationName'] ?></span></p>
<input type="hidden" name="acn" value="insertAuditorDetails">
<input type="hidden" name="OrgID" value="<?php echo $rsUserData[0]['OrgID'] ?>">
<input type="hidden" name="DivisionId" value="<?php echo $rsUserData[0]['DivisionId'] ?>">
<input type="hidden" name="StationId" value="<?php echo $rsUserData[0]['stationId'] ?>">
<div class="form-group">
<label for="text">Username:</label>
<input type="text" class="form-control" id="audi_username" name="audi_username" required="">
</div>
<div class="form-group">
<label for="text">Full Name:</label>
<input type="text" class="form-control" id="audi_fullname" name="audi_fullname" required="">
</div>
<div class="form-group">
<label for="tal">Mobile:</label>
<input type="tal" class="form-control" id="audi_contact_number" name="audi_contact_number" maxlength="10" required="">
</div>
<div class="form-group">
<label for="email">Email address:</label>
<input type="email" class="form-control" id="audi_email" name="audi_email" required="">
</div>
<div class="form-group">
<label for="pwd">Password:</label>
<input type="password" class="form-control" id="audi_password" name="audi_password" required="">
</div>
<div class="form-group">
<label for="pwd">Confirm Password:</label>
<input type="password" class="form-control" id="audi_conpassword" name="audi_conpassword" required="">
</div>
<div class="form-group">
<label for="text">Designation:</label>
<input type="text" class="form-control" id="audi_designation" name="audi_designation" required="">
</div>
<div class="form-group">
<label for="text">Type : </label>
<label class="checkbox-inline">
<input type="checkbox" value=""> CTS
</label>
<label class="checkbox-inline">
<input type="checkbox" value="">PCT
</label>
<label class="checkbox-inline">
<input type="checkbox" value=""> WAT
</label>
</div>
<center>
<button type="submit" class="btn btn-default">Submit</button>
</center>
</form>
</div>
</div>
</div>
</div>
<!-- jQuery 3 -->
<script src="theme/black/bower_components/jquery/dist/jquery.min.js"></script>
<!-- jQuery UI 1.11.4 -->
<script src="bower_components/jquery-ui/jquery-ui.min.js"></script>
<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
<script>
$.widget.bridge('uibutton', $.ui.button);
</script>
<!-- Bootstrap 3.3.7 -->
<script src="theme/black/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<!-- Morris.js charts -->
<script src="theme/black/bower_components/raphael/raphael.min.js"></script>
<script src="theme/black/bower_components/morris.js/morris.min.js"></script>
<!-- Sparkline -->
<script src="theme/black/bower_components/jquery-sparkline/dist/jquery.sparkline.min.js"></script>
<!-- jvectormap -->
<script src="theme/black/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
<script src="theme/black/plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
<!-- jQuery Knob Chart -->
<script src="theme/black/bower_components/jquery-knob/dist/jquery.knob.min.js"></script>
<!-- daterangepicker -->
<script src="theme/black/bower_components/moment/min/moment.min.js"></script>
<script src="theme/black/bower_components/bootstrap-daterangepicker/daterangepicker.js"></script>
<!-- datepicker -->
<script src="theme/black/bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
<!-- Bootstrap WYSIHTML5 -->
<script src="theme/black/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
<!-- Slimscroll -->
<script src="theme/black/bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="theme/black/bower_components/fastclick/lib/fastclick.js"></script>
<!-- AdminLTE App -->
<script src="theme/black/dist/js/adminlte.min.js"></script>
<!-- AdminLTE dashboard demo (This is only for demo purposes) -->
<script src="theme/black/dist/js/pages/dashboard.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="theme/black/dist/js/demo.js"></script>
<style>
.small-box>.inner {
border-radius: 0px !IMPORTANT;
}
.bi_box.subscription {
background-image: linear-gradient(to bottom right, #ffffff, #f4f4f4);
}
</style>
<!-- FLOT CHARTS -->
<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<!-- FLOT CHARTS -->
<script src="theme/black/bower_components/Flot/jquery.flot.js"></script>
<!-- FLOT RESIZE PLUGIN - allows the chart to redraw when the window is resized -->
<script src="theme/black/bower_components/Flot/jquery.flot.resize.js"></script>
<!-- FLOT PIE PLUGIN - also used to draw donut charts -->
<script src="theme/black/bower_components/Flot/jquery.flot.pie.js"></script>
<!-- FLOT CATEGORIES PLUGIN - Used to draw bar charts -->
<script src="theme/black/bower_components/Flot/jquery.flot.categories.js"></script>
<script>
$(document).ready(function(){
// ================== DELETE USER START FROM HERE ========================
$(".deluser").click(function(){
var txt;
var r = confirm("Would you like to delete this auditor ?");
if (r == true)
{
var deluser = $(this);
var id = deluser.attr('data-uid');
var token = 'deleteuser';
$.ajax({
type : 'POST',
url : 'runajax.php',
data : {id:id,acn:'deleteAuditorById'},
success : function(res)
{
//alert(res);
$("#rowid_"+id).hide('500');
}
});
}
else
{
}
});
});
function editauditor(auditorId) {
$( "#form_auditor_edit"+auditorId ).submit(function( event ) {
var $this = $(this);
url = 'runajax.php';
var pass = $('#audi_password_edit'+auditorId).val();
var conpass = $('#audi_conpassword_edit'+auditorId).val();
var canEdit = true;
if(pass != "" && conpass != "") {
if(pass != conpass) {
//$.toastr.error('password not match', {position: 'top-center',size: 'lg',time: 5000});
alert('password not match');
canEdit = false;
return false;
}
}
// if(pass != conpass) {
// //$.toastr.error('password not match', {position: 'top-center',size: 'lg',time: 5000});
// alert('password not match');
// return false;
// } else{
if(canEdit == true){
var formDatapro = new FormData(this);
$.ajax({
type: 'POST',
url : url,
data: formDatapro,
beforeSend: function() {
//$this.after('<div class="ldr"><i class="fa fa-circle-o-notch fa-spin"></i></div>');
},
success : function(data) {
//$('.ldr').hide();
//$('#create-auditor').modal('hide');
// console.log(data);
alert('successfully auditor edited');
location.reload();
// if(data == 'done'){
// $.toastr.success('Success Edited Profile.', {position: 'top-center',size: 'lg',time: 5000});
// }else{
// $.toastr.error('Profile not edited', {position: 'top-center',size: 'lg',time: 5000});
// return false;
// }
},
cache: false,
contentType: false,
processData: false
});
}
event.preventDefault();
});
}
</script>
<script>
$( "#form_auditor_create" ).submit(function( event ) {
var $this = $(this);
url = 'runajax.php';
var pass = $('#audi_password').val();
var conpass = $('#audi_conpassword').val();
if(pass != conpass) {
//$.toastr.error('password not match', {position: 'top-center',size: 'lg',time: 5000});
alert('password not match');
return false;
} else{
var formDatapro = new FormData(this);
$.ajax({
type: 'POST',
url : url,
data: formDatapro,
beforeSend: function() {
//$this.after('<div class="ldr"><i class="fa fa-circle-o-notch fa-spin"></i></div>');
},
success : function(data) {
//$('.ldr').hide();
//$('#create-auditor').modal('hide');
//console.log(data);
alert('successfully auditor created');
$('#audi_username').val('');
$('#audi_fullname').val('');
$('#audi_contact_number').val('');
$('#audi_email').val('');
$('#audi_password').val('');
$('#audi_conpassword').val('');
$('#audi_designation').val('');
// if(data == 'done'){
// $.toastr.success('Success Edited Profile.', {position: 'top-center',size: 'lg',time: 5000});
// }else{
// $.toastr.error('Profile not edited', {position: 'top-center',size: 'lg',time: 5000});
// return false;
// }
},
cache: false,
contentType: false,
processData: false
});
}
event.preventDefault();
});
$(function () {
"use strict";
// AREA CHART
// LINE CHART
//DONUT CHART
var donut = new Morris.Donut({
element: 'sales-chart',
resize: true,
colors: ["#3c8dbc","#00a65a"],
data: [
{label: " Used", value: 90 },
{label: "Unused ", value: 10 }
],
hideHover: 'auto'
});
//BAR CHART
});
</script>
<script>
$(document).ready(function(){
$("#hide").click(function(){
$(".auditorslist").hide();
$(".auditorslist_edit").show();
});
$("#show").click(function(){
$(".auditorslist").show();
$(".auditorslist_edit").hide();
});
});
</script>
<script>
$(document).ready(function() {
var readURL = function(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function(e) {
$(".auditorslist-pic").attr("src", e.target.result);
};
reader.readAsDataURL(input.files[0]);
}
};
$(".file-upload").on("change", function() {
readURL(this);
});
$(".upload-button").on("click", function() {
$(".file-upload").click();
});
});
</script>
<script>
$(document).ready(function() {
$('#example').DataTable();
} );
</script>
<style>
.auditorslist_card {
margin-top: 19px;
}
.auditorslist_card {
border: 1px solid #a2a2a2;
clear: both;
float: left;
box-shadow: 2px 2px 6px #777777;
}
.box-body.chart-responsive {
margin: 0px;
padding-top: 0px;
}
.bi_box p {
color: #000000 !IMPORTANT;
FONT-SIZE: 20PX;
}
.bi_box {
text-align: center;
padding-top: 22px;
}
img.auditors_img {
width: 105px;
margin: 0 auto;
border: 3px solid #fff;
border-radius: 81px;
box-shadow: 3px 3px 8px #cecece;
}
.round_border {
padding: 2px;
border: 1px solid #969696;
margin-bottom: 22px;
border-radius: 5px;
box-shadow: 2px 2px 4px #b5b5b5;
}
.bi_box {
border-radius: 5px;
}
.auditors {
background-color: #0099ea;
background-image: linear-gradient(to bottom right, #ffffff, #f4f4f4);
}
.subscription {
background-color: #0099ea;
background-image: linear-gradient(to bottom right, #1788c9, #1aa4f4);
}
.create_auditor {
background-color: #0099ea;
background-image: linear-gradient(to bottom right, #3071e5, #0fb5d4);
}
.edit_auditorslist {
background-color: #0099ea;
background-image: linear-gradient(to bottom right, #2c868f, #10b9c0);
}
body.skin-blue.fixed.sidebar-mini.sidebar-mini-expand-feature.sidebar-collapse .wrapper .content-wrapper {
height: 100vh !IMPORTANT;
}
.bi_box {
border: 1px solid #ddd;
height: 211px;
}
* {
font-weight: 200;
}
.action_view {
width: 100%;
float: left;
padding: 7px 0 14px 0;
}
.action_view a {
font-size: 17px;
color: black;
margin-right: 58px;
text-decoration: none;
}
.action a img {
width: 162px !IMPORTANT;
margin-right: 45px;
}
span.data {
text-align: right;
float: right;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
width: 283px;
}
.beatle_point p {
margin: 14px 0 14px 0 !IMPORTANT;
font-size: 17px !IMPORTANT;
font-weight: 100;
color: #2a2a2a !IMPORTANT;
}
.beatle_point p span {
margin-left: 7px !IMPORTANT;
font-weight: 600 !IMPORTANT;
color: #989898 !IMPORTANT;
}
.beatle_point img {
width: 105px;
}
.beatle_point {
text-align: center;
margin-top: 17px;
}
.col-xs-2{
color:#FFF;
}
.col-half-offset{
margin-left:4.166666667%;
padding: 0px;
}
.basic-info p b { border-bottom: 1px solid #e4e4e4;}
.basic-info.status_right {
margin-top: 20px;
}
.basic-info p b {
font-size: 17px;
color: black;
margin: 6px 0px !IMPORTANT;
float: left;
width: 100%;
}
.basic-info p {
margin: 0 0 7px 0;
font-size: 15px;
color: #000000;
}
.basic-info {
background: #f8f8f8;
padding:9px 18px 0px 18px;
width: 100%;
float: left;
}
.p-count span , .e-count span , .s-count span {
font-size: 20px;
}
.p-count {
border-right: 1px solid #83ccf1;
}
.s-count {
border-left: 1px solid #83ccf1;
}
.pes-count {
background: #00aaff;
float: left;
width: 100%;
}
.p-count , .e-count , .s-count {
padding: 8px 0 0 0;
color: #FFF;
width: 33.33%;
float: left;
text-align: center;
}
.card-info span {
float: left;
width: 100%;color:#fff;
}
/* USER PROFILE PAGE */
.card {
padding: 30px;
background-color: rgba(214, 224, 226, 0.2);
-webkit-border-top-left-radius:5px;
-moz-border-top-left-radius:5px;
border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
-moz-border-top-right-radius:5px;
border-top-right-radius:5px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.card.hovercard {
position: relative;
padding-top: 0;
overflow: hidden;
text-align: center;
background-color: #fff;
background-color: rgba(255, 255, 255, 1);
}
.card.hovercard .card-background {
height: 170px;
}
.card-background img {
-webkit-filter: blur(25px);
-moz-filter: blur(25px);
-o-filter: blur(25px);
-ms-filter: blur(25px);
filter: blur(25px);
margin-left: -100px;
margin-top: -200px;
min-width: 130%;
}
.card.hovercard .useravatar {
position: absolute;
top: 15px;
left: 0;
right: 0;
}
.card.hovercard .useravatar img {
width: 100px;
height: 100px;
max-width: 100px;
max-height: 100px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
border: 5px solid rgba(255, 255, 255, 0.5);
}
.card.hovercard .card-info {
position: absolute;
bottom: 14px;
left: 0;
right: 0;
}
span.card-position {
padding: 0 5px;
font-size: 14px;
line-height: 1;
border-radius: 4px;
margin: 3px 0;
}
span.card-add {
padding: 0 5px;
font-size:14px;
line-height: 1;
border-radius: 4px;
}
.card.hovercard .card-info .card-title {
padding: 0 5px;
font-size: 16px;
line-height: 1;
border-radius: 4px;
}
.card.hovercard .card-info {
overflow: hidden;
font-size: 12px;
line-height: 20px;
color: #737373;
text-overflow: ellipsis;
}
.card.hovercard .bottom {
padding: 0 20px;
margin-bottom: 17px;
}
</style>
<style>
.header-auditorslist {
background: #ddd;
padding: 1px 0 7px 23px;
border-radius: 8px;
margin-bottom: 15px;
box-shadow: 2px 2px 1px #888888;
}
.auditorslist_pic_changis {
background: #ffffff;
height: 400px;
box-shadow: 2px 2px 9px #a2a2a2;
}
p.auditorslist_size {
text-align: center;
margin: 16px 0;
font-size: 16px;
color: #01a70d;
}
.auditorslist_pic_show {
height: 233px;
background: #ecf0f5;
box-shadow: 0 2px 1px #c5c5c5;
}
.auditorslist-pic {
max-width: 200px;
max-height: 200px;
display: block;
}
.file-upload {
display: none;
}
.circle {
border-radius: 1000px !important;
overflow: hidden;
width: 128px;
height: 128px;
border: 8px solid rgba(255, 255, 255, 0.7);
position: absolute;
top: 72px;
}
.auditorslist_pic_changis img {
max-width: 100%;
height: auto;
}
.p-image {
position: absolute;
top: 167px;
right: 30px;
color: #666666;
transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.p-image:hover {
transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.upload-button {
font-size: 1.2em;
}
.upload-button:hover {
transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
color: #999;
}
input.file-upload {
display: none;
}
.circle {
top: 26%;
left: 50%;
transform: translate(-50%,-50%);
border: 1px solid #ddd;
}
.p-image {
width: 38px;
position: absolute;
top: 37%;
left: 59%;
transform: translate(-50%,-50%);
position: absolute;
/* top: 121px; */
right: 30px;
color: #666666;
transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
border: 2px solid #ddd;
border-radius: 33px;
height: 38px;
text-align: center;
line-height: 7 !IMPORTANT;
padding: 9px 0 0 0;
background: #dddddd;
}
.auditorslist_pic_changis img {
width: 100% !important;
height: 8vw !important;
object-fit: cover !important;
}
.complete_auditorslist {
width: 80%;
margin: 0 auto;
}
.complete_auditorslist h3 {
font-size: 16px;
}
.complete_auditorslist {
margin-top: 40px;
}
.content-wrapper {
min-height: 600px !important;
}
</style>