Avis style: extract class to avis.scss file for reuse in patron and avis

This commit is contained in:
Simon Lehericey 2017-09-06 14:08:03 +02:00
parent 2b0d9f51fd
commit c93feb27f0
4 changed files with 106 additions and 62 deletions

View file

@ -0,0 +1,73 @@
@import "colors";
@import "common";
@import "constants";
.ask-avis {
h1 {
font-size: 18px;
font-weight: bold;
margin-bottom: $default-padding;
}
.avis-notice {
font-size: 12px;
color: $grey;
margin-bottom: 2 * $default-padding;
}
input[type=email] {
max-width: 500px;
}
}
.list-avis {
.title {
font-size: 18px;
font-weight: bold;
margin-bottom: $default-padding;
.count {
display: inline-block;
width: 20px;
height: 20px;
border-radius: 10px;
border: 1px solid $grey;
text-align: center;
font-size: 12px;
font-weight: normal;
margin-left: 8px;
}
}
.one-avis {
border-top: 1px solid $grey;
padding: $default-padding 0;
h2 {
font-weight: bold;
margin-bottom: $default-spacer;
span {
font-weight: normal;
}
}
.answer {
margin-top: $default-padding;
}
.avis-icon {
margin-right: $default-spacer;
}
}
.date,
.waiting {
font-size: 12px;
color: $grey;
}
.date {
float: right;
}
}

View file

@ -8,64 +8,4 @@
font-weight: bold;
margin-bottom: $default-padding;
}
.avis-notice {
font-size: 12px;
color: $grey;
margin-bottom: 2 * $default-padding;
}
input[type=email] {
max-width: 500px;
}
.avis {
.title {
margin-bottom: $default-padding;
.count {
display: inline-block;
width: 20px;
height: 20px;
border-radius: 10px;
border: 1px solid $grey;
text-align: center;
font-size: 12px;
font-weight: normal;
margin-left: 8px;
}
}
.one-avis {
border-top: 1px solid $grey;
padding: $default-padding 0;
h2 {
font-weight: bold;
margin-bottom: $default-spacer;
span {
font-weight: normal;
}
}
.answer {
margin-top: $default-padding;
}
.avis-icon {
margin-right: $default-spacer;
}
}
.date,
.waiting {
font-size: 12px;
color: $grey;
}
.date {
float: right;
}
}
}

View file

@ -1,7 +1,7 @@
= render partial: "header", locals: { dossier: @dossier }
#dossier-instruction.container
%section
%section.ask-avis
%h1 Inviter une personne à donner son avis
%p.avis-notice Elle pourra consulter, donner un avis sur le dossier et contribuer au fil de messagerie, mais elle ne pourra le modifier.
@ -12,7 +12,7 @@
= f.submit 'Demander un avis', class: 'button send'
- if @dossier.avis.present?
%section.avis
%section.list-avis
%h1.title
Avis des invités
%span.count= @dossier.avis.count

View file

@ -155,3 +155,34 @@
Insérer ici le contenu de la colonne 1
.column
Insérer ici le contenu de la colonne 2
.container
%section.ask-avis
%h1 Inviter une personne à donner son avis
%p.avis-notice Elle pourra consulter, donner un avis sur le dossier et contribuer au fil de messagerie, mais elle ne pourra le modifier.
= form_for Avis.new, url: '/', html: { class: 'form' } do |f|
= f.email_field :email, placeholder: 'Adresse email', required: true
= f.text_area :introduction, rows: 3, value: 'Bonjour, merci de me donner votre avis sur ce dossier.', required: true
.send-wrapper
= f.submit 'Demander un avis', class: 'button send'
%section.list-avis
%h1.title
Avis des invités
%span.count 1
%ul
%li.one-avis
%h2.claimant
Vous
%span.date Demande d'avis envoyée le 12/01/2012
%p Bonjour, merci de me donner votre avis sur ce dossier.
.answer.flex.align-start
= image_tag 'icons/bubble.svg', class: 'avis-icon'
.width-100
%h2.gestionnaire
gestionnnaire@tps.com
%span.date Réponse donnée le 13/01/2012
%p Je donne un avis favorable