Background image, Squeletonquest

More
3 years 4 months ago - 3 years 4 months ago #121954 by WOM
WOM created the topic: Background image, Squeletonquest
Bonjour,

J'essaie en vain d'afficher une image en fond avec limesurvey v2.05+ et le theme squeletton quest. Ca fait un moment que je cherche mais je suis une quiche en CSS/html...

Mon image s'appelle IFD.jpg

Voici mon template.css :
/**
* This file is part of LimeSurvey template SkeletonQuest
* Make your your change here
**/
body {
    background-image: url({TEMPLATEURL}IFD.jpg)!important;
    background-repeat:no-repeat;
	background-position:center center;
}
 
h1, h2, h3, h4, h5, h6 {color: #1e4057;}
a, a:visited { color: #2a5a7a;}
a:hover, a:focus { color: #1e4057; }
#head{
  border-top:2px solid #FFD700;
  border-bottom:3px solid #FFF200;
  color:#fff;
  background:#231F20;
}
#head h1{
  color:#fff;
}
.subtitle{
  background:transparent;color:inherit;
}
#footer{
  border-top:2px solid #1e4057;
  color:#fff;
  background:#231F20;
}
#footer a, #footer a:visited {color:#fff;}
#footer a:hover, #footer a:focus, #footer a:active {color: #ffffff;}
 
#movenextbtn,#movesubmitbtn{
  background-color:#2a5a7a;color:#fff;text-shadow: 0 1px rgba(0, 0, 0, 0.75);
}
#movenextbtn:hover,#movesubmitbtn:hover,#movenextbtn:focus,#movesubmitbtn:focus{
  background-color:#6789a0;
}
#movenextbtn:active,#movesubmitbtn:active{
  background-color:#6789a0;
 
}
#movenextbtn .ui-icon,#movesubmitbtn .ui-icon{
    background-image: url("images/ui-icons_ededed_256x240.png");
}
 
li.radio-item label,li.checkbox-item label
  {background-color: #FFF;}
li.radio-item.other-item,li.checkbox-item.other-item,li.checkbox-text-item.other-item .option
  {background-color: #FFF;}
li.radio-item.other-item label,li.checkbox-item.other-item label
  {background-color: transparent;}
/* checked */
li.radio-item input.radio:checked + label,li.checkbox-item input.checkbox:checked + label
  {background:#6789a0;color:#FFF;}
li.other-item input.radio:checked + label,li.other-item input.checkbox:checked + label
  {background:transparent;color:inherit;}
li.other-item.checked
  {background:#6789a0;color:#FFF;}
/* hover */
  li.radio-item label:hover,li.checkbox-item  input.checkbox + label:hover
  {background:#2a5a7a;color:#fff}
.js li.other-item:hover
  {background:#2a5a7a;color:#fff}
.js li.other-item:hover label
  {color:#fff}
/* no answer */
li.noanswer-item input.radio:checked + label
  {background:transparent;color:inherit;}
 
li.radio-item input.radio[disabled] + label,li.checkbox-item input.checkbox[disabled] + label
{
  background:transparent;
   cursor:inherit;color:#666;
}
 
.js table.question tbody tr td.radio-item:hover {background: #2a5a7a;}
.js td.radio-item.checked{background-color:#6789a0;}
.js td.noanswer-item.checked{background-color:transparent;}
 
.js table.question tbody tr td.checkbox-item:hover {background: #2a5a7a;}
.js td.checkbox-item.checked{background-color:#6789a0;}
 
li.checkbox-item input[type=checkbox] + label:before,
li.checkbox-text-item input[type=checkbox] + label:before,
td.checkbox-item input[type=checkbox] + label
 {
	background-color: #CCC;
}
li.radio-item input[type=radio] + label:before,
td.radio-item input[type=radio] + label
{
	border-color: #CCC;
	background-color: #CCC;
}
li.checkbox-item input[type=checkbox]:checked + label:before,
li.checkbox-text-item input[type=checkbox]:checked + label:before,
td.checkbox-item input[type=checkbox]:checked + label
{
    background-color: #CCC;
    border-color: #CCC;
}
li.radio-item input[type=radio]:checked + label:before,
td.radio-item input[type=radio]:checked + label
{
	border-color: #CCC;
	background-color:#000;
}
li.checkbox-item input[type=checkbox]:hover + label:before,
li.checkbox-item input[type=checkbox] + label:hover:before,
li.checkbox-text-item input[type=checkbox]:hover + label:before,
li.checkbox-text-item input[type=checkbox] + label:hover:before,
.js td.checkbox-item:hover input[type=checkbox] + label,
{
    background-color: #CCC;
    border-color: #CCC;
}
.ui-slider-range{
background:#6789a0;
}
.slider_callout{
}
.question-wrapper {
  border:none;
  border-top:2px solid #2a5a7a;
  -webkit-border-radius: 0;border-radius: 0;
}
.question-text{
  border-bottom:none;
}
@media print {
    body{background-color:#fff;background-image:none;font: 12pt "Luxi sans", "Lucida Grande", Lucida, "Lucida Sans Unicode", sans-serif;color: #000;}
    #head{background:#fff;}
    .pagesubtitle{background:#ffffff}
    #footer {display:none}
    a:link,a:visited { color: #520; }
    #head h1 {color: #000;}
}

Merci de votre aide.
Last Edit: 3 years 4 months ago by DenisChenu.

Please Log in or Create an account to join the conversation.

More
3 years 4 months ago #121956 by DenisChenu
DenisChenu replied the topic: Background image, Squeletonquest
Si tu a envoyé l'image dans le modèle:
body {
    background-image: url(IFD.jpg) ;
    background-repeat:no-repeat;
	background-position:center center;
}

Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand (or search sondages pro).
An error happen ? Before make a new topic : remind the Debug mode .

Please Log in or Create an account to join the conversation.

More
3 years 4 months ago #121958 by WOM
WOM replied the topic: Background image, Squeletonquest
Yes merci beaucoup!



J'ai trouvé mon bonheur avec ça :

body {
background-image: url(IFD.jpg) ;
background-repeat:no-repeat;
background-attachment: fixed;
background-size: cover;
}

Mon image de fond fait 1.3mo, c'est trop?

Merci beaucoup.
Attachments:

Please Log in or Create an account to join the conversation.

Moderators: Nickko

Start now!

Just create your account and start using Limesurvey today.

Register now
Join our Newsletter!