Skip to content

Commit

Permalink
Reconfiged Navbars
Browse files Browse the repository at this point in the history
  • Loading branch information
@nathaniel-fargo
nathaniel-fargo committed Apr 11, 2019
1 parent 631499b commit bc94f35
Show file tree
Hide file tree
Showing 15 changed files with 96 additions and 389 deletions.
40 changes: 4 additions & 36 deletions 404.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,38 +9,7 @@
</head>
<body>

<<!-- Navbar -->
<nav class="navbar fixed-top navbar-expand-sm navbar-dark bg-coolblue">
<div class="container">
<a class="navbar-brand pl-2" href="/">
<img src="/assets/images/brandlogo.png" width="30" height="30" class="d-none d-sm-inline-block align-top mr-1" id="brandIcon">
Paradox Programming
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarContent" aria-controls="navbarContent" aria-expanded="false" aria-label="Toggle navbar">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="/">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="/p/about">About</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="/p/games" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Games</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="/p/games/unity">Unity Games</a>
<a class="dropdown-item" href="/p/games/javascript">Javascript Games</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="/p/youtube">Youtube</a>
</li>
</ul>
</div>
</div>
</nav>
<div id="navbar"></div>

<!-- 404 Message -->
<div class="container-fluid text-center p-3 bg-dark text-light" style="height:100%">
Expand All @@ -55,10 +24,9 @@ <h1 class="display-1 text-warning">File not found</h1>
</div>
</div>

<!-- Bootstrap JS and Dependencies -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

<!-- JS -->
<script>var active = "";</script>
<script src="/js/master.js"></script>
</body>
</html>
2 changes: 1 addition & 1 deletion css/master.css
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/* Bootstrap */
@import url("https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css");
@import url("/assets/libraries/bootstrap/css/bootstrap.min.css");
/* Navbar Font, from Google Fonts */
@import url("https://fonts.googleapis.com/css?family=ZCOOL+QingKe+HuangYou");
/* Font Awesome */
Expand Down
40 changes: 4 additions & 36 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,38 +15,7 @@
</head>
<body>

<!-- Navbar -->
<nav class="navbar fixed-top navbar-expand-sm navbar-dark bg-coolblue">
<div class="container">
<a class="navbar-brand pl-2" href="/">
<img src="/assets/images/brandlogo.png" width="30" height="30" class="d-none d-sm-inline-block align-top mr-1" id="brandIcon">
Paradox Programming
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarContent" aria-controls="navbarContent" aria-expanded="false" aria-label="Toggle navbar">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="/">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="/p/about">About</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="/p/games" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Games</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="/p/games/unity">Unity Games</a>
<a class="dropdown-item" href="/p/games/javascript">Javascript Games</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="/p/youtube">Youtube</a>
</li>
</ul>
</div>
</div>
</nav>
<div id="navbar"></div>

<!-- Image display -->
<header class="contianer-fluid">
Expand Down Expand Up @@ -75,9 +44,8 @@ <h3>What I'm up to</h3>
</div>
</footer>

<!-- Bootstrap JS and Dependencies -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<!-- JS -->
<script>var active = "home";</script>
<script src="/js/master.js"></script>
</body>
</html>
16 changes: 8 additions & 8 deletions js/master.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,18 +15,18 @@ function loadScript(url, callback) {
};
function doneLoading(){
var $nav = $('#navbar');
$nav.load("/html-templates/navcontents.html");
if(active){
console.log($("#"+active));
var $active = $("#"+active).addClass("active");
$active.addClass("active");
$active.children()
}
$nav.load("/html-templates/navcontents.html", function(){
if(active){
var $active = $('#' + active);
$active.addClass("active");
$active.children().append(' <span class="sr-only">(current)</span>');
}
});
};
function loadBootstrap(){
loadScript("/assets/libraries/bootstrap/js/bootstrap.min.js",doneLoading);
};
function loadPopper() {
loadScript("/assets/libraries/popper.min.js", loadBootstrap)
loadScript("/assets/libraries/popper.min.js", loadBootstrap);
};
loadScript("/assets/libraries/jquery-3.4.0.min.js", loadPopper);
44 changes: 6 additions & 38 deletions p/about/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,45 +10,13 @@
</head>
<body>

