File: /home/confeduphaar/backip-old-files/administrator/templates/isis/less/blocks/_forms.less
// Forms
// Normalize LTR Label (JBS request)
// --------------------------
.form-horizontal {
// Float the labels left
.control-label {
padding-right: 5px;
text-align: left;
// Set a width for the spacer hr so it shows
.spacer hr {
width: 380px;
@media (max-width: 420px) {
width: 220px;
}
}
}
.field-spacer>.control-label{
width: auto;
}
#jform_catid_chzn {
vertical-align: middle;
}
}
.form-vertical {
.control-label {
> label {
display: inline-block;
.ie7-inline-block();
}
}
.controls {
margin-left: 0;
}
}
@media (max-width: @lg-max) {
.form-horizontal-desktop {
.control-label {
float: none;
width: auto;
padding-right: 0;
padding-top: 0;
text-align: left;
> label {
display: inline-block;
.ie7-inline-block();
}
}
.controls {
margin-left: 0;
}
}
}
@media (max-width: @xl-max) {
.row-fluid .row-fluid .form-horizontal-desktop {
.control-label {
float: none;
width: auto;
padding-right: 0;
padding-top: 0;
text-align: left;
> label {
display: inline-block;
.ie7-inline-block();
}
}
.controls {
margin-left: 0;
}
}
}
.form-inline-header {
margin: 5px 0;
.control-group,
.control-label,
.controls {
display: inline-block;
.ie7-inline-block();
}
.control-label {
width: auto;
padding-right: 10px;
}
.controls {
padding-right: 20px;
}
}
/* Make fieldsets responsive */
fieldset[class^="form-"] {
min-width: 100%;
}
/* Make fieldsets responsive in Firefox. See http://getbootstrap.com/css/#tables-responsive */
@-moz-document url-prefix() {
fieldset[class^="form-"] { display: table-cell; }
}
/* Display checkboxes without bullets in list */
fieldset.checkboxes input {
float: left;
}
fieldset.checkboxes li {
list-style: none;
}
/* Make form elements responsive */
.control-group,
.controls,
.controls input[type="text"],
.controls input[type="number"],
.controls input[type="email"],
.controls select,
.controls textarea
{
max-width: 100%;
}
/* Min-width on buttons */
.controls .btn-group > .btn {
min-width: 50px;
margin-left: -1px;
}
.controls .btn-group.btn-group-yesno {
width: 220px;
max-width: 100%;
> .btn {
width: 50%;
min-width: 40px;
padding: 2px 0;
}
}
/* Title field */
input.input-large-text {
font-size: 18px;
line-height: 22px;
height: auto;
}
/* Customize Textarea Resizing */
textarea {
resize: both;
}
textarea.vert {
resize: vertical;
}
textarea.noResize {
resize: none;
}
/* Repeatable SubForm */
.subform-repeatable {
padding-right: 10px;
> .btn-toolbar {
margin: 0;
.group-add {
line-height: 26px;
width: 56px;
font-size: 13px;
margin-left: 28px;
}
}
}
.subform-repeatable-group {
margin-top: 20px;
margin-left: 28px;
border: 1px solid @inputBorder;
padding: 8px 25px 15px;
position: relative;
border-radius: @inputBorderRadius;
> .btn-toolbar {
margin: 0;
.btn-group {
margin-right: 0px;
margin-top: -1px;
position: static;
}
.btn {
font-size: 13px;
line-height: 26px;
background-color: #F3F3F3;
position: absolute;
span {
vertical-align: middle;
line-height: 11px;
}
&.btn-success {
color: #378137;
bottom: 0;
right: 0;
border-radius: @inputBorderRadius 0 0 0;
border-width: 1px 0 0 1px;
padding-top: 1px;
.icon-plus:before {
content: "]";
}
}
&.btn-danger {
color: #942a25;
top: 0;
right: 0;
border-radius: 0 0 0 @inputBorderRadius;
border-width: 0 0 1px 1px;
.icon-minus:before {
content: "I";
}
}
&.btn-primary {
color: #24748c;
color: #333;
right: 100%;
top: 50%;
margin-top: -27px;
margin-right: 1px;
border-radius: @inputBorderRadius 0 0 @inputBorderRadius;
border-width: 1px 0 1px 1px;
line-height: 52px;
.icon-move:before {
content: "Z";
}
}
[class^="icon-"], [class*=" icon-"] {
margin: 0;
}
&:hover {
background-color: #E6E6E6;
}
}
}
&:nth-child(odd) {
}
&:nth-child(even) {
}
&:last-of-type {
}
.control-group:last-of-type {
margin-bottom: 10px;
}
}
@media (max-width: @lg-max) {
.subform-repeatable-group > .btn-toolbar .btn-group {
margin-bottom: 10px;
}
}
.subform-table-layout {
.control-group {
margin-bottom: 10px;
&:last-of-type {
margin-bottom: 0;
}
}
.controls {
padding-right: 20px;
}
.btn-group {
}
input {
width: 100%;
max-width: 206px;
}
table .btn-group {
margin: 0 7px;
}
}
@media (max-width: 1024px) {
.subform-table-layout {
.subform-repeatable {
padding-right: 0;
tbody td:last-of-type {
text-align: right;
padding-bottom: 15px;
}
}
table, thead, tbody, th, td, tr {
display: block;
}
table {
border: 1px solid #ddd;
}
thead {
th {
position: absolute;
top: -9999px;
left: -9999px;
&:last-of-type {
position: static;
width: 100% !important;
text-align: right;
box-sizing: border-box;
border-left: 0;
}
}
}
tr {
margin: 0;
padding: 0;
border: 0;
}
td {
border: none;
position: relative;
padding-left: 50%;
}
tbody {
td:first-of-type {
padding-top: 15px;
border-top: 1px solid #ddd;
&:before {top:18px;}
}
}
td:before {
content: attr(data-column);
position: absolute;
top: 13px;
left: 10px;
padding-right: 10px;
}
}
}
/* Remove unneeded space between label and field in vertical forms */
.controls > .radio:first-child,
.controls > .checkbox:first-child {
padding-top: 0;
.form-horizontal & {
padding-top: 5px;
}
}
/* Align btn-group to label */
.form-horizontal .controls > .radio.btn-group:first-child {
padding-top: 0;
}
/* Align btn-group-yesno to label */
.form-horizontal .controls > .radio.btn-group-yesno:first-child {
padding-top: 2px;
}
/* Fix field media width */
input.field-media-input {
width: auto;
}