Skip to content

Commit 27c06f8

Browse files
pareenavermapareenaverma
authored
Merge pull request #1698 from zachlasiuk/main
TEMPLATE: Updated Next Step look and feel and some verbiage based on Dev Marketing & Editorial input
2 parents d9d42f2 + 2db6b2f commit 27c06f8

File tree

6 files changed

+105
-98
lines changed

6 files changed

+105
-98
lines changed

‎assets/css/feedback.css‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11

22
#feedback-container {
33
min-height: 200px;
4-
54
}
65

76
/****************************************************/

‎themes/arm-design-system-hugo-theme/layouts/install-guides/installtoolsall.html‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,11 @@ <h3 class="multi-tool-selection-title">{{.Title}}</h3>
130130
{{if not .Params.multi_install}}
131131
<br>
132132
<div style="min-height: 350px;">
133-
{{partial "general-formatting/feedback.html" (dict "context" . "learningpath_or_toolinstall" "tool quick-install guide") }}
133+
<div class="c-row">
134+
<div class="c-col">
135+
{{partial "general-formatting/feedback.html" (dict "context" . "learningpath_or_toolinstall" "tool quick-install guide") }}
136+
</div>
137+
</div>
134138
</div>
135139
{{end}}
136140
</div>

‎themes/arm-design-system-hugo-theme/layouts/partials/general-formatting/feedback.html‎

Lines changed: 74 additions & 79 deletions
Original file line numberDiff line numberDiff line change
@@ -22,89 +22,84 @@
2222
{{ $issuesURL := printf "%s/issues/new?title=Feedback - %s" $gh_repo (safeURL .context.Parent.Title ) -}}
2323

2424

25-
<!-- Give an independent row -->
26-
<div class="c-row">
27-
<div class="c-col">
28-
<div id="feedback-container">
25+
<div id="feedback-container">
2926

30-
<h2>Feedback</h2>
27+
<h2>Give Feedback</h2>
3128

