text inputs

This commit is contained in:
Adam Bradley
2013-09-09 19:06:22 -05:00
parent 4a963f41f3
commit c18dded02c
6 changed files with 818 additions and 115 deletions

View File

@ -33,7 +33,7 @@ body {
.content {
position: fixed;
overflow: auto;
overflow: auto;
right: 0;
left: 0;
}
@ -48,6 +48,10 @@ body {
padding: $contentPadding;
}
.inset {
margin: $insetMargin;
}
.rounded {
border-radius: $roundedRadius;
}

View File

@ -47,39 +47,70 @@ textarea {
font-family: $baseFontFamily; // And only set font-family here for those that need it (note the missing label element)
}
// Identify controls by their labels
label {
.input-wrapper {
display: block;
margin-bottom: 5px;
border-top: 1px solid $inputBorder;
border-bottom: 1px solid $inputBorder;
padding: 4px 7px 3px;
input {
margin: 0;
-webkit-appearance: none;
}
.input-label {
font-weight: bold;
line-height: $baseLineHeightComputed + $baseFontSize;
}
}
label input {
margin: 0;
}
.content-padded > label.input-wrapper,
.content-padded > label.stacked,
label.inset
.content-padded > .input-wrapper,
.input-wrapper.inset
{
border-left: 1px solid $inputBorder;
border-right: 1px solid $inputBorder;
@include border-radius(2px);
@include border-radius($textInputBorderRadius);
}
.input-wrapper.row-fluid {
width: auto;
}
label.inset {
margin: $insetMargin;
}
label.stacked {
.stacked-label {
padding: 0;
border: 0;
input {
border: 1px solid $inputBorder;
}
}
.stacked-label {
border: 0;
input {
border: 1px solid $inputBorder !important;
padding: $baseLineHeightComputed $baseLineHeightComputed/2 !important;
@include border-radius($textInputBorderRadius);
}
span {
font-weight: bold;
line-height: $baseLineHeightComputed;
}
}
.content > .input-wrapper.stacked-label input {
border-left: 0 !important;
border-right: 0 !important;
@include border-radius(0);
}
.content-padded > .input-wrapper.stacked-label,
.content > .input-wrapper.stacked-label.inset
{
border: 0 !important;
}
.content > .input-wrapper.stacked-label.inset input {
border: 1px solid $inputBorder !important;
}
.input-wrapper + .input-wrapper {
border-top: 0 !important;
}
// Form Controls
// -------------------------------
@ -103,7 +134,7 @@ input[type="tel"],
input[type="color"],
.uneditable-input {
display: inline-block;
height: $baseLineHeightComputed + 14px;
height: $baseLineHeightComputed + $baseFontSize;
font-size: $baseFontSize;
line-height: $baseLineHeightComputed;
color: $gray;
@ -173,7 +204,6 @@ input[type="checkbox"] {
select,
input[type="file"] {
height: $inputHeight; /* In IE7, the height of the select element cannot be changed by height, only font-size */
*margin-top: 4px; /* For IE7, add top margin to align select with labels */
line-height: $inputHeight;
}

View File

@ -0,0 +1,21 @@
//
// Grid system
// --------------------------------------------------
// Fixed (940px)
@include grid-core($gridColumnWidth, $gridGutterWidth);
// Fluid (940px)
@include grid-fluid($fluidGridColumnWidth, $fluidGridGutterWidth);
// Reset utility classes due to specificity
[class*="span"].hide,
.row-fluid [class*="span"].hide {
display: none;
}
[class*="span"].pull-right,
.row-fluid [class*="span"].pull-right {
float: right;
}