rc-base-zf
Version:
Base Foundation6
190 lines (163 loc) • 11.6 kB
HTML
<html class="no-js" lang="en-US">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>RedCastor Base Foundation6.</title>
<link type="text/css" rel="stylesheet" href="../dist/rc-base-zf.css"/>
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous">
</script>
<script type="text/javascript" src="../dist/rc-base-zf.js"></script>
</head>
<body class="sidebar-primary">
<!--[if lt IE 10]>
<div class="alert alert-warning browserupgrade">
You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.
</div>
<![endif]-->
<div id="app_root" >
<header class="header-main">
<div class="grid-x">
<div class="cell small-12">
<div class="text-center">
<h1 class="page-header">RC-BASE-ZF</h1>
<h3>RedCastor Base Foundation6</h3>
<a class="button large hollow default" href="https://github.com/RedCastor/rc-base-zf"><i class="fa fa-github"></i> View on GitHub</a>
<a class="button large hollow default" href="https://github.com/RedCastor/rc-base-zf/releases"><i class="fa fa-download"></i> Download</a>
<hr>
</div>
</div>
</div>
</header>
<div class="wrap wrap-main" role="document">
<div class="content" id="main">
<header class="main-header">
<h1 class="text-center">THIS IS THE MAIN HEADER</h1>
<!-- Dropdown Menu -->
<ul class="dropdown menu align-center" data-dropdown-menu>
<li>
<a href="#">Item 1</a>
<ul class="menu">
<li><a href="#"><i class="fi fi-diamond"></i> Item 1A</a></li>
<li><a href="#">Item 1B</a></li>
<li><a href="#">Item 1C</a>
<ul class="menu">
<li><a href="#">Item 1A-1</a></li>
<li><a href="#">Item 1B-2</a></li>
<li><a href="#">Item 1C-3</a></li>
</ul>
</li>
<li><a href="#">Item 1D</a></li>
</ul>
</li>
<li><a href="#">Item 2</a></li>
<li class="is-active"><a href="#">Item 3</a></li>
<li><a href="#">Item 4</a></li>
</ul>
<!-- End menu -->
</header>
<div class="main-container">
<div class="main-grid">
<main id="main_element" class="main" role="main">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<div class="checkbox">
<input type="checkbox" id="checkbox1">
<label for="checkbox1">
Check me out
</label>
</div>
<div class="grid-container medium-collapse large-uncollapse">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
<div>
<div class="search-form">
<button type="button" class="search-submit">Search submit</button>
</div>
<div class="buttons">
<button type="button" class="button-link">Button Link</button>
<a class="button-link">Button Link</a>
<button type="button" class="button-link" disabled="disabled">Button Link Disabled</button>
<a class="button-link" disabled="disabled">Button Link Disabled</a>
</div>
</div>
<div class="elementor">
<h5 class="h5 text-underline">Elementor Buttons</h5>
<span class="elementor-element">
<button type="button" class="elementor-button">Primary <i class="fi" data-webicon="fi:angle-right" data-alt=""></i></button>
</span>
<span class="elementor-element elementor-button-success">
<button type="button" class="elementor-button">Success</button>
</span>
<span class="elementor-element elementor-button-warning">
<button type="button" class="elementor-button">Warning</button>
</span>
<span class="elementor-element elementor-button-danger">
<button type="button" class="elementor-button">Alert</button>
</span>
<span class="elementor-element elementor-button-info">
<button type="button" class="elementor-button">Info</button>
</span>
</div>
<div class="grid-container">
<span class="badge hollow">1</span>
<span class="badge hollow square">1</span>
<span class="badge hollow square primary">1</span>
<span class="badge hollow square secondary">2</span>
<span class="badge hollow success">3</span>
<span class="badge hollow alert">A</span>
<span class="badge hollow warning">B</span>
</div>
<div class="grid-container">
<span class="badge">1</span>
<span class="badge square">1</span>
<span class="badge square primary">1</span>
<span class="badge square secondary">2</span>
<span class="badge success">3</span>
<span class="badge alert">A</span>
<span class="badge warning">B</span>
</div>
<div class="product-attribute attribute-pa_tailles" ng-class="['attribute-' + attribute.slug]" ng-repeat="attribute in item.attributes">
<span class="badge hollow attribute-term disable" ng-class="{'disable' : !term.available}" ng-repeat="term in attribute.options">S</span>
<span class="badge hollow attribute-term disable" ng-class="{'disable' : !term.available}" ng-repeat="term in attribute.options">M</span>
<span class="badge hollow attribute-term" ng-class="{'disable' : !term.available}" ng-repeat="term in attribute.options">L</span>
<span class="badge hollow attribute-term" ng-class="{'disable' : !term.available}" ng-repeat="term in attribute.options">XL</span>
</div>
<div class="product-attribute attribute-pa_tailles" ng-class="['attribute-' + attribute.slug]" ng-repeat="attribute in item.attributes">
<span class="badge attribute-term disable" ng-class="{'disable' : !term.available}" ng-repeat="term in attribute.options">S</span>
<span class="badge attribute-term disable" ng-class="{'disable' : !term.available}" ng-repeat="term in attribute.options">M</span>
<span class="badge attribute-term" ng-class="{'disable' : !term.available}" ng-repeat="term in attribute.options">L</span>
<span class="badge attribute-term" ng-class="{'disable' : !term.available}" ng-repeat="term in attribute.options">XL</span>
</div>
<div class="grid-container">
<div class="widget text-body-regular--h3 text-uppercase--h3">
<h3>Title Font</h3>
<p>Paragraph Font</p>
</div>
</div>
</main>
<aside class="sidebar">
<h5 class="h5 text-underline">Font Icons</h5>
<ul class="social-group ">
<li class="social-group-item "><a target="_blank" href="http://test.com"><i class="fi fi-pinterest-2"></i></a></li>
<li class="social-group-item "><a target="_blank" href="http://test.com"><i class="fi fi-linkedin"></i></a></li>
<li class="social-group-item "><a target="_blank" href="http://test.com"><i class="fi fi-like-solid"></i></a></li>
<li class="social-group-item "><a target="_blank" href="mailto:san@antonio.net"><i class="fi fi-envelope"></i></a></li>
</ul>
<h5 class="h5 text-underline">SVG Web Icons</h5>
<ul class="social-group ">
<li class="social-group-item "><a target="_blank" href="http://test.com"><i class="fi fi-2x" data-webicon="fi:pinterest-2" data-alt=""></i></a></li>
<li class="social-group-item "><a target="_blank" href="http://test.com"><i class="fi fi-2x" data-webicon="rc-base:linkedin" data-alt=""></i></a></li>
<li class="social-group-item "><a target="_blank" href="http://test.com"><i class="fi fi-2x" data-webicon="rc-base:like-solid" data-alt=""></i></a></li>
<li class="social-group-item "><a target="_blank" href="mailto:san@antonio.net"><i class="fi fi-2x" data-webicon="rc-base:envelope" data-alt=""></i></a></li>
</ul>
</aside>
</div>
</div>
</div>
</div>
</div>
</body>
</html>