From bfd75e8467987c7446d4c9fcc4d48f042e53f777 Mon Sep 17 00:00:00 2001 From: alexnatalia Date: Mon, 16 Aug 2021 01:08:00 +0300 Subject: [PATCH 1/7] Stories white spaces fixing. --- src/stories/SImage.stories.ts | 56 +++++++++++++++--------------- src/stories/SSkeleton.stories.ts | 58 +++++++++++++++++--------------- 2 files changed, 59 insertions(+), 55 deletions(-) diff --git a/src/stories/SImage.stories.ts b/src/stories/SImage.stories.ts index d1436374..3150d3d9 100644 --- a/src/stories/SImage.stories.ts +++ b/src/stories/SImage.stories.ts @@ -10,16 +10,17 @@ export default { export const configurable = () => ({ components: { SImage }, - template: ``, + template: ` + `, props: { src: { default: text('Src', 'https://picsum.photos/1024') @@ -47,23 +48,24 @@ export const configurable = () => ({ export const LazyImages = () => ({ components: { SImage }, - template: `
- - - - - - - - - - - - - - - -
`, + template: ` +
+ + + + + + + + + + + + + + + +
`, data: () => ({ imageSrc: 'https://picsum.photos/1024/300' }) diff --git a/src/stories/SSkeleton.stories.ts b/src/stories/SSkeleton.stories.ts index 38283f69..79fdc51a 100644 --- a/src/stories/SSkeleton.stories.ts +++ b/src/stories/SSkeleton.stories.ts @@ -16,27 +16,28 @@ export const configurable = () => ({ SSkeletonItem, SImage }, - template: `
- - - - -
`, + template: ` +
+ + + + +
`, props: { animated: { default: boolean('Animated', true) @@ -67,13 +68,14 @@ export const SkeletonItem = () => ({ SSkeleton, SSkeletonItem }, - template: `
- - - -
`, + template: ` +
+ + + +
`, props: { element: { default: select('Element', Object.values(SkeletonItemElement), SkeletonItemElement.TEXT) From b504468d6493c7beb1401d3e8d38910169beaf4f Mon Sep 17 00:00:00 2001 From: alexnatalia Date: Mon, 16 Aug 2021 03:07:44 +0300 Subject: [PATCH 2/7] Fixed neumorphic tooltips styles. --- src/styles/neumorphism/tooltip.scss | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/src/styles/neumorphism/tooltip.scss b/src/styles/neumorphism/tooltip.scss index 800cb1e1..4b23ebaf 100644 --- a/src/styles/neumorphism/tooltip.scss +++ b/src/styles/neumorphism/tooltip.scss @@ -50,4 +50,28 @@ $neu-tooltip-background-color: var(--s-color-base-content-secondary) !default; } } } + &.s-border-radius-mini { + $popper-arrow-shift: calc(var(--s-border-radius-mini) / 4); + $popper-arrow-width: 7px; + &[x-placement^="right"], + &[x-placement^="right-start"], + &[x-placement^="left"], + &[x-placement^="left-start"] { + .popper__arrow { + margin-top: $popper-arrow-shift; + } + } + &[x-placement^="right-end"], + &[x-placement^="left-end"] { + .popper__arrow { + margin-bottom: $popper-arrow-shift; + } + } + &[x-placement^="right"] .popper__arrow { + border-right-width: $popper-arrow-width; + } + &[x-placement^="left"] .popper__arrow { + border-left-width: $popper-arrow-width; + } + } } \ No newline at end of file From e51799d6b9db96cf67af547ed8be55d11f8c5d19 Mon Sep 17 00:00:00 2001 From: alexnatalia Date: Mon, 16 Aug 2021 03:08:50 +0300 Subject: [PATCH 3/7] Updated UI Lib version. --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index d79b26a6..f596b1be 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@soramitsu/soramitsu-js-ui", - "version": "1.0.17", + "version": "1.0.18", "private": false, "publishConfig": { "registry": "https://nexus.iroha.tech/repository/npm-soramitsu/" From d85a24ba94ad262c1864476b518ac085a5e84fef Mon Sep 17 00:00:00 2001 From: alexnatalia Date: Mon, 16 Aug 2021 06:38:46 +0300 Subject: [PATCH 4/7] Fixed new line at the end of the styles file. --- src/styles/neumorphism/tooltip.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/neumorphism/tooltip.scss b/src/styles/neumorphism/tooltip.scss index 4b23ebaf..48d5d9c6 100644 --- a/src/styles/neumorphism/tooltip.scss +++ b/src/styles/neumorphism/tooltip.scss @@ -74,4 +74,4 @@ $neu-tooltip-background-color: var(--s-color-base-content-secondary) !default; border-left-width: $popper-arrow-width; } } -} \ No newline at end of file +} From c3d7c808b4972ac1c6a9ee905b13f9a503afefad Mon Sep 17 00:00:00 2001 From: alexnatalia Date: Mon, 16 Aug 2021 08:28:50 +0300 Subject: [PATCH 5/7] Fixed neumorphic tooltips styles for all border sizes, updated tooltip story. --- src/stories/STooltip.stories.ts | 5 ++- src/styles/neumorphism/tooltip.scss | 67 +++++++++++++++++++++-------- 2 files changed, 53 insertions(+), 19 deletions(-) diff --git a/src/stories/STooltip.stories.ts b/src/stories/STooltip.stories.ts index 257cd16d..4e96a696 100644 --- a/src/stories/STooltip.stories.ts +++ b/src/stories/STooltip.stories.ts @@ -86,7 +86,7 @@ export const withDifferentPlacement = () => ({ components: { STooltip, SButton, SRow, SMain }, template: ` - + {{ placement }} @@ -94,6 +94,9 @@ export const withDifferentPlacement = () => ({ props: { items: { default: () => differentPlacementData + }, + borderRadius: { + default: select('BorderRadius', Object.values(BorderRadius), BorderRadius.SMALL) } } }) diff --git a/src/styles/neumorphism/tooltip.scss b/src/styles/neumorphism/tooltip.scss index 48d5d9c6..96fbb502 100644 --- a/src/styles/neumorphism/tooltip.scss +++ b/src/styles/neumorphism/tooltip.scss @@ -2,6 +2,8 @@ $neu-tooltip-max-width: 236px !default; $neu-tooltip-padding: 6px 8px !default; $neu-tooltip-line-height: 12px !default; $neu-tooltip-background-color: var(--s-color-base-content-secondary) !default; +$neu-tooltip-arrow-shift: calc(var(--s-border-radius-mini) / 4); +$neu-tooltip-arrow-width: 8px; .el-tooltip__popper.neumorphic { max-width: $neu-tooltip-max-width; @@ -38,6 +40,7 @@ $neu-tooltip-background-color: var(--s-color-base-content-secondary) !default; &[x-placement^="right"] .popper__arrow { border-right-color: $neu-tooltip-background-color; border-bottom-color: transparent; + border-right-width: $neu-tooltip-arrow-width; &::after { border-right-color: inherit; } @@ -45,33 +48,61 @@ $neu-tooltip-background-color: var(--s-color-base-content-secondary) !default; &[x-placement^="left"] .popper__arrow { border-left-color: $neu-tooltip-background-color; border-bottom-color: transparent; + border-left-width: $neu-tooltip-arrow-width; &::after { border-left-color: inherit; } } } - &.s-border-radius-mini { - $popper-arrow-shift: calc(var(--s-border-radius-mini) / 4); - $popper-arrow-width: 7px; - &[x-placement^="right"], - &[x-placement^="right-start"], - &[x-placement^="left"], - &[x-placement^="left-start"] { - .popper__arrow { - margin-top: $popper-arrow-shift; + &.s-border-radius { + &-mini { + &[x-placement^="right"], + &[x-placement^="right-start"], + &[x-placement^="left"], + &[x-placement^="left-start"] { + .popper__arrow { + margin-top: $neu-tooltip-arrow-shift; + } } - } - &[x-placement^="right-end"], - &[x-placement^="left-end"] { - .popper__arrow { - margin-bottom: $popper-arrow-shift; + &[x-placement^="right-end"], + &[x-placement^="left-end"] { + .popper__arrow { + margin-bottom: $neu-tooltip-arrow-shift; + } } } - &[x-placement^="right"] .popper__arrow { - border-right-width: $popper-arrow-width; + &-small { + &[x-placement^="right"], + &[x-placement^="right-start"], + &[x-placement^="left"], + &[x-placement^="left-start"] { + .popper__arrow { + margin-top: calc($neu-tooltip-arrow-shift / 2); + } + } + &[x-placement^="right-end"], + &[x-placement^="left-end"] { + .popper__arrow { + margin-bottom: calc($neu-tooltip-arrow-shift / 2); + } + } } - &[x-placement^="left"] .popper__arrow { - border-left-width: $popper-arrow-width; + &-medium, + &-big { + &[x-placement^="right"], + &[x-placement^="right-start"], + &[x-placement^="left"], + &[x-placement^="left-start"] { + .popper__arrow { + margin-top: -2px; + } + } + &[x-placement^="right-end"], + &[x-placement^="left-end"] { + .popper__arrow { + margin-bottom: -2px; + } + } } } } From 85002f224202dd2a7a84491935da965fe85063f4 Mon Sep 17 00:00:00 2001 From: alexnatalia Date: Mon, 16 Aug 2021 09:11:33 +0300 Subject: [PATCH 6/7] Fixed new lines at the end of the files. --- src/styles/option.scss | 2 +- src/styles/table.scss | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/styles/option.scss b/src/styles/option.scss index 661abc91..6939c70c 100644 --- a/src/styles/option.scss +++ b/src/styles/option.scss @@ -1,4 +1,4 @@ .s-option { padding-left: $s-basic-spacing * 2; padding-right: $s-basic-spacing * 2; -} \ No newline at end of file +} diff --git a/src/styles/table.scss b/src/styles/table.scss index 9c14d1c6..b9cdb281 100644 --- a/src/styles/table.scss +++ b/src/styles/table.scss @@ -187,4 +187,4 @@ .el-table--enable-row-hover.s-hierarchical-table-level:not(.s-hierarchical-table-level--last) .el-table__body tr.s-hierarchical-table-row:hover > td { background: transparent; } -} \ No newline at end of file +} From ff357563a98a91ab1f8b72c429691ce451a38de2 Mon Sep 17 00:00:00 2001 From: alexnatalia Date: Mon, 16 Aug 2021 12:26:18 +0300 Subject: [PATCH 7/7] Fixed variables calls. --- src/styles/neumorphism/tooltip.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/styles/neumorphism/tooltip.scss b/src/styles/neumorphism/tooltip.scss index 96fbb502..c4eafbfc 100644 --- a/src/styles/neumorphism/tooltip.scss +++ b/src/styles/neumorphism/tooltip.scss @@ -77,13 +77,13 @@ $neu-tooltip-arrow-width: 8px; &[x-placement^="left"], &[x-placement^="left-start"] { .popper__arrow { - margin-top: calc($neu-tooltip-arrow-shift / 2); + margin-top: calc(#{$neu-tooltip-arrow-shift} / 2); } } &[x-placement^="right-end"], &[x-placement^="left-end"] { .popper__arrow { - margin-bottom: calc($neu-tooltip-arrow-shift / 2); + margin-bottom: calc(#{$neu-tooltip-arrow-shift} / 2); } } }