buttercake
Version:
Butter Cake is an open source and lightweight modular toolkit for developing with HTML, CSS, and JS. Quickly prototype your ideas or build your entire app with our Sass(SCSS) variables and mixins, responsive grid system, extensive prebuilt components.
84 lines (63 loc) • 2.64 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Butter Cake v4.0.0 - Starter Kit</title>
<!-- FONT AWESOME 4.7.0 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- BUTTER CAKE CSS 4.0.0 -->
<link rel="stylesheet" href="dist/css/butterCake.min.css">
</head>
<body>
<!-- NAVBAR -->
<nav class="navbar expand-md default-nav bg-primary">
<div class="container">
<!-- LOGO -->
<div class="brand">
<a href="#">Butter Cake</a>
</div>
<!-- NAVBAR MENU-->
<div class="menu-box" id="mainNav">
<!-- CLOSE BUTTON | MOBILE-->
<div class="menu-close"><i class="fa fa-close"></i></div>
<!-- MENU -->
<ul class="menu ml-auto">
<li class="nav-item active"><a href="#" class="nav-link">Home</a></li>
<!-- DROPDOWN MENU -->
<li class="nav-item dropdown">
<a href="#" class="nav-link">Services</a>
<ul class="dropdown-menu">
<li><a href="">Service 01</a></li>
<li><a href="">Service 02</a></li>
<li><a href="">Service 03</a></li>
<li><a href="">Service 04</a></li>
<li><a href="">Service 05</a></li>
</ul>
</li>
<li class="nav-item"><a href="#" class="nav-link">Portfolio</a></li>
<li class="nav-item"><a href="#" class="nav-link">About</a></li>
<li class="nav-item"><a href="#" class="nav-link">Contact</a></li>
</ul>
</div>
<!-- TOGGLER | MOBILE -->
<button class="toggler bg-secondary text-white " data-nav="#mainNav"><i class="fa fa-bars"></i></button>
</div>
</nav>
<!-- HERO BANNER -->
<section class="main-hero">
<div class="jumbotron fluid">
<div class="container text-center">
<h1 class="display-4 weight-100 text-primary"><b>Butter Cake</b> Starter Kit</h1>
<h4>A Modern CSS framework built with flexbox</h4>
<a href="https://getbuttercake.com/?ref=starterKit" target="_blank" class="btn primary btn-lg mt-1">Get Started</a>
</div>
</div>
</section>
<!-- JQUERY 3.3.1 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- BUTTER CAKE JS 4.0.0 -->
<script src="dist/js/butterCake.min.js"></script>
</body>
</html>