Message for Minimal-ui CSS framework based on Flexbox

Standart Message:

Standart Message is here

Standart

Primary Message is here

Primary

Success Message is here

Success

Danger Message is here

Danger

Warning Message is here

Warning

Example:

    
<div class="ui-message" id="exampleMessage"><span class="message-title">Standart Message is here</span></div>
<div class="button button-light" id="exampleMessageBtn">Standart</div>

<div class="ui-message ui-message--primary" id="exampleMessage2"><span class="message-title">Primary Message is here</span></div>
<div class="button button-primary" id="exampleMessageBtn2">Primary</div>

<div class="ui-message ui-message--success" id="exampleMessage3"><span class="message-title">Success Message is here</span></div>
<div class="button button-success" id="exampleMessageBtn3">Success</div>

<div class="ui-message ui-message--danger" id="exampleMessage4"><span class="message-title">Danger Message is here</span></div>
<div class="button button-danger" id="exampleMessageBtn4">Danger</div>

<div class="ui-message ui-message--warning" id="exampleMessage5"><span class="message-title">Warning Message is here</span></div>
<div class="button button-warning" id="exampleMessageBtn5">Warning</div>


<script type="text/javascript">
  showMessage('#exampleMessage', '#exampleMessageBtn')
  showMessage('#exampleMessage2', '#exampleMessageBtn2')
  showMessage('#exampleMessage3', '#exampleMessageBtn3')
  showMessage('#exampleMessage4', '#exampleMessageBtn4')
  showMessage('#exampleMessage5', '#exampleMessageBtn5')

  // Only Message without button
  //- showMessage('#exampleMessage2')
</script>