:star2: 9158 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Why isn't my navbar appearing on my website? I have reviewed my HTML, CSS AND JS and can't seem to identify the problem.
https://github.com/liamdocherty/liamdocherty.github.io
https://liamdocherty.github.io
HTML
<!-- Navigation bar -->
<nav class="navbar scrolled-nav navbar-expand-md fixed-top navbar-dark bg-dark">
<a class="navbar-brand" href="#">Front End Web Developer</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar7">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse justify-content-stretch" id="navbar7">
<ul class="navbar-nav ml-auto">
<li class="nav-item active"> <a class="nav-link" href="#home.html">Home</a>
</li>
<li class="nav-item active"> <a class="nav-link" href="#about.html">About</a>
</li>
<li class="nav-item active"> <a class="nav-link" href="#portfolio.html">Portfolio</a>
</li>
<li class="nav-item active"> <a class="nav-link" href="#about.html">Price</a>
</li>
<li class="nav-item active"> <a class="nav-link" href="#contact.html">Contact</a>
</li>
</ul>
</div>
</nav>
CSS
/*==================================
= navbar =
==================================*/
.navbar {
display: none;
background-color: #f7f7f7;
}
nav ul li a {
font-family: Montserrat, Helvetica, Arial, sans-serif;
text-transform: uppercase;
color: #000;
}
nav ul li:after {
text-decoration: underline;
color: #000;
}
.navbar-brand {
text-transform: uppercase;
color: #000;
}
.abs-center-x {
position: absolute;
left: 50%;
transform: translateX(-50);
}
.border-bottom {
border-bottom: 1px solid #e5e5e5;
}
.box-shadow {
box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}
JS
var scroll = new SmoothScroll('a[href*="#"]');
jQuery(document).ready(function($) {
$(document).on("scroll", function() {
const features_top = $(".features-icons").position().top;
const top_of_window = $(window).scrollTop();
if (top_of_window >= features_top) {
$('.navbar').css('display', 'flex') // display: flex
} else {
$(".navbar").hide();
}
});
});
hi,
```
columns: [{
field: "checkboxDisplay",
title: "checkboxDisplay",
template: "# if ('new' =='new') { # <input id = 'checkIDGrid' type='checkbox' checked=true class=''> # }else{# <span class='oldEventArrow'></span> #} #"
},
```
Hi,
https://stackblitz.com/edit/angular-zddcxy?file=app/app.component.html
public loadColor() {
console.log('this.changeColor--->');
}
<span id="open1" (click)="loadColor()">add/edit prefrence</span>
@toianw It was meant to be like that as it is meant to be hidden on section one. I found out what the issue was, it was to do with the following
<script src="js/smooth-scroll-master/dist/js/smooth-scroll.js"></script>
<script src="js/javascript.js"></script>
Thanks for the help anyway :)
:cookie: 513 | @toianw |http://www.freecodecamp.org/toianw
hi, what is the problem with my code:
const {User} = require('../models')
module.exports = {
async register(req,res){
try{
const user = await User.create(req.body)
res.send(user.toJSON())
}catch (err){
res.status(400).send({
error:'This email is already in use'
})
}
}
}
It gives an error for register function. Unexpected identifier.
:cookie: 585 | @kbaig |http://www.freecodecamp.org/kbaig
:cookie: 586 | @kbaig |http://www.freecodecamp.org/kbaig
:cookie: 323 | @isaaknazar |http://www.freecodecamp.org/isaaknazar