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

update(job-offer-create): css improved

Browse Source
This commit is contained in:
Gaëlle Morin 2019-06-07 11:01:34 +02:00
parent fddc9151e6
commit 926352b191
2 changed files with 36 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/page-job-offer-create.pug
View File

@ -19,13 +19,12 @@
class-title='field form-label is-light is-expanded' class-title='field form-label is-light is-expanded'
label-title='Title*' label-title='Title*'
class-title-text='small-margin'
widget-title-text='title-text' widget-title-text='title-text'
class-description='field form-label is-light is-expanded' class-description='field form-label is-light is-expanded'
label-description='Description*' label-description='Description*'
widget-description='sib-form-textarea'
class-description-text='large-margin'
widget-description-text='description-text' widget-description-text='description-text'
class-skills='form-label is-dark' class-skills='form-label is-dark'
@ -37,6 +36,6 @@
label-closingDate='Publication end date:*' label-closingDate='Publication end date:*'
widget-closingDate='sib-form-date' widget-closingDate='sib-form-date'
next="job-offers" next='job-offers'
) )

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

@ -41,26 +41,31 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
input { input,
textarea {
-webkit-tap-highlight-color: $color-244-73-62; -webkit-tap-highlight-color: $color-244-73-62;
background-color: $color-222-57-95; background-color: $color-222-57-95;
border: none; box-sizing: border-box;
border: 2px solid $color-222-57-95;
color: $color-233-18-29; color: $color-233-18-29;
/*flex: 1 1 0; Problem on Firefox for input type date*/ /*flex: 1 1 0; Problem on Firefox for input type date*/
margin-top: 0.8rem; margin-top: 0.8rem;
min-width: 0; min-width: 0;
padding: 1.2rem; padding: 1rem;
}
input:not([type="search"]),
textarea {
border: 2px solid $color-222-57-95;
&:focus, &:focus,
&:active { &:active {
border-color: transparent;
border-bottom: 2px solid $color-244-73-62; border-bottom: 2px solid $color-244-73-62;
} }
} }
} }
input[type='submit'] { input[type="submit"] {
margin-top: 6rem;
background-color: $color-233-18-29; background-color: $color-233-18-29;
border: none; border: none;
border-radius: 100em; border-radius: 100em;
@ -68,6 +73,7 @@
float: right; float: right;
font-size: 1.4rem; font-size: 1.4rem;
font-weight: bold; font-weight: bold;
margin-top: 6rem;
padding: 0.85rem 2.55rem; padding: 0.85rem 2.55rem;
text-transform: uppercase; text-transform: uppercase;
} }
@ -92,17 +98,18 @@
/* WIDGETS */ /* WIDGETS */
sib-form-date { sib-form-date {
input[type="date"] {
input[type='date'] {
color: $color-213-4-50;
font-size: 1.4rem;
margin-top: 1.6rem;
max-width: 48.75vw;
background-image: url("/images/calendar.svg"); background-image: url("/images/calendar.svg");
background-position: right 12px top 50%; background-position: right 12px top 50%;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 14px; background-size: 1.4rem;
color: $color-213-4-50;
cursor: default; cursor: default;
font-size: 1.4rem;
margin-top: 1.6rem;
max-width: 50vw;
padding-right: 3rem; /* Needed to replace the close icon in FF when you are selecting a date */
padding-top: 1.2rem; /* Needed to center the close icon in FF when you are selecting a date */
position: relative; position: relative;
&::-webkit-calendar-picker-indicator { &::-webkit-calendar-picker-indicator {
@ -114,17 +121,17 @@
&::-webkit-clear-button { &::-webkit-clear-button {
cursor: pointer; cursor: pointer;
margin-right: 3px; margin-bottom: 5px; /* Needed to compensate padding-top: 1.2rem; for the close icon in FF */
margin-right: 5px;
} }
&::-webkit-inner-spin-button { &::-webkit-inner-spin-button {
display: none display: none;
} }
} }
} }
sib-multiple-select { sib-multiple-select {
sib-form-auto-completion > label { sib-form-auto-completion > label {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -146,7 +153,7 @@
.ss-add { .ss-add {
font-size: 1.8rem; font-size: 1.8rem;
margin: 0 12px 0 0; margin: 0 18px 0 0;
span.ss-plus { span.ss-plus {
background: $color-244-73-62; background: $color-244-73-62;