bit more responsive + changed the colors to variables in less

This commit is contained in:
Zsolt
2017-09-01 15:09:53 +02:00
parent 39c19dc1d4
commit 7b34211bb1
3 changed files with 66 additions and 51 deletions

View File

@@ -17,6 +17,7 @@
$scope.page.buttonGroupState = "init";
$scope.allowOpen = true;
function init(content) {
$scope.auditTrail = [
@@ -384,14 +385,8 @@
alert("go to page" + pageNumber);
};
$scope.openTemplate = function(template) {
alert("you opened template");
console.log("this is not the doctype");
};
$scope.openDocType = function(docType) {
alert("you opened docType");
console.log("this is not the template");
console.log("doctype has been clicked");
};
$scope.updateTemplate = function(templateAlias) {

View File

@@ -1,11 +1,10 @@
//----- SCHEDULED PUBLISH ------
.place-holder {
height: 60px;
width: 60px;
margin: 15px auto;
background-color: grey;
background-color: @gray-8;
}
.date-wrapper {
@@ -21,26 +20,27 @@
.date-wrapper__number{
font-size: 48px;
line-height: 50px;
color: #2e2e32;
color: @gray-2;
font-weight: 900;
}
.date-wrapper__title {
font-size: 16px;
font-weight: 700;
color: #514f53;
color: @gray-3;
margin: 0 0 15px 0;
}
.date-wrapper__date{
font-size: 13px;
color: #a2a0a5;
color: @gray-6;
margin: 0;
}
.date-container h4{
.data-wrapper__add{
font-size: 18px;
color: #d7d6d8;
line-height: 10px;
color: @gray-8;
font-weight: 900;
margin: 0;
}
@@ -49,7 +49,7 @@
height: 120px;
margin: 15px 0 0 0;
width: 2px;
background-color: #d7d6d8;
background-color: @gray-8;
}
//--------- HISTORY ----------
@@ -59,7 +59,7 @@
width: 2px;
height: 24px;
margin: 0 0 0 14px;
background-color: #d7d6d8;
background-color: @gray-8;
}
.history-row {
@@ -72,8 +72,8 @@
}
.history-item__date {
font-size: 13px;;
color: #817f85;
font-size: 13px;
color: @gray-5;
}
.name-date-container {
@@ -81,24 +81,10 @@
height: 30px;
}
.history-indicator__publish {
padding: 7px;
height: 14px;
background-color: #eafff5;
border: 1px solid #35c685;
}
.last-history-item .history-line {
display: none;
}
/* pagination */
.umb-box-content .umb-pagination ul {
float: none;
display: inline;
margin: 0 auto;
}
//--------- META DATA --------
.meta-data-section {
display: flex;
@@ -107,20 +93,40 @@
.meta-data-title {
font-size: 15px;
color: #000;
color: @black;
font-weight: bold;
line-height: 20px;
}
.meta-data-description {
font-size: 13px;
color: #817f85;
color: @gray-5;
}
.meta-data {
font-size: 15px;
color: #303033;
color: @gray-2;
line-height: 20px;
}
//----------- LINKS ----------
/* RESPONSIVE */
.history-item__break {
display: flex;
align-items: center;
}
@media (max-width: 979px) {
.history-row {
display: block;
padding: 10px 0;
}
.history-item__break {
padding: 7px 0;
}
.history-line {
display: none;
}
}

View File

@@ -46,23 +46,33 @@
<div ng-if="!loadingAuditTrail">
<div class="history-item" ng-repeat="item in auditTrail" ng-class="{'last-history-item': $last}">
<div class="history-row">
<umb-avatar
color="secondary"
size="xs"
name="{{item.user.name}}"
img-src="{{item.user.avatars[3]}}"
img-srcset="{{item.user.avatars[4]}} 2x, {{item.user.avatars[4]}} 3x">
</umb-avatar>
<div class="name-date-container">
<span>{{ item.user.name }}</span>
<span class="date">{{ item.date }}</span>
<div class="history-item__break">
<div class="history-item__avatar">
<umb-avatar
color="secondary"
size="xs"
name="{{item.user.name}}"
img-src="{{item.user.avatars[3]}}"
img-srcset="{{item.user.avatars[4]}} 2x, {{item.user.avatars[4]}} 3x">
</umb-avatar>
</div>
<div class="name-date-container">
<div>{{ item.user.name }}</div>
<div class="history-item__date">{{ item.date }}</div>
</div>
</div>
<div class="history-item__break">
<umb-badge
size="s"
color="{{item.actionColor}}">
{{ item.action }}
</umb-badge>
<span>{{ item.description }}</span>
<span>{{ item.description }}</span>
</div>
</div>
<div class="history-line"></div>
</div>
@@ -98,10 +108,10 @@
<div class="date-container">
<div class="date-wrapper__title">Unpublish date</div>
<div class="place-holder"></div>
<h4>ADD DATE</h4>
<div class="data-wrapper__add">ADD</div>
</div>
</div>
</umb-box-content>
</umb-box-content>
</umb-box>
<umb-box>
<umb-box-header title="Meta data"></umb-box-header>
@@ -128,7 +138,7 @@
<umb-control-group label="{{ idSection.name }}">
<div>{{ content.id }}</div>
<small class="muted">{{ content.key }}</small>
<small>{{ content.key }}</small>
</umb-control-group>
</umb-box-content>
</umb-box>
@@ -165,7 +175,11 @@
</umb-editor-footer-content-left>
<umb-editor-footer-content-right>
<umb-editor-footer-content-right>
<span ng-if="content.removeDate != null && content.releaseDate != null">Publish and unpublish date: <i class="icon-calendar"></i>{{ content.releaseDate }} and {{ content.removeDate }}</span>
<span ng-if="content.removeDate == null && content.releaseDate != null">Publish date only: <i class="icon-calendar"></i> {{ content.releaseDate }}</span>
<span ng-if="content.removeDate != null && content.releaseDate == null">Remove date only: <i class="icon-calendar"></i> {{ content.removeDate }}</span>
<umb-button
ng-if="page.listViewPath"