style: improve dark theme messagerie buttons & iconography

This commit is contained in:
Colin Darie 2023-12-04 14:47:05 +01:00
parent d601daaee1
commit c24a94430d
5 changed files with 5 additions and 25 deletions

View file

@ -1,27 +1,13 @@
@import "colors";
@import "constants";
[data-fr-theme="dark"] .message {
background: var(--background-action-low-blue-france);
&.inverted-background {
background: var(--background-action-low-blue-france);
}
}
.message {
display: flex;
align-items: flex-start;
margin-bottom: $default-padding;
padding: $default-padding;
background: $light-grey;
border-radius: 3px;
&.inverted-background {
background: $light-grey;
}
h2 {
margin-bottom: $default-spacer;
}
@ -33,8 +19,4 @@
.date {
float: right;
}
.message-answer-button {
margin-left: auto;
}
}

View file

@ -22,8 +22,7 @@
.message-extras.flex.justify-start
- if commentaire.soft_deletable?(connected_user)
= button_to instructeur_commentaire_path(commentaire.dossier.procedure, commentaire.dossier, commentaire), method: :delete, class: 'button danger', form: { data: { turbo: true, turbo_confirm: t('.confirm') } } do
= dsfr_icon('fr-icon-delete-line', :sm)
= button_to instructeur_commentaire_path(commentaire.dossier.procedure, commentaire.dossier, commentaire), method: :delete, class: 'fr-btn fr-btn--sm fr-btn--tertiary fr-icon-delete-line fr-btn--icon-left fr-text-default--warning', form: { data: { turbo: true, turbo_confirm: t('.confirm') } } do
= t('.delete_button')
- if commentaire.piece_jointe.attached?
@ -31,6 +30,5 @@
= render Attachment::ShowComponent.new(attachment: commentaire.piece_jointe.attachment, new_tab: true)
- if show_reply_button?
= button_tag type: 'button', class: 'button small message-answer-button', onclick: 'document.querySelector("#commentaire_body").focus()' do
%span.icon.reply
= button_tag type: 'button', class: 'fr-btn fr-btn--sm fr-btn--secondary fr-icon-arrow-go-back-line fr-btn--icon-left', onclick: 'document.querySelector("#commentaire_body").focus()' do
= t('.reply')

View file

@ -1,7 +1,7 @@
.messagerie.container
%ul.messages-list{ data: { controller: 'scroll-to' } }
- dossier.preloaded_commentaires.each do |commentaire|
%li.message{ class: commentaire_is_from_me_class(commentaire, connected_user), id: dom_id(commentaire) }
%li.message.fr-background-alt--grey{ class: commentaire_is_from_me_class(commentaire, connected_user), id: dom_id(commentaire) }
= render Dossiers::MessageComponent.new(commentaire: commentaire, connected_user: connected_user, messagerie_seen_at: messagerie_seen_at, show_reply_button: show_reply_button(commentaire, connected_user))
- if dossier.messagerie_available?

View file

@ -3,7 +3,7 @@
.latest-message-section
%h3.tab-title= t('views.users.dossiers.show.latest_message.latest_message')
.message.inverted-background
.message.fr-background-alt--grey
= render Dossiers::MessageComponent.new(commentaire: latest_message, connected_user: current_user)
= link_to messagerie_dossier_url(dossier, anchor: 'new_commentaire'), class: 'fr-btn fr-btn--icon-left fr-icon-discuss-line' do

View file

@ -27,7 +27,7 @@
- if dossier.en_construction?
.en-construction
- if dossier.pending_correction.present?
.message.inverted-background
.message.fr-background-alt--grey
= render Dossiers::MessageComponent.new(commentaire: dossier.pending_correction.commentaire, connected_user: current_user)
%p{ role: 'status' }