Cybertronics Techno Solutions Pvt. Ltd asked 10 years ago
Hello,
1.) I want to resize the tool bar button size.
2.) Want to change the color of selected row.
3.) Want to change the color of mouse hovering effect.
I tried the following code but failed.Please help me.
jquery-ui.custom.css
code area
.ui-button {
display: inline-block;
position: relative;
padding: 0;
margin-right: .1em;
cursor: pointer;
text-align: center;
zoom: 1;
overflow: visible;
}
.ui-button,.ui-button:link,.ui-button:visited,.ui-button:hover,.ui-button:active {
text-decoration: none;
}
.ui-button-icon-only {
width: 2.2em;
}
button.ui-button-icon-only {
width: 2.4em;
}
.ui-button-icons-only {
width: 3.4em;
}
button.ui-button-icons-only {
width: 3.7em;
}
.ui-button .ui-button-text {
display: block;
line-height: 1.4;
}
.ui-button-text-only .ui-button-text {
padding: .4em 1em;
}
.ui-button-icon-only .ui-button-text,.ui-button-icons-only .ui-button-text {
padding: .4em;
text-indent: -9999999px;
}
.ui-button-text-icon-primary .ui-button-text,.ui-button-text-icons .ui-button-text {
padding: .4em 1em .4em 2.1em;
}
.ui-button-text-icon-secondary .ui-button-text,.ui-button-text-icons .ui-button-text {
padding: .4em 2.1em .4em 1em;
}
.ui-button-text-icons .ui-button-text {
padding-left: 2.1em;
padding-right: 2.1em;
}
input.ui-button {
padding: .4em 1em;
}
.ui-button-icon-only .ui-icon,.ui-button-text-icon-primary .ui-icon,.ui-button-text-icon-secondary .ui-icon,.ui-button-text-icons .ui-icon,.ui-button-icons-only .ui-icon {
position: absolute;
top: 50%;
margin-top: -8px;
}
.ui-button-icon-only .ui-icon {
left: 50%;
margin-left: -8px;
}
.ui-button-text-icon-primary .ui-button-icon-primary,.ui-button-text-icons .ui-button-icon-primary,.ui-button-icons-only .ui-button-icon-primary {
left: .5em;
}
.ui-button-text-icon-secondary .ui-button-icon-secondary,.ui-button-text-icons .ui-button-icon-secondary,.ui-button-icons-only .ui-button-icon-secondary {
right: .5em;
}
.ui-button-text-icons .ui-button-icon-secondary,.ui-button-icons-only .ui-button-icon-secondary {
right: .5em;
}
.ui-buttonset {
margin-right: 7px;
}
.ui-buttonset .ui-button {
margin-left: 0;
margin-right: -.3em;
}
button.ui-button::-moz-focus-inner {
border: 0;
padding: 0;
}
and ui.jqgrid.css
Abu Ghufran answered 10 years ago
1) It is not current doable. I'll check and update if found some solution.
2) Redefine the css class .ui-state-highlight { } with your new setting.
3) Redefine the css class .ui-state-hover { }
