Added inlined feedback form design to post published page

no refs
This commit is contained in:
Djordje Vlaisavljevic 2023-05-12 16:11:14 +01:00
parent d82ad53bab
commit 1e3d78a937
2 changed files with 46 additions and 2 deletions

View File

@ -96,6 +96,28 @@
</button>
</p>
{{else}}
<div class="gh-feedback-grey">
<h4 class="gh-feedback-grey-title">Hey, noticed anything different?</h4>
<p>This post was successfully published using our new editor. Have any issues? Feedback? Let us know!</p>
<form>
<GhFormGroup>
{{!-- <label for="feedback-lexical">Feedback</label> --}}
<GhTextarea
@id="feedback-lexical"
@name="feedback-lexical"
@value={{this.feedbackMessage}}
@placeholder="I've noticed that..."
data-test-lexical-feedback-textarea
/>
</GhFormGroup>
</form>
<GhTaskButton
@buttonText="Send feedback"
@task={{this.submitFeedback}}
@class="gh-btn gh-btn-black gh-btn-icon"
data-test-button="submit-lexical-feedback"
/>
</div>
<p class="gh-publish-confirmation gh-publish-confirmation-with-feedback">
<button
type="button"
@ -105,7 +127,7 @@
>
<span>Back to editor</span>
</button>
{{#if (feature 'lexicalEditor')}}
{{!-- {{#if (feature 'lexicalEditor')}}
<button
type="button"
class="gh-publish-confirmation-feedback"
@ -114,7 +136,7 @@
>
<span>Beta feedback?</span>
</button>
{{/if}}
{{/if}} --}}
</p>
{{/if}}
{{/if}}

View File

@ -737,6 +737,28 @@
justify-content: space-between;
}
.gh-feedback-grey {
background: var(--main-color-content-greybg);
padding: 24px;
border-radius: 3px;
margin-bottom: 2.4rem;
}
.gh-post-bookmark-wrapper + .gh-feedback-grey {
margin-bottom: 2.4rem;
}
.gh-feedback-grey .gh-feedback-grey-title {
font-size: 1.8rem;
}
.gh-feedback-grey p {
font-size: 1.4rem;
color: var(--midgrey);
max-width: 30em;
margin-bottom: 0.8rem;
}
.gh-publish-confirmation-feedback {
color: var(--green);
font-size: 1.6rem;