diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
index abb94a533..766bfa909 100644
--- a/app/assets/stylesheets/application.scss
+++ b/app/assets/stylesheets/application.scss
@@ -49,6 +49,7 @@
@import "account/**/*";
@import "admin/**/*";
@import "budgets/**/*";
+@import "comments/**/*";
@import "debates/**/*";
@import "documents/**/*";
@import "layout/**/*";
diff --git a/app/assets/stylesheets/comments/avatar.scss b/app/assets/stylesheets/comments/avatar.scss
new file mode 100644
index 000000000..b47002a91
--- /dev/null
+++ b/app/assets/stylesheets/comments/avatar.scss
@@ -0,0 +1,6 @@
+.comment-avatar {
+ img,
+ svg {
+ float: $global-left;
+ }
+}
diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss
index 195cc2db8..febe1eb35 100644
--- a/app/assets/stylesheets/layout.scss
+++ b/app/assets/stylesheets/layout.scss
@@ -1560,7 +1560,7 @@ table {
img,
svg {
- margin-right: calc(#{$line-height} / 2);
+ margin-#{$global-right}: calc(#{$line-height} / 2);
}
.reply {
diff --git a/app/components/comments/avatar_component.html.erb b/app/components/comments/avatar_component.html.erb
index 0c95fa943..432e3a33e 100644
--- a/app/components/comments/avatar_component.html.erb
+++ b/app/components/comments/avatar_component.html.erb
@@ -1,11 +1,13 @@
-<% if comment.as_administrator? %>
- <%= image_tag("avatar_admin.png", size: 32, class: "admin-avatar float-left", alt: "") %>
-<% elsif comment.as_moderator? %>
- <%= image_tag("avatar_moderator.png", size: 32, class: "moderator-avatar float-left", alt: "") %>
-<% elsif comment.user.hidden? || comment.user.erased? %>
-
-<% elsif comment.user.organization? %>
- <%= image_tag("avatar_collective.png", size: 32, class: "avatar float-left", alt: "") %>
-<% else %>
- <%= render Shared::AvatarComponent.new(comment.user, size: 32, class: "float-left") %>
-<% end %>
+