autonomic-cooperative
/
hubl
0
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

update: style for sib-form-file on mobile

This commit is contained in:
gaelle morin 2020-06-16 13:02:42 +02:00
parent 4f7635e8d2
commit cf93abcd5c
No known key found for this signature in database
GPG Key ID: 028426702B95CF9C
1 changed files with 23 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
src/styles/base/form.scss
View File

@ -224,18 +224,18 @@ sib-form-date {
}
sib-form-file {
margin-top: 1.8rem;
div {
display: flex;
flex-direction: row-reverse;
flex-direction: column-reverse;
align-items: center;
justify-content: flex-end;
input[type='text'] {
margin-bottom: 0.8rem;
margin-top: 1.8rem;
@include breakpoint(lg) {
flex-direction: row-reverse;
justify-content: flex-end;
}
input[type='file'] {
height: 0.1px;
opacity: 0;
@ -244,6 +244,15 @@ sib-form-file {
width: 0.1px;
z-index: -1;
}
input[type='text'] {
margin-bottom: 0.8rem;
width: 100%;
@include breakpoint(lg) {
width: auto;
}
}
label {
@extend .button,
@ -251,27 +260,14 @@ sib-form-file {
.text-uppercase,
.button-primary,
.bordered;
margin: auto 2.2rem;
text-align: center;
width: 100%;
@include breakpoint(lg) {
margin: auto 2.2rem;
width: auto;
}
}
input[type='file']:focus,
label:hover ~ input[type='file'] {
background-color: var(--color-secondary);
}
label ~ input[type='file']:focus {
outline: 1px dotted #000;
outline: -webkit-focus-ring-color auto 5px;
}
/*label {
align-items: baseline;
clear: both;
display: flex;
flex-direction: row;
flex-wrap: wrap;
max-width: 100%;
}*/
}
}