Website: add edit button to articles (#14140)

Closes: #13897

Changes: 
- Added an "edit page" button to article pages.
- Updated button styles on article pages.

---------

Co-authored-by: Mike Thomas <78363703+mike-j-thomas@users.noreply.github.com>
This commit is contained in:
Eric 2023-09-27 18:35:03 -05:00 committed by GitHub
parent 4a837af229
commit 18df6ff221
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 34 additions and 3 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 527 B

View file

@ -28,17 +28,45 @@
padding: 4px 8px;
display: inline;
max-width: min-content;
color: #192147;
color: @core-fleet-black-75;
text-decoration: none;
font-size: 14px;
border-radius: 6px;
span::before {
vertical-align: baseline;
font-family: 'FontAwesome';
content: '\f09e';
color: #192147;
padding-right: 8px;
font-size: 16px;
}
&:hover {
background-color: rgba(25,33,71,.05);
}
&:active{
background-color: rgba(25,33,71,.1);
}
}
[purpose='edit-button'] {
margin-left: 24px;
img {
width: 16px;
height: 16px;
display: inline;
margin-right: 8px;
}
padding: 4px 8px;
display: block;
color: @core-fleet-black-75;
text-decoration: none;
font-size: 14px;
line-height: 21px;
border-radius: 6px;
&:hover {
background-color: rgba(25,33,71,.05);
}
&:active{
background-color: rgba(25,33,71,.1);
}
}
[purpose='article-details'] {
font-size: 14px;

View file

@ -11,7 +11,10 @@
<img style="height: 28px; width: 28px; border-radius: 100%;" alt="The author's GitHub profile picture" :src="'https://github.com/'+thisPage.meta.authorGitHubUsername+'.png?size=200'">
<p class="pl-2 font-weight-bold"><%=thisPage.meta.authorFullName %></p>
</div>
<a purpose="rss-button" class="px-0 px-sm-2 pt-3 pt-sm-1" taget="_blank" :href="'/rss/'+articleCategorySlug"><span>Subscribe</span></a>
<div class="d-flex flex-row align-items-center pt-3 pt-sm-1">
<a purpose="rss-button" target="_blank" :href="'/rss/'+articleCategorySlug"><span>Subscribe</span></a>
<a purpose="edit-button" class="d-flex flex-row align-items-center" target="_blank" :href="'https://github.com/fleetdm/fleet/edit/main/articles/'+thisPage.sectionRelativeRepoPath"><img alt="A pencil icon" src="/images/pencil-16x16@2x.png">Edit page</span></a>
</div>
</div>
<div purpose="article-content" class="d-flex flex-column" parasails-has-no-page-script>
<%- partial(path.relative(path.dirname(__filename), path.resolve( sails.config.appPath, path.join(sails.config.builtStaticContent.compiledPagePartialsAppPath, thisPage.htmlId)))) %>