Welcome, Guest
Username: Password: Remember me
  • Page:
  • 1
  • 2

TOPIC: template.css

Re: template.css 3 years 8 months ago #54839

  • Mazi
  • Mazi's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 5325
  • Thank you received: 296
  • Karma: 249
chupanibre wrote:
@Mazi: Is there another option to implement a test-survey than to activate the aurvey?
At global settings -> securtiy -> enable preview for non-admin users
This way we can view a survey even if it's not activated yet.

Best regards/Beste Grüße,
Dr. Marcel Minke
(Limesurvey Head of Support)
Need Help? We offer professional Limesurvey support
Contact: marcel.minke(at)limesurvey.org'"
The administrator has disabled public write access.

Re: template.css 3 years 8 months ago #54844

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4207
  • Thank you received: 791
  • Karma: 360
By "HTML elements" I mean the basic structure of the page - banner, group description, questions, footer, navigation, etc. These elements are defined in the .pstpl files.

Some templates use tables to lay these out and some use divisions. Regardless, they all have different IDs and classes in different templates. This means that style sheets are template specific.

As Mazi says, if you could let us see a sample survey we would be able to help more. Otherwise there is no way for us to guess what the HTML source of your page is and how to apply styles to it.
Cheers,
Tony Partner

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

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.

Re: template.css 3 years 8 months ago #54848

  • chupanibre
  • chupanibre's Avatar
  • OFFLINE
  • Junior Lime
  • Posts: 29
  • Karma: 0
The administrator has disabled public write access.

Re: template.css 3 years 8 months ago #54859

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4207
  • Thank you received: 791
  • Karma: 360
Well, your template doesn't have classes assigned to too may elements but this should get you started. Add the following to the end of template.css::
div#layout {
	border: 1px solid #BBC6CC;
	margin: 10px auto;
}
 
#header {
	padding: 0 7px;
}
 
form#limesurvey {
	background-color: #D2E0F2;
	padding: 0 20px;
	margin-bottom: 7px;
}
 
.survey-survey-percent {
	left: 537px;
	position: absolute;
	text-align: center;
	top: 15px;
	width: 174px;
}
 
div.survey-question-text {
	background-color: #EEF6FF;
	padding: 0 10px;
}
 
div.survey-question-text p {
	margin-bottom: 0;
}
 
div.survey-question-text .asterisk {
	color: #CC0000;
}
 
.survey-question-answer {
	background-color: #FFFFFF;
	margin: 0;
	padding: 5px 20px;
}
 
table.question {
	width: 100%;
}
 
table.question td,
table.question th {
	border: 2px solid #FFFFFF;
}
 
.array2 {
	background-color: #EEEEEE;
}
Cheers,
Tony Partner

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

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
Last Edit: 3 years 8 months ago by tpartner.
The administrator has disabled public write access.

Aw: template.css 3 years 8 months ago #55475

  • chupanibre
  • chupanibre's Avatar
  • OFFLINE
  • Junior Lime
  • Posts: 29
  • Karma: 0
I added your code to the end of my template.css and tried to manipulate some of the classes and selectory, but without any success. It seems that there are some predefined values which override any modifcations I make. I tried everything I could think of, without any success.

I am working on the question-page, here is my question.pstpl:
<div {QUESTION_ESSENTIALS} class="{QUESTION_CLASS}{QUESTION_MAN_CLASS}{QUESTION_INPUT_ERROR_CLASS}">
<div class="survey-question-text"> {QUESTION}</div>
<div class="survey-question-answer">{ANSWER}</div>
<div class="survey-question-space"></div>
</div>

I want to modify the display of the "answer" keyword. I attached my current template.css. Thanks in advance for your help!


File Attachment:

File Name: template.txt
File Size: 7 KB
Last Edit: 3 years 8 months ago by chupanibre. Reason: attachment is missing
The administrator has disabled public write access.

Re: Aw: template.css 3 years 8 months ago #55478

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4207
  • Thank you received: 791
  • Karma: 360
I don't see any inline style in your template that would override the stylsheets. I think it's just a matter of selecting the correct element to style and placing the styles in the proper position in the cascade.

Try using Firebug for Firefox to explore the elements of your pages.

There are lots of helpful CSS tips tutorials available online - eg. www.w3schools.com/css/default.asp
Cheers,
Tony Partner

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

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.

Aw: Re: Aw: template.css 3 years 8 months ago #55650

  • chupanibre
  • chupanibre's Avatar
  • OFFLINE
  • Junior Lime
  • Posts: 29
  • Karma: 0
Thanks for the firebug-tip.
I was able to narrow down my problem; using firebug I was able to retrieve the css-class dealing with the format of my question:
.survey-question-answer {
display:block;
font-weight:400;
margin:0 64px 0 54px;
}

The thing is that I am unable to modify this entry. I changed this class in the template.css using the template editor from limesurvey, but it seems to stays the same. The format of the question does not change, as well as the entry in the .css file displayed in firebug...

That is the reason why I first asked about this; I changed some values in template.css which did not lead to any change in the final version of my questionnaire.
Last Edit: 3 years 8 months ago by chupanibre.
The administrator has disabled public write access.

Re: Aw: Re: Aw: template.css 3 years 8 months ago #55656

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4207
  • Thank you received: 791
  • Karma: 360
I don't understand why making changes in the template editor don't change the file.

Try adding the following to the end of template.css as a test:
.survey-question-answer {
    color: red;
}
Cheers,
Tony Partner

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

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.
The following user(s) said Thank You: chupanibre

Re: Aw: Re: Aw: template.css 3 years 8 months ago #55661

  • Mazi
  • Mazi's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 5325
  • Thank you received: 296
  • Karma: 249
chupanibre wrote:
That is the reason why I first asked about this; I changed some values in template.css which did not lead to any change in the final version of my questionnaire.
Usually CSS files are cached by the browser. You have to reload the complete survey page so that the updated CSS file is loaded by the browser. Pressing (CTRL) + F5 should do the trick.
Using firebug you can then also check if the changes were saved at the template editor.

Best regards/Beste Grüße,
Dr. Marcel Minke
(Limesurvey Head of Support)
Need Help? We offer professional Limesurvey support
Contact: marcel.minke(at)limesurvey.org'"
The administrator has disabled public write access.
The following user(s) said Thank You: chupanibre

Aw: Re: Aw: Re: Aw: template.css 3 years 8 months ago #55701

  • chupanibre
  • chupanibre's Avatar
  • OFFLINE
  • Junior Lime
  • Posts: 29
  • Karma: 0
@Mazi: Thanks again for your help, (CTRL) + F5 was the problem ;)
Last Edit: 3 years 8 months ago by chupanibre.
The administrator has disabled public write access.
  • Page:
  • 1
  • 2
Moderators: ITEd
Time to create page: 0.128 seconds
Donation Image