<!-- Navbar -->
<nav class="navbar fixed-top navbar-expand-sm navbar-dark bg-coolblue">
<div class="container">
<a class="navbar-brand pl-2" href="/">
<img src="/assets/images/brandlogo.png" width="30" height="30" class="d-none d-sm-inline-block align-top mr-1" id="brandIcon">
Paradox Programming
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarContent" aria-controls="navbarContent" aria-expanded="false" aria-label="Toggle navbar">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="/">Home</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="/p/about">About <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="/p/games" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Games</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="/p/games/unity">Unity Games</a>
<a class="dropdown-item" href="/p/games/javascript">Javascript Games</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="/p/youtube">Youtube</a>
</li>
</ul>
</div>
</div>
</nav>

<div id="navbar"></div>

<header class="contianer-fluid">
<img class="img-fluid" src="/assets/images/coding-bg-2.jpg">
</header>

<section mt-3>
<section class="mt-3">
<div class="container bg-white p-4 rounded">
<h1 class="ml-5">About Me</h1>
<p>
Expand All @@ -61,9 +29,9 @@ <h1 class="ml-5">About Me</h1>
</section>


<!-- Bootstrap JS and Dependencies -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script>
var active = "about";
</script>
<script src="/js/master.js"></script>
</body>
</html>
47 changes: 7 additions & 40 deletions p/about/site/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,57 +10,24 @@
</head>
<body>

<!-- Navbar -->
<nav class="navbar fixed-top navbar-expand-sm navbar-dark bg-coolblue">
<div class="container">
<a class="navbar-brand pl-2" href="/">
<img src="/assets/images/brandlogo.png" width="30" height="30" class="d-none d-sm-inline-block align-top mr-1" id="brandIcon">
Paradox Programming
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarContent" aria-controls="navbarContent" aria-expanded="false" aria-label="Toggle navbar">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/p/about">About <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="games" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Games</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="/p/games/unity">Unity Games</a>
<a class="dropdown-item" href="/p/games/javascript">Javascript Games</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="/p/youtube">Youtube</a>
</li>
</ul>
</div>
</div>
</nav>


<div id="navbar"></div>

<header class="contianer-fluid">
<img class="img-fluid" src="/assets/images/coding-bg-3.jpg" alt="/assets/images/coding-bg-1.jpg">
</header>

<section id="content">
<section class="mt-4">
<div class="container bg-white p-4 rounded">
<h1 class="ml-5">About this Site</h1>
<p>This site was set up 100% free. The domain was from <a href="https://freenom.com">Freenom</a>, where you can buy and manage domains, and <a href="https://netlify.com">Netlify</a> helped me manage the github repository to the domain, using some nameservers. I used bootstrap, jQuery, and Popper.js to make this site work, all free libraries.</p>
<a href="/">Home</a>
</div>
</section>


<!-- Bootstrap JS and Dependencies -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<!-- JS -->
<script>
var active = "about";
</script>
<script src="/js/master.js"></script>
</body>
</html>
47 changes: 8 additions & 39 deletions p/games/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,40 +11,8 @@
</head>
<body>

<!-- Navbar -->
<nav class="navbar fixed-top navbar-expand-sm navbar-dark bg-coolblue">
<div class="container">
<a class="navbar-brand pl-2" href="/">
<img src="/assets/images/brandlogo.png" width="30" height="30" class="d-none d-sm-inline-block align-top mr-1" id="brandIcon">
Paradox Programming
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarContent" aria-controls="navbarContent" aria-expanded="false" aria-label="Toggle navbar">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="/">Home</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="/p/about">About</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="/p/games" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Games <span class="sr-only">(current)</span>
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="/p/games/unity">Unity Games</a>
<a class="dropdown-item" href="/p/games/javascript">Javascript Games</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="/p/youtube">Youtube</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Navbar placeholder -->
<div id="navbar"></div>

<!-- Image display -->
<header class="contianer-fluid">
Expand All @@ -62,10 +30,11 @@ <h3>The games I put on this website are either made with unity, or javascript li
</div>
</section>

<!-- Bootstrap JS and Dependencies -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

<!-- JS -->
<script>
var active = "games";
</script>
<script src="/js/master.js"></script>

</body>
</html>
Loading

0 comments on commit bc94f35

Please sign in to comment.