Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

5 point question - star theme - color fade

  • rhtudd
  • rhtudd's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
4 years 7 months ago #188885 by rhtudd
5 point question - star theme - color fade was created by rhtudd
Hi there,

thanks for this excellent piece of software.

Although I have some (however a little outdated) css/php skills I desperately fail to find the point in code where I can change the overlaying color fade (greenish to redish) on the 5-point-stars theme:


Any help would be appreciated.

Thank you and regards,
Rob
The topic has been locked.
  • holch
  • holch's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 7 months ago #188906 by holch
Replied by holch on topic 5 point question - star theme - color fade
I never use this question type, but I would assume that these are images, so you need to find where these images are and adapt them accordingly.
I answer at the LimeSurvey forum in my spare time, I'm not a LimeSurvey GmbH employee.
No support via private message.
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 7 months ago - 4 years 7 months ago #188907 by Joffm
Replied by Joffm on topic 5 point question - star theme - color fade
As usual, the best way is to inspect it with a web development tool, which is included in each modern browser.
Here you see
Code:
.star-1.star-rated-on:not(.star-stub) {
    color: hsl(66, 80%, 50%);
}
.star-1 {
    color: #797979;
}
.star-2.star-rated-on:not(.star-stub) {
    color: hsl(60,80%,50%);
}
.star-2 {
    color: #868686;
}
.star-3.star-rated-on:not(.star-stub) {
    color: hsl(54,80%,50%);
}
.star-3 {
    color: #929292;
}
star-4.star-rated-on:not(.star-stub) {
    color: hsl(48,80%,50%);
}
.star-4 {
    color: #989898;
}
.star-5.star-rated-on:not(.star-stub) {
    color: hsl(42,80%,50%);
}
.star-5 {
    color: #a4a4a4;
}
 
.star-rating {
    font-size: 24px;
    line-height: 36px;
    cursor: pointer;
    display: block;
    float: left;
    height: 36px;
    overflow: hidden;
    width: 36px;
}
all in star-rating.css.
Meaning you can insert this in your custom.css and change the colors.

Joffm
Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 4 years 7 months ago by Joffm.
The following user(s) said Thank You: DenisChenu
The topic has been locked.

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans
Get started

Legal

About Us

Open Source