Lorem ipsum is a pseudo-Latin text used in web design, typography, layout, and printing in place of English to emphasis design elements over content. It's also called placeholder (or filler) text.
Description: Information panel with auto played LivIcon.
Requires: Bootstrap 3.X for basic grid, buttons, text, etc. styles.
WordPress Note: This example may require theme files customization or using a page builder (composer) at your own. See on it as a starting point.
Important: LivIcons data-options
are set to different from these defaults only! If you have another set of the default options please use a full notation of them which you can get from the Configuration tool
<!-- Info Panel 01 --> <div class="container"> <div class="row"> <div class="col-md-12"> <div class="info-panel-01"> <h6 class="text-uppercase"> <div class="livicon-evo" data-options=" name: info-alt.svg; style: lines; size: 40px; strokeColor: #5893DD; strokeWidth: 2; autoPlay: true; duration: 2; repeat: loop; repeatDelay: 1; eventOn: none; drawOnViewport: true "></div> Information </h6> <h3>LivIcons Evolution is a jQuery Plugin</h3> <p>Lorem ipsum is a pseudo-Latin text used in web design, typography, layout, and printing in place of English to emphasis design elements over content. It's also called placeholder (or filler) text.</p> </div> </div> </div> </div>
/*********** Info Panel 01 ***********/ .info-panel-01 { padding: 40px 40px 30px; margin: 20px 0; background-color: #fafafa; border-left: 5px solid #5893DD; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); } .info-panel-01 .livicon-evo { display: block; float: left; margin-right: 10px; margin-left: -3px; margin-top: -13px; opacity: 0.3; } .info-panel-01 h6 { font-weight: 900; } .info-panel-01 h6:after { clear: both; } .info-panel-01 h3 { font-weight: 300; margin-top: 30px; margin-bottom: 15px; } .info-panel-01 p { font-weight: 300; font-size: 16px; line-height: 1.5; }