Close

Profile: sumit7034

Avatar

User posts

10 years ago

Thanks now I understand Now I have added below in css
.attributeFilterPanel7Spikes ul
{
max-height: 300px;
overflow: auto;
}
.manufacturerFilterPanel7Spikes ul
{
max-height: 400px;
overflow: auto;
}
.specificationFilterPanel7Spikes ul
{
max-height: 300px;
overflow: auto;
}


Also let me know is there a way of searching in filters like in link below on filter they are having textbox to search
http://www.centralbooksonline.com/school-books/cbse/nursery.html?p=2

10 years ago

Now I got it I am getting scrolling on Product attribute filters only

But not getting on manufacturers, vendors and Specification Attribute filter.

Please suggest the change for getting filter on them also.

10 years ago

Did you found any solution?

Is below solution working fine at your end and giving scrolling in filters
.attributeFilterPanel7Spikes ul
{
max-height: 300px;
overflow: auto;
}

10 years ago

My path is 
Desktop\nopCommerce_3.60_Source\Presentation\Nop.Web\Plugins\SevenSpikes.Nop.Plugins.AjaxFilters\Themes\DefaultClean\Content\AjaxFilters.css


and default clean is my active theme

10 years ago

Please provide the solution or provide update css for this problem

10 years ago

I have changed below is my CSS but it has no effect.
/*
* Copyright 2015 Seven Spikes Ltd. All rights reserved. (http://www.nop-templates.com)
* http://www.nop-templates.com/t/licensinginfo
*/
.attributeFilterPanel7Spikes ul
{
max-height: 20px;
overflow: auto;
}




.nopAjaxFilters7Spikes .filtersTitlePanel {
  display: none;
}
.nopAjaxFilters7Spikes a {
    cursor: pointer;
}
.product-filters {
  display: none; /*hide empty default filters*/
}




.nopAjaxFilters7Spikes .block {
    min-height: 46px;
    margin: 0 auto 10px;
}
.nopAjaxFilters7Spikes .block .title {
    position: relative;
    overflow: hidden;
    padding: 0;
    background: #f6f6f6;
    margin: 0;
}
.nopAjaxFilters7Spikes .block .filtersGroupPanel {
    position: relative;
    padding: 15px 10px;
    overflow: hidden;
}
.nopAjaxFilters7Spikes .block .title a.toggleControl {
    position: relative;
    display: block;
    cursor: pointer;
    padding: 12px 40px 12px 10px;
    color: #444;
    font-size: 18px;
}
.nopAjaxFilters7Spikes .block .title a.toggleControl:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 12px;
  height: 19px;
  margin-top: -9px;
  background: url(images/filters-toggle.png) center no-repeat;
}
.nopAjaxFilters7Spikes .block .title a.clearFilterOptions {
    position: absolute;
    top: 50%;
    right: 40px;
    font-size: 14px;
    line-height: 1;
    text-transform: lowercase;
    color: #888;
    cursor: pointer;
    margin-top: -7px;
}
.nopAjaxFilters7Spikes .block .title a.clearFilterOptions:hover {
  text-decoration: underline;
}












/* search criteria */




.selected-options-list > li {
  margin: 10px 0 0;
  font-size: 16px;
    overflow: hidden;
}
.selected-options-list > li:first-child {
  margin: 0;
}
.selected-options-list > li label{
    display: block;
    color: #444;
    margin: 0 0 2px;
}
.selected-options-list > li span {
    float: left;
    padding: 6px 14px 6px 0;
    margin: 0 20px 0 0;
    color: #4ab2f1;
    cursor: pointer;
    background: url(images/filters-remove.png) right center no-repeat;
    line-height: 1;
}
.selected-options-list > li span:hover {
  text-decoration: underline;
}












/* price range slider */




.priceRangeFilterPanel7Spikes .ui-slider {
    margin: 0 0 20px;
    border-radius: 0;
    height: 11px;
    background: #f3f3f3;
    border: 1px solid #ddd;
}
.priceRangeFilterPanel7Spikes .ui-slider-range.ui-widget-header {
    top: -1px;
    height: 11px;
    background: #ccc;
    border: 1px solid #bbb;
}
.priceRangeFilterPanel7Spikes .priceRangeMinMaxPanel {
    overflow: hidden;
    margin-bottom: 20px;
}
.priceRangeMinPanel,
.priceRangeCurrentPricesPanel .currentMinPrice {
    float: left;
}
.priceRangeMaxPanel,
.priceRangeCurrentPricesPanel .currentMaxPrice {
    float: right;
}
.priceRangeMinPanel,
.priceRangeMaxPanel {
    font-size: 14px;
    color: #888;
}
.priceRangeCurrentPricesPanel .currentMinPrice,
.priceRangeCurrentPricesPanel .currentMaxPrice {
    font-size: 16px;
    color: #444;
}
.nopAjaxFilters7Spikes .block .title a.clearPriceRangeFilter {
    position: absolute;
    top: 50%;
    right: 40px;
    font-size: 14px;
    line-height: 1;
    text-transform: lowercase;
    color: #888;
    cursor: pointer;
    margin-top: -7px;
}
.nopAjaxFilters7Spikes .block .title a.clearPriceRangeFilter:hover {
  text-decoration: underline;
}
.priceRangeFilterPanel7Spikes .ui-slider-handle {
    top: -7px !important;
    width: 10px !important;
    height: 23px !important;
    padding: 0 !important;
    cursor: pointer !important;
    background: #aaa !important;
    border: 1px solid #999 !important;
    border-radius: 0 !important;
    margin: 0 0 0 -1px !important;
}
.priceRangeFilterPanel7Spikes .ui-slider-handle:last-child {
  margin-left: -9px !important;
}



10 years ago

Currently I am using trial version of nope 3.60 I have same issue.

Please tell me where I have to change.
I mean in which file so that i can make all filters scrollable.