32-
<!-- 1) Stars -->
33-
<div id="feedback-1-stars">
34-
<p>How would you rate the overall quality of this {{.learningpath_or_toolinstall}}?</p>
35-
<div class="rating" style="float: left">
36-
<input id="rating-5" type="radio" name="rating" value="5" onclick="starRatingGiven(this)"/><label title="Excellent" for="rating-5"><i class="fa-regular fa-2x fa-star"></i></label>
37-
<input id="rating-4" type="radio" name="rating" value="4" onclick="starRatingGiven(this)"/><label title="Good" for="rating-4"><i class="fa-regular fa-2x fa-star"></i></label>
38-
<input id="rating-3" type="radio" name="rating" value="3" onclick="starRatingGiven(this)"/><label title="Okay" for="rating-3"><i class="fa-regular fa-2x fa-star"></i></label>
39-
<input id="rating-2" type="radio" name="rating" value="2" onclick="starRatingGiven(this)"/><label title="Bad" for="rating-2"><i class="fa-regular fa-2x fa-star"></i></label>
40-
<input id="rating-1" type="radio" name="rating" value="1" onclick="starRatingGiven(this)"/><label title="Very Bad" for="rating-1"><i class="fa-regular fa-2x fa-star"></i></label>
29+
<!-- 1) Stars -->
30+
<div id="feedback-1-stars">
31+
<p>How would you rate this {{.learningpath_or_toolinstall}}?</p>
32+
<div class="rating" style="float: left">
33+
<input id="rating-5" type="radio" name="rating" value="5" onclick="starRatingGiven(this)"/><label title="Excellent" for="rating-5"><i class="fa-regular fa-2x fa-star"></i></label>
34+
<input id="rating-4" type="radio" name="rating" value="4" onclick="starRatingGiven(this)"/><label title="Good" for="rating-4"><i class="fa-regular fa-2x fa-star"></i></label>
35+
<input id="rating-3" type="radio" name="rating" value="3" onclick="starRatingGiven(this)"/><label title="Okay" for="rating-3"><i class="fa-regular fa-2x fa-star"></i></label>
36+
<input id="rating-2" type="radio" name="rating" value="2" onclick="starRatingGiven(this)"/><label title="Bad" for="rating-2"><i class="fa-regular fa-2x fa-star"></i></label>
37+
<input id="rating-1" type="radio" name="rating" value="1" onclick="starRatingGiven(this)"/><label title="Very Bad" for="rating-1"><i class="fa-regular fa-2x fa-star"></i></label>
38+
</div>
39+
</div>
40+
41+
<!-- 2) Multiple-choice feedback -->
42+
<div id="feedback-2-choice" hidden>
43+
<p class="u-margin-bottom-0">What is the primary reason for your feedback <span id="specific-stars"></span>?</p>
44+
<form id='feedback-choice-form' action='javascript:choiceFeedbackGiven()'>
45+
<!-- Bad options, 1-3 stars given -->
46+
<div id="1-2-3-star-options" class="u-margin-left-1" hidden>
47+
<div class="choice ads-radio-style">
48+
<input type="radio" class="" id="poor-1" value="Missing information" name="feedback-choice"></input>
49+
<label for="poor-1">Missing information</label>
50+
</div>
51+
<br>
52+
<div class="choice ads-radio-style">
53+
<input type="radio" class="" id="poor-2" value="Too complicated / unclear steps" name="feedback-choice"></input>
54+
<label for="poor-2">Too complicated / unclear steps</label>
55+
</div>
56+
<br>
57+
<div class="choice ads-radio-style">
58+
<input type="radio" class="" id="poor-3" value="Code problems" name="feedback-choice"></input>
59+
<label for="poor-3">Code problems</label>
60+
</div>
61+
<br>
62+
<div class="choice ads-radio-style">
63+
<input type="radio" class="" id="poor-4" value="Out of date" name="feedback-choice"></input>
64+
<label for="poor-4">Out of date</label>
4165
</div>
4266
</div>
43-
44-
<!-- 2) Multiple-choice feedback -->
45-
<div id="feedback-2-choice" hidden>
46-
<p class="u-margin-bottom-0">What is the primary reason for your feedback <span id="specific-stars"></span>?</p>
47-
<form id='feedback-choice-form' action='javascript:choiceFeedbackGiven()'>
48-
<!-- Bad options, 1-3 stars given -->
49-
<div id="1-2-3-star-options" class="u-margin-left-1" hidden>
50-
<div class="choice ads-radio-style">
51-
<input type="radio" class="" id="poor-1" value="Missing information" name="feedback-choice"></input>
52-
<label for="poor-1">Missing information</label>
53-
</div>
54-
<br>
55-
<div class="choice ads-radio-style">
56-
<input type="radio" class="" id="poor-2" value="Too complicated / unclear steps" name="feedback-choice"></input>
57-
<label for="poor-2">Too complicated / unclear steps</label>
58-
</div>
59-
<br>
60-
<div class="choice ads-radio-style">
61-
<input type="radio" class="" id="poor-3" value="Code problems" name="feedback-choice"></input>
62-
<label for="poor-3">Code problems</label>
63-
</div>
64-
<br>
65-
<div class="choice ads-radio-style">
66-
<input type="radio" class="" id="poor-4" value="Out of date" name="feedback-choice"></input>
67-
<label for="poor-4">Out of date</label>
68-
</div>
69-
</div>
70-
71-
<!-- Good options, 4-5 stars given -->
72-
<div id="4-5-star-options" class="u-margin-left-1" hidden>
73-
<div class="choice ads-radio-style">
74-
<input type="radio" class="" id="good-1" value="Easy to understand" name="feedback-choice"></input>
75-
<label for="good-1">Easy to understand</label>
76-
</div>
77-
<br>
78-
<div class="choice ads-radio-style">
79-
<input type="radio" class="" id="good-2" value="Solved my problem" name="feedback-choice"></input>
80-
<label for="good-2">Solved my problem</label>
81-
</div>
82-
<br>
83-
<div class="choice ads-radio-style">
84-
<input type="radio" class="" id="good-3" value="Helpful code snippets" name="feedback-choice"></input>
85-
<label for="good-3">Excellent code snippets</label>
86-
</div>
87-
</div>
88-
89-
<!-- Error message if submit without selection; hidden by default. -->
90-
<span>
91-
<input class="u-margin-top-1 u-margin-bottom-1" type="submit" value="Submit Feedback" id="submit-feedback-btn">
92-
<div id="choice-select-option-error" hidden>
93-
<p id="error-text">&nbsp;&nbsp;&nbsp;Please select a reason before submitting.</p>
94-
</div>
95-
</span>
96-
97-
</form>
67+
68+
<!-- Good options, 4-5 stars given -->
69+
<div id="4-5-star-options" class="u-margin-left-1" hidden>
70+
<div class="choice ads-radio-style">
71+
<input type="radio" class="" id="good-1" value="Easy to understand" name="feedback-choice"></input>
72+
<label for="good-1">Easy to understand</label>
73+
</div>
74+
<br>
75+
<div class="choice ads-radio-style">
76+
<input type="radio" class="" id="good-2" value="Solved my problem" name="feedback-choice"></input>
77+
<label for="good-2">Solved my problem</label>
78+
</div>
79+
<br>
80+
<div class="choice ads-radio-style">
81+
<input type="radio" class="" id="good-3" value="Helpful code snippets" name="feedback-choice"></input>
82+
<label for="good-3">Excellent code snippets</label>
83+
</div>
9884
</div>
85+
86+
<!-- Error message if submit without selection; hidden by default. -->
87+
<span>
88+
<input class="u-margin-top-1 u-margin-bottom-1" type="submit" value="Submit Feedback" id="submit-feedback-btn">
89+
<div id="choice-select-option-error" hidden>
90+
<p id="error-text">&nbsp;&nbsp;&nbsp;Please select a reason before submitting.</p>
91+
</div>
92+
</span>
9993

