openecomp-ui/resources/scss/bootstrap-cust/_forms.scss

   1 .form-group {
   2   .control-label {
   3     @extend .body-2-semibold;
   4   }
   5   &.required {
   6     label:before {
   7       content: "*";
   8       color: $red;
   9       margin: 0 4px 0 0;
  10     }
  11   }
  12 }
  13 .form-control {
  14   @extend .body-1;
  15   border-radius: 2px;
  16   height: 30px;
  17   @include box-shadow(none);
  18   &:focus {
  19     @include box-shadow(none);
  20   }
  21   &:hover {
  22     border-color: $gray;
  23   }
  24 }
  25
  26 label {
  27   @extend .body-3;
  28   margin-bottom: 8px;
  29 }
  30
  31 select.form-control {
  32   display: block;
  33   width: 215px;
  34 }
  35
  36 select[multiple] {
  37   background: none;
  38 }
  39
  40 input[type="radio"], input[type="checkbox"] {
  41   margin: 0;
  42
  43   &:before {
  44     content: "";
  45     display: inline-block;
  46     width: 11px;
  47     height: 11px;
  48     margin-right: 10px;
  49     position: absolute;
  50     background-color: $white;
  51     border: 1px solid $blue;
  52     box-sizing: content-box;
  53   }
  54 }
  55
  56 .radio label {
  57   font-weight: normal;
  58   display: inline-block;
  59   cursor: pointer;
  60   margin-right: $body-font-1;
  61   font-size: $body-font-1;
  62 }
  63
  64 .checkbox label {
  65   font-weight: normal;
  66   display: inline-block;
  67   cursor: pointer;
  68   margin-right: $body-font-1;
  69   font-size: $body-font-1;
  70 }
  71
  72 .radio input:before {
  73   border-radius: 8px;
  74 }
  75
  76 .checkbox input:before {
  77   border-radius: 2px;
  78 }
  79
  80 input[type=radio]:checked:before {
  81   content: "\2022";
  82   color: $blue;
  83   font-size: 30px;
  84   text-align: center;
  85   line-height: 11px;
  86   font-family: $radio-font-family;
  87 }
  88
  89 input[type=checkbox]:checked:before {
  90   font-family: $icon-font-family;
  91   content: "\2714";
  92   font-size: $icon-font-size;
  93   color: $blue;
  94   text-align: center;
  95         line-height: 13px;
  96 }
  97
  98 .radio,
  99 .checkbox {
 100   margin-top: 0px;
 101   margin-bottom: 0px;
 102 }
 103
 104 .radio input[type="radio"],
 105 .radio-inline input[type="radio"],
 106 .checkbox input[type="checkbox"],
 107 .checkbox-inline input[type="checkbox"] {
 108   position: absolute;
 109   margin-left: -20px;
 110   top: 2px;
 111 }