diff --git a/app/styles/base.sass b/app/styles/base.sass index da69e5a83..663326fcc 100644 --- a/app/styles/base.sass +++ b/app/styles/base.sass @@ -161,8 +161,8 @@ a[data-toggle="modal"] table.table background-color: white -.ui-autocomplete - //z-index: $zindexAutocomplete +//.ui-autocomplete +// z-index: $zindexAutocomplete .ui-slider border: 1px solid black diff --git a/app/styles/play/level.sass b/app/styles/play/level.sass index ed07f7709..122c07f2a 100644 --- a/app/styles/play/level.sass +++ b/app/styles/play/level.sass @@ -1,34 +1,5 @@ -@import "../bootstrap/mixins" - -@mixin gradient-banner-button($topBottomColor: #2C446A, $middleColor: #3A537F) - background-color: mix($topBottomColor, $middleColor, 80%) - background-image: -webkit-gradient(linear, 0 0, 0 100%, from($topBottomColor), color-stop(16%, $topBottomColor), color-stop(17%, $middleColor), color-stop(83%, $middleColor), color-stop(84%, $topBottomColor), to($topBottomColor)) - background-image: -webkit-linear-gradient($topBottomColor, $topBottomColor 16%, $middleColor 16%, $middleColor 83%, $topBottomColor 84%, $topBottomColor) - background-image: -moz-linear-gradient(top, $topBottomColor, $topBottomColor 16%, $middleColor 16%, $middleColor 83%, $topBottomColor 84%, $topBottomColor) - background-image: -o-linear-gradient($topBottomColor, $topBottomColor 16%, $middleColor 16%, $middleColor 83%, $topBottomColor 84%, $topBottomColor) - background-image: linear-gradient($topBottomColor, $topBottomColor 16%, $middleColor 16%, $middleColor 83%, $topBottomColor 84%, $topBottomColor) - background-repeat: no-repeat - -@mixin banner-button($backgroundColor: #3A537F, $textColor: #FFF) - $topBottomColor: darken($backgroundColor, 9%) - @include gradient-banner-button($topBottomColor, $backgroundColor) - color: $textColor - - &:hover:not(.disabled):not([disabled]), &:focus:not(.disabled):not([disabled]) - @include gradient-banner-button(lighten($topBottomColor, 6%), lighten($backgroundColor, 6%)) - - &.active, &:active - background-image: none - outline: 0 - @include box-shadow(inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)) - - // Disabled state - &.disabled, &[disabled] - cursor: default - background-image: none - @include opacity(0.65) - @include box-shadow(none) - +@import "app/styles/bootstrap/mixins" +@import "app/styles/mixins" #level-view margin: 0 auto diff --git a/app/styles/play/level/hud.sass b/app/styles/play/level/hud.sass index ce112abc9..63f8b1a94 100644 --- a/app/styles/play/level/hud.sass +++ b/app/styles/play/level/hud.sass @@ -1,4 +1,5 @@ @import "app/styles/bootstrap/mixins" +@import "app/styles/mixins" #thang-hud.no-selection .center @@ -63,19 +64,24 @@ .thang-canvas-wrapper, .speaker-image-wrapper width: 100px height: 100px - border: 1px solid darkred margin: 7px 7px 7px 22px float: left - border-radius: 4px overflow: hidden + border: 1px solid #888 + border-radius: 4px + @include gradient-radial-custom-stops(hsla(205,0%,74%,1), 20%, hsla(205,0%,31%,1), 70%) &.team-humans border-color: darkred - background-color: rgba(255,100,100,0.5) + @include gradient-radial-custom-stops(hsla(4,80%,74%,1), 20%, hsla(4,80%,51%,1), 70%) &.team-ogres border-color: darkblue - background-color: rgba(100,100,255,0.5) + @include gradient-radial-custom-stops(hsla(205,100%,74%,1), 20%, hsla(205,100%,31%,1), 70%) + + &.team-allies, &.team-minions + border-color: darkgreen + @include gradient-radial-custom-stops(hsla(116,80%,74%,1), 20%, hsla(116,80%,31%,1), 70%) .thang-props width: 144px diff --git a/app/styles/play/level/thang_avatar.sass b/app/styles/play/level/thang_avatar.sass index 683a58ac2..07ea13bc7 100644 --- a/app/styles/play/level/thang_avatar.sass +++ b/app/styles/play/level/thang_avatar.sass @@ -1,14 +1,5 @@ -@import "../../bootstrap/mixins" - -@mixin gradient-radial-custom-stops($innerColor: #555, $innerStop: 20%, $outerColor: #333, $outerStop: 70%) - background-color: $outerColor - @include gradient-vertical($innerColor, $outerColor) // IE6-9 fallback on vertical gradient - background-image: -webkit-gradient(radial, center center, 0, center center, 460, from($innerColor $innerStop), to($outerColor $outerStop)) - background-image: -webkit-radial-gradient(circle, $innerColor $innerStop, $outerColor $outerStop) - background-image: -moz-radial-gradient(circle, $innerColor $innerStop, $outerColor $outerStop) - background-image: -o-radial-gradient(circle, $innerColor $innerStop, $outerColor $outerStop) - background-image: radial-gradient(circle, $innerColor $innerStop, $outerColor $outerStop) - background-repeat: no-repeat +@import "app/styles/bootstrap/mixins" +@import "app/styles/mixins" .thang-avatar-view diff --git a/app/views/play/level/hud_view.coffee b/app/views/play/level/hud_view.coffee index 3fb5ba321..e70714eda 100644 --- a/app/views/play/level/hud_view.coffee +++ b/app/views/play/level/hud_view.coffee @@ -110,7 +110,8 @@ module.exports = class HUDView extends View newCanvas = $(stage.canvas).addClass('thang-canvas') wrapper.empty().append(newCanvas) team = @thang?.team or @speakerSprite?.thang?.team - newCanvas.parent().removeClass('team-ogres').removeClass('team-humans').addClass("team-#{team}") + wrapper.removeClass (i, css) -> (css.match(/\bteam-\S+/g) or []).join ' ' + wrapper.addClass "team-#{team}" stage.update() @stage?.stopTalking() @stage = stage