DEV Community

Cover image for Get Lookover
Get Lookover
Get Lookover

Posted on • Edited on

Get Lookover

Get Lookover

Get Lookover is a new open source CSS framework.
We've add some new utilities in Get Lookover, and here is the full features:

Navigation Bar, Containers, Colors, Jumbotrons, Alerts, Margin, Padding, Display, Inputs, Forms Controls, Borders, Border's radius, Notes, Columns, Grids, Accordions, Spacers & Horizontal Lines, Tabs, Opacity, Typography, Z-index, Icons

N.B: We included Google Symbols for icons

Add Get Lookover's CSS link in the head tag :

 <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/get-lookover/cdn@v0.5/css/get-lookover.min.css"> 
Enter fullscreen mode Exit fullscreen mode

To use all Get Lookover's features add jQuery/get-lookover.js at the end of the body tag :

 <!-- jquery.js --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <!-- get-lookover.js --> <script src="https://cdn.jsdelivr.net/gh/get-lookover/cdn@v0.5/js/get-lookover.min.js"></script> 
Enter fullscreen mode Exit fullscreen mode

Here is a simple tutorial to add navigation bar :

 <!-- Centred Navbar --> <header class="navbar center-navbar bg-dark"> <h4 class="logo"><b>Brand</b></h4> <nav class="navbar-nav"> <ul class="navbar-links"> <li class="navbar-items"> <a class="navtab active">Home</a> </li> <li class="navbar-items"> <a class="navtab">Download</a> </li> <li class="navbar-items"> <a class="navtab">Docs</a> </li> <li class="navbar-items"> <a class="navtab">About</a> </li> </ul> </nav> <span class="navmenu">☰</span> </header> 
Enter fullscreen mode Exit fullscreen mode

The following picture showing different navigation bar ( left / center / right )

Get Lookover Navbar

Website : Get Lookover

Copyrights © Get Lookover™, 2022

Top comments (0)