Skip to content

Commit cea5318

Browse files
tvdeyentvdeyen
authored
Merge pull request #4123 from AlchemyCMS/help-button
feat: Add a help button
2 parents bc64c18 + d6ae9c4 commit cea5318

10 files changed

Lines changed: 131 additions & 65 deletions

File tree

‎app/assets/builds/alchemy/admin.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎app/assets/builds/alchemy/alchemy_admin.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎app/assets/builds/alchemy/alchemy_admin.min.js.map‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎app/javascript/alchemy_admin/initializer.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ function showHelp(evt) {
1010
) {
1111
openDialog("/admin/help", {
1212
title: Alchemy.t("help"),
13-
size: "400x492"
13+
size: "500x400"
1414
})
1515
return false
1616
} else {

‎app/stylesheets/alchemy/admin.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@
1616
@use "admin/form_fields";
1717
@use "admin/forms";
1818
@use "admin/frame";
19+
@use "admin/help";
1920
@use "admin/hints";
2021
@use "admin/icons";
2122
@use "admin/image_library";

‎app/stylesheets/alchemy/admin/_help.scss‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
.help-container {
2+
display: grid;
3+
grid-template-columns: 1fr 1fr;
4+
}
5+
6+
.help-resource-links {
7+
display: grid;
8+
grid-template-columns: 1fr 1fr;
9+
gap: var(--spacing-4);
10+
}

‎app/stylesheets/alchemy/admin/buttons.scss‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,17 @@ a.button {
4747
fill: currentColor;
4848
}
4949
}
50+
51+
&.ghost {
52+
background-color: transparent;
53+
border-color: var(--button-ghost-border-color), var(--text-color);
54+
color: var(--button-ghost-text-color, var(--text-color));
55+
56+
&:hover:not([disabled]):not(.disabled) {
57+
border-color: var(--button-ghost-hover-color, var(--text-link-color));
58+
color: var(--button-ghost-hover-color, var(--text-link-color));
59+
}
60+
}
5061
}
5162

