Skip to content

Instantly share code, notes, and snippets.

@mamarilmanson

mamarilmanson/app.html

Last active September 16, 2016 00:29
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mamarilmanson/4c3d9ca52c3cc745ee1aff0269b53f9b to your computer and use it in GitHub Desktop.
Save mamarilmanson/4c3d9ca52c3cc745ee1aff0269b53f9b to your computer and use it in GitHub Desktop.
Download ZIP
Please don't mind the Bootstrap classes... I'm in the process of migrating to foundation... :)
Raw
app.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>AX Metrix Desktop</title>
<!-- <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap-theme.min.css"/>
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css"/> -->
<link rel="stylesheet" type="text/css" href="fontawesome/css/font-awesome.min.css"/>
<link rel="stylesheet" type="text/css" href="foundation/css/foundation.min.css"/>
<link rel="stylesheet" type="text/css" href="foundation/css/app.css"/>
</head>
<body>
<div class="row full-height full-width" id="main-content"></div>
<script>
window.$ = window.jQuery = require('./foundation/js/vendor/jquery.js');
</script>
<script type="text/javascript" src="foundation/js/vendor/what-input.js"></script>
<script type="text/javascript" src="foundation/js/vendor/foundation.js"></script>
<script type="text/javascript" src="foundation/js/app.js"></script>
<script type="text/javascript" src="app.js"></script>
</body>
</html>
Raw
main.html
<div class="small-2 medium-3 large-3 columns full-height menu-bar">
<div class="list-group fixedgroup">
<div class="list-group-item" style="list-style-type: none">
<li>
<span id="lt-username"></span>
</li>
<li>
<span id="lt-userposition"></span>
</li>
</div>
<button type="button" id="dashboard" class="list-group-item hidden-xs lt-menu">Dashboard</button>
<button type="button" id="settings" class="list-group-item hidden-xs lt-menu"><i class="fa fa-cog" aria-hidden="true" style="color: white"></i>Settings</button>
<button type="button" id="logout" class="list-group-item hidden-xs lt-menu"><i class="fa fa-power-off" aria-hidden="true" style="color: white"></i>Logout</button>
</div>
</div>
<!-- <div class="small-10 medium-9 large-9 full-height container-fluid" id="right-window"></div> -->
<div class="small-10 medium-9 large-9 columns full-height" id="right-window"></div>
<script type="text/javascript" src="app/js/main.js"></script>
Raw
settings.html
// THIS IS A COPY FROM THE DOCS TO TEST IF IS WORKING WITH BASIC MARKUP
// AND THIS FILE IS LOADED VIA JQUERY INTO #right-window INSIDE THE FILE BELOW main.html
<div class="row collapse">
<div class="medium-3 columns">
<ul class="tabs vertical" id="example-vert-tabs" data-tabs>
<li class="tabs-title is-active"><a href="#panel1v" aria-selected="true">Tab 1</a></li>
<li class="tabs-title"><a href="#panel2v">Tab 2</a></li>
<li class="tabs-title"><a href="#panel3v">Tab 3</a></li>
<li class="tabs-title"><a href="#panel4v">Tab 4</a></li>
<li class="tabs-title"><a href="#panel5v">Tab 5</a></li>
<li class="tabs-title"><a href="#panel6v">Tab 6</a></li>
</ul>
</div>
<div class="medium-9 columns">
<div class="tabs-content vertical" data-tabs-content="example-vert-tabs">
<div class="tabs-panel is-active" id="panel1v">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
<div class="tabs-panel" id="panel2v">
<p>Vivamus hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus rhoncus ut eleifend nibh porttitor. Ut in nulla enim. Phasellus molestie magna non est bibendum non venenatis nisl tempor. Suspendisse dictum feugiat nisl ut dapibus.</p>
</div>
<div class="tabs-panel" id="panel3v">
<img class="thumbnail" src="assets/img/generic/rectangle-3.jpg">
</div>
<div class="tabs-panel" id="panel4v">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
<div class="tabs-panel" id="panel5v">
<p>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 class="tabs-panel" id="panel6v">
<img class="thumbnail" src="assets/img/generic/rectangle-5.jpg">
</div>
</div>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment