woodpecker/server/app/styles/modules/list-activity.less

.activity-list {

}

.activity-item {
	display:block;
	position: relative;
	margin-bottom:20px;
	border:1px solid @border-light;
	padding:20px;
	text-decoration:none;
}

.activity-item h2 {
	color: @darker;
	font-size:18px;
	margin-bottom: 10px;
}

.activity-item p {
	.text-overflow();
	margin: 0px;
	margin-bottom: 2px;
	max-width: 100%;
	color: #999;
}

.activity-sha,
.activity-branch,
.activity-date {
	color: #999;
}


.activity-branch:before,
.activity-date:before {
	content: '\2022';
	opacity: 0.5;
	margin-left: 5px;
	margin-right: 5px;
}

.activity-item img {
	border-radius:@circle;
	width:32px;
	height:32px;
	margin-left:15px;
}

.activity-item .fa {
	float: right;
	width: 48px;
	height: 48px;
	font-size: 36px;
	line-height: 74px;
	vertical-align: middle;
	&:before{
		display: inline-block;
	}
}


.activity-item-Success .fa {
	color: @green;
}

.activity-item-Error,
.activity-item-Failure, 
.activity-item-Killed {
	border:1px solid @red-border;
	background: @red-background;
	color: @red;

	p, span {
		color: @red-text-light;
	}
	h2 span {
		color: @red-text;
	}
}




.activity-item {
	&:after {
		font-family: 'FontAwesome';
		font-size:22px;
		min-width:32px;
		display:inline-block;
		text-align:center;

		margin-left: 30px;
		margin-top: 20px;
		font-size: 32px;
	}

	&[data-status="Success"]:after {
		color: @green;
		content: "\f00c";
	}

	&[data-status="Error"],
	&[data-status="Failure"],
	&[data-status="Killed"] {
		border:1px solid @red-border;
		background: @red-background;
		color: @red;

		p, span {
			color: @red-text-light;
		}
		h2 {
			color: @red-text;
		}

		&:after {
			color: @red;
			content: "\f00d";
		}
	}
}