Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Aligning Settings welcome dashboard headlines #17609

Merged
merged 2 commits into from
Nov 21, 2024
Merged

Aligning Settings welcome dashboard headlines #17609

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
c2096f6
use box headline for headlines
madsrasmussen Nov 21, 2024
38e0696
Settings welcome dashboard amends
leekelleher Nov 21, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46 changes: 19 additions & 27 deletions ...Umbraco.Web.UI.Client/src/packages/settings/welcome/settings-welcome-dashboard.element.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,91 +7,77 @@
override render() {
return html`
<section id="settings-dashboard" class="uui-text">
<uui-box>
<h1 class="uui-h3"><umb-localize key="settingsDashboard_documentationHeader">Documentation</umb-localize></h1>
<uui-box headline=${this.localize.term('settingsDashboard_documentationHeader')}>
<p>
<umb-localize key="settingsDashboard_documentationDescription">
Read more about working with the items in Settings in our Documentation.
</umb-localize>
</p>
<uui-button
look="primary"
href="https://docs.umbraco.com/umbraco-cms/umbraco-cms"
href="https://docs.umbraco.com/umbraco-cms"
label=${this.localize.term('settingsDashboard_getHelp')}
target="_blank"
rel="noopener"></uui-button>
target="_blank"></uui-button>
</uui-box>

<uui-box>
<h1 class="uui-h3"><umb-localize key="settingsDashboard_communityHeader">Community</umb-localize></h1>
<uui-box headline=${this.localize.term('settingsDashboard_communityHeader')}>
<p>
<umb-localize key="settingsDashboard_communityDescription">
Ask a question in the community forum or our Discord community
</umb-localize>
</p>

<div class="button-group">
<uui-button
look="primary"
href="https://our.umbraco.com/forum"
href="https://our.umbraco.com/forum/"
label=${this.localize.term('settingsDashboard_goForum')}
target="_blank"
rel="noopener"></uui-button>
target="_blank"></uui-button>
<uui-button
look="primary"
href="https://discord.umbraco.com"
label=${this.localize.term('settingsDashboard_chatWithCommunity')}
target="_blank"
rel="noopener"></uui-button>
target="_blank"></uui-button>
</div>
</uui-box>

<uui-box class="training">
<h1 class="uui-h3"><umb-localize key="settingsDashboard_trainingHeader">Training</umb-localize></h1>

<uui-box headline=${this.localize.term('settingsDashboard_trainingHeader')}>
<p>
<umb-localize key="settingsDashboard_trainingDescription">
Find out about real-life training and certification opportunities
</umb-localize>
</p>
<uui-button
look="primary"
href="https://umbraco.com/training/"
label=${this.localize.term('settingsDashboard_getCertified')}
target="_blank"
rel="noopener"></uui-button>
target="_blank"></uui-button>
</uui-box>

<uui-box>
<h1 class="uui-h3"><umb-localize key="settingsDashboard_supportHeader">Support</umb-localize></h1>

<uui-box headline=${this.localize.term('settingsDashboard_supportHeader')}>
<p>
<umb-localize key="settingsDashboard_supportDescription">
Extend your team with a highly skilled and passionate bunch of Umbraco know-it-alls
</umb-localize>
</p>
<uui-button
look="primary"
href="https://umbraco.com/support/"
label=${this.localize.term('settingsDashboard_getHelp')}
target="_blank"
rel="noopener"></uui-button>
target="_blank"></uui-button>
</uui-box>

<uui-box>
<h1 class="uui-h3"><umb-localize key="settingsDashboard_videosHeader">Videos</umb-localize></h1>
<uui-box headline=${this.localize.term('settingsDashboard_videosHeader')}>
<p>
<umb-localize key="settingsDashboard_videosDescription">
Watch our free tutorial videos on the Umbraco Learning Base YouTube channel, to get upto speed quickly
with Umbraco.
</umb-localize>
</p>
<uui-button
look="primary"
href="https://www.youtube.com/c/UmbracoLearningBase"
label=${this.localize.term('settingsDashboard_watchVideos')}
target="_blank"
rel="noopener"></uui-button>
target="_blank"></uui-button>

Check notice on line 80 in src/Umbraco.Web.UI.Client/src/packages/settings/welcome/settings-welcome-dashboard.element.ts

View check run for this annotation

CodeScene Delta Analysis / CodeScene Cloud Delta Analysis (v15/dev)

✅ Getting better: Large Method 

UmbSettingsWelcomeDashboardElement.render decreases from 85 to 74 lines of code, threshold = 70. Large functions with many lines of code are generally harder to understand and lower the code health. Avoid adding more lines to this function.
</uui-box>
</section>
`;
Expand All @@ -107,6 +93,12 @@
padding: var(--uui-size-layout-1);
}

uui-box {
p:first-child {
margin-top: 0;
}
}

@media (max-width: 1200px) {
#settings-dashboard {
grid-template-columns: repeat(2, 1fr);
Expand Down
Loading