blob: ba5eef02bfc60da0aaea3987f7a5e4aa8393c79f [file] [log] [blame]
<dom-module id="gr-checks-status">
<template>
<style>
:host {
display: inline-block;
}
i {
border-radius: 50%;
color: white;
display: inline-block;
font-style: normal;
height: 16px;
margin-right: 4px;
text-align: center;
width: 16px;
}
.successful > i {
background-color: #00C752;
}
.failed > i {
background-color: #DA4236;
}
.in-progress > i {
background-color: #ddd;
}
.unevaluated > i {
background-color: black;
}
</style>
<span class$="[[_className]]">
<template is="dom-if" if="[[_isUnevaluated(status)]]">
<i>&#x23F9;</i>
<template is="dom-if" if="[[showText]]">
<span>
Unevaluated
</span>
</template>
</template>
<template is="dom-if" if="[[_isInProgress(status)]]">
<i></i>
<template is="dom-if" if="[[showText]]">
<span>
In progress
</span>
</template>
</template>
<template is="dom-if" if="[[_isSuccessful(status)]]">
<i></i>
<template is="dom-if" if="[[showText]]">
<span>
Successful
</span>
</template>
</template>
<template is="dom-if" if="[[_isFailed(status)]]">
<i>!</i>
<template is="dom-if" if="[[showText]]">
<span>
Failed
</span>
</template>
</template>
</span>
</template>
<script src="gr-checks-all-statuses.js"></script>
<script src="gr-checks-status.js"></script>
</dom-module>