100-
<!-- 3) Thank you message -->
101-
<div id="feedback-3-thanks" hidden>
102-
<p>Thank you. We're grateful for your feedback on how to improve this {{.learningpath_or_toolinstall}}.</p>
103-
<ul>
104-
<li>Have more detailed feedback about what to improve or add next? <a href="{{$issuesURL}}" target="_blank">Log an issue on GitHub.{{partial "general-formatting/external-link.html" }}</a></li>
105-
<li>Want to discuss this topic with fellow developers and Arm Experts? <a href="https://discord.com/invite/armsoftwaredev" target="_blank">Collaborate in the Arm Developer Discord server.{{partial "general-formatting/external-link.html" }}</a></li>
106-
</ul>
107-
</div>
108-
</div>
94+
</form>
95+
</div>
96+
97+
<!-- 3) Thank you message -->
98+
<div id="feedback-3-thanks" hidden>
99+
<p>Thank you! We're grateful for your feedback.</p>
100+
<ul>
101+
<li>Have more feedback? <a href="{{$issuesURL}}" target="_blank">Log an issue on GitHub.{{partial "general-formatting/external-link.html" }}</a></li>
102+
<li>Want to collaborate? <a href="https://discord.com/invite/armsoftwaredev" target="_blank">Join our Discord server.{{partial "general-formatting/external-link.html" }}</a></li>
103+
</ul>
109104
</div>
110-
</div>
105+
</div>

‎themes/arm-design-system-hugo-theme/layouts/partials/learning-paths/next-steps.html‎

Lines changed: 25 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -50,10 +50,10 @@
5050
</style>
5151

5252

