Add more styling

This commit is contained in:
Ramon Wenger 2019-07-22 16:27:59 +02:00
parent d8f4077d63
commit c537fd37aa
2 changed files with 34 additions and 12 deletions

View File

@ -1,5 +1,6 @@
.survey { .survey {
&__panel-title { &__panel-title,
&__page-title {
@include main-title; @include main-title;
margin-bottom: $large-spacing*2; margin-bottom: $large-spacing*2;
span { span {
@ -7,7 +8,8 @@
} }
} }
&__panel-description { &__panel-description,
&__page-description {
@include regular-paragraph; @include regular-paragraph;
line-height: 1.5; line-height: 1.5;
margin-bottom: $large-spacing; margin-bottom: $large-spacing;
@ -80,4 +82,24 @@
} }
} }
&__error {
margin-bottom: $large-spacing;
}
&__error-item {
span {
color: $color-error;
@include small-text;
}
}
}
.question {
$question: &;
&--error #{$question}__input {
border-color: $color-error;
box-shadow: none;
}
} }

View File

@ -16,8 +16,8 @@ export const css = {
'progressBar': 'survey__progress-bar', 'progressBar': 'survey__progress-bar',
'page': { 'page': {
'root': 'survey__page', 'root': 'survey__page',
'title': '', 'title': 'survey__page-title',
'survey__page-description': '' 'description': 'survey__page-description'
}, },
'pageTitle': 'survey__page-title', 'pageTitle': 'survey__page-title',
'pageDescription': 'survey__page-description', 'pageDescription': 'survey__page-description',
@ -29,10 +29,10 @@ export const css = {
'title': 'survey__question-title', 'title': 'survey__question-title',
'number': 'sv_q_num', 'number': 'sv_q_num',
'survey__question-description': 'small', 'survey__question-description': 'small',
'comment': 'survey__question-input skillbox-input', 'comment': 'survey__question-input skillbox-input question__input',
'required': '', 'required': '',
'titleRequired': '', 'titleRequired': '',
'hasError': 'has-error', 'hasError': 'survey__question--error question--error',
'indent': 20 'indent': 20
}, },
'panel': { 'panel': {
@ -43,9 +43,9 @@ export const css = {
'error': { 'error': {
'root': 'alert alert-danger', 'root': 'alert alert-danger',
'icon': 'glyphicon glyphicon-exclamation-sign', 'icon': 'glyphicon glyphicon-exclamation-sign',
'item': '', 'item': 'survey__error-item',
'locationTop': 'sv_qstn_error_top', 'locationTop': 'survey__error survey__error--top',
'locationBottom': 'sv_qstn_error_bottom' 'locationBottom': 'survey__error survey__error--bottom'
}, },
'boolean': { 'boolean': {
'root': 'sv_qbln form-inline checkbox', 'root': 'sv_qbln form-inline checkbox',
@ -63,10 +63,10 @@ export const css = {
'other': 'sv_q_checkbox_other skillbox-input', 'other': 'sv_q_checkbox_other skillbox-input',
'column': 'sv_q_select_column' 'column': 'sv_q_select_column'
}, },
'comment': 'survey__input skillbox-input', 'comment': 'survey__input skillbox-input question__input',
'dropdown': { 'dropdown': {
'root': '', 'root': '',
'control': 'skillbox-input', 'control': 'survey__input skillbox-input',
'other': 'sv_q_dd_other skillbox-input' 'other': 'sv_q_dd_other skillbox-input'
}, },
'html': { 'html': {
@ -131,7 +131,7 @@ export const css = {
'itemText': '', 'itemText': '',
'maxText': '' 'maxText': ''
}, },
'text': 'survey__input skillbox-input', 'text': 'survey__input skillbox-input question__input',
'expression': 'survey__input skillbox-input', 'expression': 'survey__input skillbox-input',
'file': { 'file': {
'root': 'sv_q_file', 'root': 'sv_q_file',