diff options
author | Israel Lavi <il0695@att.com> | 2018-08-07 10:54:17 +0300 |
---|---|---|
committer | Israel Lavi <il0695@att.com> | 2018-08-07 11:06:44 +0300 |
commit | b2a3acea0d0f66028c9ce5fad02d4ecc64abf70c (patch) | |
tree | 8d70110f34cb845965c42a5915e950bca967d2c3 /src/style/scss/angular | |
parent | 05b37297177e8a342668c15e5d6f738b51f7aedd (diff) |
Initial commit.
Adding files needed for Linux Foundation.
Change-Id: I9f2b4851a5ae01f83800c7f8bab8608a2221c730
Issue-ID: SDC-1608
Signed-off-by: Israel Lavi <il0695@att.com>
Diffstat (limited to 'src/style/scss/angular')
-rw-r--r-- | src/style/scss/angular/_svg_icon.scss | 210 | ||||
-rw-r--r-- | src/style/scss/angular/_tooltip_custom_style.scss | 9 |
2 files changed, 0 insertions, 219 deletions
diff --git a/src/style/scss/angular/_svg_icon.scss b/src/style/scss/angular/_svg_icon.scss deleted file mode 100644 index 16be14b..0000000 --- a/src/style/scss/angular/_svg_icon.scss +++ /dev/null @@ -1,210 +0,0 @@ -@mixin color-icon($primary-color) { - color: $primary-color; - fill: $primary-color; -} - -@mixin color-icon-hover($secondary-color) { - &.clickable { - &:not([disabled]):hover, &:active, &:focus { - @include color-icon($secondary-color); - } - } -} - -@mixin color-icon-label($primary-color) { - @include color-icon($primary-color); - - .svg-icon { - @include color-icon($primary-color); - } -} - -@mixin color-icon-label-hover($secondary-color) { - &.clickable { - &:not([disabled]):hover, &:active, &:focus { - @include color-icon-label($secondary-color); - } - } -} - -.svg-icon { - display: inline-flex; - width: 24px; - height: 24px; - - & > svg { - width: 100%; - height: 100%; - } - - &[disabled] { - opacity: 0.7; - } - - &.mode-primary { - @include color-icon($blue); - @include color-icon-hover($light-blue); - } - - &.mode-secondary { - @include color-icon($gray); - @include color-icon-hover($dark-gray); - } - - &.mode-success { - @include color-icon($green); - } - - &.mode-error { - @include color-icon($red); - } - - &.mode-warning { - @include color-icon($yellow); - } - - &.mode-info { - @include color-icon($text-black); - @include color-icon-hover($dark-blue); - } - - &.size-x_small { - width: 12px; - height: 12px; - } - - &.size-small { - width: 16px; - height: 16px; - } - - &.size-medium { - width: 24px; - height: 24px; - } - - &.size-large { - width: 36px; - height: 36px; - } - - &.size-x_large { - width: 48px; - height: 48px; - } -} - -.svg-icon-wrapper { - display: inline-flex; - justify-content: center; - align-items: center; - - &.svg-icon-label { - } - - &.svg-icon { - } - - &[disabled] { - opacity: 0.7; - } - - &.label-placement-bottom { - flex-direction: column; - .svg-icon-label { - margin-top: 0.25em; - } - } - - &.label-placement-right { - .svg-icon-label { - margin-left: 0.25em; - } - } - - &.label-placement-top { - flex-direction: column-reverse; - .svg-icon-label { - margin-bottom: 0.25em; - } - } - - &.label-placement-left { - flex-direction: row-reverse; - .svg-icon-label { - margin-right: 0.25em; - } - } - - &.mode-primary { - @include color-icon-label($blue); - @include color-icon-label-hover($light-blue); - } - - &.mode-secondary { - @include color-icon-label($gray); - @include color-icon-label-hover($dark-gray); - } - - &.mode-success { - @include color-icon-label($green); - } - - &.mode-error { - @include color-icon-label($red); - } - - &.mode-warning { - @include color-icon-label($yellow); - } - - &.mode-info { - @include color-icon-label($text-black); - @include color-icon-label-hover($dark-blue); - } - - &.size-x_small { - font-size: 8px; - line-height: 10px; - - .svg-icon { - @extend .svg-icon.size-x_small; - } - } - - &.size-small { - font-size: 12px; - line-height: 14px; - - .svg-icon { - @extend .svg-icon.size-small; - } - } - - &.size-medium { - font-size: 16px; - line-height: 20px; - - .svg-icon { - @extend .svg-icon.size-medium; - } - } - - &.size-large { - font-size: 24px; - line-height: 28px; - - .svg-icon { - @extend .svg-icon.size-large; - } - } - - &.size-x_large { - font-size: 34px; - line-height: 40px; - - .svg-icon { - @extend .svg-icon.size-x_large; - } - } -} diff --git a/src/style/scss/angular/_tooltip_custom_style.scss b/src/style/scss/angular/_tooltip_custom_style.scss deleted file mode 100644 index 886b1dc..0000000 --- a/src/style/scss/angular/_tooltip_custom_style.scss +++ /dev/null @@ -1,9 +0,0 @@ -.sdc-custom-tooltip { - background-color: $dark-blue; - border-color: $dark-blue; - border-radius: 10px; - - &:after { - border-color: $dark-blue transparent transparent transparent; - } -} |