diff --git a/scss/components/form/_form.scss b/scss/components/form/_form.scss index 56f6ac67..6be0970c 100644 --- a/scss/components/form/_form.scss +++ b/scss/components/form/_form.scss @@ -7,7 +7,7 @@ } &--inline { - > .#{$ns}PlainField { + >.#{$ns}PlainField { display: inline-block; padding-top: $Form-input-paddingY; // padding-bottom: $Form-input-paddingY; @@ -20,8 +20,9 @@ margin-bottom: px2rem(5px); display: inline-block; max-width: 100%; + position: relative; - > span { + >span { position: relative; } } @@ -30,9 +31,8 @@ color: $red; font-size: $fontSizeXs; position: absolute; - left: 100%; - top: px2rem(5px); - margin-left: px2rem(3px); + left: px2rem(-7px); + top: px2rem(4px); line-height: 1; } @@ -60,11 +60,11 @@ .#{$ns}Form-item { margin-bottom: $Form-item-gap; - .#{$ns}Grid-form > &:last-child { + .#{$ns}Grid-form>&:last-child { margin-bottom: 0; } - .#{$ns}Form--inline > &--inline { + .#{$ns}Form--inline>&--inline { margin-bottom: $Form-item-gap/2; margin-right: $Form-item-gap/2; @@ -80,18 +80,18 @@ } &--horizontal { - > .#{$ns}Form-label { + >.#{$ns}Form-label { text-align: $Form--horizontal-label-align; } } &--normal { - > .#{$ns}Form-label { + >.#{$ns}Form-label { display: block; } } - &.is-error > .#{$ns}Form-label { + &.is-error>.#{$ns}Form-label { color: $danger; } } @@ -136,13 +136,13 @@ margin-left: -$Form--horizontal-gutterWidth / 2; margin-right: -$Form--horizontal-gutterWidth / 2; - > * { + >* { padding-left: $Form--horizontal-gutterWidth / 2; padding-right: $Form--horizontal-gutterWidth / 2; } - > .#{$ns}Form-label, - > .#{$ns}Form-value { + >.#{$ns}Form-label, + >.#{$ns}Form-value { flex-basis: 0; flex-grow: 1; max-width: 100%; @@ -157,7 +157,7 @@ flex-basis: unset; } - > .#{$ns}Form-label { + >.#{$ns}Form-label { padding-top: $Form-label-paddingTop; margin-bottom: 0; } @@ -195,7 +195,7 @@ display: inline-block; vertical-align: top; - > .#{$ns}Form-label { + >.#{$ns}Form-label { padding-top: $Form-label-paddingTop; margin-bottom: 0; margin-right: $Form-item-gap/2; @@ -205,19 +205,19 @@ } } - > .#{$ns}Form-value { + >.#{$ns}Form-value { display: inline; - > .#{$ns}Form-control { + >.#{$ns}Form-control { vertical-align: top; display: inline-block; } - > .#{$ns}Form-control.#{$ns}InputGroup { + >.#{$ns}Form-control.#{$ns}InputGroup { display: inline-flex; } - > .#{$ns}TextControl--withAddOn { + >.#{$ns}TextControl--withAddOn { display: inline-flex; } } @@ -232,7 +232,7 @@ margin-right: -$Form-row-gutterWidth / 2; align-items: flex-start; - > * { + >* { padding-left: $Form-row-gutterWidth / 2; padding-right: $Form-row-gutterWidth / 2; } @@ -248,16 +248,16 @@ display: flex; flex-wrap: nowrap; - > .#{$ns}Form-label { + >.#{$ns}Form-label { display: inline-block; vertical-align: top; padding-top: $Form-label-paddingTop; padding-right: $Form-row-gutterWidth; } - > .#{$ns}Form-control { + >.#{$ns}Form-control { flex-basis: 0; flex-grow: 1; } } -} +} \ No newline at end of file diff --git a/src/icons/upload.svg b/src/icons/upload.svg index 1906b4a4..0516398d 100644 --- a/src/icons/upload.svg +++ b/src/icons/upload.svg @@ -1,6 +1,6 @@ - +