corrade-nucleus-nucleons – Blame information for rev 20
?pathlinks?
| Rev | Author | Line No. | Line |
|---|---|---|---|
| 20 | office | 1 | // |
| 2 | // Forms |
||
| 3 | // -------------------------------------------------- |
||
| 4 | |||
| 5 | |||
| 6 | // Normalize non-controls |
||
| 7 | // |
||
| 8 | // Restyle and baseline non-control form elements. |
||
| 9 | |||
| 10 | fieldset { |
||
| 11 | padding: 0; |
||
| 12 | margin: 0; |
||
| 13 | border: 0; |
||
| 14 | // Chrome and Firefox set a `min-width: min-content;` on fieldsets, |
||
| 15 | // so we reset that to ensure it behaves more like a standard block element. |
||
| 16 | // See https://github.com/twbs/bootstrap/issues/12359. |
||
| 17 | min-width: 0; |
||
| 18 | } |
||
| 19 | |||
| 20 | legend { |
||
| 21 | display: block; |
||
| 22 | width: 100%; |
||
| 23 | padding: 0; |
||
| 24 | margin-bottom: @line-height-computed; |
||
| 25 | font-size: (@font-size-base * 1.5); |
||
| 26 | line-height: inherit; |
||
| 27 | color: @legend-color; |
||
| 28 | border: 0; |
||
| 29 | border-bottom: 1px solid @legend-border-color; |
||
| 30 | } |
||
| 31 | |||
| 32 | label { |
||
| 33 | display: inline-block; |
||
| 34 | max-width: 100%; // Force IE8 to wrap long content (see https://github.com/twbs/bootstrap/issues/13141) |
||
| 35 | margin-bottom: 5px; |
||
| 36 | font-weight: bold; |
||
| 37 | } |
||
| 38 | |||
| 39 | |||
| 40 | // Normalize form controls |
||
| 41 | // |
||
| 42 | // While most of our form styles require extra classes, some basic normalization |
||
| 43 | // is required to ensure optimum display with or without those classes to better |
||
| 44 | // address browser inconsistencies. |
||
| 45 | |||
| 46 | // Override content-box in Normalize (* isn't specific enough) |
||
| 47 | input[type="search"] { |
||
| 48 | .box-sizing(border-box); |
||
| 49 | } |
||
| 50 | |||
| 51 | // Position radios and checkboxes better |
||
| 52 | input[type="radio"], |
||
| 53 | input[type="checkbox"] { |
||
| 54 | margin: 4px 0 0; |
||
| 55 | margin-top: 1px \9; // IE8-9 |
||
| 56 | line-height: normal; |
||
| 57 | } |
||
| 58 | |||
| 59 | input[type="file"] { |
||
| 60 | display: block; |
||
| 61 | } |
||
| 62 | |||
| 63 | // Make range inputs behave like textual form controls |
||
| 64 | input[type="range"] { |
||
| 65 | display: block; |
||
| 66 | width: 100%; |
||
| 67 | } |
||
| 68 | |||
| 69 | // Make multiple select elements height not fixed |
||
| 70 | select[multiple], |
||
| 71 | select[size] { |
||
| 72 | height: auto; |
||
| 73 | } |
||
| 74 | |||
| 75 | // Focus for file, radio, and checkbox |
||
| 76 | input[type="file"]:focus, |
||
| 77 | input[type="radio"]:focus, |
||
| 78 | input[type="checkbox"]:focus { |
||
| 79 | .tab-focus(); |
||
| 80 | } |
||
| 81 | |||
| 82 | // Adjust output element |
||
| 83 | output { |
||
| 84 | display: block; |
||
| 85 | padding-top: (@padding-base-vertical + 1); |
||
| 86 | font-size: @font-size-base; |
||
| 87 | line-height: @line-height-base; |
||
| 88 | color: @input-color; |
||
| 89 | } |
||
| 90 | |||
| 91 | |||
| 92 | // Common form controls |
||
| 93 | // |
||
| 94 | // Shared size and type resets for form controls. Apply `.form-control` to any |
||
| 95 | // of the following form controls: |
||
| 96 | // |
||
| 97 | // select |
||
| 98 | // textarea |
||
| 99 | // input[type="text"] |
||
| 100 | // input[type="password"] |
||
| 101 | // input[type="datetime"] |
||
| 102 | // input[type="datetime-local"] |
||
| 103 | // input[type="date"] |
||
| 104 | // input[type="month"] |
||
| 105 | // input[type="time"] |
||
| 106 | // input[type="week"] |
||
| 107 | // input[type="number"] |
||
| 108 | // input[type="email"] |
||
| 109 | // input[type="url"] |
||
| 110 | // input[type="search"] |
||
| 111 | // input[type="tel"] |
||
| 112 | // input[type="color"] |
||
| 113 | |||
| 114 | .form-control { |
||
| 115 | display: block; |
||
| 116 | width: 100%; |
||
| 117 | height: @input-height-base; // Make inputs at least the height of their button counterpart (base line-height + padding + border) |
||
| 118 | padding: @padding-base-vertical @padding-base-horizontal; |
||
| 119 | font-size: @font-size-base; |
||
| 120 | line-height: @line-height-base; |
||
| 121 | color: @input-color; |
||
| 122 | background-color: @input-bg; |
||
| 123 | background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 |
||
| 124 | border: 1px solid @input-border; |
||
| 125 | border-radius: @input-border-radius; // Note: This has no effect on <select>s in some browsers, due to the limited stylability of <select>s in CSS. |
||
| 126 | .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); |
||
| 127 | .transition(~"border-color ease-in-out .15s, box-shadow ease-in-out .15s"); |
||
| 128 | |||
| 129 | // Customize the `:focus` state to imitate native WebKit styles. |
||
| 130 | .form-control-focus(); |
||
| 131 | |||
| 132 | // Placeholder |
||
| 133 | .placeholder(); |
||
| 134 | |||
| 135 | // Unstyle the caret on `<select>`s in IE10+. |
||
| 136 | &::-ms-expand { |
||
| 137 | border: 0; |
||
| 138 | background-color: transparent; |
||
| 139 | } |
||
| 140 | |||
| 141 | // Disabled and read-only inputs |
||
| 142 | // |
||
| 143 | // HTML5 says that controls under a fieldset > legend:first-child won't be |
||
| 144 | // disabled if the fieldset is disabled. Due to implementation difficulty, we |
||
| 145 | // don't honor that edge case; we style them as disabled anyway. |
||
| 146 | &[disabled], |
||
| 147 | &[readonly], |
||
| 148 | fieldset[disabled] & { |
||
| 149 | background-color: @input-bg-disabled; |
||
| 150 | opacity: 1; // iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655 |
||
| 151 | } |
||
| 152 | |||
| 153 | &[disabled], |
||
| 154 | fieldset[disabled] & { |
||
| 155 | cursor: @cursor-disabled; |
||
| 156 | } |
||
| 157 | |||
| 158 | // Reset height for `textarea`s |
||
| 159 | textarea& { |
||
| 160 | height: auto; |
||
| 161 | } |
||
| 162 | } |
||
| 163 | |||
| 164 | |||
| 165 | // Search inputs in iOS |
||
| 166 | // |
||
| 167 | // This overrides the extra rounded corners on search inputs in iOS so that our |
||
| 168 | // `.form-control` class can properly style them. Note that this cannot simply |
||
| 169 | // be added to `.form-control` as it's not specific enough. For details, see |
||
| 170 | // https://github.com/twbs/bootstrap/issues/11586. |
||
| 171 | |||
| 172 | input[type="search"] { |
||
| 173 | -webkit-appearance: none; |
||
| 174 | } |
||
| 175 | |||
| 176 | |||
| 177 | // Special styles for iOS temporal inputs |
||
| 178 | // |
||
| 179 | // In Mobile Safari, setting `display: block` on temporal inputs causes the |
||
| 180 | // text within the input to become vertically misaligned. As a workaround, we |
||
| 181 | // set a pixel line-height that matches the given height of the input, but only |
||
| 182 | // for Safari. See https://bugs.webkit.org/show_bug.cgi?id=139848 |
||
| 183 | // |
||
| 184 | // Note that as of 9.3, iOS doesn't support `week`. |
||
| 185 | |||
| 186 | @media screen and (-webkit-min-device-pixel-ratio: 0) { |
||
| 187 | input[type="date"], |
||
| 188 | input[type="time"], |
||
| 189 | input[type="datetime-local"], |
||
| 190 | input[type="month"] { |
||
| 191 | &.form-control { |
||
| 192 | line-height: @input-height-base; |
||
| 193 | } |
||
| 194 | |||
| 195 | &.input-sm, |
||
| 196 | .input-group-sm & { |
||
| 197 | line-height: @input-height-small; |
||
| 198 | } |
||
| 199 | |||
| 200 | &.input-lg, |
||
| 201 | .input-group-lg & { |
||
| 202 | line-height: @input-height-large; |
||
| 203 | } |
||
| 204 | } |
||
| 205 | } |
||
| 206 | |||
| 207 | |||
| 208 | // Form groups |
||
| 209 | // |
||
| 210 | // Designed to help with the organization and spacing of vertical forms. For |
||
| 211 | // horizontal forms, use the predefined grid classes. |
||
| 212 | |||
| 213 | .form-group { |
||
| 214 | margin-bottom: @form-group-margin-bottom; |
||
| 215 | } |
||
| 216 | |||
| 217 | |||
| 218 | // Checkboxes and radios |
||
| 219 | // |
||
| 220 | // Indent the labels to position radios/checkboxes as hanging controls. |
||
| 221 | |||
| 222 | .radio, |
||
| 223 | .checkbox { |
||
| 224 | position: relative; |
||
| 225 | display: block; |
||
| 226 | margin-top: 10px; |
||
| 227 | margin-bottom: 10px; |
||
| 228 | |||
| 229 | label { |
||
| 230 | min-height: @line-height-computed; // Ensure the input doesn't jump when there is no text |
||
| 231 | padding-left: 20px; |
||
| 232 | margin-bottom: 0; |
||
| 233 | font-weight: normal; |
||
| 234 | cursor: pointer; |
||
| 235 | } |
||
| 236 | } |
||
| 237 | .radio input[type="radio"], |
||
| 238 | .radio-inline input[type="radio"], |
||
| 239 | .checkbox input[type="checkbox"], |
||
| 240 | .checkbox-inline input[type="checkbox"] { |
||
| 241 | position: absolute; |
||
| 242 | margin-left: -20px; |
||
| 243 | margin-top: 4px \9; |
||
| 244 | } |
||
| 245 | |||
| 246 | .radio + .radio, |
||
| 247 | .checkbox + .checkbox { |
||
| 248 | margin-top: -5px; // Move up sibling radios or checkboxes for tighter spacing |
||
| 249 | } |
||
| 250 | |||
| 251 | // Radios and checkboxes on same line |
||
| 252 | .radio-inline, |
||
| 253 | .checkbox-inline { |
||
| 254 | position: relative; |
||
| 255 | display: inline-block; |
||
| 256 | padding-left: 20px; |
||
| 257 | margin-bottom: 0; |
||
| 258 | vertical-align: middle; |
||
| 259 | font-weight: normal; |
||
| 260 | cursor: pointer; |
||
| 261 | } |
||
| 262 | .radio-inline + .radio-inline, |
||
| 263 | .checkbox-inline + .checkbox-inline { |
||
| 264 | margin-top: 0; |
||
| 265 | margin-left: 10px; // space out consecutive inline controls |
||
| 266 | } |
||
| 267 | |||
| 268 | // Apply same disabled cursor tweak as for inputs |
||
| 269 | // Some special care is needed because <label>s don't inherit their parent's `cursor`. |
||
| 270 | // |
||
| 271 | // Note: Neither radios nor checkboxes can be readonly. |
||
| 272 | input[type="radio"], |
||
| 273 | input[type="checkbox"] { |
||
| 274 | &[disabled], |
||
| 275 | &.disabled, |
||
| 276 | fieldset[disabled] & { |
||
| 277 | cursor: @cursor-disabled; |
||
| 278 | } |
||
| 279 | } |
||
| 280 | // These classes are used directly on <label>s |
||
| 281 | .radio-inline, |
||
| 282 | .checkbox-inline { |
||
| 283 | &.disabled, |
||
| 284 | fieldset[disabled] & { |
||
| 285 | cursor: @cursor-disabled; |
||
| 286 | } |
||
| 287 | } |
||
| 288 | // These classes are used on elements with <label> descendants |
||
| 289 | .radio, |
||
| 290 | .checkbox { |
||
| 291 | &.disabled, |
||
| 292 | fieldset[disabled] & { |
||
| 293 | label { |
||
| 294 | cursor: @cursor-disabled; |
||
| 295 | } |
||
| 296 | } |
||
| 297 | } |
||
| 298 | |||
| 299 | |||
| 300 | // Static form control text |
||
| 301 | // |
||
| 302 | // Apply class to a `p` element to make any string of text align with labels in |
||
| 303 | // a horizontal form layout. |
||
| 304 | |||
| 305 | .form-control-static { |
||
| 306 | // Size it appropriately next to real form controls |
||
| 307 | padding-top: (@padding-base-vertical + 1); |
||
| 308 | padding-bottom: (@padding-base-vertical + 1); |
||
| 309 | // Remove default margin from `p` |
||
| 310 | margin-bottom: 0; |
||
| 311 | min-height: (@line-height-computed + @font-size-base); |
||
| 312 | |||
| 313 | &.input-lg, |
||
| 314 | &.input-sm { |
||
| 315 | padding-left: 0; |
||
| 316 | padding-right: 0; |
||
| 317 | } |
||
| 318 | } |
||
| 319 | |||
| 320 | |||
| 321 | // Form control sizing |
||
| 322 | // |
||
| 323 | // Build on `.form-control` with modifier classes to decrease or increase the |
||
| 324 | // height and font-size of form controls. |
||
| 325 | // |
||
| 326 | // The `.form-group-* form-control` variations are sadly duplicated to avoid the |
||
| 327 | // issue documented in https://github.com/twbs/bootstrap/issues/15074. |
||
| 328 | |||
| 329 | .input-sm { |
||
| 330 | .input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @input-border-radius-small); |
||
| 331 | } |
||
| 332 | .form-group-sm { |
||
| 333 | .form-control { |
||
| 334 | height: @input-height-small; |
||
| 335 | padding: @padding-small-vertical @padding-small-horizontal; |
||
| 336 | font-size: @font-size-small; |
||
| 337 | line-height: @line-height-small; |
||
| 338 | border-radius: @input-border-radius-small; |
||
| 339 | } |
||
| 340 | select.form-control { |
||
| 341 | height: @input-height-small; |
||
| 342 | line-height: @input-height-small; |
||
| 343 | } |
||
| 344 | textarea.form-control, |
||
| 345 | select[multiple].form-control { |
||
| 346 | height: auto; |
||
| 347 | } |
||
| 348 | .form-control-static { |
||
| 349 | height: @input-height-small; |
||
| 350 | min-height: (@line-height-computed + @font-size-small); |
||
| 351 | padding: (@padding-small-vertical + 1) @padding-small-horizontal; |
||
| 352 | font-size: @font-size-small; |
||
| 353 | line-height: @line-height-small; |
||
| 354 | } |
||
| 355 | } |
||
| 356 | |||
| 357 | .input-lg { |
||
| 358 | .input-size(@input-height-large; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @input-border-radius-large); |
||
| 359 | } |
||
| 360 | .form-group-lg { |
||
| 361 | .form-control { |
||
| 362 | height: @input-height-large; |
||
| 363 | padding: @padding-large-vertical @padding-large-horizontal; |
||
| 364 | font-size: @font-size-large; |
||
| 365 | line-height: @line-height-large; |
||
| 366 | border-radius: @input-border-radius-large; |
||
| 367 | } |
||
| 368 | select.form-control { |
||
| 369 | height: @input-height-large; |
||
| 370 | line-height: @input-height-large; |
||
| 371 | } |
||
| 372 | textarea.form-control, |
||
| 373 | select[multiple].form-control { |
||
| 374 | height: auto; |
||
| 375 | } |
||
| 376 | .form-control-static { |
||
| 377 | height: @input-height-large; |
||
| 378 | min-height: (@line-height-computed + @font-size-large); |
||
| 379 | padding: (@padding-large-vertical + 1) @padding-large-horizontal; |
||
| 380 | font-size: @font-size-large; |
||
| 381 | line-height: @line-height-large; |
||
| 382 | } |
||
| 383 | } |
||
| 384 | |||
| 385 | |||
| 386 | // Form control feedback states |
||
| 387 | // |
||
| 388 | // Apply contextual and semantic states to individual form controls. |
||
| 389 | |||
| 390 | .has-feedback { |
||
| 391 | // Enable absolute positioning |
||
| 392 | position: relative; |
||
| 393 | |||
| 394 | // Ensure icons don't overlap text |
||
| 395 | .form-control { |
||
| 396 | padding-right: (@input-height-base * 1.25); |
||
| 397 | } |
||
| 398 | } |
||
| 399 | // Feedback icon (requires .glyphicon classes) |
||
| 400 | .form-control-feedback { |
||
| 401 | position: absolute; |
||
| 402 | top: 0; |
||
| 403 | right: 0; |
||
| 404 | z-index: 2; // Ensure icon is above input groups |
||
| 405 | display: block; |
||
| 406 | width: @input-height-base; |
||
| 407 | height: @input-height-base; |
||
| 408 | line-height: @input-height-base; |
||
| 409 | text-align: center; |
||
| 410 | pointer-events: none; |
||
| 411 | } |
||
| 412 | .input-lg + .form-control-feedback, |
||
| 413 | .input-group-lg + .form-control-feedback, |
||
| 414 | .form-group-lg .form-control + .form-control-feedback { |
||
| 415 | width: @input-height-large; |
||
| 416 | height: @input-height-large; |
||
| 417 | line-height: @input-height-large; |
||
| 418 | } |
||
| 419 | .input-sm + .form-control-feedback, |
||
| 420 | .input-group-sm + .form-control-feedback, |
||
| 421 | .form-group-sm .form-control + .form-control-feedback { |
||
| 422 | width: @input-height-small; |
||
| 423 | height: @input-height-small; |
||
| 424 | line-height: @input-height-small; |
||
| 425 | } |
||
| 426 | |||
| 427 | // Feedback states |
||
| 428 | .has-success { |
||
| 429 | .form-control-validation(@state-success-text; @state-success-text; @state-success-bg); |
||
| 430 | } |
||
| 431 | .has-warning { |
||
| 432 | .form-control-validation(@state-warning-text; @state-warning-text; @state-warning-bg); |
||
| 433 | } |
||
| 434 | .has-error { |
||
| 435 | .form-control-validation(@state-danger-text; @state-danger-text; @state-danger-bg); |
||
| 436 | } |
||
| 437 | |||
| 438 | // Reposition feedback icon if input has visible label above |
||
| 439 | .has-feedback label { |
||
| 440 | |||
| 441 | & ~ .form-control-feedback { |
||
| 442 | top: (@line-height-computed + 5); // Height of the `label` and its margin |
||
| 443 | } |
||
| 444 | &.sr-only ~ .form-control-feedback { |
||
| 445 | top: 0; |
||
| 446 | } |
||
| 447 | } |
||
| 448 | |||
| 449 | |||
| 450 | // Help text |
||
| 451 | // |
||
| 452 | // Apply to any element you wish to create light text for placement immediately |
||
| 453 | // below a form control. Use for general help, formatting, or instructional text. |
||
| 454 | |||
| 455 | .help-block { |
||
| 456 | display: block; // account for any element using help-block |
||
| 457 | margin-top: 5px; |
||
| 458 | margin-bottom: 10px; |
||
| 459 | color: lighten(@text-color, 25%); // lighten the text some for contrast |
||
| 460 | } |
||
| 461 | |||
| 462 | |||
| 463 | // Inline forms |
||
| 464 | // |
||
| 465 | // Make forms appear inline(-block) by adding the `.form-inline` class. Inline |
||
| 466 | // forms begin stacked on extra small (mobile) devices and then go inline when |
||
| 467 | // viewports reach <768px. |
||
| 468 | // |
||
| 469 | // Requires wrapping inputs and labels with `.form-group` for proper display of |
||
| 470 | // default HTML form controls and our custom form controls (e.g., input groups). |
||
| 471 | // |
||
| 472 | // Heads up! This is mixin-ed into `.navbar-form` in navbars.less. |
||
| 473 | |||
| 474 | .form-inline { |
||
| 475 | |||
| 476 | // Kick in the inline |
||
| 477 | @media (min-width: @screen-sm-min) { |
||
| 478 | // Inline-block all the things for "inline" |
||
| 479 | .form-group { |
||
| 480 | display: inline-block; |
||
| 481 | margin-bottom: 0; |
||
| 482 | vertical-align: middle; |
||
| 483 | } |
||
| 484 | |||
| 485 | // In navbar-form, allow folks to *not* use `.form-group` |
||
| 486 | .form-control { |
||
| 487 | display: inline-block; |
||
| 488 | width: auto; // Prevent labels from stacking above inputs in `.form-group` |
||
| 489 | vertical-align: middle; |
||
| 490 | } |
||
| 491 | |||
| 492 | // Make static controls behave like regular ones |
||
| 493 | .form-control-static { |
||
| 494 | display: inline-block; |
||
| 495 | } |
||
| 496 | |||
| 497 | .input-group { |
||
| 498 | display: inline-table; |
||
| 499 | vertical-align: middle; |
||
| 500 | |||
| 501 | .input-group-addon, |
||
| 502 | .input-group-btn, |
||
| 503 | .form-control { |
||
| 504 | width: auto; |
||
| 505 | } |
||
| 506 | } |
||
| 507 | |||
| 508 | // Input groups need that 100% width though |
||
| 509 | .input-group > .form-control { |
||
| 510 | width: 100%; |
||
| 511 | } |
||
| 512 | |||
| 513 | .control-label { |
||
| 514 | margin-bottom: 0; |
||
| 515 | vertical-align: middle; |
||
| 516 | } |
||
| 517 | |||
| 518 | // Remove default margin on radios/checkboxes that were used for stacking, and |
||
| 519 | // then undo the floating of radios and checkboxes to match. |
||
| 520 | .radio, |
||
| 521 | .checkbox { |
||
| 522 | display: inline-block; |
||
| 523 | margin-top: 0; |
||
| 524 | margin-bottom: 0; |
||
| 525 | vertical-align: middle; |
||
| 526 | |||
| 527 | label { |
||
| 528 | padding-left: 0; |
||
| 529 | } |
||
| 530 | } |
||
| 531 | .radio input[type="radio"], |
||
| 532 | .checkbox input[type="checkbox"] { |
||
| 533 | position: relative; |
||
| 534 | margin-left: 0; |
||
| 535 | } |
||
| 536 | |||
| 537 | // Re-override the feedback icon. |
||
| 538 | .has-feedback .form-control-feedback { |
||
| 539 | top: 0; |
||
| 540 | } |
||
| 541 | } |
||
| 542 | } |
||
| 543 | |||
| 544 | |||
| 545 | // Horizontal forms |
||
| 546 | // |
||
| 547 | // Horizontal forms are built on grid classes and allow you to create forms with |
||
| 548 | // labels on the left and inputs on the right. |
||
| 549 | |||
| 550 | .form-horizontal { |
||
| 551 | |||
| 552 | // Consistent vertical alignment of radios and checkboxes |
||
| 553 | // |
||
| 554 | // Labels also get some reset styles, but that is scoped to a media query below. |
||
| 555 | .radio, |
||
| 556 | .checkbox, |
||
| 557 | .radio-inline, |
||
| 558 | .checkbox-inline { |
||
| 559 | margin-top: 0; |
||
| 560 | margin-bottom: 0; |
||
| 561 | padding-top: (@padding-base-vertical + 1); // Default padding plus a border |
||
| 562 | } |
||
| 563 | // Account for padding we're adding to ensure the alignment and of help text |
||
| 564 | // and other content below items |
||
| 565 | .radio, |
||
| 566 | .checkbox { |
||
| 567 | min-height: (@line-height-computed + (@padding-base-vertical + 1)); |
||
| 568 | } |
||
| 569 | |||
| 570 | // Make form groups behave like rows |
||
| 571 | .form-group { |
||
| 572 | .make-row(); |
||
| 573 | } |
||
| 574 | |||
| 575 | // Reset spacing and right align labels, but scope to media queries so that |
||
| 576 | // labels on narrow viewports stack the same as a default form example. |
||
| 577 | @media (min-width: @screen-sm-min) { |
||
| 578 | .control-label { |
||
| 579 | text-align: right; |
||
| 580 | margin-bottom: 0; |
||
| 581 | padding-top: (@padding-base-vertical + 1); // Default padding plus a border |
||
| 582 | } |
||
| 583 | } |
||
| 584 | |||
| 585 | // Validation states |
||
| 586 | // |
||
| 587 | // Reposition the icon because it's now within a grid column and columns have |
||
| 588 | // `position: relative;` on them. Also accounts for the grid gutter padding. |
||
| 589 | .has-feedback .form-control-feedback { |
||
| 590 | right: floor((@grid-gutter-width / 2)); |
||
| 591 | } |
||
| 592 | |||
| 593 | // Form group sizes |
||
| 594 | // |
||
| 595 | // Quick utility class for applying `.input-lg` and `.input-sm` styles to the |
||
| 596 | // inputs and labels within a `.form-group`. |
||
| 597 | .form-group-lg { |
||
| 598 | @media (min-width: @screen-sm-min) { |
||
| 599 | .control-label { |
||
| 600 | padding-top: (@padding-large-vertical + 1); |
||
| 601 | font-size: @font-size-large; |
||
| 602 | } |
||
| 603 | } |
||
| 604 | } |
||
| 605 | .form-group-sm { |
||
| 606 | @media (min-width: @screen-sm-min) { |
||
| 607 | .control-label { |
||
| 608 | padding-top: (@padding-small-vertical + 1); |
||
| 609 | font-size: @font-size-small; |
||
| 610 | } |
||
| 611 | } |
||
| 612 | } |
||
| 613 | } |