Connect

package com.employee.controllers;

import java.util.ArrayList;
import java.util.List;
import java.util.Map;
import java.util.TreeMap;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.validation.Valid;

import org.apache.log4j.Logger;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.servlet.ModelAndView;

import com.employee.beans.EmployeeBean;
import com.employee.beans.EmployeeHistBean;
import com.employee.dao.EmpDao;
import com.employee.validator.EmployeeValidator;

/**
 * @author Fredrik
 *
 */
@Controller
public class EmpSearchController {

final static Logger logger = Logger.getLogger(EmpSearchController.class);

@Autowired
EmpDao dao;// will inject dao from xml file
// @Autowired
// EmployeeValidator employeeValidator;

//method to View Employee List page
@RequestMapping(value = "/empsearch", method = RequestMethod.POST)
protected ModelAndView empSearch(@ModelAttribute("emp") EmployeeBean emp, HttpServletRequest request,
HttpServletResponse response, Model m) {

ModelAndView model = new ModelAndView("empsearch");
try {
List<EmployeeBean> empList = dao.searcheEmployee(emp);
logger.info("empList**" + empList.size());
m.addAttribute("empList", empList);
if (empList.size() == 0) {
request.setAttribute("no_records", "Sorry, employee record could not be found!!");
}
} catch (Exception e) {
logger.info("Exception in empSearch method");
logger.error(e.getMessage());
}
return model;
}

/**
* @param emp
* @param request
* @param response
* @param m
* @return
*/
@RequestMapping(value = "/csvemployee", method = RequestMethod.GET)
protected ModelAndView csvemployee(@ModelAttribute("emp") EmployeeBean emp, HttpServletRequest request,
HttpServletResponse response, Model m) {
boolean isCsvFile = false;
ModelAndView model = new ModelAndView("empsearch");
try {
isCsvFile = dao.downloadCsv(emp);
logger.info("isCsvFile" + isCsvFile);
m.addAttribute("emp", new EmployeeBean());
} catch (Exception e) {
logger.info("Exception in csvemployee method");
logger.error(e.getMessage());
}
return model;
}

//method to redirect Add new employee page
@RequestMapping(value = "/addemployee", method = RequestMethod.GET)
protected ModelAndView addemployee(@ModelAttribute("emp") EmployeeBean emp, HttpServletRequest request,
HttpServletResponse response, Model m) {
logger.info("::in add employee");
m.addAttribute("emp", new EmployeeBean());
ModelAndView model = new ModelAndView("addemployee");

return model;
}

//method to save record from add new employee page
/**
* @param emp
* @param bindingResult
* @param m
* @param request
* @return
*/
@RequestMapping(value = "/save", method = RequestMethod.POST)
protected String save(@Valid @ModelAttribute("emp") EmployeeBean emp, BindingResult bindingResult, Model m,HttpServletRequest request) {
System.out.println("in save");
if (bindingResult.hasErrors()) {
System.out.println("bindingResult"+bindingResult);
System.out.println("in error");
m.addAttribute("emp", emp);
return "addemployee";
}
try {
System.out.println("in save try");
int saved = dao.save(emp);
System.out.println("saved**"+saved);

if (saved >= 1) {
request.setAttribute("success_message", "Employee record has been saved successfully");

} else {
request.setAttribute("error_message", "Server error has encountered, Failed to save the record");
}
} catch (Exception e) {
logger.info("Exception in save method");
logger.error(e.getMessage());
}
return "addemployee";
}

//method to redirect Employee list page on click of cancel butten
// @RequestMapping(params = "cancel")
// protected String cancel() {
// System.out.println("in cancel");
// return "redirect:/";
// }

// method to edit employee record
@RequestMapping(value = "/editemp/{id}", method = RequestMethod.GET)
public String editEmployee(@ModelAttribute("emp") EmployeeBean emp, @PathVariable int id, Model m, HttpServletRequest request,
HttpServletResponse response) {
emp = dao.getEmployeeById(id);
m.addAttribute("emp", emp);
System.out.println("emp"+emp);
return "editemployee";
}

//method to save edited record
@RequestMapping(value = "/editsave", method = RequestMethod.POST)
protected String editsave(@Valid @ModelAttribute("emp") EmployeeBean emp, BindingResult br, Model m,
HttpServletRequest request, HttpServletResponse response) {

logger.info("in editsave");
if (br.hasErrors()) {
System.out.println("br"+br);
m.addAttribute("command", emp);
m.addAttribute("error", "true");
return "editemployee";
} else {
System.out.println("in save edit");
int saved = dao.saveEdit(emp);

if (saved >= 1) {
logger.info("saved::" + saved);
request.setAttribute("success_message", "Employee record has been saved successfully");

} else {
System.out.println("saved::" + saved);
request.setAttribute("error_message", "Server error has encountered, Failed to save the record");
}

// m.addAttribute("command", dao.getEmployeeById(emp.getEmp_id()));
m.addAttribute("command", emp);
return "editemployee";
}
}

//method to delete employee record
@RequestMapping(value = "/deleteemp/{id}", method = RequestMethod.GET)
public String deleteemp(@PathVariable int id, Model m, HttpServletRequest request) {
int deleted = dao.delete(id);
if (deleted >= 1) {
logger.info("deleted::" + deleted);
request.setAttribute("delete_message", "Employee record has been deleted successfully");
}
return "empsearch";
}

//method to view employee history
@RequestMapping(value = "/histemp/{id}", method = RequestMethod.GET)
protected ModelAndView histemp(@PathVariable int id, @ModelAttribute("emp") EmployeeHistBean emp,
HttpServletRequest request, HttpServletResponse response, Model m) {
logger.info("in Employee History");
ModelAndView model = new ModelAndView("employeehistory");
String empName = null;
List<EmployeeHistBean> empHistList = dao.searcheEmployeeHist(id);
logger.info("empHistList**" + empHistList.size());
for (EmployeeHistBean item : empHistList) {
empName = item.getEmp_name();
}
m.addAttribute("empNameFromList", empName);
m.addAttribute("empid", id);
m.addAttribute("empHistList", empHistList);
return model;
}

@ModelAttribute("empLevel")
public List<String> getempLevel() {
List<String> empLevel = new ArrayList<String>();
empLevel.add("7");
empLevel.add("8");
empLevel.add("9");
empLevel.add("10");
empLevel.add("11");
empLevel.add("12");
empLevel.add("13");
return empLevel;
}



_--------------------------

public class EmpSearchController {

final static Logger logger = Logger.getLogger(EmpSearchController.class);

@Autowired
EmpDao dao;// will inject dao from xml file
// @Autowired
// EmployeeValidator employeeValidator;


@RequestMapping("/getEmp")
protected ModelAndView redirect( HttpServletRequest request,
HttpServletResponse response,Model m)
{
System.out.println("in abc search *************");
System.out.println("success message attri *************"+request.getAttribute("success_message"));
ModelAndView model = new ModelAndView("empsearch");
try {
List<EmployeeBean> getEmpList = dao.getEmployees();
logger.info("getEmpList**" + getEmpList.size());
m.addAttribute("getEmpList", getEmpList);
if (getEmpList.size() == 0) {
request.setAttribute("no_records", "Sorry, employee record could not be found!!");
}
} catch (Exception e) {
logger.info("Exception in empSearch method");
logger.error(e.getMessage());
}
return model;
}

//method to View Employee List page
@RequestMapping(value = "/empsearch", method = RequestMethod.POST)
protected ModelAndView empSearch(@ModelAttribute("emp") EmployeeBean emp, HttpServletRequest request,
HttpServletResponse response, Model m) {
System.out.println("in emp search *************");

ModelAndView model = new ModelAndView("empsearch");
try {
List<EmployeeBean> empList = dao.searcheEmployee(emp);
logger.info("empList**" + empList.size());
m.addAttribute("empList", empList);

if (empList.size() == 0) {
request.setAttribute("no_records", "Sorry, employee record could not be found!!");
}
} catch (Exception e) {
logger.info("Exception in empSearch method");
logger.error(e.getMessage());
}
return model;
}

/**
* @param emp
* @param request
* @param response
* @param m
* @return
*/
@RequestMapping(value = "/csvemployee", method = RequestMethod.GET)
protected ModelAndView csvemployee(@ModelAttribute("emp") EmployeeBean emp, HttpServletRequest request,
HttpServletResponse response, Model m) {
boolean isCsvFile = false;
ModelAndView model = new ModelAndView("empsearch");
try {
isCsvFile = dao.downloadCsv(emp);
logger.info("isCsvFile" + isCsvFile);
m.addAttribute("emp", new EmployeeBean());
} catch (Exception e) {
logger.info("Exception in csvemployee method");
logger.error(e.getMessage());
}
return model;
}

//method to redirect Add new employee page
@RequestMapping(value = "/addemployee", method = RequestMethod.GET)
protected ModelAndView addemployee(@ModelAttribute("emp") EmployeeBean emp, HttpServletRequest request,
HttpServletResponse response, Model m) {
System.out.println("in add employee**************");
logger.info("::in add employee");
m.addAttribute("emp", new EmployeeBean());
ModelAndView model = new ModelAndView("addemployee");

return model;
}

//method to save record from add new employee page
/**
* @param emp
* @param bindingResult
* @param m
* @param request
* @return
*/
@RequestMapping(value = "/save", method = RequestMethod.POST)
protected String save(@Valid @ModelAttribute("emp") EmployeeBean emp, BindingResult bindingResult, Model m,HttpServletRequest request) {
System.out.println("in save");
if (bindingResult.hasErrors()) {
System.out.println("bindingResult"+bindingResult);
System.out.println("in error");
m.addAttribute("emp", emp);
return "addemployee";
}
try {
System.out.println("in save try");
int saved = dao.save(emp);
System.out.println("saved**"+saved);

if (saved >= 1) {
request.setAttribute("success_message", "Employee record has been saved successfully");
m.addAttribute("success_message", "Employee record has been saved successfully");
System.out.println("attri********"+m.containsAttribute("success_message"));

List<EmployeeBean> getEmpList = dao.getEmployees();
logger.info("getEmpList**" + getEmpList.size());
m.addAttribute("getEmpList", getEmpList);

return "empsearch";
} else {
request.setAttribute("error_message", "Server error has encountered, Failed to save the record");
return "redirect:getEmp";
}
} catch (Exception e) {
logger.info("Exception in save method");
logger.error(e.getMessage());
}
// return "addemployee";
System.out.println("hiiiiiiiiiiiiiiiii");
return "addemployee";
}

//method to redirect Employee list page on click of cancel butten
// @RequestMapping(params = "cancel")
// protected String cancel() {
// System.out.println("in cancel");
// return "redirect:/";
// }

// method to edit employee record
@RequestMapping(value = "/editemp/{id}", method = RequestMethod.GET)
public String editEmployee(@ModelAttribute("emp") EmployeeBean emp, @PathVariable int id, Model m, HttpServletRequest request,
HttpServletResponse response) {
emp = dao.getEmployeeById(id);
m.addAttribute("emp", emp);
System.out.println("emp"+emp.getDateOfBirth());
System.out.println("emp"+emp.getDob());
System.out.println("emp"+emp.getDateOfJoin());
System.out.println("emp"+emp.getDoj());
return "editemployee";
}

//method to save edited record
@RequestMapping(value = "/editsave", method = RequestMethod.POST)
protected String editsave(@Valid @ModelAttribute("emp") EmployeeBean emp, BindingResult br, Model m,
HttpServletRequest request, HttpServletResponse response) {

logger.info("in editsave");
if (br.hasErrors()) {
System.out.println("br"+br);
m.addAttribute("command", emp);
m.addAttribute("error", "true");
return "editemployee";
} else {
System.out.println("in save edit");
int saved = dao.saveEdit(emp);

if (saved >= 1) {
logger.info("saved::" + saved);
request.setAttribute("success_message", "Employee record has been saved successfully");

} else {
System.out.println("saved::" + saved);
request.setAttribute("error_message", "Server error has encountered, Failed to save the record");
}

// m.addAttribute("command", dao.getEmployeeById(emp.getEmp_id()));
m.addAttribute("command", emp);
return "editemployee";
}
}

//method to delete employee record
@RequestMapping(value = "/deleteemp/{id}", method = RequestMethod.GET)
public String deleteemp(@PathVariable int id, Model m, HttpServletRequest request) {
int deleted = dao.delete(id);
if (deleted >= 1) {
logger.info("deleted::" + deleted);
request.setAttribute("delete_message", "Employee record has been deleted successfully");
}
return "empsearch";
}

//method to view employee history
@RequestMapping(value = "/histemp/{id}", method = RequestMethod.GET)
protected ModelAndView histemp(@PathVariable int id, @ModelAttribute("emp") EmployeeHistBean emp,
HttpServletRequest request, HttpServletResponse response, Model m) {
logger.info("in Employee History");
ModelAndView model = new ModelAndView("employeehistory");
String empName = null;
List<EmployeeHistBean> empHistList = dao.searcheEmployeeHist(id);
logger.info("empHistList**" + empHistList.size());
for (EmployeeHistBean item : empHistList) {
empName = item.getEmp_name();
}
m.addAttribute("empNameFromList", empName);
m.addAttribute("empid", id);
m.addAttribute("empHistList", empHistList);
return model;
}

@ModelAttribute("empLevel")
public List<String> getempLevel() {
List<String> empLevel = new ArrayList<String>();
empLevel.add("7");
empLevel.add("8");
empLevel.add("9");
empLevel.add("10");
empLevel.add("11");
empLevel.add("12");
empLevel.add("13");
return empLevel;
}

@ModelAttribute("bloodGroup")
public Map<String, String> getbloodGroup() {
Map<String, String> bloodGroup = new TreeMap<String, String>();
bloodGroup.put("A+", "A+");
bloodGroup.put("A-", "A-");
bloodGroup.put("B+", "B+");
bloodGroup.put("B-", "B-");
bloodGroup.put("O+", "O+");
bloodGroup.put("O-", "O-");
bloodGroup.put("AB+", "AB+");
bloodGroup.put("AB-", "AB-");
return bloodGroup;
}

@ModelAttribute("gender")
public Map<String, String> getGender() {
Map<String, String> gender = new TreeMap<String, String>();
gender.put("Male", "Male");
gender.put("Female", "Female");
gender.put("ND", "ND");
return gender;
}
}

@ModelAttribute("bloodGroup")
public Map<String, String> getbloodGroup() {
Map<String, String> bloodGroup = new TreeMap<String, String>();
bloodGroup.put("A+", "A+");
bloodGroup.put("A-", "A-");
bloodGroup.put("B+", "B+");
bloodGroup.put("B-", "B-");
bloodGroup.put("O+", "O+");
bloodGroup.put("O-", "O-");
bloodGroup.put("AB+", "AB+");
bloodGroup.put("AB-", "AB-");
return bloodGroup;
}

@ModelAttribute("gender")
public Map<String, String> getGender() {
Map<String, String> gender = new TreeMap<String, String>();
gender.put("Male", "Male");
gender.put("Female", "Female");
gender.put("ND", "ND");
return gender;
}
}

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">
<div class="container">
    <div class="col-md-12 col-lg-6">
        <div class="panel">
         <!--Heading-->
      <div class="panel-heading">
       <div class="panel-control">
        <div class="btn-group">
         <button class="btn btn-default" type="button" data-toggle="collapse" data-target="#demo-chat-body"><i class="fa fa-chevron-down"></i></button>
         <button type="button" class="btn btn-default" data-toggle="dropdown"><i class="fa fa-gear"></i></button>
         <ul class="dropdown-menu dropdown-menu-right">
          <li><a href="#">Available</a></li>
          <li><a href="#">Busy</a></li>
          <li><a href="#">Away</a></li>
          <li class="divider"></li>
          <li><a id="demo-connect-chat" href="#" class="disabled-link" data-target="#demo-chat-body">Connect</a></li>
          <li><a id="demo-disconnect-chat" href="#" data-target="#demo-chat-body">Disconect</a></li>
         </ul>
        </div>
       </div>
       <h3 class="panel-title">Chat</h3>
      </div>
    
      <!--Widget body-->
      <div id="demo-chat-body" class="collapse in">
       <div class="nano has-scrollbar" style="height:380px">
        <div class="nano-content pad-all" tabindex="0" style="right: -17px;">
         <ul class="list-unstyled media-block">
          <li class="mar-btm">
           <div class="media-left">
            <img src="https://bootdey.com/img/Content/avatar/avatar1.png" class="img-circle img-sm" alt="Profile Picture">
           </div>
           <div class="media-body pad-hor">
            <div class="speech">
             <a href="#" class="media-heading">John Doe</a>
             <p>Hello Lucy, how can I help you today ?</p>
             <p class="speech-time">
             <i class="fa fa-clock-o fa-fw"></i>09:23AM
             </p>
            </div>
           </div>
          </li>
          <li class="mar-btm">
           <div class="media-right">
            <img src="https://bootdey.com/img/Content/avatar/avatar2.png" class="img-circle img-sm" alt="Profile Picture">
           </div>
           <div class="media-body pad-hor speech-right">
            <div class="speech">
             <a href="#" class="media-heading">Lucy Doe</a>
             <p>Hi, I want to buy a new shoes.</p>
             <p class="speech-time">
              <i class="fa fa-clock-o fa-fw"></i> 09:23AM
             </p>
            </div>
           </div>
          </li>
          <li class="mar-btm">
           <div class="media-left">
            <img src="https://bootdey.com/img/Content/avatar/avatar1.png" class="img-circle img-sm" alt="Profile Picture">
           </div>
           <div class="media-body pad-hor">
            <div class="speech">
             <a href="#" class="media-heading">John Doe</a>
             <p>Shipment is free. You\'ll get your shoes tomorrow!</p>
             <p class="speech-time">
              <i class="fa fa-clock-o fa-fw"></i> 09:25
             </p>
            </div>
           </div>
          </li>
          <li class="mar-btm">
           <div class="media-right">
            <img src="https://bootdey.com/img/Content/avatar/avatar2.png" class="img-circle img-sm" alt="Profile Picture">
           </div>
           <div class="media-body pad-hor speech-right">
            <div class="speech">
             <a href="#" class="media-heading">Lucy Doe</a>
             <p>Wow, that\'s great!</p>
             <p class="speech-time">
              <i class="fa fa-clock-o fa-fw"></i> 09:27
             </p>
            </div>
           </div>
          </li>
          <li class="mar-btm">
           <div class="media-right">
            <img src="https://bootdey.com/img/Content/avatar/avatar2.png" class="img-circle img-sm" alt="Profile Picture">
           </div>
           <div class="media-body pad-hor speech-right">
            <div class="speech">
             <a href="#" class="media-heading">Lucy Doe</a>
             <p>Ok. Thanks for the answer. Appreciated.</p>
             <p class="speech-time">
             <i class="fa fa-clock-o fa-fw"></i> 09:28
             </p>
            </div>
           </div>
          </li>
          <li class="mar-btm">
           <div class="media-left">
            <img src="https://bootdey.com/img/Content/avatar/avatar1.png" class="img-circle img-sm" alt="Profile Picture">
           </div>
           <div class="media-body pad-hor">
            <div class="speech">
             <a href="#" class="media-heading">John Doe</a>
             <p>You are welcome! <br> Is there anything else I can do for you today?</p>
             <p class="speech-time">
              <i class="fa fa-clock-o fa-fw"></i> 09:30
             </p>
            </div>
           </div>
          </li>
          <li class="mar-btm">
           <div class="media-right">
            <img src="https://bootdey.com/img/Content/avatar/avatar2.png" class="img-circle img-sm" alt="Profile Picture">
           </div>
           <div class="media-body pad-hor speech-right">
            <div class="speech">
             <a href="#" class="media-heading">Lucy Doe</a>
             <p>Nope, That\'s it.</p>
             <p class="speech-time">
              <i class="fa fa-clock-o fa-fw"></i> 09:31
             </p>
            </div>
           </div>
          </li>
          <li class="mar-btm">
           <div class="media-left">
            <img src="https://bootdey.com/img/Content/avatar/avatar1.png" class="img-circle img-sm" alt="Profile Picture">
           </div>
           <div class="media-body pad-hor">
            <div class="speech">
             <a href="#" class="media-heading">John Doe</a>
             <p>Thank you for contacting us today</p>
             <p class="speech-time">
              <i class="fa fa-clock-o fa-fw"></i> 09:32
             </p>
            </div>
           </div>
          </li>
         </ul>
        </div>
       <div class="nano-pane"><div class="nano-slider" style="height: 141px; transform: translate(0px, 0px);"></div></div></div>
    
       <!--Widget footer-->
       <div class="panel-footer">
        <div class="row">
         <div class="col-xs-9">
          <input type="text" placeholder="Enter your text" class="form-control chat-input">
         </div>
         <div class="col-xs-3">
          <button class="btn btn-primary btn-block" type="submit">Send</button>
         </div>
        </div>
       </div>
      </div>
     </div>
    </div>
