Inline Forms

This commit is contained in:
2020-08-25 16:26:18 +02:00
parent 9c8986c564
commit 4004342255
5 changed files with 77 additions and 48 deletions

View File

@@ -38,7 +38,7 @@
flex-direction: column; }
.RV-FlexRow__Item {
min-width: 0;
min-width: min-content;
width: 100%; }
.RV-FlexRow__Item__Container {
display: grid; }
@@ -600,7 +600,8 @@ body {
border: none;
border-bottom: 1px solid #565656;
padding: 8px 0;
margin-bottom: 30px; }
margin-bottom: 30px;
width: 100%; }
.LP-Input .LP-Input__Field:focus, .LP-Input .LP-Input__Field:active, .LP-Input .LP-Input__Field:invalid {
margin-bottom: 29px;
border-bottom: 2px solid #76323F;
@@ -1094,6 +1095,31 @@ body {
.LP-Footer .LP-LinkList__List .LP-LinkList__Item .LP-Link:hover {
background-color: inherit; }
.LP-Form--inline .LP-Form__Legend, .LP-Form--inline .LP-Input__Label {
display: none; }
.LP-Form--inline .LP-Form__Button {
flex-grow: 0;
flex-shrink: 0;
width: min-content;
flex-basis: max-content; }
@media (max-width: 450px) {
.LP-Form:not(.LP-Form--inline) .LP-Form__Composition {
flex-wrap: wrap; } }
.LP-Form:not(.LP-Form--inline) .LP-Form__Button {
flex-grow: 0;
flex-shrink: 0;
width: min-content;
flex-basis: 130px; }
@media (max-width: 450px) {
.LP-Form:not(.LP-Form--inline) .LP-Form__Button {
flex-grow: 0;
flex-shrink: 0;
width: min-content;
flex-basis: 100%; } }
.LP-Form .LP-Form__Fieldset {
margin: 0;
padding: 0;
@@ -1129,9 +1155,6 @@ body {
@media (max-width: 650px) {
.LP-Form .LP-Form__Composition--breakable {
flex-wrap: wrap; } }
@media (max-width: 450px) {
.LP-Form .LP-Form__Composition {
flex-wrap: wrap; } }
.LP-Form .LP-Form__Composition--buttons {
justify-content: flex-end;
padding: 10px; }
@@ -1139,7 +1162,7 @@ body {
gap: 10px; }
.LP-Form .LP-Form__Field {
min-width: 0;
min-width: min-content;
width: 100%; }
.LP-Form .LP-Form__Field__Container {
display: grid; }
@@ -1187,18 +1210,6 @@ body {
width: min-content;
flex-basis: 100px; }
.LP-Form .LP-Form__Button {
flex-grow: 0;
flex-shrink: 0;
width: min-content;
flex-basis: 130px; }
@media (max-width: 450px) {
.LP-Form .LP-Form__Button {
flex-grow: 0;
flex-shrink: 0;
width: min-content;
flex-basis: 100%; } }
.LP-Form .LP-Form__InfoText .LP-Paragraph {
font-family: Montserrat, Helvetica, sans-serif;
color: #565656; }