UNPKG

vue-flow-form-rate-v1

Version:

Create conversational conditional-logic forms with Vue.js.

5 lines 4.53 kB
/*! Copyright (c) 2020 - present, DITDOT Ltd. - MIT Licence https://github.com/ditdot-dev/vue-flow-form https://www.ditdot.hr/en */:root{--vff-bg-color:#fff;--vff-main-text-color:#181818;--vff-secondary-text-color:#999;--vff-tertiary-text-color:#f1f1f1;--vff-main-accent-color:#0dbc79;--vff-secondary-accent-color:#bbebd5}.vff,.vff-footer,.vff-header,.vff input,.vff kbd,.vff select,.vff select option,.vff textarea{font-family:Poppins,sans-serif}body{margin:0;background-color:var(--vff-bg-color)}.vff,.vff.vff-not-standalone{color:var(--vff-main-text-color)}.vff.vff-not-standalone{background-color:var(--vff-bg-color)}header.vff-header{background-color:var(--vff-secondary-accent-color)}header.vff-header svg.f-logo{fill:rgba(0,0,0,.9)}.vff input[type=date],.vff input[type=email],.vff input[type=number],.vff input[type=password],.vff input[type=tel],.vff input[type=text],.vff input[type=url],.vff span.faux-form,.vff textarea{border-bottom-color:var(--vff-secondary-text-color)}.vff a,.vff a:active,.vff input,.vff select option,.vff textarea{color:var(--vff-main-text-color)}.vff ::-webkit-input-placeholder{color:var(--vff-secondary-text-color);opacity:1;font-weight:300}.vff ::-moz-placeholder{color:var(--vff-secondary-text-color);opacity:1;font-weight:300}.vff :-ms-input-placeholder{color:var(--vff-secondary-text-color)!important;opacity:1!important;font-weight:300!important}.vff :-moz-placeholder{color:#999;opacity:1;font-weight:300}.vff.vff-is-ios .field-date:not(.f-has-value) .f-answer>span:before{color:var(--vff-secondary-text-color);font-weight:300;font-size:.72em}.vff ul.f-radios li{border:1px solid var(--vff-secondary-text-color)}.vff ul.f-radios li.f-selected,.vff ul.f-radios li:active{border-color:var(--vff-main-text-color);background-color:var(--vff-tertiary-text-color)}.vff ul.f-radios li.f-other.f-selected input{color:inherit}.vff .f-key,.vff span.f-empty{color:var(--vff-secondary-text-color)}.vff span.f-answered{color:var(--vff-main-text-color)}.vff .f-arrow-down svg{fill:var(--vff-main-text-color)}.vff .o-btn-action{color:var(--vff-bg-color);background-color:var(--vff-main-text-color)}.vff .o-btn-action:focus,.vff .o-btn-action:hover{background-color:var(--vff-main-text-color);opacity:.9}.vff-footer .footer-inner-wrap{background-color:hsla(0,0%,100%,.75)}@media screen and (max-width:479px){.vff-footer .footer-inner-wrap{background-color:hsla(0,0%,94.1%,.75)}}.vff-footer .f-next svg,.vff-footer .f-prev svg{fill:var(--vff-main-text-color)}.vff-footer .f-progress{color:var(--vff-secondary-text-color)}.vff-footer .f-progress-bar{background-color:var(--vff-secondary-text-color);-webkit-filter:brightness(1.2);filter:brightness(1.2)}.vff-footer .f-progress-bar-inner{background-color:var(--vff-main-text-color)}.vff-footer .f-next:focus,.vff-footer .f-next:hover,.vff-footer .f-prev:focus,.vff-footer .f-prev:hover{background-color:rgba(0,0,0,.07)}.vff .f-invalid,.vff .text-alert{color:#f5554a}.vff .text-success{color:#4caf50}.vff .text-muted,.vff p.f-description,.vff span.f-sub,.vff span.f-tagline{color:var(--vff-secondary-text-color)}@media (prefers-color-scheme:dark){:root{--vff-bg-color:#313640;--vff-main-text-color:#fff;--vff-secondary-text-color:#aeb6bf;--vff-tertiary-text-color:#41464f;--vff-main-accent-color:#41b883;--vff-secondary-accent-color:#a0dbc1}header.vff-header{background-color:#313640}header.vff-header svg.f-logo{fill:var(--vff-main-accent-color)}.vff input,.vff select option,.vff textarea{color:var(--vff-main-accent-color)}.vff input[type=date]::-webkit-calendar-picker-indicator{-webkit-filter:invert(100%);filter:invert(100%)}.vff span.f-answered{color:var(--vff-main-accent-color)}.vff .f-arrow-down svg{fill:var(--vff-main-accent-color)}.vff .text-success{color:var(--vff-main-accent-color)}.vff-footer .footer-inner-wrap{background-color:rgba(49,54,64,.75)}.vff-footer .f-next svg,.vff-footer .f-prev svg{fill:var(--vff-main-accent-color)}.vff-footer .f-next.f-disabled svg,.vff-footer .f-prev.f-disabled svg{fill:var(--vff-main-text-color)}.vff-footer .f-next:hover,.vff-footer .f-prev:hover{background-color:rgba(0,0,0,.2)}.vff-footer .f-progress-bar{background-color:var(--vff-secondary-text-color);-webkit-filter:brightness(1);filter:brightness(1)}.vff-footer .f-progress-bar-inner{background-color:var(--vff-main-accent-color)}.vff ul.f-radios li.f-selected{color:var(--vff-main-accent-color)}.vff ul.f-radios li{font-weight:900;color:var(--vff-secondary-text-color)}.vff .f-key{font-weight:400;color:var(--vff-main-accent-color)}}