Inline Form Style like Sughan
Fri Sep 22 2023 06:34:56 GMT+0000 (Coordinated Universal Time)
.pv-inline-form{ .gform_body{ padding-top: 80px; @media(max-width: 860px){ padding-top: 25px; } .gform_fields{ .gfield{ .ginput_container{ flex-grow: 1; select { appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url('/wp-content/uploads/2023/06/arrow-down.svg'); background-repeat: no-repeat; background-size: 16px; background-position: right center; padding-right: 30px; /* padding-left: 0; */ } @media(min-width: 861px){ select{ text-align: center !important; text-align: -webkit-center !important; text-align-last: center; -webkit-text-alig-last: center; -moz-text-align-last: center; direction: ltr; background-position: 70% center; } input{ text-align: center !important; } } } @media(min-width: 861px){ label, .gfield_description{ flex: 0 0 auto; } .gfield_description{ font-size: 20px; } &.scta-top{ display: inline-flex; //width: 33.333% !important; justify-content: flex-start; align-items: center; vertical-align: middle; gap: 10px; &.scta-name{ width: 38%; } &.scta-company{ width: 31%; } &.scta-job{ width: 31%; } } &.scta-center{ display: inline-flex; justify-content: flex-start; align-items: center; vertical-align: middle; gap: 10px; padding-top: 25px; } &.scta-center.scta-subject{ width: 33.3333%; } &.scta-center.scta-message{ width: 66.6666%; } &.scta-bottom{ display: inline-flex; width: 100%; justify-content: flex-start; align-items: center; gap: 10px; vertical-align: middle; padding-top: 25px; } &.scta-top:not(:first-child), &.scta-message{ padding-left: 10px; } } @media(max-width: 860px){ display: block !important; width: 100% !important; label{ margin-bottom: 0 !important; } .gfield_description{ padding-top: 15px; font-size: 16px; } .ginput_container{ input, select{ padding: 15px 0 !important; } } &:not(:first-child){ margin-top: 20px; } } &.gfield_error{ .ginput_container{ input, select{ border-color: red !important; border: unset !important; border-bottom: 1px solid red !important; } } .gfield_validation_message{ display: none !important; } } } } } .gform_footer{ padding-top: 45px; span.fas.fa-arrow-right{ &::before{ @include arrow-white; margin-left: 10px; } } @media(max-width: 860px){ padding-top: 0 !important; } } }
Comments