JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
<div id="app-banner">
  <div id="app-banner-close">×</div>
  <span>Текст баннера текст баннера текст баннера текст баннера текст баннера</span>
</div>

<div>
  <p>Основной контент сайта</p>
</div>

CSS

#app-banner {
  display: none;
  position: relative;
  padding: 10px;
  margin-bottom: 10px;
  color: #31708f;
  background-color: #d9edf7;
  border-color: #31708f;
}

#app-banner-close {
  position: absolute;
  top: 5px;
  right: 5px;
  cursor: pointer;
}

JavaScript

$(document).ready( function() {
    if ( ! $.cookie('app-banner-closed') ) $('#app-banner').show();
    
    $('#app-banner-close').click( function(e) {
        e.preventDefault();
        $.cookie('app-banner-closed', '1', { expires: 7, path: '/' });
        $('#app-banner').fadeOut( 500, function() {
            $(this).remove();
        });
    });
});