Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

needs a way to custom style everything. #6

Closed
jspreddy opened this issue Apr 20, 2015 · 5 comments
Closed

needs a way to custom style everything. #6

jspreddy opened this issue Apr 20, 2015 · 5 comments

Comments

@jspreddy
Copy link

Make the plugin custom styleable. As it stands now, I can't change the styling without changing it inline in the plugin js file.

Extract all the styling strings (css classes) into the options object.
Default options will have default styling strings.
Can pass in custom styling classes.

@paramquery
Copy link
Owner

It's not needed to make changes in js file to customize styling. All the styling is done by assigning classes which are in css file. you can have a look at the css file and override the styles by writing your own css rules for those classes.

For example in this demo http://paramquery.com/pro/demos/showhide_columns .pq-select-button and .pq-select-popup-cont classes are customized. ( Please have a look at the css tab under the demo )

.pq-toolbar .pq-select-button
{
padding:4px 5px;
min-width:200px;
}
.pq-select-popup-cont
{
max-width:200px;
}

Some of the classes can be modified or added with help of options like hoverCls and selectCls

Probably addition of options to inject classes in various states and to different regions of the select list or documentation of the customizable classes would be more appropriate.

@jspreddy
Copy link
Author

Agreed. I can write styling to override all the styling classes used in there and get a decent looking thingy.
My requirement is that I want to restyle this using bootstrap and not use any jQuery-UI classes.
Is there any other way to do that?

@paramquery
Copy link
Owner

Ok, I see what you mean. I guess you want to assign bootstrap classes to different regions/parts of the select list?

That's a nice suggestion, support for it would be added probably in the next version.

@paramquery
Copy link
Owner

Just an addition: There is a jsfiddle of customizing css with existing classes in pqSelect

http://jsfiddle.net/dLvx6u63/11/

and the common classes are documented here:

https://github.com/paramquery/select/wiki/Css-customization

@massic80
Copy link

massic80 commented Jul 8, 2016

Current release lacks an important class: see #5 from @barseghyanartur.
This would be a quick amend!

@jspreddy jspreddy closed this as completed Aug 8, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants