Details | Last modification | View Log | RSS feed
| Rev | Author | Line No. | Line |
|---|---|---|---|
| 1 | espaco | 1 | /*** |
| 2 | Form Layouts |
||
| 3 | ****/ |
||
| 4 | |||
| 5 | /* Static info */ |
||
| 6 | |||
| 7 | .static-info { |
||
| 8 | margin-bottom: 10px; |
||
| 9 | |||
| 10 | .name { |
||
| 11 | font-size: 14px; |
||
| 12 | } |
||
| 13 | |||
| 14 | .value { |
||
| 15 | font-size: 14px; |
||
| 16 | font-weight: 600; |
||
| 17 | } |
||
| 18 | |||
| 19 | &.align-reverse .name, |
||
| 20 | &.align-reverse .value { |
||
| 21 | text-align: right; |
||
| 22 | } |
||
| 23 | } |
||
| 24 | |||
| 25 | /* Help blocks */ |
||
| 26 | |||
| 27 | .help-block { |
||
| 28 | margin-top: 5px; |
||
| 29 | margin-bottom: 5px; |
||
| 30 | } |
||
| 31 | |||
| 32 | .help-inline { |
||
| 33 | font-size: 13px; |
||
| 34 | color: #737373; |
||
| 35 | display: inline-block; |
||
| 36 | padding: 5px; |
||
| 37 | } |
||
| 38 | |||
| 39 | .form-inline { |
||
| 40 | input { |
||
| 41 | margin-bottom: 0px !important; |
||
| 42 | } |
||
| 43 | } |
||
| 44 | |||
| 45 | |||
| 46 | /* Control Label */ |
||
| 47 | |||
| 48 | .control-label { |
||
| 49 | margin-top: 1px; |
||
| 50 | |||
| 51 | .required { |
||
| 52 | color: #e02222; |
||
| 53 | font-size: 12px; |
||
| 54 | padding-left: 2px; |
||
| 55 | } |
||
| 56 | } |
||
| 57 | |||
| 58 | .form { |
||
| 59 | padding: 0 !important; |
||
| 60 | |||
| 61 | .form-body { |
||
| 62 | padding: 10px; |
||
| 63 | |||
| 64 | .portlet.light & { |
||
| 65 | padding-left: 0; |
||
| 66 | padding-right: 0; |
||
| 67 | } |
||
| 68 | } |
||
| 69 | |||
| 70 | .form-actions { |
||
| 71 | padding: 20px 10px; |
||
| 72 | margin: 0; |
||
| 73 | background-color: #f5f5f5; |
||
| 74 | border-top: 1px solid #e5e5e5; |
||
| 75 | *zoom: 1; |
||
| 76 | |||
| 77 | .portlet.light & { |
||
| 78 | background: none; |
||
| 79 | padding-left: 0; |
||
| 80 | padding-right: 0; |
||
| 81 | } |
||
| 82 | |||
| 83 | .portlet & { |
||
| 84 | @include border-radius(0 0 $portlet-border-radius $portlet-border-radius); |
||
| 85 | } |
||
| 86 | |||
| 87 | @include clearfix(); |
||
| 88 | |||
| 89 | &.right { |
||
| 90 | padding-left: 0; |
||
| 91 | padding-right: 10px; |
||
| 92 | text-align: right; |
||
| 93 | |||
| 94 | .portlet.light & { |
||
| 95 | padding-right: 0; |
||
| 96 | } |
||
| 97 | } |
||
| 98 | |||
| 99 | &.left { |
||
| 100 | padding-left: 10px; |
||
| 101 | padding-right: 0; |
||
| 102 | text-align: left; |
||
| 103 | |||
| 104 | .portlet.light & { |
||
| 105 | padding-left: 0; |
||
| 106 | } |
||
| 107 | } |
||
| 108 | |||
| 109 | &.nobg { |
||
| 110 | background-color: transparent; |
||
| 111 | } |
||
| 112 | |||
| 113 | &.top { |
||
| 114 | margin-top: 0; |
||
| 115 | margin-bottom: 20px; |
||
| 116 | border-top: 0; |
||
| 117 | border-bottom: 1px solid #e5e5e5; |
||
| 118 | |||
| 119 | .portlet.light & { |
||
| 120 | background: none; |
||
| 121 | } |
||
| 122 | } |
||
| 123 | |||
| 124 | .btn-set { |
||
| 125 | display: inline-block; |
||
| 126 | } |
||
| 127 | |||
| 128 | @media (max-width: $screen-xs-max) { /* 767px */ |
||
| 129 | .btn-set { |
||
| 130 | margin-bottom: 3px; |
||
| 131 | margin-top: 3px; |
||
| 132 | float: left !important; |
||
| 133 | } |
||
| 134 | } |
||
| 135 | } |
||
| 136 | |||
| 137 | .form-section { |
||
| 138 | margin: 30px 0px 25px 0px; |
||
| 139 | padding-bottom: 5px; |
||
| 140 | border-bottom: 1px solid #eee; |
||
| 141 | |||
| 142 | &:first-child { |
||
| 143 | margin-top: 5px; |
||
| 144 | } |
||
| 145 | } |
||
| 146 | } |
||
| 147 | |||
| 148 | /* Checkboxes */ |
||
| 149 | |||
| 150 | .checkbox, |
||
| 151 | .form-horizontal .checkbox { |
||
| 152 | padding: 0; |
||
| 153 | |||
| 154 | > label { |
||
| 155 | padding-left: 0; |
||
| 156 | } |
||
| 157 | } |
||
| 158 | |||
| 159 | .checkbox-list > label { |
||
| 160 | display: block; |
||
| 161 | |||
| 162 | &.checkbox-inline { |
||
| 163 | display: inline-block; |
||
| 164 | |||
| 165 | &:first-child { |
||
| 166 | padding-left: 0; |
||
| 167 | } |
||
| 168 | } |
||
| 169 | } |
||
| 170 | |||
| 171 | /* Radio buttons */ |
||
| 172 | |||
| 173 | .radio-list > label { |
||
| 174 | display: block; |
||
| 175 | |||
| 176 | &.radio-inline { |
||
| 177 | display: inline-block; |
||
| 178 | |||
| 179 | &:first-child { |
||
| 180 | padding-left: 0; |
||
| 181 | } |
||
| 182 | } |
||
| 183 | } |
||
| 184 | |||
| 185 | /* Radio buttons in horizontal forms */ |
||
| 186 | |||
| 187 | .form-horizontal { |
||
| 188 | |||
| 189 | .radio-list { |
||
| 190 | .radio { |
||
| 191 | padding-top: 1px; |
||
| 192 | } |
||
| 193 | |||
| 194 | > label { |
||
| 195 | margin-bottom: 0; |
||
| 196 | } |
||
| 197 | } |
||
| 198 | |||
| 199 | .radio { |
||
| 200 | > span { |
||
| 201 | margin-top: 2px; |
||
| 202 | } |
||
| 203 | } |
||
| 204 | } |
||
| 205 | |||
| 206 | /* Rows seperated form layout */ |
||
| 207 | |||
| 208 | .form .form-row-seperated { |
||
| 209 | .portlet-body { |
||
| 210 | padding: 0; |
||
| 211 | } |
||
| 212 | |||
| 213 | .form-group { |
||
| 214 | margin: 0; |
||
| 215 | border-bottom: 1px solid #efefef; |
||
| 216 | padding: 15px 0; |
||
| 217 | |||
| 218 | &.last { |
||
| 219 | border-bottom: 0; |
||
| 220 | margin-bottom: 0; |
||
| 221 | padding-bottom: 13px; |
||
| 222 | } |
||
| 223 | |||
| 224 | .help-block { |
||
| 225 | margin-bottom: 0; |
||
| 226 | } |
||
| 227 | } |
||
| 228 | |||
| 229 | .form-body { |
||
| 230 | padding: 0; |
||
| 231 | } |
||
| 232 | |||
| 233 | .form-actions { |
||
| 234 | padding-left: 15px !important; |
||
| 235 | padding-right: 15px !important; |
||
| 236 | } |
||
| 237 | } |
||
| 238 | |||
| 239 | /* Form bordered */ |
||
| 240 | |||
| 241 | .form .form-bordered { |
||
| 242 | |||
| 243 | .form-group { |
||
| 244 | margin: 0; |
||
| 245 | border-bottom: 1px solid #efefef; |
||
| 246 | |||
| 247 | > div { |
||
| 248 | padding: 15px; |
||
| 249 | border-left: 1px solid #efefef; |
||
| 250 | |||
| 251 | @media (max-width: $screen-sm-max) { /* 991px */ |
||
| 252 | border-left: 0; |
||
| 253 | } |
||
| 254 | } |
||
| 255 | |||
| 256 | &.last { |
||
| 257 | border-bottom: 0; |
||
| 258 | } |
||
| 259 | |||
| 260 | .control-label { |
||
| 261 | padding-top: 20px; |
||
| 262 | |||
| 263 | @media (max-width: $screen-sm-max) { /* 991px */ |
||
| 264 | padding-top: 10px; |
||
| 265 | } |
||
| 266 | } |
||
| 267 | |||
| 268 | .help-block { |
||
| 269 | margin-bottom: 0; |
||
| 270 | } |
||
| 271 | |||
| 272 | .form-control { |
||
| 273 | margin: 0; |
||
| 274 | } |
||
| 275 | } |
||
| 276 | |||
| 277 | .form-body { |
||
| 278 | margin: 0; |
||
| 279 | padding: 0; |
||
| 280 | } |
||
| 281 | |||
| 282 | .form-actions { |
||
| 283 | margin-top: 0; |
||
| 284 | padding-left: 16px !important; |
||
| 285 | padding-right: 16px !important; |
||
| 286 | |||
| 287 | @media (max-width: $screen-sm-max) { /* 991px */ |
||
| 288 | padding-left: 15px !important; |
||
| 289 | padding-right: 15px !important; |
||
| 290 | } |
||
| 291 | } |
||
| 292 | } |
||
| 293 | |||
| 294 | /* Horizontal bordered form */ |
||
| 295 | |||
| 296 | .form .form-horizontal.form-bordered { |
||
| 297 | &.form-row-stripped { |
||
| 298 | .form-group:nth-child(even) { |
||
| 299 | background-color: #fcfcfc; |
||
| 300 | } |
||
| 301 | |||
| 302 | .form-control { |
||
| 303 | background: #fff !important; |
||
| 304 | } |
||
| 305 | } |
||
| 306 | |||
| 307 | &.form-label-stripped { |
||
| 308 | .form-group:nth-child(even) { |
||
| 309 | background-color: #fcfcfc; |
||
| 310 | |||
| 311 | > div { |
||
| 312 | background-color: #ffffff; |
||
| 313 | } |
||
| 314 | } |
||
| 315 | |||
| 316 | .form-group:nth-child(even) { |
||
| 317 | background-color: #fcfcfc; |
||
| 318 | } |
||
| 319 | } |
||
| 320 | } |