diff --git a/com.twin.app.shoptime/src/views/SearchPanel/SearchResults/SearchItemResults/SearchItemCard/SearchItemCard.module.less b/com.twin.app.shoptime/src/views/SearchPanel/SearchResults/SearchItemResults/SearchItemCard/SearchItemCard.module.less index afda3d1c..90a8d217 100644 --- a/com.twin.app.shoptime/src/views/SearchPanel/SearchResults/SearchItemResults/SearchItemCard/SearchItemCard.module.less +++ b/com.twin.app.shoptime/src/views/SearchPanel/SearchResults/SearchItemResults/SearchItemCard/SearchItemCard.module.less @@ -4,9 +4,9 @@ .card { .size(@w: 561px, @h:150px); background-color: @COLOR_LIGHT_SKYBLUE; - overflow: hidden; border: 1px solid #ccc; .flex(); + position: relative; .imageBox { .size(@w: 150px, @h: 100%); @@ -53,7 +53,8 @@ &:focus-within, &:focus { - border: 4px solid @PRIMARY_COLOR_RED; - box-shadow: 0 0 50px 0 rgba(11, 8, 8, 0.5); + &::after { + .focused(@boxShadow: 22px); + } } } diff --git a/com.twin.app.shoptime/src/views/SearchPanel/SearchResults/SearchThemeResults/SearchThemeCard/SearchThemeCard.module.less b/com.twin.app.shoptime/src/views/SearchPanel/SearchResults/SearchThemeResults/SearchThemeCard/SearchThemeCard.module.less index 6c4eb28c..45d5ef9d 100644 --- a/com.twin.app.shoptime/src/views/SearchPanel/SearchResults/SearchThemeResults/SearchThemeCard/SearchThemeCard.module.less +++ b/com.twin.app.shoptime/src/views/SearchPanel/SearchResults/SearchThemeResults/SearchThemeCard/SearchThemeCard.module.less @@ -5,11 +5,11 @@ .size(@w: 560px, @h: 140px); background-image: url("../../../../../../assets/searchpanel/bg_srch_curation.png"); border: 2px solid #ccc; - overflow: hidden; background-size: cover; background-repeat: no-repeat; background-position: center top; padding: 25px 20px; + position: relative; .title { color: @COLOR_GRAY06; @@ -37,9 +37,10 @@ &:focus-within, &:focus { + &::after { + .focused(@boxShadow: 22px); + } background-position: center bottom; - border: 4px solid @PRIMARY_COLOR_RED; - box-shadow: 0 0 50px 0 rgba(11, 8, 8, 0.5); .title { color: @COLOR_WHITE;