</div×

body{
    margin-top:20px;
    background:#ebeef0;
}
.panel {
    box-shadow: 0 2px 0 rgba(0,0,0,0.075);
    border-radius: 0;
    border: 0;
    margin-bottom: 24px;
}
.panel .panel-heading, .panel>:first-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.panel-heading {
    position: relative;
    height: 50px;
    padding: 0;
    border-bottom:1px solid #eee;
}
.panel-control {
    height: 100%;
    position: relative;
    float: right;
    padding: 0 15px;
}
.panel-title {
    font-weight: normal;
    padding: 0 20px 0 20px;
    font-size: 1.416em;
    line-height: 50px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.panel-control>.btn:last-child, .panel-control>.btn-group:last-child>.btn:first-child {
    border-bottom-right-radius: 0;
}
.panel-control .btn, .panel-control .dropdown-toggle.btn {
    border: 0;
}
.nano {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.nano>.nano-content {
    position: absolute;
    overflow: scroll;
    overflow-x: hidden;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.pad-all {
    padding: 15px;
}
.mar-btm {
    margin-bottom: 15px;
}
.media-block .media-left {
    display: block;
    float: left;
}
.img-sm {
    width: 46px;
    height: 46px;
}
.media-block .media-body {
    display: block;
    overflow: hidden;
    width: auto;
}
.pad-hor {
    padding-left: 15px;
    padding-right: 15px;
}
.speech {
    position: relative;
    background: #b7dcfe;
    color: #317787;
    display: inline-block;
    border-radius: 0;
    padding: 12px 20px;
}
.speech:before {
    content: "";
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    left: 0;
    top: 0;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-right: 7px solid #b7dcfe;
    margin: 15px 0 0 -6px;
}
.speech-right>.speech:before {
    left: auto;
    right: 0;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 7px solid #ffdc91;
    border-right: 0;
    margin: 15px -6px 0 0;
}
.speech .media-heading {
    font-size: 1.2em;
    color: #317787;
    display: block;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    margin-bottom: 10px;
    padding-bottom: 5px;
    font-weight: 300;
}
.speech-time {
    margin-top: 20px;
    margin-bottom: 0;
    font-size: .8em;
    font-weight: 300;
}
.media-block .media-right {
    float: right;
}
.speech-right {
    text-align: right;
}
.pad-hor {
    padding-left: 15px;
    padding-right: 15px;
}
.speech-right>.speech {
    background: #ffda87;
    color: #a07617;
    text-align: right;
}
.speech-right>.speech .media-heading {
    color: #a07617;
}
.btn-primary, .btn-primary:focus, .btn-hover-primary:hover, .btn-hover-primary:active, .btn-hover-primary.active, .btn.btn-active-primary:active, .btn.btn-active-primary.active, .dropdown.open>.btn.btn-active-primary, .btn-group.open .dropdown-toggle.btn.btn-active-primary {
    background-color: #579ddb;
    border-color: #5fa2dd;
    color: #fff !important;
}
.btn {
    cursor: pointer;
    /* background-color: transparent; */
    color: inherit;
    padding: 6px 12px;
    border-radius: 0;
    border: 1px solid 0;
    font-size: 11px;
    line-height: 1.42857;
    vertical-align: middle;
    -webkit-transition: all .25s;
    transition: all .25s;
}
.form-control {
    font-size: 11px;
    height: 100%;
    border-radius: 0;
    box-shadow: none;
    border: 1px solid #e9e9e9;
    transition-duration: .5s;
}
.nano>.nano-pane {
    background-color: rgba(0,0,0,0.1);
    position: absolute;
    width: 5px;
    right: 0;
    top: 0;
    bottom: 0;
    opacity: 0;
    -webkit-transition: all .7s;
    transition: all .7s;
}