Check out the LimeSurvey source code on GitHub!

Clickable Image as Answer - change label

More
3 months 2 weeks ago #144150 by RitaShen
thanks for sharing.

I have use this in Mutiple Options.
just change "radio" to "checkbox"
<style type="text/css">/* Add box around answer option */  
  input[type=checkbox] + label+div::before { font-family: FontAwesome; content: "\f06a";}
  input[type=checkbox]:checked +label+div::before { font-family: FontAwesome; content: "\f07a";}
 
input[type=checkbox] + label+div {
  color: #ccc;
  font-style: italic;
  padding: 10px;
  border: 1px solid #f1f1f1;
  margin-left: -20px !important;
} 
input[type=checkbox]:checked + label+div {
  color: #f00;
  font-style: normal;
  padding: 10px;  
  border: 1px solid green;
  margin-left: -20px !important;  
}
.checkbox label::before {
  visibility: hidden !important;
}
.checkbox label::after {
  visibility: hidden !important; 
}
</style>

I just curious about does anyone try to use this in the Array´╝č
I have try, but it does not work!

many thanks

Please Log in to join the conversation.

More
3 months 2 weeks ago #144176 by tpartner
What LimeSurvey version and what type of array?

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Please Log in to join the conversation.

More
3 months 2 weeks ago #144192 by RitaShen
I'm use 2.50+ Build 160430
Attachments:

Please Log in to join the conversation.

More
3 months 2 weeks ago #144196 by tpartner
Try adding something like this to the end of template.css:

.array-flexible-row .radio input[type="radio"] + label::before {
	top: -0.2em;
	left: 0.1em;
	height: auto;
	width: auto;
	font-family: FontAwesome; 
	font-size: 21px;
	content: "\f06a";   
	color: #CCCCCC;  
	background-color: transparent;
	border: 0 none;
}
 
.array-flexible-row .radio input[type="radio"]:checked + label::before { 
	content: "\f07a";
	color: green;
}
 
.array-flexible-row .radio input[type="radio"]:focus + label::before {
    outline: none;
}
 
.array-flexible-row .radio label::after {
	display: none !important;
}


Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Attachments:
The following user(s) said Thank You: RitaShen

Please Log in to join the conversation.

More
3 months 2 weeks ago #144205 by RitaShen
it's work
thanks for help!!!!!

Please Log in to join the conversation.

Imprint                   Privacy policy         General Terms & Conditions         Revocation information and revocation form