diff --git a/frappe/public/js/frappe/form/sidebar/review.js b/frappe/public/js/frappe/form/sidebar/review.js
index dd991778d3..292db75393 100644
--- a/frappe/public/js/frappe/form/sidebar/review.js
+++ b/frappe/public/js/frappe/form/sidebar/review.js
@@ -143,7 +143,9 @@ frappe.ui.form.Review = class Review {
review_logs.forEach(log => {
let review_pill = $(`
- ${log.points > 0 ? '+': ''}${log.points}
+
+ ${Math.abs(log.points)}
+
`);
review_pill.insertBefore(this.add_review_button_wrapper);
diff --git a/frappe/public/scss/sidebar.scss b/frappe/public/scss/sidebar.scss
index 638030675b..eb8311ff4f 100644
--- a/frappe/public/scss/sidebar.scss
+++ b/frappe/public/scss/sidebar.scss
@@ -424,20 +424,18 @@ body[data-route^="Module"] .main-menu {
}
.form-reviews {
- // REDESIGN-TODO: Refactor
.review {
- display: inline-block;
+ display: inline-flex;
font-weight: 500;
+ width: 28px;
+ height: 28px;
border-radius: 50%;
- margin-bottom: var(--margin-sm);
- margin-right: var(--margin-sm);
+ vertical-align: middle;
+ justify-content: center;
font-size: var(--text-xs);
- height: 34px;
- width: 34px;
- text-align: center;
- cursor: pointer;
- padding: var(--padding-xs);
- padding-top: 8px;
+ align-items: center;
+ margin-bottom: var(--margin-xs);
+ margin-right: var(--margin-xs);
&.appreciation {
background-color: var(--dark-green-100);
color: var(--dark-green-600);
@@ -450,15 +448,16 @@ body[data-route^="Module"] .main-menu {
li:last-child {
display: inline-block;
}
- .add-review-btn {
- height: 28px;
- width: 28px;
- border-radius: var(--border-radius);
- border: 1px dashed var(--gray-300);
- background: var(--gray-50);
- text-align: center;
- padding: 3px;
- }
+}
+
+.add-review-btn, .share-doc-btn {
+ height: 28px;
+ width: 28px;
+ border-radius: var(--border-radius);
+ border: 1px dashed var(--gray-300);
+ background: var(--gray-50);
+ text-align: center;
+ padding: 3px;
}
.review-popover {