diff --git a/src/scss/components/_context-menu.scss b/src/scss/components/_context-menu.scss index d5d92012..1a265784 100755 --- a/src/scss/components/_context-menu.scss +++ b/src/scss/components/_context-menu.scss @@ -69,30 +69,13 @@ overflow-x: hidden; .menu-item { + @include gradient_overlay(3px); cursor: pointer; display: block; padding: 9px 12px 8px; box-sizing: border-box; position: relative; color: $white; - border-radius: 3px; - - &:before { - @include animate(); - content: ''; - display: block; - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - opacity: 0; - z-index: 9; - background: -webkit-linear-gradient(to bottom right, rgba(255,255,255,1), rgba(0,0,0,0.5)); - background: -moz-linear-gradient(to bottom right, rgba(255,255,255,1), rgba(0,0,0,0.5)); - background: -o-linear-gradient(to bottom right, rgba(255,255,255,1), rgba(0,0,0,0.5)); - background: linear-gradient(to bottom right, rgba(255,255,255,1), rgba(0,0,0,0.5)); - } .notouch &:hover { &:before { @@ -124,13 +107,15 @@ position: absolute; top: 0; right: 0; - bottom: 0; left: 100%; + height: 100%; + min-height: 200px; width: 0; height: 100%; overflow-y: scroll; - background: $faint_grey; + background: $darkest_grey; z-index: 3; + border-radius: 3px; &.expanded { width: 100%; @@ -166,7 +151,7 @@ font-weight: 300; color: inherit; - &:not(:first-child){ + &:not(:first-child):not(.dropdown-field){ border-top: 1px solid lighten($dark_grey, 8%); } @@ -188,6 +173,7 @@ .dropdown-field { padding: 0; + box-shadow: none; .label { padding: 16px 20px; @@ -196,11 +182,14 @@ .options { display: block; position: static; - background: darken($dark_grey, 5%); + background: $darkest_grey; + border-radius: 0; + border: 0; + color: $white !important; .option { padding: 12px 20px 12px 50px; - border-top: 1px solid $dark_grey; + border-radius: 0; .fa { display: inline-block; @@ -208,6 +197,10 @@ top: 14px; } } + + &:before { + display: none; + } } } } @@ -254,7 +247,6 @@ } & > span { - button, .button { color: $white; diff --git a/src/scss/components/_dropdown-field.scss b/src/scss/components/_dropdown-field.scss index dbfd5f56..2d3392d3 100755 --- a/src/scss/components/_dropdown-field.scss +++ b/src/scss/components/_dropdown-field.scss @@ -10,7 +10,7 @@ padding: 14px 10px; cursor: pointer; - &:hover { + .notouch &:hover { color: $blue; } } @@ -79,7 +79,7 @@ font-size: 10px; } - &:hover { + .notouch &:hover { color: $black; &:before { diff --git a/src/scss/global/_forms.scss b/src/scss/global/_forms.scss index 638de460..67c12c3d 100755 --- a/src/scss/global/_forms.scss +++ b/src/scss/global/_forms.scss @@ -57,9 +57,9 @@ input[type="submit"] { vertical-align: middle; position: relative; border: 0 !important; + cursor: pointer; - &:hover{ - cursor: pointer; + .notouch &:hover{ box-shadow: 1px 2px 6px rgba(0,0,0,0.2); &:before { @@ -148,7 +148,7 @@ input[type="submit"] { cursor: not-allowed !important; &, - &:hover, + .notouch &:hover, &:active { color: $mid_grey; border-color: $mid_grey; diff --git a/src/scss/global/_variables.scss b/src/scss/global/_variables.scss index 0f125da4..bfdde028 100755 --- a/src/scss/global/_variables.scss +++ b/src/scss/global/_variables.scss @@ -206,6 +206,7 @@ $bp_shallow: 650px; left: 0; opacity: $opacity; z-index: 9; + pointer-events: none; background: -webkit-linear-gradient(to bottom right, rgba(255,255,255,1), rgba(0,0,0,0.5)); background: -moz-linear-gradient(to bottom right, rgba(255,255,255,1), rgba(0,0,0,0.5)); background: -o-linear-gradient(to bottom right, rgba(255,255,255,1), rgba(0,0,0,0.5));