5263
.icon_button {

‎app/views/alchemy/admin/_left_menu.html.erb‎

Lines changed: 17 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,26 @@
22
<%= render "alchemy/admin/main_navi" %>
33

44
<div id="logout">
5+
<div class="main_navi_entry">
6+
<%= link_to_dialog(
7+
safe_join([
8+
render_icon(:question, class: 'module'),
9+
tag.label(Alchemy.t("Help"))
10+
]),
11+
alchemy.help_path,
12+
{
13+
title: Alchemy.t("AlchemyCMS Help"),
14+
size: "500x400"
15+
}
16+
) %>
17+
</div>
518
<div class="main_navi_entry">
619
<% if current_alchemy_user %>
720
<%= link_to_dialog(
8-
%(
9-
#{render_icon('logout-box-r', class: 'module')}
10-
<label>#{Alchemy.t(:leave)}</label>
11-
).html_safe,
21+
safe_join([
22+
render_icon('logout-box-r', class: 'module'),
23+
tag.label(Alchemy.t(:leave))
24+
]),
1225
alchemy.leave_admin_path, {
1326
size: "320x140",
1427
title: Alchemy.t("Leave Alchemy")

‎app/views/alchemy/admin/dashboard/help.html.erb‎

Lines changed: 84 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -1,57 +1,84 @@
1-
<h2><%= Alchemy.t('Global shortcuts') %></h2>
2-
<ul class="shortcuts">
3-
<li>
4-
<kbd>?</kbd>
5-
<%= Alchemy.t('Open help window', scope: 'help.shortcuts') %>
6-
</li>
7-
<li>
8-
<kbd>esc</kbd>
9-
<%= Alchemy.t('Close current dialog', scope: 'help.shortcuts') %>
10-
</li>
11-
<li>
12-
<kbd>alt</kbd><kbd>q</kbd>
13-
<%= Alchemy.t('Open logout dialog', scope: 'help.shortcuts') %>
14-
</li>
15-
<li>
16-
<kbd>alt</kbd><kbd>f</kbd>
17-
<%= Alchemy.t('Focus search field', scope: 'help.shortcuts') %>
18-
</li>
19-
<li>
20-
<kbd>alt</kbd><kbd>n</kbd>
21-
<%= Alchemy.t('Create a new record', scope: 'help.shortcuts') %>
22-
</li>
23-
</ul>
24-
<h2><%= Alchemy.t('Page edit shortcuts') %></h2>
25-
<ul class="shortcuts">
26-
<li>
27-
<kbd>alt</kbd><kbd>i</kbd>
28-
<%= Alchemy.t('Show page infos', scope: 'help.shortcuts') %>
29-
</li>
30-
<li>
31-
<kbd>alt</kbd><kbd>n</kbd>
32-
<%= Alchemy.t('Create new element', scope: 'help.shortcuts') %>
33-
</li>
34-
<li>
35-
<kbd>alt</kbd><kbd>e</kbd>
36-
<%= Alchemy.t('Edit page properties', scope: 'help.shortcuts') %>
37-
</li>
38-
<li>
39-
<kbd>alt</kbd><kbd>r</kbd>
40-
<%= Alchemy.t('Reload the preview', scope: 'help.shortcuts') %>
41-
</li>
42-
<li>
43-
<kbd>alt</kbd><kbd>x</kbd>
44-
<%= Alchemy.t('Leave the page', scope: 'help.shortcuts') %>
45-
</li>
46-
</ul>
47-
<h2><%= Alchemy.t('Library shortcuts') %></h2>
48-
<ul class="shortcuts">
49-
<li>
50-
<kbd>alt</kbd><kbd>n</kbd>
51-
<%= Alchemy.t('Open upload form', scope: 'help.shortcuts') %>
52-
</li>
53-
<li>
54-
<kbd>alt</kbd><kbd>a</kbd>
55-
<%= Alchemy.t('Select all pictures', scope: 'help.shortcuts') %>
56-
</li>
57-
</ul>
1+
<div class="help-container">
2+
<div>
3+
<h2><%= Alchemy.t('Global shortcuts') %></h2>
4+
<ul class="shortcuts">
5+
<li>
6+
<kbd>?</kbd>
7+
<%= Alchemy.t('Open help window', scope: 'help.shortcuts') %>
8+
</li>
9+
<li>
10+
<kbd>esc</kbd>
11+
<%= Alchemy.t('Close current dialog', scope: 'help.shortcuts') %>
12+
</li>
13+
<li>
14+
<kbd>alt</kbd><kbd>q</kbd>
15+
<%= Alchemy.t('Open logout dialog', scope: 'help.shortcuts') %>
16+
</li>
17+
<li>
18+
<kbd>alt</kbd><kbd>f</kbd>
19+
<%= Alchemy.t('Focus search field', scope: 'help.shortcuts') %>
20+
</li>
21+
<li>
22+
<kbd>alt</kbd><kbd>n</kbd>
23+
<%= Alchemy.t('Create a new record', scope: 'help.shortcuts') %>
24+
</li>
25+
</ul>
26+
</div>
27+
<div>
28+
<h2><%= Alchemy.t('Page edit shortcuts') %></h2>
29+
<ul class="shortcuts">
30+
<li>
31+
<kbd>alt</kbd><kbd>i</kbd>
32+
<%= Alchemy.t('Show page infos', scope: 'help.shortcuts') %>
33+
</li>
34+
<li>
35+
<kbd>alt</kbd><kbd>n</kbd>
36+
<%= Alchemy.t('Create new element', scope: 'help.shortcuts') %>
37+
</li>
38+
<li>
39+
<kbd>alt</kbd><kbd>e</kbd>
40+
<%= Alchemy.t('Edit page properties', scope: 'help.shortcuts') %>
41+
</li>
42+
<li>
43+
<kbd>alt</kbd><kbd>r</kbd>
44+
<%= Alchemy.t('Reload the preview', scope: 'help.shortcuts') %>
45+
</li>
46+
<li>
47+
<kbd>alt</kbd><kbd>x</kbd>
48+
<%= Alchemy.t('Leave the page', scope: 'help.shortcuts') %>
49+
</li>
50+
</ul>
51+
</div>
52+
<div>
53+
<h2><%= Alchemy.t('Library shortcuts') %></h2>
54+
<ul class="shortcuts">
55+
<li>
56+
<kbd>alt</kbd><kbd>n</kbd>
57+
<%= Alchemy.t('Open upload form', scope: 'help.shortcuts') %>
58+
</li>
59+
<li>
60+
<kbd>alt</kbd><kbd>a</kbd>
61+
<%= Alchemy.t('Select all pictures', scope: 'help.shortcuts') %>
62+
</li>
63+
</ul>
64+
</div>
65+
<div>
66+
<h2><%= Alchemy.t("help.resources") %></h2>
67+
<div class="help-resource-links">
68+
<a class="button ghost with_icon" href="https://guides.alchemy-cms.com" target="_blank" rel="noopener">
69+
<alchemy-icon name="external-link"></alchemy-icon>
70+
<%= Alchemy.t("help.resource_links.guidelines") %>
71+
</a>
72+
<a class="button ghost with_icon" href="https://www.alchemy-cms.com" target="_blank" rel="noopener">
73+
<alchemy-icon name="external-link"></alchemy-icon>
74+
<%= Alchemy.t("help.resource_links.homepage") %>
75+
</a>
76+
</div>
77+
</div>
78+
</div>
79+
80+
<form method="dialog">
81+
<div class="submit">
82+
<button type="submit"><%= Alchemy.t(:close) %></button>
83+
</div>
84+
</form>

‎config/locales/alchemy.en.yml‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -495,6 +495,10 @@ en:
495495
"Leave the page": "Leave the page"
496496
"Open upload form": "Open upload form"
497497
"Select all pictures": "Select all pictures"
498+
resources: Resources
499+
resource_links:
500+
guidelines: "Guidelines"
501+
homepage: "Homepage"
498502
hide_element_content: "Hide this elements content."
499503
homepage_does_not_exist: "This language has no homepage yet"
500504
dashboard: "Dashboard"

0 commit comments

Comments
 (0)