style/less/layout/connect_page.less
@CN_CONTENT_TOP: 34px;
@CN_CONTENT_BTM: 64px;

#cn {
	position: absolute;
  z-index:2;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	#cn_rhs_inner *,#cn_env_add a,input{
    .ui-font-mixin;
  }
  input:not([type=button]):not([type=file]):not([type=submit]):not([type=checkbox]),textarea{
    border-radius: 2px;
    padding-left: 5px;
    line-height: 24px;
  }
  select {
    height:26px;
  }

  label{
    font-weight:600;
  }
  .cn_label {
    display: inline-block;
    width: 115px;
  }
  // input[type=checkbox]+label {
  //   display: inline-block;
  //   width: 100%;
  // }
	.hsplitbar {
		width: 7px;
	}
	.indent {
		margin-left: 24px;
	}
  .dlg_btns{
    button { margin: 2px; }
    .left{
      text-align: left;
    }
    .right{
      text-align: right;
    }
  }
  textarea {
    resize: vertical;
  }
}
#cn_favs {
  position: absolute;
  top: @CN_CONTENT_TOP;
  left: 0;
  right: 0;
  bottom: @CN_CONTENT_BTM;
	overflow: auto;
	>div {
		line-height: 36px;
		padding: 0 2px 0 8px;
		margin-bottom: 1px;
		cursor: default;

    .go {
      float: left;
    }
    .cog {
      float: right;
    }    
    .go, .cog {
      margin-top:2px;
      margin-right:5px;
      width:32px;
      height:32px;
      border-radius:2px;
      padding:1px 6px;
      font-size:1em;
      line-height:0px;
    }
  }
  
  .name{
    font-weight:600;
    font-size:14px;
  }
	div {
		position: relative;
	}
}

#cn_rhs_inner>*>.row, #cn_rhs_inner>.row, #cn_dtl>*>.row {
    padding: 3px 0px;
}
#cn_lhs {
  min-width: 400px;
	overflow: hidden;
  padding:0px;
  user-select: none;
}
#cn_rhs {
  min-width: 475px;
}
#cn_rhs_inner {
  overflow-y: auto;
  overflow-x: hidden;
  padding: 2px 8px;
  height:calc(100% - @CN_CONTENT_BTM - @CN_CONTENT_TOP);
  button{
    padding:8px;
    width: auto;
  }
  .row .col-sm-12:first-child {
    padding-bottom: 2px;
  }  
  .col{
    // >input,>select,>button{
    >input:not([type=checkbox]),>select{
      width:100%;
      &.browse {
        width: calc(100% - 35px);
      }
    }
  }
	p {
		padding: 4px 0;
	}
}
#cn_go {
	min-width: 75px;
}
#cn_env_add {
	padding-left:0px;
	a {
		font-family: @APL_FONT;
		font-size: 18px;
		text-decoration: none;
	}
}
.cn_hint {
	font-size: 14px;
	font-style: italic;
	opacity: 0.5;
}
.cn_progress {
	display: block;
	width: 100%;
	margin-bottom: 8px;
}
#cn_listen_dlg {
	width: 380px;
	height: 210px;
}
#cn_connecting_dlg {
	width: 360px;
	height: 150px;
}
.cn_dlg_content {
	padding: 8px;
	text-align: center;
}

#cn_args, #cn_env {
  width:100%;
}
.cn_head {
  width:100%;
  height: @CN_CONTENT_TOP;
  display: flex;
  align-items: center;
  font-weight: 500;
  padding: 0 8px; 
}