diff --git a/src/js/components/ContextMenu/ContextMenu.js b/src/js/components/ContextMenu/ContextMenu.js index a00796cd..1780eaf5 100755 --- a/src/js/components/ContextMenu/ContextMenu.js +++ b/src/js/components/ContextMenu/ContextMenu.js @@ -49,7 +49,7 @@ const Title = ({ ); } - if (item) { + if (item?.added_from) { return (
diff --git a/src/scss/components/_context-menu.scss b/src/scss/components/_context-menu.scss index 8a417578..ac937d75 100755 --- a/src/scss/components/_context-menu.scss +++ b/src/scss/components/_context-menu.scss @@ -187,7 +187,7 @@ } @include responsive($bp_medium){ - @include fadein(0.2s, 40px); + @include fadein(0.1s, '100px'); top: 0 !important; right: 0 !important; bottom: 0 !important; @@ -196,7 +196,7 @@ text-align: center; &--closing { - @include fadeout(0.2s, 40px); + @include fadeout(0.2s, '100px'); } &__background { @@ -205,11 +205,24 @@ right: 0; bottom: 0; left: 0; - background-image: linear-gradient(rgba(24,24,24,0) 0%, rgba(24,24,24,1) 20%); z-index: 1; - @include theme('light') { - background-image: linear-gradient(rgba(255,255,255,0) 0%, rgba(255,255,255,1) 20%); + &::after { + @include fadein(0.1s, '100px'); + display: block; + content: ''; + position: absolute; + top: calc(20% - 20px); + left: 5%; + right: 5%; + bottom: 0; + border-top-left-radius: 20px; + border-top-right-radius: 20px; + background: colour('white'); + + @include theme('dark') { + background: colour('grey'); + } } } diff --git a/src/scss/components/_dropdown-field.scss b/src/scss/components/_dropdown-field.scss index b24ae9c0..0882e019 100755 --- a/src/scss/components/_dropdown-field.scss +++ b/src/scss/components/_dropdown-field.scss @@ -129,11 +129,12 @@ } &__label { - padding: 0 0 3px 0; + padding: 0 0 12px 0; opacity: 0.5; font-size: 1rem; display: block; cursor: default; + text-transform: uppercase; &__value { display: none; @@ -156,6 +157,8 @@ &__options { display: block; position: static; + width: 50%; + margin: 0 auto; background: transparent; border-radius: 0; border: 0; @@ -182,6 +185,7 @@ } &__item { + @include click_feedback(); display: block; padding: 3px 5px; border-radius: 0; @@ -197,8 +201,8 @@ .icon { display: inline-block; - position: static; - padding-right: 2px; + position: absolute; + left: 0; padding-bottom: 3px; font-size: 0.9em; }