Guide for Luminate survey's css

Gwendolyn Chambers
Gwendolyn Chambers
Tenth Anniversary Kudos 1 Name Dropper Participant
in Blackbaud Luminate Online® & Blackbaud TeamRaiser® Discussions

Are there any resources that exist that break down the elements in a survey so that we can rebuild our style sheets? I'm running into issues where a ‘label’ style only works for certain labels and not others. A test survey is here > You can see that numbers 4, 5, 6, 7, 12, and 14 do not the same as the rest of the labels.

Tagged:

Comments

  • Brian Mucha
    Brian Mucha
    Tenth Anniversary Kudos 2 Participant Facilitator 1

    You must have made some changes, they all look pretty similar to me now.

    I do notice that your labels break after the number in long labels like on row 4. That is due to this…

    label { display: inline-block; }

    …on line 36 of your forms style sheet. Try making that inline instead.

  • Gwendolyn Chambers
    Gwendolyn Chambers
    Tenth Anniversary Kudos 1 Name Dropper Participant

    Do you mean adding it to a pagebuilder page? I tried that, but it's still breaking. That would be nice to fix if you have any other suggestions.

    For my other issues, I had made some changes that were not fixes really but workarounds. I realized that after #4 there is a caption that reads as a question and numbers 5, 6, and 7 intended to be answers to this question (an unfortunate limitation within surveys). For the final survey I took out the numbers and unbolded. That made it passable.

  • Brian Mucha
    Brian Mucha
    Tenth Anniversary Kudos 2 Participant Facilitator 1
    What is it you are trying to change? I see some inconsistent margin issues between some questions. You could fix that with this line.

    .mobile div.responsive div.form-content {

    margin-bottom: 20px;

    margin-right: 0;

    margin-top: 0;

    }


    That .mobile selector isn't doing anything, and I'd remove it if it were me.


    Do you use the Inspector in Dev Tools (F12)?
  • Gwendolyn Chambers
    Gwendolyn Chambers
    Tenth Anniversary Kudos 1 Name Dropper Participant

    Yes, I'm using the inspector in Chrome. I've tried your suggestion with and without the .mobile but have not been able to get that to work. .mobile appears in the inspector though it does not currently exist in the pagebuilder page nor the style sheet that I created for surveys. I'm having a hard time tracking these pieces down. It's very confusing. Hence my original plea for a toolkit or guide specific to survey wrappers. I hacked this one together using wrapper files from another toolkit for mobile donations.

Categories