MessageList Component

This commit is contained in:
reverend 2020-08-12 21:31:04 +02:00
parent 72c8febfc4
commit f0b3839e73
3 changed files with 30 additions and 0 deletions

View File

@ -0,0 +1,15 @@
.LP-MessageList{
padding: 25px;
.LP-MessageList__List{
padding: 0;
margin: 0;
list-style-type: none;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.LP-MessageList__Item{
margin: 5px 0;
}
}

View File

@ -0,0 +1,6 @@
{
"title": "Message List",
"context": {
"text": "At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."
}
}

View File

@ -0,0 +1,9 @@
<div class="LP-MessageList">
<ul class="LP-MessageList__List">
<li class="LP-MessageList__Item">{{> @message messageText=text modifier='--info'}}</li>
<li class="LP-MessageList__Item">{{> @message messageText=text modifier='--warning'}}</li>
<li class="LP-MessageList__Item">{{> @message messageText=text modifier='--error'}}</li>
<li class="LP-MessageList__Item">{{> @message messageText=text modifier='--success'}}</li>
<li class="LP-MessageList__Item">{{> @message messageText=text modifier='--debug'}}</li>
</ul>
</div>