stylesheets: move the dossier floating bar CSS to dossier_edit.scss

forms.scss is supposed to be for generic elements.
This commit is contained in:
Pierre de La Morinerie 2019-09-12 14:16:15 +02:00 committed by Paul Chavard
parent 09a0f21cac
commit 974c1b1150
3 changed files with 58 additions and 58 deletions

View file

@ -45,4 +45,61 @@
padding: 20px;
border-radius: 4px;
}
.send-dossier-actions-bar {
display: flex;
width: 100%;
margin-top: $default-padding;
background: #FFFFFF;
position: fixed;
bottom: 0px;
border: 1px solid #CCCCCC;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-bottom: none;
padding: 30px;
padding-bottom: 5px;
padding-top: 5px;
margin: 0 auto;
margin-left: -30px;
max-width: 1100px;
.button {
margin-top: $default-padding;
margin-bottom: 0;
}
@media(max-width: 1100px) {
margin-left: -16px;
}
// Wide layout: align buttons on a single row
@media (min-width: 550px) {
flex-direction: row;
.button:not(:first-of-type) {
margin-left: $default-spacer;
}
// If there are more than one button, align the "Send" button to the right
.button:not(:first-of-type).send {
margin-left: auto;
}
}
// Narrow layout: stack buttons vertically
@media (max-width: 550px) {
flex-direction: column-reverse;
align-items: center;
margin-left: -16px;
.button {
width: 100%;
max-width: 350px;
line-height: 30px;
margin-left: none;
margin-right: none;
}
}
}
}

View file

@ -361,63 +361,6 @@
}
}
.send-dossier-wrapper {
display: flex;
width: 100%;
margin-top: $default-padding;
background: #FFFFFF;
position: fixed;
bottom: 0px;
border: 1px solid #CCCCCC;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-bottom: none;
padding: 30px;
padding-bottom: 5px;
padding-top: 5px;
margin: 0 auto;
margin-left: -30px;
max-width: 1100px;
.button {
margin-top: $default-padding;
margin-bottom: 0;
}
@media(max-width: 1100px) {
margin-left: -16px;
}
// Wide layout: align buttons on a single row
@media (min-width: 550px) {
flex-direction: row;
.button:not(:first-of-type) {
margin-left: $default-spacer;
}
// If there are more than one button, align the "Send" button to the right
.button:not(:first-of-type).send {
margin-left: auto;
}
}
// Narrow layout: stack buttons vertically
@media (max-width: 550px) {
flex-direction: column-reverse;
align-items: center;
margin-left: -16px;
.button {
width: 100%;
max-width: 350px;
line-height: 30px;
margin-left: none;
margin-right: none;
}
}
}
.send-notice {
@include notice-text-style;
margin-bottom: $default-padding;

View file

@ -32,7 +32,7 @@
locals: { champ: champ, form: champ_form }
- if !apercu
.send-dossier-wrapper
.send-dossier-actions-bar
- if dossier.brouillon?
= f.button 'Enregistrer le brouillon',
formnovalidate: true,