style(feedback): subtle feedback feature

frappe · Jan 12, 2024 · e070186 · e070186
1 parent c41a740
commit e070186
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 21 deletions.
diff --git a/wiki/public/scss/wiki.scss b/wiki/public/scss/wiki.scss
@@ -791,20 +791,15 @@ h6:hover .feather-link {
 }
 
 .feedback-btn {
-	position: fixed;
-	right: 2%;
-	top: 93%;
-	z-index: 1000;
+	cursor: pointer;
 
-	&:focus, &:active {
-		outline: none !important;
-		box-shadow: none !important;
+	&:hover {
+		text-decoration: underline;
 	}
 }
 
 .feedback-modal {
-	margin-right: 0;
-	width: 22rem;
+	width: 25rem;
 
 	.form-control:focus {
 		border: none;

diff --git a/wiki/wiki/doctype/wiki_page/templates/feedback.html b/wiki/wiki/doctype/wiki_page/templates/feedback.html
@@ -8,7 +8,7 @@ <h5 class="modal-title" id="feedbackRating">Feedback</h5>
                 </button>
             </div>
             <div class="modal-body">
-                <label for="rating-options" class="text-muted text-xs">How would you rate this documentation?</label>
+                <label for="rating-options" class="text-muted text-xs">How would you rate this page?</label>
                 <div id="rating-options" class="rating-options mb-2">
                     <div class="rating-options-buttons" style="grid-template-columns: repeat(5, minmax(0px, 1fr));">
                         <button class="ratings-number question-2-rating-1 auto-text-color" type="submit" value="0.2">

diff --git a/wiki/wiki/doctype/wiki_page/templates/show.html b/wiki/wiki/doctype/wiki_page/templates/show.html
@@ -47,7 +47,15 @@ <h5 class="modal-title" id="addGroupModalTitle">Title</h5>
 	</div>
 </div>
 
-<div class="my-4 wiki-page-meta hide d-print-none">
+<div class="flex my-4 wiki-page-meta hide d-print-none">
+	{%- if show_feedback -%}
+	<div class="flex mt-4">
+		<span class="text-sm">Was this article helpful?</span>
+		<span class="text-sm ml-2 feedback-btn" data-toggle="modal" data-target="#feedbackModal">Give Feedback</span>
+	</div>
+	{% include "wiki/doctype/wiki_page/templates/feedback.html" %}
+	{%- endif -%}
+
 	{%- if last_revision -%}
 	<div class="user-contributions" data-date="{{ last_revision.modified }}">
 	</div>
@@ -67,16 +75,6 @@ <h5 class="modal-title" id="addGroupModalTitle">Title</h5>
 	</div>
 </div>
 
-{%- if show_feedback -%}
-<button class="btn btn-secondary btn-sm feedback-btn" data-toggle="modal" data-target="#feedbackModal">
-	<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-		stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-message-square">
-		<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path>
-	</svg>
-</button>
-{% include "wiki/doctype/wiki_page/templates/feedback.html" %}
-{%- endif -%}
-
 <script type="text/javascript" src="/assets/frappe/js/lib/jquery/jquery.min.js"></script>
 <script>
 	const patchNewCode = `<h1>{{ patch_new_title }}</h1>{{ patch_new_code }}`;