Skip to content
This repository has been archived by the owner on Jan 22, 2024. It is now read-only.

Commit

Permalink
Release 1.1.0 - topbar updates and mobile nav
Browse files Browse the repository at this point in the history
  • Loading branch information
Steven Morrison committed Feb 12, 2016
1 parent 005b36d commit cefd063
Show file tree
Hide file tree
Showing 11 changed files with 75 additions and 36 deletions.
4 changes: 2 additions & 2 deletions Jolt/css/global.css
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
/* --------------------------------------------------------
Jolt Global CSS File
Version: 1.0.1
Author: Steven Morrison
Version: 1.1.0
Author: Steven Morrison
Website: jolt.zaffri.com
GitHub: github.com/Zaffri
Expand Down
16 changes: 6 additions & 10 deletions Jolt/css/topbar.css
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
/* --------------------------------------------------------
Jolt Topbar CSS File
Version: 1.0.1
Author: Steven Morrison
Version: 1.1.0
Author: Steven Morrison
Website: jolt.zaffri.com
GitHub: github.com/Zaffri
Expand All @@ -18,17 +18,13 @@

#main-nav {
float: right;
width: 75%;
}

#main-nav ul {
width: 100%;
width: auto;
padding-right: 95px;
}

#main-nav ul li {
list-style: none;
display: inline-block;
width: 25%; /* Depending on number of links - 4 links = (100%/4) = 25 */
text-align: center;
position: relative;
}
Expand All @@ -51,7 +47,7 @@ html body #main-nav ul ul li {

#main-nav a {
width: 100%;
padding: 20px 0 20px 0;
padding: 20px;
display: inline-block;
}

Expand Down Expand Up @@ -82,7 +78,6 @@ html body #main-nav ul ul li {

#main-logo {
float: left;
width: 25%;
padding-left: 5%;
height: 100%;
}
Expand All @@ -103,6 +98,7 @@ html body #main-nav ul ul li {
float: none;
margin-top: 50px;
width: 100%;
padding-right: 0px;
}
#main-nav ul {
width: 100%;
Expand Down
2 changes: 1 addition & 1 deletion Jolt/css/topbar.min.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

20 changes: 17 additions & 3 deletions Jolt/js/topbar.js
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
/* --------------------------------------------------------
Jolt Topbar JavaScript File
Version: 1.0.1
Author: Steven Morrison
Version: 1.1.0
Author: Steven Morrison
Website: jolt.zaffri.com
GitHub: github.com/Zaffri
Expand Down Expand Up @@ -53,4 +53,18 @@ function topBar() {
// Update last scroll distance
distLast = dist;
};
};
};
/* --------------------------- [JavaScript burger nav collapse on click] --------------------------- */
// Mobile link elements
var mobileLinks = document.querySelectorAll('.mobile-li a');
var mobileLinksNum = mobileLinks.length;

// Loop through each mobil link and add event handler
for(var x=0; x<mobileLinksNum; x++) {

mobileLinks[x].onclick = function () {
// Uncheck checkbox
document.getElementById('mobile-checkbox').checked = false;
};

}
2 changes: 1 addition & 1 deletion Jolt/js/topbar.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

24 changes: 24 additions & 0 deletions Release-notes.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@

---- Jolt 1.1.0 ----

Update: #main-nav and logo area now have a width of auto by default, instead of percentage based.
Update: Mobile nav collapses/closes on link click.
Update: Updated demo templates with new burger styles.

--------------------



---- Jolt 1.0.1 ----

Patch: Global default font (oxygen) was not working on smalle devices.

--------------------



---- Jolt 1.0.0 ----

First Release.

--------------------
1 change: 0 additions & 1 deletion demos/css/global.min.css

This file was deleted.

1 change: 0 additions & 1 deletion demos/css/topbar.min.css

This file was deleted.

26 changes: 15 additions & 11 deletions demos/demo-basic.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />

<link rel="stylesheet" type="text/css" href="css/global.min.css" />
<link rel="stylesheet" type="text/css" href="css/topbar.min.css" />
<link rel="stylesheet" type="text/css" href="../jolt/css/global.css" />
<link rel="stylesheet" type="text/css" href="../jolt/css/topbar.css" />

<!-- Custom styles - embedded and inline styles only for demo purposes -->
<style type="text/css">
Expand Down Expand Up @@ -64,12 +64,16 @@
#dynamic #main-logo {
color: #30dae9;
}

#dynamic .burger-bar {
background: #fff;
}

</style>

</head>
<body>
<!--- Start of Topbar --->
<!-- Start of Topbar -->
<header id="header">
<div id="topbar">

Expand All @@ -96,17 +100,17 @@
<div class="clear"></div>
</div>
</header>
<!--- End of Topbar --->
<!-- End of Topbar -->

<!--- Start full page 1 --->
<!-- Start full page 1 -->
<section class="full-background vh-area" style="height: 100vh; background: #efefef;">

<h1 class="vh-content text-center">Center Test</h1>

</section>
<!--- End full Page 1 --->
<!-- End full Page 1 -->

<!--- Start full page 2 --->
<!-- Start full page 2 -->
<section class="full-background vh-area" style="height: 100vh; background: #ccc;">

<div class="vh-content text-center">
Expand All @@ -115,9 +119,9 @@ <h1 class="element-center">Another Test</h1>
</div>

</section>
<!--- End full page 2 --->
<!-- End full page 2 -->

<!--- Start cells 3 --->
<!-- Start cells 3 -->
<section class="full-background" style="min-height: 100vh; background: #efefef;padding:75px 0 75px 0;">

<div class="container-mid">
Expand All @@ -136,9 +140,9 @@ <h1 class="element-center">Another Test</h1>
</div>

</section>
<!--- End cells 3 --->
<!-- End cells 3 -->

<script src="js/topbar.min.js"></script>
<script src="../jolt/js/topbar.js"></script>
<script>topBar();</script>
</body>
</html>
14 changes: 9 additions & 5 deletions demos/demo-dropdowns.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />

<link rel="stylesheet" type="text/css" href="css/global.min.css" />
<link rel="stylesheet" type="text/css" href="css/topbar.min.css" />
<link rel="stylesheet" type="text/css" href="../jolt/css/global.css" />
<link rel="stylesheet" type="text/css" href="../jolt/css/topbar.css" />

<!-- Custom styles - embedded and inline styles only for demo purposes -->
<style type="text/css">
Expand Down Expand Up @@ -75,12 +75,16 @@
#dynamic #main-logo {
color: #30dae9;
}

#dynamic .burger-bar {
background: #fff;
}

</style>

</head>
<body>
<!--- Start of Topbar --->
<!-- Start of Topbar -->
<header id="header">
<div id="topbar">

Expand Down Expand Up @@ -118,7 +122,7 @@
<div class="clear"></div>
</div>
</header>
<!--- End of Topbar --->
<!-- End of Topbar -->

<section class="full-background vh-area" style="height: 100vh; background: #efefef;">

Expand Down Expand Up @@ -150,7 +154,7 @@ <h1 style="background: #ccc; width: 200px;height: 200px;" class="element-center"

</section>

<script src="js/topbar.min.js"></script>
<script src="../jolt/js/topbar.js"></script>
<script>topBar();</script>
</body>
</html>
1 change: 0 additions & 1 deletion demos/js/topbar.min.js

This file was deleted.

0 comments on commit cefd063

Please sign in to comment.