2016-07-28 12:52:54 -05:00
|
|
|
.summary_tpl {
|
|
|
|
@include outer-container;
|
|
|
|
padding: 2rem 0;
|
|
|
|
.prft-heading {
|
|
|
|
font-size:1.875rem;
|
|
|
|
}
|
|
|
|
.answer-sec {
|
|
|
|
// padding-top:2rem;
|
|
|
|
margin-bottom: 2rem;
|
|
|
|
transition: 0.3s ease;
|
|
|
|
// &.editable {
|
|
|
|
// background-color: #f2f2f2;
|
|
|
|
// }
|
|
|
|
.question-heading {
|
|
|
|
@include outer-container;
|
|
|
|
.question-title {
|
|
|
|
@include span-columns(12);
|
|
|
|
@include omega();
|
|
|
|
padding-top: .75rem;
|
|
|
|
h3 {
|
|
|
|
font-size: 1.25rem;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.answer-buttons {
|
|
|
|
@include span-columns(12);
|
|
|
|
@include omega();
|
|
|
|
white-space: nowrap;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.answer-container {
|
|
|
|
padding:2rem 0;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.editable {
|
|
|
|
background-color: #f2f2f2;
|
|
|
|
padding: 2rem;
|
|
|
|
margin: 0 -2rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
#summary-form {
|
|
|
|
margin-top: 3rem;
|
|
|
|
}
|
|
|
|
|
2016-07-29 09:15:58 -05:00
|
|
|
@keyframes success-fadeout {
|
|
|
|
0% { opacity: 1; max-height: 40px; }
|
|
|
|
85% { opacity: 0; max-height: 40px; padding: .5rem 0; margin-bottom: .5rem; }
|
|
|
|
100% { opacity: 0; max-height: 0; padding: 0; margin-bottom: 0; }
|
|
|
|
}
|
|
|
|
|
2016-07-28 12:52:54 -05:00
|
|
|
.success {
|
2016-07-29 09:15:58 -05:00
|
|
|
box-sizing: border-box;
|
2016-07-28 12:52:54 -05:00
|
|
|
text-align: center;
|
|
|
|
background-color: $accent-color-3;
|
|
|
|
color: #fff;
|
|
|
|
padding-top: .5rem;
|
|
|
|
padding-bottom: .5rem;
|
|
|
|
margin-bottom: .5rem;
|
2016-07-29 09:15:58 -05:00
|
|
|
animation-name: success-fadeout;
|
|
|
|
animation-duration: 1.5s;
|
|
|
|
animation-delay: 2s;
|
|
|
|
animation-fill-mode: forwards;
|
|
|
|
}
|
|
|
|
|
|
|
|
.text-answer.answer-container {
|
|
|
|
white-space: pre-line;
|
2016-07-28 12:52:54 -05:00
|
|
|
}
|
|
|
|
|
|
|
|
@media only screen and (min-width: $tablet) {
|
|
|
|
.summary_tpl {
|
|
|
|
.answer-sec {
|
|
|
|
.question-heading {
|
|
|
|
.question-title {
|
|
|
|
@include span-columns(8);
|
|
|
|
}
|
|
|
|
.answer-buttons {
|
|
|
|
@include span-columns(4);
|
|
|
|
@include omega();
|
|
|
|
text-align: right;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@media only screen and (min-width: $desktop) {
|
|
|
|
.summary_tpl {
|
|
|
|
.answer-sec {
|
|
|
|
.question-heading {
|
|
|
|
.question-title {
|
|
|
|
@include span-columns(9);
|
|
|
|
}
|
|
|
|
.answer-buttons {
|
|
|
|
@include span-columns(3);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|