diff --git a/src/styles/base/form.scss b/src/styles/base/form.scss index 7d555fc..0f1c7a3 100644 --- a/src/styles/base/form.scss +++ b/src/styles/base/form.scss @@ -224,31 +224,54 @@ sib-form-date { } sib-form-file { + margin-top: 1.8rem; + + div { + display: flex; + flex-direction: row-reverse; + align-items: center; + justify-content: flex-end; + + input[type='text'] { + margin-bottom: 0.8rem; + } - label { + input[type='file'] { + height: 0.1px; + opacity: 0; + overflow: hidden; + position: absolute; + width: 0.1px; + z-index: -1; + } + + label { + @extend .button, + .text-bold, + .text-uppercase, + .button-primary, + .bordered; + margin: auto 2.2rem; + } + + 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%; - - div { - width: 100%; - } - - input[type='text'] { - box-sizing: border-box; - flex: 0 0 50%; - } - - input[type='file'] { - box-sizing: border-box; - flex: 0 0 20%; - color: var(--color-input-text); - cursor: pointer; - padding-left: 3rem; - } + }*/ } } diff --git a/src/views/admin/page-admin-projects-create.pug b/src/views/admin/page-admin-projects-create.pug index 6d829a3..6c01fba 100644 --- a/src/views/admin/page-admin-projects-create.pug +++ b/src/views/admin/page-admin-projects-create.pug @@ -38,9 +38,10 @@ div.content-box__info.flex class-captain='form-label is-light is-half-width' widget-captain='sib-form-auto-completion' + class='input-text-like' widget-logo="sib-form-file" label-logo="Télécharger un logo" - class-logo='form-label is-light select-add' + class-logo='select-add' upload-url-logo=`${endpoints.uploads || endpoints.post.uploads}` next='admin-project-list'