.enable_search() when(@enable-search = true) { .well.search-area { background-color: #ecf1f4; border-color: #d6e1ea; .box-shadow(none); } .search-thumbnail { .transition-duration(0.1s); &:hover { border-color: #75A8CE; } .search-title { margin-top: 15px; } } .search-media { border: 1px solid #ddd; margin-top: -1px; padding: 12px; .transition(~"border 0.1s ease-in-out 0s"); position: relative; padding-right: 150px; &:hover { border-color: #75A8CE; z-index: 1; } .search-actions { position: absolute; right: 0; top: 0; bottom: 0; height: 100%; width: 20%; min-width: 100px; max-width: 150px; padding: 6px 9px; &::before { content: ""; display: block; position: absolute; left: 0; top: 8px; bottom: 16px; width: 1px; #gradient > .vertical(#FFF, #DDD); } } &:hover .search-actions { background-color: #F0F4F7; } &.disabled:hover .search-actions { background-color: #F6F6F6; } &:not(.disabled):hover .search-actions::before { #gradient > .vertical(#FFF, lighten(#6FB3E0, 5%)); } } .search-filter-header { padding: 8px; margin: -4px; } .search-btn-action { position: absolute; bottom: -5px; left: 0; right: 0; width: auto; .transition(~"bottom 0.15s"); } .search-media:hover .search-btn-action{ bottom: 1px; } .search-promotion.label { position: absolute; margin-top: -1px; margin-left: -1px; } .search-filter-element { padding: 12px; background-color: #FFF; border: 1px solid #C9DDE7; } //search type 2 .search-results { padding: 24px 12px; min-height: 20px; } .search-result { margin-top: -1px; position: relative; padding: 12px; border: 1px dotted; border-color: #DDD #FFF #FFF; border-color: rgba(0, 0, 0, 0.11) transparent transparent; &:hover { background-color: #F7F7F7; border-color: #D6E1EA; border-style: solid; z-index: 1; } &:first-child { border-top-color: #FFF; border-top-color: transparent; } &:first-child:hover { border-top-color: #D6E1EA; } ///// .search-title { font-size: @font-size-search-title; margin-top: 0; margin-bottom: 6px; } .search-content { margin-top: 2px; } } } .enable_search();