diff --git a/.storybook/storybook.scss b/.storybook/storybook.scss index f1e1bee62..d8cdd8a97 100644 --- a/.storybook/storybook.scss +++ b/.storybook/storybook.scss @@ -21,6 +21,7 @@ .sbdocs-preview { overflow: visible !important; + background: var(--ui-01) i !important; > div { > div { overflow: visible !important; diff --git a/src/components/Item/Item.js b/src/components/Item/Item.js index f06847061..a11125c75 100755 --- a/src/components/Item/Item.js +++ b/src/components/Item/Item.js @@ -38,9 +38,8 @@ export const Item = ({ {image ? (
{image}
) : noImage ? ( -
- Empty -
+
) : null}
diff --git a/src/components/Item/_item.scss b/src/components/Item/_item.scss index 632d0fdfd..df12f2371 100755 --- a/src/components/Item/_item.scss +++ b/src/components/Item/_item.scss @@ -59,6 +59,11 @@ background: var(--ui-02); } } + &--repeater { + cursor: pointer; + background: var(--ui-02); + margin-bottom: 1em; + } &--button { padding: 1em; &:hover { @@ -149,7 +154,8 @@ .#{$prefix}--item__image { svg, .svg-inline--fa, - img { + img, + video { margin: 0; display: block; width: 100%; diff --git a/src/components/Sidebar/_sidebar.scss b/src/components/Sidebar/_sidebar.scss index 90e5fde38..f557e065b 100644 --- a/src/components/Sidebar/_sidebar.scss +++ b/src/components/Sidebar/_sidebar.scss @@ -60,7 +60,8 @@ top: 0; background: var(--ui-01); width: 100%; - min-height: 100%; + height: 100%; + overflow: auto; transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1); z-index: 100; } diff --git a/src/globals/scss/_theme-tokens.scss b/src/globals/scss/_theme-tokens.scss index 3f1a05f47..9b5e0a8cf 100644 --- a/src/globals/scss/_theme-tokens.scss +++ b/src/globals/scss/_theme-tokens.scss @@ -22,9 +22,9 @@ --text-01: #{$color__white}; --text-02: #{$color__navy-gray-8}; --text-03: #{$color__navy-gray-9}; - --field-01: #{$color__navy-gray-2}; + --field-01: #{$color__gray-80}; --field-02: #{$color__navy-gray-2}; - --field-border-01: #{$color__navy-gray-4}; + --field-border-01: #{$color__gray-60}; --focus-01: #{$color__navy-gray-1}; --support-01: #{$color__red}; --support-light-01: #{saturate(darken($color__red, 20), 40)}; //#{$color__red-60}; @@ -136,12 +136,12 @@ @include darkTheme(); background-color: var(--ui-01) !important; } -} -@media (prefers-color-scheme: dark) { - body { - &.wfp--theme-dark--auto { - @include darkTheme(); + @media (prefers-color-scheme: dark) { + body { + &.wfp--theme-dark--auto { + @include darkTheme(); + } } } }