black friday bar

 avatar
unknown
html
3 years ago
2.4 kB
5
Indexable
<div class="topbar" style="display:none;">
<div class="black-inner">
<p><strong>Black Weeks! przeWYPRZEDAŻ -69% na 4 Potężne kursy.</strong></p>
  <img src="http://gen.sendtric.com/countdown/ca34wk35e4" style="display: block;" />
<a href="https://theswitch.pl/produkt/black-friday-4-szkolenia-rozwojowe/" rel="noopener" class="black-btn">Sprawdź</a>
  <div class="close1"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="times" class="svg-inline--fa fa-times fa-w-11" role="img" viewBox="0 0 352 512"><path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"/></svg></div></div>
</div>


<style>
.topbar {
    display: block;
    position: fixed !important;
  bottom:0!important;
  left: 0 !important;
    background: #000;
    width: 100%;
    text-align: center;
    padding-top: 6px;
    padding-bottom: 9px;
    z-index: 99999999;
}

.topbar .black-inner {
  margin: 10px;
    font-family: 'Roboto';
}

.topbar .black-inner {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  position: relative;
}

.topbar p {
    color: #FFF;
    font-size: 25px;
    line-height: 1.5;
    font-weight: 600;
  font-weight: 900;
}

.topbar img {
  max-width: 240px;
  flex: 0 0;
}

.black-inner .black-btn {
    padding: 10px 15px;
    font-size: 23px;
    font-weight: 600;
    line-height: 14px !important;
    color: #fff;
  text-decoration: none;
  background: #f34a39;
  text-transform: uppercase;
font-family: 'Roboto';
  border-radius: 5px;
}

.close1 {
color: white;
    position: relative;
    top: -15px;
    right: -10px;
    opacity: 1;
    cursor: pointer;
    z-index: 999999999999999999999999;
}

.close1 svg {
  fill: white;
  width: 20px;
  height: 20px;
}
</style>




<script type="text/javascript"> 

jQuery(document).ready(function(){
    jQuery('.close1').on('click', function(event) {
        jQuery('.topbar').css('display', 'none');
   });
});

 </script>
Editor is loading...