diff --git a/src/assets/scss/abstracts/_mixins.scss b/src/assets/scss/abstracts/_mixins.scss index 4ebbd60..22089ae 100644 --- a/src/assets/scss/abstracts/_mixins.scss +++ b/src/assets/scss/abstracts/_mixins.scss @@ -12,12 +12,20 @@ color: color-yiq($background); @include gradient-bg($background); border-color: $border; - @include box-shadow($btn-box-shadow); + // @include box-shadow($btn-box-shadow); + @if $background == $white { + box-shadow: 3px 5px 0 $dark; + } @include hover() { color: color-yiq($hover-background); @include gradient-bg($hover-background); border-color: $hover-border; + + @if $background == $white { + background-color: $white; + border-color: $dark; + } } &:focus, @@ -25,6 +33,10 @@ color: color-yiq($hover-background); @include gradient-bg($hover-background); border-color: $hover-border; + @if $background == $white { + background-color: $white; + border-color: $dark; + } } // Disabled comes first so active can properly restyle diff --git a/src/components/globals/DotButton.vue b/src/components/globals/DotButton.vue index f3dde65..acc18be 100644 --- a/src/components/globals/DotButton.vue +++ b/src/components/globals/DotButton.vue @@ -55,18 +55,44 @@ export default { &:not(.show), &.hide { - min-height: 1.1875rem; - min-width: 1.1875rem; + height: 1.1875rem; + width: 1.1875rem; padding: 0; &.dot-btn-depart { - min-height: 1.875rem; - min-width: 1.875rem; + height: 1.875rem; + width: 1.875rem; } span { display: none; } } + + &.hide:hover { + span { + pointer-events: none; + position: absolute; + display: block; + transform: translate(calc(-100% + 1.1875rem), -50%); + border-radius: 50rem; + padding: 0 $input-btn-padding-x; + line-height: 1.5; + } + + @each $color, $value in $theme-colors { + &.dot-btn-#{$color} { + span { + background-color: lighten($value, 15%); + } + &:active, + &.active { + span { + background-color: $value; + } + } + } + } + } } diff --git a/src/components/nodes/NodeViewFooter.vue b/src/components/nodes/NodeViewFooter.vue index ab1758c..d96ed3a 100644 --- a/src/components/nodes/NodeViewFooter.vue +++ b/src/components/nodes/NodeViewFooter.vue @@ -13,7 +13,7 @@