173 lines
4.2 KiB
Plaintext
173 lines
4.2 KiB
Plaintext
|
//
|
||
|
// Forms
|
||
|
// This is a custom version of Bootstrap's forms.less file suited for Hathor's needs
|
||
|
// --------------------------------------------------
|
||
|
|
||
|
// Ensure input-prepend/append never wraps
|
||
|
.input-append input[class*="span"],
|
||
|
.input-append .uneditable-input[class*="span"],
|
||
|
.input-prepend input[class*="span"],
|
||
|
.input-prepend .uneditable-input[class*="span"],
|
||
|
.row-fluid input[class*="span"],
|
||
|
.row-fluid select[class*="span"],
|
||
|
.row-fluid textarea[class*="span"],
|
||
|
.row-fluid .uneditable-input[class*="span"],
|
||
|
.row-fluid .input-prepend [class*="span"],
|
||
|
.row-fluid .input-append [class*="span"] {
|
||
|
display: inline-block;
|
||
|
}
|
||
|
// Allow us to put symbols and text within the input field for a cleaner look
|
||
|
.input-append,
|
||
|
.input-prepend {
|
||
|
margin-bottom: 5px;
|
||
|
font-size: 0;
|
||
|
white-space: nowrap; // Prevent span and input from separating
|
||
|
|
||
|
input,
|
||
|
select,
|
||
|
.uneditable-input {
|
||
|
position: relative; // placed here by default so that on :focus we can place the input above the .add-on for full border and box-shadow goodness
|
||
|
margin-bottom: 0; // prevent bottom margin from screwing up alignment in stacked forms
|
||
|
*margin-left: 0;
|
||
|
font-size: @baseFontSize;
|
||
|
vertical-align: top;
|
||
|
.border-radius(0 @inputBorderRadius @inputBorderRadius 0);
|
||
|
// Make input on top when focused so blue border and shadow always show
|
||
|
&:focus {
|
||
|
z-index: 2;
|
||
|
}
|
||
|
}
|
||
|
.add-on {
|
||
|
display: inline-block;
|
||
|
width: auto;
|
||
|
height: @baseLineHeight;
|
||
|
min-width: 16px;
|
||
|
padding: 4px 5px;
|
||
|
font-size: @baseFontSize;
|
||
|
font-weight: normal;
|
||
|
line-height: @baseLineHeight;
|
||
|
text-align: center;
|
||
|
text-shadow: 0 1px 0 @white;
|
||
|
background-color: @grayLighter;
|
||
|
border: 1px solid #ccc;
|
||
|
}
|
||
|
.add-on,
|
||
|
.btn {
|
||
|
margin-left: -1px;
|
||
|
vertical-align: top;
|
||
|
.border-radius(0);
|
||
|
}
|
||
|
.active {
|
||
|
background-color: lighten(@green, 30);
|
||
|
border-color: @green;
|
||
|
}
|
||
|
}
|
||
|
.input-prepend {
|
||
|
.add-on,
|
||
|
.btn {
|
||
|
margin-right: -1px;
|
||
|
}
|
||
|
.add-on:first-child,
|
||
|
.btn:first-child {
|
||
|
.border-radius(@inputBorderRadius 0 0 @inputBorderRadius);
|
||
|
}
|
||
|
}
|
||
|
.input-append {
|
||
|
input,
|
||
|
select,
|
||
|
.uneditable-input {
|
||
|
.border-radius(@inputBorderRadius 0 0 @inputBorderRadius);
|
||
|
}
|
||
|
.add-on:last-child,
|
||
|
.btn:last-child {
|
||
|
.border-radius(0 @inputBorderRadius @inputBorderRadius 0);
|
||
|
}
|
||
|
}
|
||
|
// Remove all border-radius for inputs with both prepend and append
|
||
|
.input-prepend.input-append {
|
||
|
input,
|
||
|
select,
|
||
|
.uneditable-input {
|
||
|
.border-radius(0);
|
||
|
}
|
||
|
.add-on:first-child,
|
||
|
.btn:first-child {
|
||
|
margin-right: -1px;
|
||
|
.border-radius(@inputBorderRadius 0 0 @inputBorderRadius);
|
||
|
}
|
||
|
.add-on:last-child,
|
||
|
.btn:last-child {
|
||
|
margin-left: -1px;
|
||
|
.border-radius(0 @inputBorderRadius @inputBorderRadius 0);
|
||
|
}
|
||
|
}
|
||
|
/* Allow for input prepend/append in search forms */
|
||
|
.form-search .input-append .search-query,
|
||
|
.form-search .input-prepend .search-query {
|
||
|
.border-radius(0); // Override due to specificity
|
||
|
}
|
||
|
.form-search .input-append .search-query {
|
||
|
.border-radius(14px 0 0 14px)
|
||
|
}
|
||
|
.form-search .input-append .btn {
|
||
|
.border-radius(0 14px 14px 0)
|
||
|
}
|
||
|
.form-search .input-prepend .search-query {
|
||
|
.border-radius(0 14px 14px 0)
|
||
|
}
|
||
|
.form-search .input-prepend .btn {
|
||
|
.border-radius(14px 0 0 14px)
|
||
|
}
|
||
|
.form-search,
|
||
|
.form-inline,
|
||
|
.form-horizontal {
|
||
|
input,
|
||
|
textarea,
|
||
|
select,
|
||
|
.help-inline,
|
||
|
.uneditable-input,
|
||
|
.input-prepend,
|
||
|
.input-append {
|
||
|
display: inline-block;
|
||
|
.ie7-inline-block();
|
||
|
margin-bottom: 0;
|
||
|
vertical-align: middle;
|
||
|
}
|
||
|
// Re-hide hidden elements due to specifity
|
||
|
.hide {
|
||
|
display: none;
|
||
|
}
|
||
|
}
|
||
|
// Remove margin for input-prepend/-append
|
||
|
.form-search .input-append,
|
||
|
.form-inline .input-append,
|
||
|
.form-search .input-prepend,
|
||
|
.form-inline .input-prepend {
|
||
|
margin-bottom: 0;
|
||
|
}
|
||
|
/* Accessible Hidden Elements (good for hidden labels and such) */
|
||
|
.element-invisible{
|
||
|
position: absolute;
|
||
|
padding: 0 !important;
|
||
|
margin: 0 !important;
|
||
|
border: 0;
|
||
|
height: 1px;
|
||
|
width: 1px !important;
|
||
|
overflow: hidden;
|
||
|
}
|
||
|
|
||
|
// Login form only
|
||
|
// Shared size and type resets
|
||
|
#form-login select,
|
||
|
#form-login input[type="text"],
|
||
|
#form-login input[type="password"] {
|
||
|
display: inline-block;
|
||
|
padding: 4px 6px;
|
||
|
margin-bottom: 9px;
|
||
|
font-size: @baseFontSize;
|
||
|
line-height: @baseLineHeight;
|
||
|
color: @gray;
|
||
|
.border-radius(@inputBorderRadius);
|
||
|
width: 175px;
|
||
|
}
|