Cascading Style Sheets (CSS) on Project Level

CSS – Cascading style sheets are now implemented into questfox.
The rules are cascading too.

It is wise to define the style on the project level an NOT manually changing entries on a page.

A general non-specific questfox style sheet is applied if you do not change anything at all.
You can then define your client areas style sheet which will affect the formatting of all projects of your client area.
Inside each project you can define specific formatting styles just for this project.

CSS on project level
CSS on Page Level

Cascading means, that the design is rolling down into your project from above. If you define something specific on one page this is breaking the CSS rules.

On every level you can code the CSS right away into questfox

answerCtrl.answer.title
body {
font-size: 1.2em;
font-weight: bold;
font-family: ‘Open Sans’, sans-serif;
}

.answerItemLabel {
color: black;
font-weight: bold;
font-size: 1.2em;
}

.matrixbutton{ padding:10px!important; }

body {
background-repeat: space;
background-size: cover;
font-weight: bold;
}

.qa_question_text_left{
font-size: 0.9em;
color:#293038;
font-weight: bold;
}
.qa_question_text_right{
font-size: 0.9em;
color:#293038;
font-weight: bold;
}

.answerTitle {
margin-top: 1.6em;
font-size: 1.2em;
font-weight: bold;
}

.btnNext button {
font-size: 1.5em;
letter-spacing: 1px;
text-align: center;
text-decoration: none;
text-transform: uppercase;
}

.questionText > span > p{
font-size: 1.4em;
font-weight: 600;
}

.questionText > span > p{
font-size: 1.4em;
font-weight: 600;
}

/* Setting Color of MARKED item */
.singlechoice.active::after, .matrixbutton.active::after, .pic.active::after {
border-right-color: #380E31;
border-top-color: #380E31;
}

body {
background-color: #ffffff;
}

.textarea{
font-size:1.3em
background-color: #dddddd;
}

Finally it is still possible to define single elements by using an HTML code directly in the specific element.

Wishing you more stylish projects with questfox in the near future.



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s