Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  • Modal: .is-modal

  • Slide-in: .mopinion-slide

  • Embedded: .is-embed

Modal

Code Block
languagecss
.mopinion-survey-content .mopinion-survey-output.is-modal {
    /* Applies only to surveys displayed as modal */
}

Slide-in

Code Block
languagecss
.mopinion-survey-content .mopinion-survey-output.mopinion-slide {
    /* Applies only to surveys displayed as slide-in */
}

Embedded

Code Block
languagecss
.mopinion-survey-content .mopinion-survey-output.is-embed {
    /* Applies only to surveys displayed as embedded */
}

...

Info

Make sure that the font declaration matches the font declaration as used on your site, e.g. replace MyWebFont with the actual font, we recommend using the same font fallbacks as well.

Code Block
languagecss
/* Form title */
.mopinion-survey-content .srv-title{
    font-family: MyWebFont, Calibri, sans-serif;
}

/* question blocks */
.mopinion-survey-content .control-group{
    font-family: MyWebFont, Calibri, sans-serif;
}

/*question block titles */
.mopinion-survey-content .control-group .block-title{
    font-family: MyWebFont, Calibri, sans-serif;
}

/* custom front / last page */
.mopinion-survey-content .custom-section{
    font-family: MyWebFont, Calibri, sans-serif;
}

/* buttons */
.mopinion-survey-content .btn.btn-previous,
.mopinion-survey-content .btn.btn-next,
.mopinion-survey-content .btn.btn-submit {
    font-family: MyWebFont, Calibri, sans-serif;
}

/* standard thanks page */
.mopinion-survey-content .last-page{
    font-family: MyWebFont, Calibri, sans-serif;
}

/* Passive Feedback  button */
.mopinion-survey-content .btn-open-survey.btn.btn-primary.tab.allow-button {
   font-family: MyWebFont, Calibri, sans-serif;
}

...

Modal close cross

Code Block
languagecss
/* Change position close cross for Modal surveys */
.mopinion-survey-content #surveyBody .close-modal {
    top: 10px;
    right: 10px;
}

Modify z-index

Code Block
languagecss
/* Change z-index of the feedback button */
.mopinion-survey-content .btn-open-survey.tab{
    z-index: 9500!important;
}

Reduce gap from header to first question

Code Block
languagecss
.mopinion-survey-content #surveyHead{
    margin-bottom:0;
}

Reduce gap between questions

Code Block
languagecss
.mopinion-survey-content .control-group{
    padding-bottom:0;
}

...