diff --git a/src/form-label.scss b/src/form-label.scss index da8d4b837a..d97a572d73 100644 --- a/src/form-label.scss +++ b/src/form-label.scss @@ -1,5 +1,5 @@ -@import "./new-settings"; -@import "./mixins"; +@import './new-settings'; +@import './mixins'; /*! .fd-form-label @@ -33,11 +33,11 @@ $block: #{$fd-namespace}-form-label; } &--required, - &[aria-required="true"] { + &[aria-required='true'] { padding-right: $fd-require-space-padding; &::after { - content: "*"; + content: '*'; font-size: var(--sapFontSize); font-weight: bold; color: var(--sapField_RequiredColor); @@ -61,7 +61,7 @@ $block: #{$fd-namespace}-form-label; padding-right: $fd-colon-space-padding; &::before { - content: ":"; + content: ':'; font-size: var(--sapFontSize); color: inherit; position: absolute; @@ -80,7 +80,7 @@ $block: #{$fd-namespace}-form-label; } &.#{$block}--required, - &[aria-required="true"] { + &[aria-required='true'] { padding-right: $fd-require-colon-space-spacing; &::before { @@ -104,9 +104,5 @@ $block: #{$fd-namespace}-form-label; display: flex; justify-content: space-between; align-items: center; - - .#{$fd-namespace}-inline-help { - top: 0; - } } } diff --git a/src/fundamental-styles.scss b/src/fundamental-styles.scss index 948a9774b4..af7faf275f 100644 --- a/src/fundamental-styles.scss +++ b/src/fundamental-styles.scss @@ -24,7 +24,6 @@ @import "./form-item"; @import "./form-label"; @import "./form-message"; -@import "./inline-help"; @import "./input"; @import "./input-group"; @import "./layout-grid"; diff --git a/src/inline-help.scss b/src/inline-help.scss deleted file mode 100644 index 677f5a448f..0000000000 --- a/src/inline-help.scss +++ /dev/null @@ -1,69 +0,0 @@ -@import "./new-settings"; -@import "./mixins"; - -$block: #{$fd-namespace}-inline-help; - -.#{$block} { - // LOCAL VARS - $fd-tooltip-icon-background-color: var(--sapButton_Neutral_Background) !default; - $fd-tooltip-content-background-color: var(--sapTile_Background) !default; - $fd-tooltip-content-color: var(--sapTextColor) !default; - $fd-tooltip-padding: 0.5rem !default; - $fd-tooltip-icon-size: 1.125rem; - $fd-tooltip-transition-params: $fd-animation-speed ease-in !default; - $fd-tooltip-min-width: 21.875rem !default; - $fd-tooltip-box-shadow: drop-shadow(var(--sapContent_Shadow0)) !default; - - // BLOCK BASE ******************************************* - @include fd-reset(); - - position: relative; - display: inline-block; - width: $fd-tooltip-icon-size; - height: $fd-tooltip-icon-size; - top: 0.188rem; - - &::before { - content: "?"; - width: $fd-tooltip-icon-size; - height: $fd-tooltip-icon-size; - line-height: $fd-tooltip-icon-size; - font-style: normal; - position: absolute; - left: 0; - border-radius: 50%; - color: var(--sapContent_ContrastIconColor); - background-color: $fd-tooltip-icon-background-color; - text-align: center; - } - - // ELEMENTS ******************************************* - &__content { - font-size: var(--sapFontSmallSize); - line-height: normal; - background-color: $fd-tooltip-content-background-color; - padding: $fd-tooltip-padding * 1.5; - display: block; - color: $fd-tooltip-content-color; - top: $fd-tooltip-padding * 2.5; - right: -$fd-tooltip-padding; - min-width: $fd-tooltip-min-width; - transition: opacity $fd-tooltip-transition-params; - text-align: left; - z-index: map-get($fd-z-index-levels, "first"); - border-radius: 0.313rem; - filter: $fd-tooltip-box-shadow; - } - - &:hover { - .#{$block}__content { - visibility: visible; - opacity: 1; - overflow: visible; - } - } - - &:focus { - outline: none; - } -}