53-
<div class="c-row">
53+
<div class="c-row u-margin-bottom-0">
5454
<div class="c-col">
5555
<h2>Share</h2>
56-
<p>Share what you've learned.</p>
56+
<p>Bring your insights to the conversation.</p>
5757
<div class="social-sharing">
5858
<div id="social-share-icon-div" class="social-icons">
5959
<a id="linkedin-link" class="share-button" name="LinkedIn"
@@ -103,6 +103,12 @@ <h2>Share</h2>
103103
</div>
104104
</div>
105105
</div>
106+
<div class="c-col">
107+
<!-- Feedback -->
108+
{{partial "general-formatting/feedback.html" (dict "context" .context "learningpath_or_toolinstall" "Learning Path") }}
109+
110+
111+
</div>
106112
</div>
107113

108114
<script>
@@ -196,18 +202,11 @@ <h2>Share</h2>
196202
window.open(linkedinShareUrl, '_blank', 'width=900,height=650');
197203
});
198204

199-
</script>
200-
201-
<br>
202-
203-
<!-- Feedback -->
204-
{{partial "general-formatting/feedback.html" (dict "context" .context "learningpath_or_toolinstall" "Learning Path") }}
205-
205+
</script>
206206

207207

208208

209-
210-
<div class="c-row">
209+
<div class="c-row u-margin-top-0">
211210
<div class="c-col">
212211
<!-- Main CTA for next learning path: -->
213212
<h2>Continue Learning</h2>
@@ -254,19 +253,23 @@ <h4>Talk with Arm Experts</h4>
254253
</script>
255254
-->
256255

257-
<h4>Join Developer Program</h4>
258-
<p>Join the Arm Developer Program to share ideas, ask questions, and explore solutions with the support of the developer community.</p>
256+
<h4>Join the Arm Developer Program</h4>
257+
<p>
258+
Connect, upskill, and build with the Arm Developer Community. Join today for hands-on technical resources and education materials, along with the support of Arm engineers and the broader ecosystem.
259+
</p>
259260

260261
<ads-modal id="modal-custom-trigger">
261262
<div slot="body">
262263
<div id="form-display">
263-
<h2 class="modal-title u-margin-right-1/2" style="margin-top: 0px; margin-bottom: 16px;">Join Arm Developer Program</h2>
264+
<h2 class="modal-title u-margin-right-1/2" style="margin-top: 0px; margin-bottom: 16px;">Join the Arm Developer Program</h2>
264265
<div class="c-row" style="max-width: 650px;">
265266
<p>By signing up, you will receive member news and email updates on topics that interest you. You can manage your subscription preferences anytime.</p>
266267
</div>
268+
267269
<div class="c-row lg:u-display-block u-hide u-margin-bottom-1 u-margin-right-1/2">
268-
<img src="/img/arm_dev_program_half.jpg" alt="Developer Program" style="width: 98%; max-width: 650px; display: block;">
269-
</div>
270+
<img src="/img/dev_prog.png" alt="Developer Program" style="width: 98%; max-width: 650px; display: block;">
271+
</div>
272+
270273
<hr class="u-margin-right-1/2">
271274
<div id="marketo-form-container"></div>
272275
</div>
@@ -389,6 +392,12 @@ <h2 class="modal-title">Program Registration Success</h2>
389392
.mktoField {
390393
391394
}
395+
.mktoFormCol {
396+
width:100%;
397+
}
398+
.mktoFieldWrap {
399+
width:90%;
400+
}
392401
393402
394403
`;

‎themes/arm-design-system-hugo-theme/layouts/partials/navigation/nav-buttons.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010

1111

1212
<!-- Row for buttons -->
13-
<div class="c-row u-margin-top-2">
13+
<div class="c-row u-margin-top-2 u-margin-bottom-2">
1414
{{ $counter := 0 }} <!-- Counter to track index -->
1515
{{ range .learningpathfiles }}
1616
{{ if eq .Weight $.context.Weight }}

‎themes/arm-design-system-hugo-theme/static/img/dev_prog.png‎

203 KB
Loading

0 commit comments

Comments
 (0)