fixes: U4-10665 7.8 - Log info on two lines is a bit off

This commit is contained in:
Mads Rasmussen
2017-11-14 15:57:13 +01:00
parent 3e5744dbb7
commit 31f6bd4c02
3 changed files with 27 additions and 71 deletions

View File

@@ -111,6 +111,7 @@
item.logTypeColor = "success";
break;
case "UnPublish":
case "Delete":
item.logTypeColor = "danger";
break;
default:

View File

@@ -60,21 +60,29 @@
//------------------- HISTORY ------------------
.history {
position: relative;
}
.history-line {
width: 2px;
height: 24px;
height: 100%;
margin: 0 0 0 14px;
background-color: @gray-8;
position: absolute;
z-index: 0;
}
.history-row {
.history-item {
display: flex;
align-items: center;
margin-bottom: 24px;
position: relative;
z-index: 1;
}
.history-item__avatar{
min-width: 30px;
.history-item__avatar {
margin-right: 7px;
}
.history-item__date {
@@ -82,74 +90,18 @@
color: @gray-5;
}
.name-date-container {
margin: 0 30px 0 7px;
height: 30px;
min-width: 170px;
}
.last-history-item .history-line {
display: none;
}
//--------- META DATA --------
.meta-data-section {
display: flex;
flex-direction: column;
}
.meta-data-title {
font-size: 15px;
color: @black;
font-weight: bold;
line-height: 20px;
}
.meta-data-description {
font-size: 13px;
color: @gray-5;
}
.meta-data {
font-size: 15px;
color: @gray-2;
line-height: 20px;
}
/* RESPONSIVE */
.history-item__break {
display: flex;
align-items: center;
min-width: 230px;
font-size: 14px;
}
@media (max-width: 979px) {
/* RESPONSIVE */
@media (min-width: 1101px) and (max-width: 1365px), (max-width: 979px) {
.history-row {
.history-item {
display: block;
padding: 10px 0;
}
.history-item__break {
padding: 7px 0;
}
.history-line {
display: none;
}
}
@media (max-width: 1535px) {
.history-line {
visibility: hidden;
}
}
@media (min-width: 1101px) and (max-width: 1365px) {
.history-row {
display: block;
padding: 10px 0;
}
.history-item__break {

View File

@@ -36,10 +36,13 @@
<localize key="content_noChanges"></localize>
</umb-empty-state>
</div>
<div class="history">
<div ng-if="auditTrail.length > 1" class="history-line"></div>
<div class="history-item" ng-repeat="item in auditTrail" ng-class="{'last-history-item': $last}">
<div class="history-row">
<div class="history-item" ng-repeat="item in auditTrail">
<div class="history-item__break">
<div class="history-item__avatar">
<umb-avatar
@@ -51,7 +54,7 @@
</umb-avatar>
</div>
<div class="name-date-container">
<div>
<div>{{ item.userName }}</div>
<div class="history-item__date">{{item.timestampFormatted}}</div>
</div>
@@ -59,14 +62,14 @@
<div class="history-item__break">
<umb-badge
size="s"
size="xs"
color="{{item.logTypeColor}}">
{{ item.logType }}
</umb-badge>
<span>{{ item.comment }}</span>
</div>
</div>
<div class="history-line"></div>
</div>
</div>