Horizontal Static Layout with Icon
Horizontal Static with icon layout is useful for those users who don't wants menu options on top.
CSS Class
To use static layout for your project add
.horizontal-icon
class in body
tag.
js option
To use Compact Menu for your project add
themelayout: 'horizontal', FixedNavbarPosition: false, FixedHeaderPosition: false,
class in js.
HTML Markup
Use the following code to use Horizontal Static Layout with Icon in horizontal.
Usage:
$( document ).ready(function() {
$( "#pcoded" ).pcodedmenu({
themelayout: 'horizontal',
FixedNavbarPosition: false,
FixedHeaderPosition: false,
});
});
<!DOCTYPE html>
<html lang="en">
<head></head>
<body class="horizontal-icon">
<div class="card">
<div class="card-header">
<h5>Hello card</h5>
<span> Lorem ipsum dolor sit amet, consectetur adipisicing elit</span>
<div class="card-header-right">
<i class="icofont icofont-rounded-down"></i>
<i class="icofont icofont-refresh"></i>
<i class="icofont icofont-close-circled"></i>
</div>
</div>
<div class="card-block">
<p>
Enjoy flat-able With Horizontal Static Layout with Icon
</p>
</div>
</div>
</body>
</html>