mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-03-11 02:12:21 -05:00
Made all the event tables more consistent
- Adjustments to the icon spacing for all tables - Adjustments to the font weighting and colour for all event tables - Changed activity on dashboard to have relative time - Tweaked padding and margins to bring more consistency - Also fixed a linting bug refs https://github.com/TryGhost/Team/issues/1816
This commit is contained in:
James Morris
parent
5008a5b948
commit
8b8fa76cc7
8 changed files with 60 additions and 31 deletions
|
|
@ -101,15 +101,15 @@
|
|||
<span class="gh-dashboard-list-subtext">
|
||||
{{capitalize-first-letter parsedEvent.action}}
|
||||
{{#if parsedEvent.url}}
|
||||
"<a class="ghost-members-activity-object-link" href="{{parsedEvent.url}}" target="_blank" rel="noopener noreferrer">{{parsedEvent.object}}</a>"
|
||||
<a class="ghost-members-activity-object-link" href="{{parsedEvent.url}}" target="_blank" rel="noopener noreferrer">{{parsedEvent.object}}</a>
|
||||
{{else}}
|
||||
{{parsedEvent.object}}
|
||||
{{/if}}
|
||||
{{parsedEvent.info}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="gh-dashboard-list-item-sub">
|
||||
<span class="gh-dashboard-list-subtext">{{moment-format parsedEvent.timestamp "DD MMM YYYY HH:mm"}}</span>
|
||||
<div class="gh-dashboard-list-item-sub gh-dashboard-list-item-date">
|
||||
<span class="gh-dashboard-list-subtext">{{moment-from-now parsedEvent.timestamp}}</span>
|
||||
</div>
|
||||
</div>
|
||||
{{/let}}
|
||||
|
|
|
|||
|
|
@ -27,16 +27,15 @@
|
|||
<span class="gh-members-activity-description">
|
||||
{{capitalize-first-letter event.action}}
|
||||
{{#if event.url}}
|
||||
"<a class="ghost-members-activity-object-link" href="{{event.url}}" target="_blank" rel="noopener noreferrer">{{event.object}}</a>"
|
||||
<a class="ghost-members-activity-object-link" href="{{event.url}}" target="_blank" rel="noopener noreferrer">{{event.object}}</a>
|
||||
{{else}}
|
||||
{{event.object}}
|
||||
{{/if}}
|
||||
{{#if event.email}}
|
||||
<GhEmailPreviewLink @data={{event.email}} />
|
||||
{{/if}}
|
||||
<span class="highlight">{{event.info}}</span>
|
||||
</span>
|
||||
{{#if event.email}}
|
||||
"<GhEmailPreviewLink @data={{event.email}} />"
|
||||
{{/if}}
|
||||
{{event.info}}
|
||||
|
||||
</span>
|
||||
</div>
|
||||
<div class="gh-member-feed-time">
|
||||
|
|
|
|||
|
|
@ -22,18 +22,18 @@
|
|||
<span class="gh-members-activity-description">
|
||||
{{capitalize-first-letter event.action}}
|
||||
{{#if event.url}}
|
||||
"<a class="ghost-members-activity-object-link" href="{{event.url}}" target="_blank" rel="noopener noreferrer">{{event.object}}</a>"
|
||||
<a class="ghost-members-activity-object-link" href="{{event.url}}" target="_blank" rel="noopener noreferrer">{{event.object}}</a>
|
||||
{{else}}
|
||||
{{event.object}}
|
||||
{{/if}}
|
||||
{{#if event.email}}
|
||||
<GhEmailPreviewLink @data={{event.email}} />
|
||||
{{/if}}
|
||||
<span class="highlight">{{event.info}}</span>
|
||||
</span>
|
||||
{{#if event.email}}
|
||||
"<GhEmailPreviewLink @data={{event.email}} />"
|
||||
{{/if}}
|
||||
<span class="highlight">{{event.info}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gh-list-data">{{moment-format event.timestamp "DD MMM YYYY HH:mm"}}</div>
|
||||
<div class="gh-list-data gh-list-data-date">{{moment-format event.timestamp "DD MMM YYYY HH:mm"}}</div>
|
||||
</tr>
|
||||
{{/let}}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import {inject as service} from '@ember/service';
|
||||
import PostsRoute from './posts';
|
||||
import {inject as service} from '@ember/service';
|
||||
|
||||
export default class PagesRoute extends PostsRoute {
|
||||
@service feature;
|
||||
|
|
|
|||
|
|
@ -112,6 +112,12 @@ ul.nostyle li {
|
|||
background: var(--whitegrey-l2);
|
||||
}
|
||||
|
||||
.gh-list-data-date {
|
||||
font-weight: 500;
|
||||
font-size: 1.3rem;
|
||||
color: var(--midlightgrey);
|
||||
}
|
||||
|
||||
.gh-list-data.align-right,
|
||||
.gh-list-cell.align-right {
|
||||
text-align: right;
|
||||
|
|
|
|||
|
|
@ -714,15 +714,15 @@ Dashboard List */
|
|||
}
|
||||
|
||||
.gh-dashboard-list-subtext > a {
|
||||
color: var(--black);
|
||||
font-weight: 600;
|
||||
color: var(--darkgrey);
|
||||
}
|
||||
|
||||
.gh-dashboard-list-item svg {
|
||||
width: 20px;
|
||||
min-width: 20px;
|
||||
height: 20px;
|
||||
margin: 0 0.5rem 0 -4px;
|
||||
width: 24px;
|
||||
min-width: 24px;
|
||||
height: 24px;
|
||||
margin: 0 0.5rem 0 -2px;
|
||||
}
|
||||
|
||||
.gh-dashboard-list-item-sub {
|
||||
|
|
@ -1103,6 +1103,12 @@ Dashboard Recent Activity */
|
|||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.gh-dashboard-list-item-date > .gh-dashboard-list-subtext {
|
||||
font-weight: 500;
|
||||
font-size: 1.3rem;
|
||||
color: var(--midlightgrey);
|
||||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
Dashboard Recents */
|
||||
|
|
@ -1189,7 +1195,7 @@ Dashboard Recents */
|
|||
|
||||
.gh-dashboard-recents-activity .gh-dashboard-list-header,
|
||||
.gh-dashboard-recents-activity .gh-dashboard-list-item {
|
||||
grid-template-columns: 30% 40% 30%;
|
||||
grid-template-columns: 30% 55% 15%;
|
||||
}
|
||||
|
||||
.gh-dashboard-recents-activity .gh-dashboard-list-title:nth-child(2),
|
||||
|
|
|
|||
|
|
@ -125,16 +125,23 @@
|
|||
|
||||
.gh-members-activity-description {
|
||||
display: block;
|
||||
color: var(--middarkgrey);
|
||||
font-weight: 500;
|
||||
font-size: 1.4rem;
|
||||
color: var(--middarkgrey);
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.gh-members-activity-description a {
|
||||
font-weight: 600;
|
||||
color: var(--darkgrey);
|
||||
}
|
||||
|
||||
.gh-members-activity-icon {
|
||||
width: 24px;
|
||||
min-width: 24px;
|
||||
height: 24px;
|
||||
margin: 0 0.75rem 0 0;
|
||||
margin: 0 0.5rem 0 -2px;
|
||||
}
|
||||
|
||||
.gh-members-activity-single .gh-members-activity-icon {
|
||||
|
|
|
|||
|
|
@ -1060,7 +1060,7 @@ textarea.gh-member-details-textarea {
|
|||
|
||||
.gh-member-feed {
|
||||
margin: 0;
|
||||
padding: 16px 20px;
|
||||
padding: 20px;
|
||||
background: var(--white);
|
||||
box-shadow: 0 1px 4px -1px rgba(0,0,0,0.1);
|
||||
border-radius: 3px;
|
||||
|
|
@ -1143,6 +1143,7 @@ textarea.gh-member-details-textarea {
|
|||
display: flex;
|
||||
flex-grow: 1;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
|
|
@ -1178,7 +1179,7 @@ textarea.gh-member-details-textarea {
|
|||
flex-shrink: 0;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-right: 1rem;
|
||||
margin: 0 0.5rem 0 -1px;
|
||||
}
|
||||
|
||||
.gh-member-feed-icon svg {
|
||||
|
|
@ -1187,14 +1188,15 @@ textarea.gh-member-details-textarea {
|
|||
}
|
||||
|
||||
.gh-member-settings .gh-members-activity-description {
|
||||
color: var(--darkgrey-l1);
|
||||
font-weight: 400;
|
||||
font-weight: 500;
|
||||
font-size: 1.4rem;
|
||||
color: var(--middarkgrey);
|
||||
}
|
||||
|
||||
.gh-member-feed-time {
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
color: var(--midgrey);
|
||||
font-weight: 500;
|
||||
font-size: 1.3rem;
|
||||
color: var(--midlightgrey);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
|
|
@ -1202,6 +1204,15 @@ textarea.gh-member-details-textarea {
|
|||
padding-top: 16px;
|
||||
}
|
||||
|
||||
.gh-member-feed-footer a {
|
||||
font-weight: 500;
|
||||
transition: color 100ms ease;
|
||||
}
|
||||
|
||||
.gh-member-feed-footer a:hover {
|
||||
color: #269a34;
|
||||
}
|
||||
|
||||
|
||||
/* Import modal
|
||||
/* ---------------------------------------------------------- */
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue