mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-12-25 03:44:29 +03:00
Added basic styling with icons for events and tided structure
refs https://github.com/TryGhost/Team/issues/1277
This commit is contained in:
James Morris
parent
ee5aae8a90
commit
f63328e2cf
@ -10,14 +10,17 @@
|
||||
</div>
|
||||
{{/unless}}
|
||||
<div class="gh-list-data">
|
||||
{{event.action}}
|
||||
{{event.object}}
|
||||
|
||||
{{#if event.email}}
|
||||
"<GhEmailPreviewLink @data={{event.email}} />"
|
||||
{{/if}}
|
||||
|
||||
<span class="highlight">{{event.info}}</span>
|
||||
<div class="gh-list-data-event">
|
||||
<span class="gh-members-activity-icon">{{svg-jar event.icon}}</span>
|
||||
<span class="gh-members-activity-description">
|
||||
{{event.action}}
|
||||
{{event.object}}
|
||||
</span>
|
||||
{{#if event.email}}
|
||||
"<GhEmailPreviewLink @data={{event.email}} />"
|
||||
{{/if}}
|
||||
<span class="highlight">{{event.info}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gh-list-data">{{moment-format event.timestamp "D MMM YYYY HH:MM"}}</div>
|
||||
</tr>
|
||||
|
||||
@ -26,7 +26,53 @@ export default function parseMemberEvent(event) {
|
||||
/* internal helper functions */
|
||||
|
||||
function getIcon(event) {
|
||||
return event.type;
|
||||
let icon;
|
||||
|
||||
if (event.type === 'signup_event') {
|
||||
icon = 'signed-up';
|
||||
}
|
||||
|
||||
if (event.type === 'login_event') {
|
||||
icon = 'logged-in';
|
||||
}
|
||||
|
||||
if (event.type === 'payment_event') {
|
||||
icon = 'made-a-payment';
|
||||
}
|
||||
|
||||
if (event.type === 'newsletter_event') {
|
||||
if (event.data.subscribed) {
|
||||
icon = 'subscribed-to-email';
|
||||
} else {
|
||||
icon = 'unsubscribed-from-email';
|
||||
}
|
||||
}
|
||||
|
||||
if (event.type === 'subscription_event') {
|
||||
if (event.data.from_plan === null) {
|
||||
icon = 'started-subscription';
|
||||
}
|
||||
|
||||
if (event.data.to_plan === null) {
|
||||
icon = 'canceled-subscription';
|
||||
}
|
||||
|
||||
icon = 'changed';
|
||||
}
|
||||
|
||||
if (event.type === 'email_opened_event') {
|
||||
icon = 'opened-email';
|
||||
}
|
||||
|
||||
if (event.type === 'email_delivered_event') {
|
||||
icon = 'received-email';
|
||||
}
|
||||
|
||||
if (event.type === 'email_failed_event') {
|
||||
icon = 'email-delivery-failed';
|
||||
}
|
||||
|
||||
return 'event-' + icon;
|
||||
}
|
||||
|
||||
function getAction(event) {
|
||||
|
||||
@ -58,6 +58,7 @@
|
||||
@import "layouts/whatsnew.css";
|
||||
@import "layouts/tags.css";
|
||||
@import "layouts/members.css";
|
||||
@import "layouts/member-activity.css";
|
||||
@import "layouts/error.css";
|
||||
@import "layouts/apps.css";
|
||||
@import "layouts/packages.css";
|
||||
@ -959,6 +960,11 @@ input:focus,
|
||||
background: var(--dark-main-bg-color);
|
||||
}
|
||||
|
||||
/* Members activity */
|
||||
.gh-members-activity-icon svg path {
|
||||
stroke: #fff;
|
||||
}
|
||||
|
||||
/* Portal */
|
||||
.gh-portal-settings-maintabs {
|
||||
border: 1px solid color-mod(var(--darkgrey) l(-27%) blackness(+15%));
|
||||
|
||||
@ -58,6 +58,7 @@
|
||||
@import "layouts/whatsnew.css";
|
||||
@import "layouts/tags.css";
|
||||
@import "layouts/members.css";
|
||||
@import "layouts/member-activity.css";
|
||||
@import "layouts/error.css";
|
||||
@import "layouts/apps.css";
|
||||
@import "layouts/packages.css";
|
||||
|
||||
38
ghost/admin/app/styles/layouts/member-activity.css
Normal file
38
ghost/admin/app/styles/layouts/member-activity.css
Normal file
@ -0,0 +1,38 @@
|
||||
.gh-members-activity-single .members-header {
|
||||
height: 88px;
|
||||
}
|
||||
|
||||
.gh-members-activity .gh-member-detail-overview {
|
||||
padding: 0 0 32px;
|
||||
}
|
||||
|
||||
.gh-members-activity-single .gh-list-scrolling {
|
||||
height: calc(100vh - 200px);
|
||||
}
|
||||
|
||||
.gh-list-data-event {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.gh-members-activity-description {
|
||||
display: inline-block;
|
||||
text-transform: lowercase;
|
||||
}
|
||||
|
||||
.gh-members-activity-description:first-letter {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.gh-members-activity-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: inline-block;
|
||||
margin: 0 0.5rem 0 0;
|
||||
}
|
||||
|
||||
.gh-members-activity-icon svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
@ -1,9 +1,14 @@
|
||||
<section class="gh-canvas">
|
||||
<section class="gh-canvas gh-members-activity {{if this.memberRecord "gh-members-activity-single"}}">
|
||||
<GhCanvasHeader class="gh-canvas-header break tablet members-header">
|
||||
<h2 class="gh-canvas-title" data-test-screen-title>
|
||||
<LinkTo @route="members" data-test-link="members-back">Members</LinkTo>
|
||||
<span>{{svg-jar "arrow-right"}}</span>
|
||||
Activity
|
||||
{{#if this.memberRecord}}
|
||||
<LinkTo @route="members-activity" data-test-link="members-activity-back">Activity</LinkTo>
|
||||
<span>{{svg-jar "arrow-right"}}</span>
|
||||
{{else}}
|
||||
Activity
|
||||
{{/if}}
|
||||
</h2>
|
||||
|
||||
<div class="view-actions">
|
||||
|
||||
@ -0,0 +1,8 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M11.4385 6.54891V3.12891" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M8.01855 15.6688C8.01855 17.3788 9.54615 17.9488 11.4386 17.9488C13.331 17.9488 14.8586 17.9488 14.8586 15.6688C14.8586 12.2488 8.01855 12.2488 8.01855 8.82883C8.01855 6.54883 9.54615 6.54883 11.4386 6.54883C13.331 6.54883 14.8586 7.41523 14.8586 8.82883" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M11.4385 17.9492V21.3692" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M17.7139 4.58008L6.97596 16.085" stroke="white" stroke-width="1.7" stroke-linecap="round"/>
|
||||
<path d="M16.4619 8.23047L5.72401 19.7354" stroke="white" stroke-width="1.7" stroke-linecap="round"/>
|
||||
<path d="M15.9375 7.55566L7.50058 16.7596" stroke="#F50B23" stroke-width="1.7" stroke-linecap="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1012 B |
@ -0,0 +1,6 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M13.2401 18.5546L10.8426 16.1681L8.26916 17.4988L8.36814 13.6826L5.35477 10.6693C5.21299 10.5276 5.10861 10.353 5.05102 10.161C4.99343 9.96906 4.98444 9.76579 5.02484 9.5695C5.06399 9.35366 5.16006 9.1522 5.30314 8.98592C5.44621 8.81965 5.63109 8.6946 5.83867 8.6237L17.6392 4.68653C17.8603 4.60436 18.1003 4.5874 18.3308 4.63768C18.5613 4.68796 18.7724 4.80335 18.9392 4.97014C19.106 5.13694 19.2214 5.34811 19.2717 5.57857C19.322 5.80904 19.305 6.04909 19.2229 6.27019L17.1077 12.6099" stroke="#95A1AD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M18.871 4.92871L8.36816 13.6829" stroke="#95A1AD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M15.3477 14.0586L20.243 18.9539" stroke="#F50B23" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M15.3477 18.9531L20.243 14.0578" stroke="#F50B23" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
5
ghost/admin/public/assets/icons/event-logged-in.svg
Normal file
5
ghost/admin/public/assets/icons/event-logged-in.svg
Normal file
@ -0,0 +1,5 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M4.00055 12H14.3105" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M11.2336 8.92383L14.3105 12.0008L11.2336 15.0777" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M4.99805 16.3077C5.88288 17.7657 7.1928 18.8823 8.73134 19.4902C10.2699 20.098 11.9541 20.1642 13.5314 19.6789C15.1087 19.1935 16.494 18.1828 17.4797 16.7984C18.4653 15.4139 18.998 13.7303 18.998 12C18.998 10.2697 18.4653 8.58611 17.4797 7.20164C16.494 5.81716 15.1087 4.80647 13.5314 4.32115C11.9541 3.83582 10.2699 3.90203 8.73134 4.50984C7.1928 5.11765 5.88288 6.2343 4.99805 7.69231" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 856 B |
7
ghost/admin/public/assets/icons/event-made-a-payment.svg
Normal file
7
ghost/admin/public/assets/icons/event-made-a-payment.svg
Normal file
@ -0,0 +1,7 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M9 6.12888V3.12891" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M6 14.1288C6 15.6288 7.33999 16.1288 8.99997 16.1288C10.66 16.1288 11.9999 16.1288 11.9999 14.1288C11.9999 11.1289 6 11.1289 6 8.12889C6 6.12891 7.33999 6.12891 8.99997 6.12891C10.66 6.12891 11.9999 6.8889 11.9999 8.12889" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M9 16.1289V19.1289" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M16.3379 15.2061V22.1291" stroke="#30CF43" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M12.877 18.668H19.8" stroke="#30CF43" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 895 B |
6
ghost/admin/public/assets/icons/event-opened-email.svg
Normal file
6
ghost/admin/public/assets/icons/event-opened-email.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M20.2704 12.6611C20.4826 12.426 20.6 12.1206 20.6 11.8039C20.6 11.4873 20.4826 11.1819 20.2704 10.9468C18.9271 9.50111 15.8694 6.68652 12.3 6.68652C8.7306 6.68652 5.67294 9.50111 4.32961 10.9468C4.11744 11.1819 4 11.4873 4 11.8039C4 12.1206 4.11744 12.426 4.32961 12.6611C5.67294 14.1068 8.7306 16.9214 12.3 16.9214C12.5357 16.9214 12.3691 16.9091 12.6 16.8858" stroke="#95A1AD" stroke-width="1.55" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M12.3009 14.3635C13.714 14.3635 14.8596 13.2179 14.8596 11.8048C14.8596 10.3917 13.714 9.24609 12.3009 9.24609C10.8878 9.24609 9.74219 10.3917 9.74219 11.8048C9.74219 13.2179 10.8878 14.3635 12.3009 14.3635Z" stroke="#95A1AD" stroke-width="1.55" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M18.4609 13.6865V20.6096" stroke="#30CF43" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M15 17.1484H21.9231" stroke="#30CF43" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
5
ghost/admin/public/assets/icons/event-received-email.svg
Normal file
5
ghost/admin/public/assets/icons/event-received-email.svg
Normal file
@ -0,0 +1,5 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M13.2401 18.5546L10.8426 16.1681L8.26916 17.4988L8.36814 13.6826L5.35477 10.6693C5.21299 10.5276 5.10861 10.353 5.05102 10.161C4.99343 9.96906 4.98444 9.76579 5.02484 9.5695C5.06399 9.35366 5.16006 9.1522 5.30314 8.98592C5.44621 8.81965 5.63109 8.6946 5.83867 8.6237L17.6392 4.68653C17.8603 4.60436 18.1003 4.5874 18.3308 4.63768C18.5613 4.68796 18.7724 4.80335 18.9392 4.97014C19.106 5.13694 19.2214 5.34811 19.2717 5.57857C19.322 5.80904 19.305 6.04909 19.2229 6.27019L17.1077 12.6099" stroke="#95A1AD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M18.871 4.92871L8.36816 13.6829" stroke="#95A1AD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M15 16.1094L16.8232 17.9326C16.9209 18.0302 17.0791 18.0302 17.1768 17.9326L21.5 13.6094" stroke="#30CF43" stroke-width="1.44" stroke-linecap="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 973 B |
6
ghost/admin/public/assets/icons/event-signed-up.svg
Normal file
6
ghost/admin/public/assets/icons/event-signed-up.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M11.2457 12.1438C13.5884 12.1438 15.4875 10.2446 15.4875 7.90196C15.4875 5.55928 13.5884 3.66016 11.2457 3.66016C8.90303 3.66016 7.00391 5.55928 7.00391 7.90196C7.00391 10.2446 8.90303 12.1438 11.2457 12.1438Z" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M4 18.7612C4.75715 17.5184 5.82127 16.4913 7.09008 15.7785C8.35889 15.0658 9.78971 14.6914 11.245 14.6914C12.3654 14.6914 13.4713 14.9133 14.5 15.3407" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M17.5391 16.0771V23.0002" stroke="#30CF43" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M14.0771 19.5391H21.0002" stroke="#30CF43" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 902 B |
@ -0,0 +1,6 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M9 6.12888V3.12891" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M6 14.1288C6 15.6288 7.33999 16.1288 8.99997 16.1288C10.66 16.1288 11.9999 16.1288 11.9999 14.1288C11.9999 11.1289 6 11.1289 6 8.12889C6 6.12891 7.33999 6.12891 8.99997 6.12891C10.66 6.12891 11.9999 6.8889 11.9999 8.12889" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M9 16.1289V19.1289" stroke="#95A1AD" stroke-width="1.71429" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M14 18.1104L15.8232 19.9336C15.9209 20.0312 16.0791 20.0312 16.1768 19.9336L20.5 15.6104" stroke="#30CF43" stroke-width="1.44" stroke-linecap="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 821 B |
@ -0,0 +1,8 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M16.5391 13.7637V20.6867" stroke="#95A1AD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M13.0771 17.2246H20.0002" stroke="#95A1AD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M10.1923 16.0711H6.15385C5.84783 16.0711 5.55434 15.9496 5.33795 15.7332C5.12157 15.5168 5 15.2233 5 14.9173V6.84037C5 6.53435 5.12157 6.24087 5.33795 6.02448C5.55434 5.80809 5.84783 5.68652 6.15385 5.68652H17.6923C17.9983 5.68652 18.2918 5.80809 18.5082 6.02448C18.7246 6.24087 18.8462 6.53435 18.8462 6.84037V12.0327" stroke="#95A1AD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M5 7.14062L11.9231 12.0329L18.8462 7.14062" stroke="#95A1AD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M16.5391 13.7637V20.6867" stroke="#30CF43" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M13.0771 17.2246H20.0002" stroke="#30CF43" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
@ -0,0 +1,5 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M16.5 15.0762H20.42" stroke="#F50B23" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M13.7 17.0711H6.15385C5.84783 17.0711 5.55434 16.9496 5.33795 16.7332C5.12157 16.5168 5 16.2233 5 15.9173V7.84037C5 7.53435 5.12157 7.24087 5.33795 7.02448C5.55434 6.80809 5.84783 6.68652 6.15385 6.68652H17.6923C17.9983 6.68652 18.2918 6.80809 18.5082 7.02448C18.7246 7.24087 18.8462 7.53435 18.8462 7.84037V12.0327" stroke="#95A1AD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M5 8.14062L11.9231 13.0329L18.8462 8.14062" stroke="#95A1AD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 767 B |
Loading…
Reference in New Issue
Block a user