These are chat archives for FreeCodeCamp/HelpFrontEnd

24th
Apr 2017
alpox
@alpox
Apr 24 2017 00:00
to*
Kevin
@kevinhisel
Apr 24 2017 00:00
@jdtdesigns Thank you very much! I've never heard of the property box-sizing before!
CamperBot
@camperbot
Apr 24 2017 00:00
kevinhisel sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 917 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Saboor Malik
@MathematicsCoding
Apr 24 2017 00:00
Sigh...
JD Tadlock
@jdtdesigns
Apr 24 2017 00:02
@kevinhisel Just keeps padding and border from effecting height/width of the element.
Saboor Malik
@MathematicsCoding
Apr 24 2017 00:05
wtf
My browse was shutted down itself
Like someone took control of my pc
Pagnito
@Pagnito
Apr 24 2017 00:09
Hey, can anyone help me with "Where are thou" I made an algorithm that i thought would work and it does for the first two cases, but for some reason in the third it should only return 2 objects, but the other objects also have the source argument so my algorithm returns them too, i dont understand the problem anymore
nvm i get why its doin that now
WillTheCruzan
@WillTheCruzan
Apr 24 2017 00:15
I have to look up practically everything i do while making the tribute page. Did I do something wrong and what should i do?
JD Tadlock
@jdtdesigns
Apr 24 2017 00:15
@WillTheCruzan meaning you have to learn how to do it?
that's what the challenge is all about ;)
WillTheCruzan
@WillTheCruzan
Apr 24 2017 00:16
I just feel like i forgot everything i learned
JD Tadlock
@jdtdesigns
Apr 24 2017 00:16
happens to us all
that's why it's important to keep coding until stuff sticks
if you take constant breaks before absorbing the info through constant repetition, you most likely won't remember it
WillTheCruzan
@WillTheCruzan
Apr 24 2017 00:18
alright thanks @jdtdesigns
CamperBot
@camperbot
Apr 24 2017 00:18
willthecruzan sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 918 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
WillTheCruzan
@WillTheCruzan
Apr 24 2017 00:19
also how do i put text in front of an image?
Saboor Malik
@MathematicsCoding
Apr 24 2017 00:24
@jdtdesigns sorry im back...
Had PC issues
Gulsvi
@gulsvi
Apr 24 2017 00:26
What's up @MathematicsCoding
Saboor Malik
@MathematicsCoding
Apr 24 2017 00:27
Alright
I need online button to return online only
Todd Abraham
@toddabraham
Apr 24 2017 00:27
@WillTheCruzan have you tried the bootstrap JumboTron feature? Change the background to be an image perhaps?
Saboor Malik
@MathematicsCoding
Apr 24 2017 00:28
I wrote some code but browse shutting down itself ruined it...
Gulsvi
@gulsvi
Apr 24 2017 00:29
What approach are you trying to take
Saboor Malik
@MathematicsCoding
Apr 24 2017 00:29
Did you see these if statement?
I dont know what code to write to return online instead
Gulsvi
@gulsvi
Apr 24 2017 00:29
Figuring that out is part of this challenge
Saboor Malik
@MathematicsCoding
Apr 24 2017 00:30
:\
JD Tadlock
@jdtdesigns
Apr 24 2017 00:30
@MathematicsCoding You shouldn't be firing an ajax request for the status type buttons
Gulsvi
@gulsvi
Apr 24 2017 00:30
I don't think you want the answer, is what I'm saying - wondering if you had an idea about how you wanted to do it.
JD Tadlock
@jdtdesigns
Apr 24 2017 00:30
you should get all streams on page load and just add/remove a class on them based on which button is pressed
Saboor Malik
@MathematicsCoding
Apr 24 2017 00:37
ugh
Dawson DePretis
@d3ddd
Apr 24 2017 00:38
FCC provides some sound files for the simon game (ex. https://s3.amazonaws.com/freecodecamp/simonSound1.mp3) but when I try to use it on codepen it says there is no Access-Control-Allow-Origin header so it can't access it... I'm not sure how to get around that.
Saboor Malik
@MathematicsCoding
Apr 24 2017 00:40
I will try figure it out later...
Cya guys
WillTheCruzan
@WillTheCruzan
Apr 24 2017 00:52
The text wont center
<a class="center-text" href="https://en.wikipedia.org/wiki/Abraham_Lincoln" target="_blank">Learn More</a>
Keon Samuel
@keonsam
Apr 24 2017 00:54
figure out what?
WillTheCruzan
@WillTheCruzan
Apr 24 2017 00:54
nvm i got it
Vincent Del Vecchio
@DVecc
Apr 24 2017 00:55
'
did you realize you had text and center reversed lol
does anyone see what could be causing nothing to show up
Tom
@moT01
Apr 24 2017 01:03
@conradkay //this.changeHandler
Vincent Del Vecchio
@DVecc
Apr 24 2017 01:06
@conradkay you're also missing a semi colon on line 13
Conrad Kay
@conradkay
Apr 24 2017 01:06
@moT01 @DVecc thanks!
CamperBot
@camperbot
Apr 24 2017 01:06
conradkay sends brownie points to @mot01 and @dvecc :sparkles: :thumbsup: :sparkles:
:cookie: 124 | @dvecc |http://www.freecodecamp.com/dvecc
:cookie: 634 | @mot01 |http://www.freecodecamp.com/mot01
Vincent Del Vecchio
@DVecc
Apr 24 2017 01:06
as a tip you can always hit the drop down arrow and click analyze js to have it tell you what errors are occuring
Conrad Kay
@conradkay
Apr 24 2017 01:07
its always the tiny errors that are never caught!
ok
Vincent Del Vecchio
@DVecc
Apr 24 2017 01:07
after adding the semi colon I'm still receiving a unclosed regular expression error I'm trying to find
Pagnito
@Pagnito
Apr 24 2017 01:08
having trouble with "Where art thou" anyone up to help?. I just need to figure out how to make sure that the collection has BOTH of the keys from source
Conrad Kay
@conradkay
Apr 24 2017 01:09
@Pagnito I can help i think
whats your current code?
function whereArtThou(collection, source) {
  var arr = [];
for (var keyd in source) {
   for (var key in collection) {
       if (source[keyd] === collection[key][keyd]) {
          arr.push(collection[key]);
       }
  }
return(arr);
}

this is what i came up with
JD Tadlock
@jdtdesigns
Apr 24 2017 01:13
@MathematicsCoding Here's an example of how to go about it. I made a few changes here and there to clean up the code. I also added a couple things in the css. Hope this helps. ;) https://codepen.io/jdtadlock/pen/jmMOyJ?editors=0100
WillTheCruzan
@WillTheCruzan
Apr 24 2017 01:18
How do I add a border to an image? I've tried several different techniques on google but none seemed to work.
Vincent Del Vecchio
@DVecc
Apr 24 2017 01:22
   <div class="thumbnail">
      <img src="..." alt="...">
      <div class="caption text-center">
      </div>
    </div>
Make sure you're using this bootstrap build and not 4.0
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
Free code camp's tutorials use 3 and not 4.0 so some things may not work the same if you use 4.0
Saboor Malik
@MathematicsCoding
Apr 24 2017 01:27
@jdtdesigns Damn it you did it for me lol
Thanks man
Gtg :\
JD Tadlock
@jdtdesigns
Apr 24 2017 01:29
@MathematicsCoding Welcome! Take a look at it and figure it all out before moving foward. You'll learn a couple of things that will help you down the road. ;)
WillTheCruzan
@WillTheCruzan
Apr 24 2017 01:30
thanks @DVecc ! got it to work!
CamperBot
@camperbot
Apr 24 2017 01:30
willthecruzan sends brownie points to @dvecc :sparkles: :thumbsup: :sparkles:
:cookie: 125 | @dvecc |http://www.freecodecamp.com/dvecc
WillTheCruzan
@WillTheCruzan
Apr 24 2017 01:37
How am i supposed to make the buttons on the portfolio project?
Vincent Del Vecchio
@DVecc
Apr 24 2017 01:40
The ones that take you to the different section of your portfolio?
WillTheCruzan
@WillTheCruzan
Apr 24 2017 01:40
yes
Basically you have a button object in you nav bar with a target of #About or whatever section you want it to take the user to
and then in your html you start the section with
<section id="#(whatever section it is called)"></sec>
and put your code inbetween the section tags
and when they click on the button it will jump to the section on the page with the corresponding ID
WillTheCruzan
@WillTheCruzan
Apr 24 2017 01:42
ohhh ok!
thanks @DVecc
CamperBot
@camperbot
Apr 24 2017 01:43
willthecruzan sends brownie points to @dvecc :sparkles: :thumbsup: :sparkles:
:warning: willthecruzan already gave dvecc points
Vincent Del Vecchio
@DVecc
Apr 24 2017 01:43
I would recommend reading the bootstrap documentation on whatever components you are trying to work with, it's extremely helpful
Pagnito
@Pagnito
Apr 24 2017 02:19
@conradkay hey was ina diffirent chatroom...can u explai what ur doing. im looking at the code but im not sure how it checks for multiple values or keys
Neil
@NNeil1
Apr 24 2017 02:21
guys an advice on my nav bar. anything I can add to make it look more full? i feel like it looks to plain - http://s.codepen.io/RPIE3/debug/EmyBOW/ZoABajoDEydr
Reeson55
@Reeson55
Apr 24 2017 02:30
hey guys when using bootstrap <div class=col-ms-4> it positions my text on the left column but id like to use the middle one how can I select the middle column if all 3 columns are all the same
Neil
@NNeil1
Apr 24 2017 02:31
add a class to the column and then style it
uiharu
@uiharu-s
Apr 24 2017 02:31
@Reeson55 you could do an additional empty <div class=col-ms-4> before that or
<div class="col-ms-4 offset-md-4”>
Gulsvi
@gulsvi
Apr 24 2017 02:55
@Reeson55 Use column offsets: http://getbootstrap.com/css/#grid-offsetting and don't forget to put your columns in a row:
  <div class="row">
    <div class="col-md-4 col-md-offset-4">
      Middle column
    </div>
  </div>
Alright what do you think?
@jdtdesigns did it for me with online and offline buttons and some improvement
But I have changed some designs
huh I think I messed up things...
Gulsvi
@gulsvi
Apr 24 2017 03:04
@MathematicsCoding If you want my honest opinion, I think you need to take what JD wrote as a guideline and write your own code. :)
This is definitely not your coding style:
$('.stream-list').find(id == 'all' ? 'li' : id == 'online' ? '.online' : '.offline').show();
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:06
:\
I will try to change it but what did I do wrong
It worked before
JD Tadlock
@jdtdesigns
Apr 24 2017 03:07
You didn't add .stream-list class to the ul ;)
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:08
Thought didnt need it..
JD Tadlock
@jdtdesigns
Apr 24 2017 03:08
And like i said, you need to go through my code and make sure it all makes sense before moving on.
if not, you're just wasting your time :/
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:10
I have already take a look at your code :\
JD Tadlock
@jdtdesigns
Apr 24 2017 03:11
do you know what id == 'all' ? 'li' : id == 'online' ? '.online' : '.offline' means?
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:11
That is only code I have no idea what that meant :\
Figured out whats wrong
JD Tadlock
@jdtdesigns
Apr 24 2017 03:12
exactly lol
figure out what code does before moving on
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:13
Its because I deleted a single class :\
I have noticed you made "Bio -" sticked with username xD
I fixed it tho
I understand how almost all JS code works but this code
id == 'all' ? 'li' : id == 'online' ? '.online' : '.offline'
Are they like if statements?
What does ? represent?
JD Tadlock
@jdtdesigns
Apr 24 2017 03:15
@MathematicsCoding You should never use <br>'s except in testing
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:15
@jdtdesigns why?
JD Tadlock
@jdtdesigns
Apr 24 2017 03:15
you should use text elements for text
you use css to create spacing between element
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:16
Yeah but whats wrong with <br>?
JD Tadlock
@jdtdesigns
Apr 24 2017 03:16
it's a bad practice in production code
since there are 50 ways to create space between two elements, there's never a good reason to have a <br> in production
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:18
I could delete Bio - instead
That would looks better
JD Tadlock
@jdtdesigns
Apr 24 2017 03:18
or just wrap the bio line in a <p> ;)
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:19
I saw you did it but Bio - was in wrong position
Gulsvi
@gulsvi
Apr 24 2017 03:19

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/br

Notes
Do not use <br> to increase the gap between lines of text; use the CSS margin property or the <p> element.

Saboor Malik
@MathematicsCoding
Apr 24 2017 03:19
....
Gulsvi
@gulsvi
Apr 24 2017 03:19
Getting it from all angles lol
uiharu
@uiharu-s
Apr 24 2017 03:19
:p
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:20
Alright deleted <br>
Gulsvi
@gulsvi
Apr 24 2017 03:20
Lots of people use <br> too much
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:20
Yeah...
I learned new lessons from you guys lol
But I gotta learn one more lesson
$('.stream-list').find(id == 'all' ? 'li' : id == 'online' ? '.online' : '.offline').show();
Explain that code? :\
CamperBot
@camperbot
Apr 24 2017 03:20

freeCodeCamp Wiki:

:point_right: The freeCodeCamp wiki can be found on our forum.
Please follow the link and search there.
Gulsvi
@gulsvi
Apr 24 2017 03:21
I think JD sent you down a rat hole with a nested ternary
:)
JD Tadlock
@jdtdesigns
Apr 24 2017 03:21
@MathematicsCoding
<if condition> ? <true> : <false>
Gulsvi
@gulsvi
Apr 24 2017 03:21
Maybe easier to understand written out as if/else
JD Tadlock
@jdtdesigns
Apr 24 2017 03:22
but i did nest one more ternary inside another, which is a little tricky @MathematicsCoding
there are plenty of tutorials on ternary expressions in js though
Here's a FCC boring dude that explains it pretty well :D
https://www.youtube.com/watch?v=s4sB1hm73tw
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:26
Yeah that guy will make me happy
But first...
I need to make this "offline" color red I have done it but it didnt stay with status -
They were on different line
JD Tadlock
@jdtdesigns
Apr 24 2017 03:27
basically, i'm just finding all the li's inside .stream-list using the id of the button as the conditional. Instead of doing a standard if/elseif/else i use a ternary to write one line shortcode.
@MathematicsCoding
Don't try to over think ternaries. They are pretty simple logic operators
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:30
Alright
Thanks for that video tho
I will probably learn that in JS book too :\
So ternaries is just shortcut code for if statements?
JD Tadlock
@jdtdesigns
Apr 24 2017 03:31
yep, but they can be used for logical operations or setters
very useful to shorten your code
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:31
I see
ESL_SC2
That person really play Starcraft all day?
Like 24/7..
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:39
huh ternary operator is really simple...
So like ? = if statement and : = else
JD Tadlock
@jdtdesigns
Apr 24 2017 03:41
if ( condition ) {
  // true
} else {
 // false
} 

condition ? true : false
Manish Giri
@Manish-Giri
Apr 24 2017 03:42
any react experts here?
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:42
yeah
console.log((condtion) ? true : false);
right?
JD Tadlock
@jdtdesigns
Apr 24 2017 03:43
no need for (condition)
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:43
SO instead of console.log how would I return it?
why?
Ah () inside is a variable not parameter?
var blah = num;
if ( blah = condition ) {
  // true
} else {
 // false
} 

console.log((blah) ? true : false);
JD Tadlock
@jdtdesigns
Apr 24 2017 03:45
lol, you're adding code
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:45
yeah?
JD Tadlock
@jdtdesigns
Apr 24 2017 03:46
some condition ? do something if true : do something if false
not (some condition) ? ....
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:46
false?
Subramanya Chakravarthy
@chakrihacker
Apr 24 2017 03:46
if(blah===condition) {
return true
} else {
return false
}
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:47
@chakrihacker ``` not ``````
Three of them
@jdtdesigns but these code I posted above
Right example?
Subramanya Chakravarthy
@chakrihacker
Apr 24 2017 03:48
@MathematicsCoding single equal is assignment and === is checking condition
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:48
yeah...
JD Tadlock
@jdtdesigns
Apr 24 2017 03:48
@MathematicsCoding .... don't add the brackets is what i was saying
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:49
I just made it up
JD Tadlock
@jdtdesigns
Apr 24 2017 03:50
var some_truth = true;

some_truth ? console.log('it is truth') : console.log('it is false');
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:50
ah...
So that would return 'it is truth'
Subramanya Chakravarthy
@chakrihacker
Apr 24 2017 03:50
@jdtdesigns blah === condition ? 'true content' : 'false content'
JD Tadlock
@jdtdesigns
Apr 24 2017 03:50
correct
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:50
I see
Subramanya Chakravarthy
@chakrihacker
Apr 24 2017 03:51
@jdtdesigns you are assigning some_truth variable as true
JD Tadlock
@jdtdesigns
Apr 24 2017 03:51
@chakrihacker For a simple example yep
Subramanya Chakravarthy
@chakrihacker
Apr 24 2017 03:52
is my example solves your question?
JD Tadlock
@jdtdesigns
Apr 24 2017 03:52
who's question?
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:52
Alright thanks for the lessons about ternary lol
@chakrihacker mine...
He was teaching me
Well I didnt ask a question
Never mind Misunderstood
Subramanya Chakravarthy
@chakrihacker
Apr 24 2017 03:53
ok
Saboor Malik
@MathematicsCoding
Apr 24 2017 03:53
Cya guys
JD Tadlock
@jdtdesigns
Apr 24 2017 03:54
cya
Csaba Balogh
@JasonCorp84
Apr 24 2017 04:01
Goo evening everyone
what link should I add to codepen.io to make work my mobile dropdown menu work ?
h1tag
@h1tag
Apr 24 2017 04:10
@JasonCorp84 from the JS settings, add jQuery then Bootstrap.js
LoneWolf08
@LoneWolf08
Apr 24 2017 04:19
hello! Can anyone suggest me how to make a dashboard? i need the dashboard on a webpage.
Csaba Balogh
@JasonCorp84
Apr 24 2017 04:23
@fortMaximus thank you!
CamperBot
@camperbot
Apr 24 2017 04:23
jasoncorp84 sends brownie points to @fortmaximus :sparkles: :thumbsup: :sparkles:
:cookie: 739 | @fortmaximus |http://www.freecodecamp.com/fortmaximus
Jaizon Carlos
@Jaizon
Apr 24 2017 04:31
Can anyone take a look at my Tribute Page? I mean, is this enough to pass or there's no requirement, except for the link ad picture?
h1tag
@h1tag
Apr 24 2017 04:35
@Jaizon you're pretty much good to go. This is one of the best looking tribute pages I've seen over here :+1:
the requirements for the projects are the user stories
uiharu
@uiharu-s
Apr 24 2017 04:36
@Jaizon it looks marvelous :) just clean up the images to the bottom ;)
h1tag
@h1tag
Apr 24 2017 04:37
you have a type This is a tribte to:
Jaizon Carlos
@Jaizon
Apr 24 2017 04:37
@fortMaximus Ty, but, even with no responsiveness? I saw that my images got all messed up when resizing.
CamperBot
@camperbot
Apr 24 2017 04:37
jaizon sends brownie points to @fortmaximus :sparkles: :thumbsup: :sparkles:
:cookie: 740 | @fortmaximus |http://www.freecodecamp.com/fortmaximus
h1tag
@h1tag
Apr 24 2017 04:37
tribute*
Jaizon Carlos
@Jaizon
Apr 24 2017 04:37
goingto correct all you saying, just a moment
h1tag
@h1tag
Apr 24 2017 04:37
didn't check for responsive, I'll do now
uiharu
@uiharu-s
Apr 24 2017 04:38
@Jaizon it’ll do you good if you’d use bootstrap on the img's :)
h1tag
@h1tag
Apr 24 2017 04:39
yea, it doesn't look as good on smaller screens @Jaizon
Jaizon Carlos
@Jaizon
Apr 24 2017 04:40
@uiharu-s I forgot the class for that, I was worried about finishing up with just css and html, just used bootstraps for grid purpose
h1tag
@h1tag
Apr 24 2017 04:41
I think it's img-fluid in Bootstrap 4 and img-responsive in 3
Neil
@NNeil1
Apr 24 2017 04:41
you know when you click on a name in a nav bar and it auto scrolls that to that point in the page, how difficult is it?
debating on if I should do a one page design, or three pages
h1tag
@h1tag
Apr 24 2017 04:41
impossible :p
uiharu
@uiharu-s
Apr 24 2017 04:41
@Jaizon :point_up: April 24, 2017 12:41 PM
and put them in col's
h1tag
@h1tag
Apr 24 2017 04:42
easy, jk @NMC96
uiharu
@uiharu-s
Apr 24 2017 04:42
@NMC96 it’s pretty easy
Neil
@NNeil1
Apr 24 2017 04:43
what framework do I have to use for it?
h1tag
@h1tag
Apr 24 2017 04:43
the idea is that you'll have to divide the page into section, using divs with ids
Jaizon Carlos
@Jaizon
Apr 24 2017 04:43
@uiharu-s alright, col's + img-fluid
Neil
@NNeil1
Apr 24 2017 04:44
Could it not be as simple as putting everything into sections, and then doing onClick
h1tag
@h1tag
Apr 24 2017 04:44
yes, that's it
Neil
@NNeil1
Apr 24 2017 04:44
and adding a function to make a certain div at the top of the page
i.e the beginning of the page the user clicked on
I've been thinking for past half hour how to do it, saying it out loud makes it sound so simple lol
h1tag
@h1tag
Apr 24 2017 04:46
onClick or href="#section-id-name"
Vincent Del Vecchio
@DVecc
Apr 24 2017 04:47
Can I get some feedback on my portfolio?
Neil
@NNeil1
Apr 24 2017 04:47
how would the href work with ids?
uiharu
@uiharu-s
Apr 24 2017 04:47
@NMC96 could be as simple as id’s
lol
Neil
@NNeil1
Apr 24 2017 04:47
i didn't know href could link up with ids lmao
h1tag
@h1tag
Apr 24 2017 04:48
lol
me too, at first
uiharu
@uiharu-s
Apr 24 2017 04:49
@DVecc looks great :D
Neil
@NNeil1
Apr 24 2017 04:49
that was so simple
like lol
no animation on it so it looks like its from the 90's but ill sort that out later on
uiharu
@uiharu-s
Apr 24 2017 04:50
@DVecc col-md-* might be more suited for most ppl’s devices than col-lg-
h1tag
@h1tag
Apr 24 2017 04:50
@NMC96 lol
Neil
@NNeil1
Apr 24 2017 04:51
can't remember who posted there portfolio, but it looks pretty decent. Well done. The only thing I would change would be the color and font off the opening header and opening bio about yourself. Other than that it looks great
uiharu
@uiharu-s
Apr 24 2017 04:52
@NMC96 look up scrollspy, might be useful
Neil
@NNeil1
Apr 24 2017 04:55
That verticle scroll using scrollspy is exactly what I needed
thanks for that @uiharu-s
CamperBot
@camperbot
Apr 24 2017 04:55
nmc96 sends brownie points to @uiharu-s :sparkles: :thumbsup: :sparkles:
:cookie: 309 | @uiharu-s |http://www.freecodecamp.com/uiharu-s
Become0
@Become0
Apr 24 2017 04:55
body {
margin-top: 60px;
}
why is it in CSS
uiharu
@uiharu-s
Apr 24 2017 04:56
@Become0 to give the whole page a top margin of 60 pixels?
Neil
@NNeil1
Apr 24 2017 04:56
what do you mean exactly
uiharu
@uiharu-s
Apr 24 2017 04:56
and yay @NMC96 :D
utkarshonly
@utkarshonly
Apr 24 2017 04:59
<a href="http://www.dailyreport.in/wp-content/uploads/2016/06/P.V.-Narasimha-Rao.jpg"> <img src="http://www.dailyreport.in/wp-content/uploads/2016/06/P.V.-Narasimha-Rao.jpg" class="img-circle" alt="Photo of the Man"> </a>
^is there something wrong with this?
The bootstrap class is not working
Gulsvi
@gulsvi
Apr 24 2017 05:02
@utkarshonly If you're using Bootstrap 4, use rounded-circle instead of img-circle
utkarshonly
@utkarshonly
Apr 24 2017 05:03
Oh. Okay thanks!
Gulsvi
@gulsvi
Apr 24 2017 05:03
If you want to use Bootstrap 3, and you're using Codepen, click "Settings", click "CSS", and replace your link to Bootstrap with this one: https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css @utkarshonly
LoneWolf08
@LoneWolf08
Apr 24 2017 05:06
guys, please help me out
I have to create a dashboard on a webpage. I have no idea how to do it. Can anyone please suggest.
I had it working before, but now it linking the ID but not scrolling down lol
when you click html it should scroll
uiharu
@uiharu-s
Apr 24 2017 05:08
@LoneWolf08 any more details for everyone? :)
Nick
@Ninikitos
Apr 24 2017 05:09
Hey guys. Im basically trying to put my custom logo into my Codepen project. And the only solution i came up was to copy url of an existing logo on tech crunch.com
Is there a way to add a custom one ?
Neil
@NNeil1
Apr 24 2017 05:10
upload logo to image hosting
then use the url from the image host to put it on codepen
Gulsvi
@gulsvi
Apr 24 2017 05:11
@NMC96 ID values shouldn't start with a #, for example: <div id="page2"> not <div id="#page2">
LoneWolf08
@LoneWolf08
Apr 24 2017 05:11
@uiharu-s my database is in SQL server
Nick
@Ninikitos
Apr 24 2017 05:11
@NMC96 I don't have my own server or hosting.
Gulsvi
@gulsvi
Apr 24 2017 05:12
@Ninikitos A lot of people use https://postimage.io for image hosting. It's free.
Nick
@Ninikitos
Apr 24 2017 05:13
@SkyCoder01 Thanks will try )))
CamperBot
@camperbot
Apr 24 2017 05:13
ninikitos sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:star2: 1159 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Jaizon Carlos
@Jaizon
Apr 24 2017 05:27
Can someone take a look a it now? Just a quick feedback before I submit
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 05:44
Hi everyone, I am working on the random quotes machine, could someone please help me that I can not load a different quote, after I clicked the button it won't request another quotes :( http://codepen.io/elliotzengyi/pen/GmqvvK
and I have to use http:// because codepen doesn't allow me to request http json via https
Nick
@Ninikitos
Apr 24 2017 05:48
Hey guys. Using a bootstrap navbar. But for some reason when i resize the page drop down does not work. Here is my code
<nav class="navbar navbar-toggleable-md navbar-light bg-faded">
<div class="container">
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand nav-item nav-link active" href="#"><span class="sr-only">(current)</span>
<img id="brand-image" alt="Website Logo" src="https://s24.postimg.org/jdspbb51h/Logo.png" class="img-responsive">
</a>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-item nav-link active" href="#">Socials</a>
<a class="nav-item nav-link" href="#">Portfolio</a>
<a class="nav-item nav-link" href="#">Contact Me</a>
</div>
</div>
</nav>
Please help me) Send like an hour already
h1tag
@h1tag
Apr 24 2017 05:55
@Jaizon :+1:
Sorin Ruse
@sorinr
Apr 24 2017 05:56
@Ninikitos ofc its not working if u don't add in codepen ssettings->javascript part jquery first and boostrap.js after :)
Nick
@Ninikitos
Apr 24 2017 06:00
@sorinr MAAAAAAAANNNN !!!
@sorinr IT helped !!!
@sorinr THANK YOU !! Didn't know about that part
CamperBot
@camperbot
Apr 24 2017 06:00
ninikitos sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1271 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Apr 24 2017 06:02
@Ninikitos welcome
ckshobha
@ckshobha
Apr 24 2017 06:02
Hi, I need help for the Local Weather app. I am able to get the long and lat by using the following code i am unable to get response to the weather app data what is wrong with this $.getJSON("http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + long + "&appid=**",function(data){
console.log("Data: " + data );
});
Sorin Ruse
@sorinr
Apr 24 2017 06:03
@ckshobha how do u get lat and lon?
ckshobha
@ckshobha
Apr 24 2017 06:05
if (navigator.geolocation){
navigator.geolocation.getCurrentPosition(showPosition);
}
i am able to get lat and long value perfectly right
but beyond that I dont see any code execution
let me know if u need the complete snippet of code
kirbyedy
@kirbyedy
Apr 24 2017 06:07
@ckshobha combining geolocation with openweather api is a pain
not sure if it works anymore...
ckshobha
@ckshobha
Apr 24 2017 06:08
hmn okie.
Sorin Ruse
@sorinr
Apr 24 2017 06:28
@ckshobha geolocation needs https access. openweather, free plan, accepts only http. change ether location service or weather api
@ckshobha if u want to keep geolocation, thats more accurate, look at weather apis like apixu, wunderground that accepts calls on https on the free plan
uiharu
@uiharu-s
Apr 24 2017 06:39
smb mentioned https://crossorigin.me/
could be equally useful for making http api http/s enabled
kirbyedy
@kirbyedy
Apr 24 2017 06:40
crossorigin stopped working for me a while ago
Czpl
@Czpl
Apr 24 2017 06:45
darksky api has https
iso
@iso1048
Apr 24 2017 07:42
Could someone help me with getting geolocation data please. I'm working on the weather app
Yankoth
@Yankoth
Apr 24 2017 07:48
@gothamknight What's your problem?
iso
@iso1048
Apr 24 2017 07:49
@Yankoth you mind if I send you a pm?
Yankoth
@Yankoth
Apr 24 2017 07:52
@gothamknight No problem
Buhaianu Remus
@Remus432
Apr 24 2017 09:57

function orderMyLogic(val) {
  if (val < 10) {
    return "Less than 10";
  } else if (val < 5) {
    return "Less than 5";
  } else {
    return "Greater than or equal to 10";
  }
}

// Change this value to test
orderMyLogic(5);
Change the order of logic in the function so that it will return the correct statements in all cases.Can someone help me with it?
heroiczero
@heroiczero
Apr 24 2017 09:59

@Remus432

  if (val < 10) {
    return "Less than 10";
  } else if (val < 5) {
    return "Less than 5";
  }

switch the 10 with 5 so it returns "Less than 5" before "Less than 10"

Yankoth
@Yankoth
Apr 24 2017 10:00
@Jaizon The albums part, looks pressed
Faiz Ahmed
@Faiz7412
Apr 24 2017 10:09
Can anyone tell me how are they animating so beautifully with scroll?
https://ethereum.org
my random quotes machine.
it takes very long time to load another quote because my internet is so slow in China. Can anyone tell me the speed in your side please?
heroiczero
@heroiczero
Apr 24 2017 10:14
@elliotzengyi it is good :+1: but really want a twitter button
Lokesh Devraj
@lokeshdevraj
Apr 24 2017 10:14
@Faiz7412 Try ScrollReveal https://scrollrevealjs.org/
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 10:14
^_^ I will add the twitter button, thank you. @heroiczero
CamperBot
@camperbot
Apr 24 2017 10:14
elliotzengyi sends brownie points to @heroiczero :sparkles: :thumbsup: :sparkles:
:star2: 1179 | @heroiczero |http://www.freecodecamp.com/heroiczero
Keon Samuel
@keonsam
Apr 24 2017 10:22
@elliotzengyi almost instant on my side.
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 10:32
@keonsam thank you. I was thinking to storage 20 quotes into an array while page loading. so even it's slow in my side, it may also instantly change.
CamperBot
@camperbot
Apr 24 2017 10:32
elliotzengyi sends brownie points to @keonsam :sparkles: :thumbsup: :sparkles:
:cookie: 337 | @keonsam |http://www.freecodecamp.com/keonsam
Abdallah Sarhan
@AbdallahSarhan
Apr 24 2017 10:35
hey guys, I have a string & I want to turn it without changing it to Array to use reverse method ,, got it ??
Faiz Ahmed
@Faiz7412
Apr 24 2017 10:35
@lokeshdevraj Thanks! But they seem to be using more than just scrollrevealjs. Their animations are moving according to scroll, and reversing too when scrolled up. The transitions are impressive!
CamperBot
@camperbot
Apr 24 2017 10:35
faiz7412 sends brownie points to @lokeshdevraj :sparkles: :thumbsup: :sparkles:
:cookie: 36 | @lokeshdevraj |http://www.freecodecamp.com/lokeshdevraj
blastit
@blastit
Apr 24 2017 10:37
@blastit
what is the correct code for the profile lookup? I've tried about 3 different times
for (var i = 0; i < contacts.length; i++) {
    if (contacts[i].firstName === firstName) {

        if (contacts[i].hasOwnProperty(prop)) {
          return contacts[i][prop];
        } else {
          return "No such property"; 
      }
    } else {
      return "No such contact";
    }
  }
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 10:39
if (contacts[i][prop]) {
        return contacts[i][prop];
      }
      return "No such property";
@blastit i think this is already fine.
missed the }); lol.
Tamas Csonka
@csnktms
Apr 24 2017 10:40
hey anyone, in react how is it possible to strike-trough different list items, in an array?
Abdallah Sarhan
@AbdallahSarhan
Apr 24 2017 10:42
@blastit contacts[i][prop] .... without hasOwnProperty
@elliotzengyi , I have a string & I want to turn it without changing it to Array to use reverse method ,, got it ??
like palindrome ..
@blastit if (contacts[i][prop] === prop ) {......
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 10:47
hi @AbdallahSarhan I don't have any ideas about that. have you tried slice() & +=?
Abdallah Sarhan
@AbdallahSarhan
Apr 24 2017 10:49
@elliotzengyi this is what i am trying right now xD
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 10:52
but why you don't want to change it to an arry?
Abdallah Sarhan
@AbdallahSarhan
Apr 24 2017 10:53
because i tried before with another algorithm and the console returns perfect result , but i didn't pass xDDD :(
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 10:54
function reverseString(str) {
    var result = "";
    for (var i = str.length - 1; i >= 0; i--) {
        result += str[i];
    }
    return result;
maybe try this
looks stupid but also work...
Abdallah Sarhan
@AbdallahSarhan
Apr 24 2017 11:00
@elliotzengyi works well tho hehe, thank you
CamperBot
@camperbot
Apr 24 2017 11:00
abdallahsarhan sends brownie points to @elliotzengyi :sparkles: :thumbsup: :sparkles:
:warning: @elliotzengyi's account is not linked with freeCodeCamp. Please visit the settings and link your GitHub account.
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 11:01
@AbdallahSarhan you're welcome.
Ming Zhu
@chocobrownie
Apr 24 2017 11:05
Hi, how do I use JSON/AJax to access http API from a https webpage? It gives me errors when I try to do that
Kuriakin Zeng
@kuriakinzeng
Apr 24 2017 11:09
I am building the voting app. Though it's a backend project, I use React Redux as the frontend, and I have a few questions:
  1. I need a way to display "Delete" button if a poll belongs to the signed in user. Should I store userId and poll owner's id in redux state so that I can compare them? Someone could edit the local storage to make the userId equal to poll owner's id, therefore exposing the delete button.
  2. On the backend, how do I check that a user has enough privilege to delete a poll?
Tamas Csonka
@csnktms
Apr 24 2017 11:16
hey
is anyone experienced here in react?
Keon Samuel
@keonsam
Apr 24 2017 11:17
where should I go to learn react free?
Kuriakin Zeng
@kuriakinzeng
Apr 24 2017 11:17
hysterical-amusement.surge.sh
@keonsam
@csnktms what's up with react
Tamas Csonka
@csnktms
Apr 24 2017 11:18
@kuriakinzeng hey
i have a todolist
Kuriakin Zeng
@kuriakinzeng
Apr 24 2017 11:19
ok
Tamas Csonka
@csnktms
Apr 24 2017 11:19
i can add and delete todos
Kuriakin Zeng
@kuriakinzeng
Apr 24 2017 11:19
are you using redux?
Tamas Csonka
@csnktms
Apr 24 2017 11:20
i would like to apply strike through to items
no
and if it is applied, i would like to push them to the completed section
Kuriakin Zeng
@kuriakinzeng
Apr 24 2017 11:20
hmm ok?
Tamas Csonka
@csnktms
Apr 24 2017 11:20
i show u the code
import React, { Component } from 'react';


class ToDoList extends Component {
  constructor(props) {
    super(props);
    this.state = {list: [], items: ''};
    this.handleChange = this.handleChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleRemove = this.handleRemove.bind(this);
  }

  handleChange(event) {
    this.setState({items: event.target.value})
    console.log(event.target.value);
  }

  handleSubmit(event) {
    this.setState({
      list: [...this.state.list, this.state.items],
      items: ''
    })
    event.preventDefault();
  }


  handleRemove(index) {
    const filteredArray = this.state.list.values.filter((_, i) => i !== index); // used underscore as a convention to address nothing is going there
    this.setState({
      list: filteredArray
    });
  }

  render() {
    return (
    <div className='header main'>
      <form onSubmit={this.handleSubmit} >
        <label>
          <input className='new-todo'
            placeholder='What needs to be done?'
            type="text"
            value={this.state.items}
            onChange={this.handleChange} />
        </label>
      </form>
      <ul className='todo-list'>
        {this.state.list.map((item, index) => (
            <li className='list-view' key={index+1}>{item}<button className='list-view-button' onClick={this.handleRemove.bind(this, index) }>X</button></li>
        ))}
      </ul>
      <div className='footer'>
        Remaining: {this.state.list.length}
      </div>
      </div>
    );
  }
}

export default ToDoList;
Kuriakin Zeng
@kuriakinzeng
Apr 24 2017 11:21
ok
and handleRemove doesn't work?
Tamas Csonka
@csnktms
Apr 24 2017 11:22
so first of all, that would be the best If I could strike-through the todos, without deleting and pushing them into a completed section
it is working
remove is working
i would like to line-through it
Kuriakin Zeng
@kuriakinzeng
Apr 24 2017 11:22
so strikethrough is just a styling thing right
Tamas Csonka
@csnktms
Apr 24 2017 11:23
yep
how is it possible to achive it with every individual item i click on?
Kuriakin Zeng
@kuriakinzeng
Apr 24 2017 11:23
in each item in your todo list
other than saving the text, save whether it's done
if done is true, apply the strikethrough
Tamas Csonka
@csnktms
Apr 24 2017 11:24
how should I implement it in the code? could u show me an example?
im a bit confused.
Kuriakin Zeng
@kuriakinzeng
Apr 24 2017 11:25
@uiharu-s has shown the element
Tamas Csonka
@csnktms
Apr 24 2017 11:25
got it
JayyRaaj
@JayyRaaj
Apr 24 2017 11:26
Hey , hi .. .Can anyone explain how do we go about creating the file in codepen .. i'd like the html editor css editor and script editor to be on the same plane together.. ?
Kuriakin Zeng
@kuriakinzeng
Apr 24 2017 11:26
but you're not keeping track of what's done right?
JayyRaaj
@JayyRaaj
Apr 24 2017 11:26
Anthing i'm doing wrong ?
Kuriakin Zeng
@kuriakinzeng
Apr 24 2017 11:29
@csnktms I need to go, but I suggest that your item and handleSubmit is in this format:
const newItem = { content: 'Buy milk', done: false }
this.setState({ item: newItem })
@JayyRaaj i think the layout is fixed
that said, you could put all your code in the html part I'm sure
Ming Zhu
@chocobrownie
Apr 24 2017 11:33
Hi, I'm trying to achive similiar function of random quote machine sample code. But I run into same
type of bug when I try to access random quote API. I assume they are caused by accessing http api
from https webpage. I tried the methods below but they didn't work 1.replace JSON with jsonp data type 2.change codepen from https to http 3.change API URL from http to https 4.Add "https://crossorigin.me" ahead of the api url This is my code pen code: https://codepen.io/chocobrownie/pen/mmEJgq Please let me know if there's any feedback.
Kuriakin Zeng
@kuriakinzeng
Apr 24 2017 11:37
You could use http for codepen
Just change your url to http
Ming Zhu
@chocobrownie
Apr 24 2017 11:39
This is what I get when I change it: "Access to Font at 'https://production-assets.codepen.io/assets/telefon/bold/af889c53-1ee3-4868…50-3-b7a87e0fbd213943fae0c0ef5985635dd43fa9c24876b2725127a13ccaf4ab6a.woff' from origin 'http://codepen.io' has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header has a value 'https://codepen.io' that is not equal to the supplied origin. Origin 'http://codepen.io' is therefore not allowed access"
Also I heard that http is deprecated so it is good to try to avoid it
@kuriakinzeng
Brenda A Villarreal
@brendavee
Apr 24 2017 11:49

Please help:

  1. How do I get my navbar to always be on top and above the main content? I used z-index:99; but it still is overlapping the content instead of above the content.

  2. How do I get my navbar buttons to highlight white or active when clicked? My "ABOUT " button stays active.

https://codepen.io/brendavee/full/NpzRwp/

Paradox5
@Paradox5
Apr 24 2017 11:49
Hello
kirbyedy
@kirbyedy
Apr 24 2017 11:54
@brendavee looks ok to me, just it has opacity of 0.9 so its basically see through
if thats what you mean...
Screen Shot 2017-04-24 at 14.55.03.png
for the second question search for scroll spy @brendavee
Ken Haduch
@khaduch
Apr 24 2017 12:04
@brendavee - the navbar is always "over" the content - overlapping. the z-index will not change that. What you have to do is put some padding-top in your div elements so that they do not scroll underneath. SOmething like that usually works.
Anna
@AnnaVih
Apr 24 2017 12:07
hi ! Need help.Which the best way to make sticky footer
kirbyedy
@kirbyedy
Apr 24 2017 12:21
@AnnaVih here is five ways to do that: https://css-tricks.com/couple-takes-sticky-footer/
Jaizon Carlos
@Jaizon
Apr 24 2017 12:29
How to put those image frames people use on their portfolios?
Ming Zhu
@chocobrownie
Apr 24 2017 12:39
I have a question: How come the page reports "data.shift" is not a function in my code? https://codepen.io/chocobrownie/pen/mmEJgq
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 12:41

hi everyone

var randomIndex = Math.floor(Math.random * 10);

  //Change Content
  $("#quote-content").html(quotesArr[randomIndex][0]);
  $("#quote-title").html("-- " + quotesArr[randomIndex][1]);

I tried to load random quotes from an array but it says "TypeError: Cannot read property '0' of undefined"
could you please give me some advice?

Czpl
@Czpl
Apr 24 2017 12:43
where did you define your quotesArr?
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 12:43
i can read it via quotesArr[0][0]
but can not via quotesArr[randomIndex][0]
in getJSON
Czpl
@Czpl
Apr 24 2017 12:44
@chocobrownie because data is an object, not array
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 12:45
var quotesArr = [];

$.getJSON("https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=10", function(json) {

  json.forEach(function(val, index){
    quotesArr.push([val.content, val.title]);
  });
});
Czpl
@Czpl
Apr 24 2017 12:45
@elliotzengyi Math.floor(Math.random() * 10);
you forgot "()"
Ming Zhu
@chocobrownie
Apr 24 2017 12:46
@Czpl in my case it is an object inside an array https://quotesondesign.com/api-v4-0/
Czpl
@Czpl
Apr 24 2017 12:46
random is a method
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 12:46
OMG
Ming Zhu
@chocobrownie
Apr 24 2017 12:46
You can look at the example at the bottom of the page of discription
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 12:46
i am so stupid
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 12:48
and also i keep getting errors like
Uncaught Error: Bootstrap tooltips require Tether (http://tether.io/)
at VM5410 bootstrap.min.js:7
at VM5410 bootstrap.min.js:7
at VM5410 bootstrap.min.js:7
not sure what it means but doesn't affect my page
i am adding the twitter button now
you didnt specify parameters in your url
@elliotzengyi because you are using bootstrap 4
it need tether
needs*
Elliot Zeng Yi
@elliotzengyi
Apr 24 2017 12:53
thanks, i removed the entire bootstrap js, now my page works great
i only need its css, lol
Ming Zhu
@chocobrownie
Apr 24 2017 12:56
@Czpl I don't understand why it worked, what did you mean by I didn't specify parameter?
Czpl
@Czpl
Apr 24 2017 12:59
i checked again, it was &_jsonp=mycallback fault
it wraps response in /**/mycallback()
Ming Zhu
@chocobrownie
Apr 24 2017 13:00
What does that mean?
What is mycallback function?
Oh so the output has a problem, the whole out put is within a function input bracket
But what caused that? I was simply following sample code
Czpl
@Czpl
Apr 24 2017 13:08
from their docs adding _jsonp parameter it returns a function you can execute
WillTheCruzan
@WillTheCruzan
Apr 24 2017 13:10
how could i make my Will Cruzan float to the left?
<div class = "container-fluid">
<ul class = "nav nav-pills float-right" <li class="nav-item">
<a class="nav-link active" href="#">Will Cruzan</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="#">About Me</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="#">Portfolio</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="#">Contact Me</a>
</li>
</ul>
Marlon
@mblmarlon
Apr 24 2017 13:12
@WillTheCruzan "float-left"?
Czpl
@Czpl
Apr 24 2017 13:13
you could make it in separate list, and then float it left
<div class="container-fluid">
  <ul class="nav nav-pills float-left">
    <li class="nav-item">
      <a class="nav-link active" href="#">Will Cruzan</a>
    </li>
  </ul>
  <ul class="nav nav-pills float-right">
    <li class="nav-item">
      <a class="nav-link active" href="#">About Me</a>
    </li>
    <li class="nav-item">
      <a class="nav-link active" href="#">Portfolio</a>
    </li>
    <li class="nav-item">
      <a class="nav-link active" href="#">Contact Me</a>
    </li>
  </ul>
CamperBot
@camperbot
Apr 24 2017 13:14
:bulb: to format code use backticks! ``` more info
WillTheCruzan
@WillTheCruzan
Apr 24 2017 13:16
when i do that it then creates 2 bar menus
it makes it so that Will Cruzan is above the rest
Czpl
@Czpl
Apr 24 2017 13:17
well you didnt show your css
WillTheCruzan
@WillTheCruzan
Apr 24 2017 13:19

.nav-pills{
font-size:1.7em;
background-color: black;
opacity: .7;
margin-left: -1%;
margin-right: -1%;
}

body {
background-image:url("https://images2.alphacoders.com/683/thumb-1920-68370.jpg");
background-size:cover;
}

Czpl
@Czpl
Apr 24 2017 13:19
it should work then
WillTheCruzan
@WillTheCruzan
Apr 24 2017 13:20
alright ima try again
Got it to work thank you @Czpl !
CamperBot
@camperbot
Apr 24 2017 13:24
willthecruzan sends brownie points to @czpl :sparkles: :thumbsup: :sparkles:
:cookie: 266 | @czpl |http://www.freecodecamp.com/czpl
Muhammad Hasham
@MohammadHasham
Apr 24 2017 13:36
Is it necesaary to be a good programmer to become a good web developer?
Ming Zhu
@chocobrownie
Apr 24 2017 13:36
@Czpl I found a problem with your method, https://quotesondesign.com/wp-json/posts does not give random quotes anymore, it is always the same
the _jsonp parameter was a problem
Ming Zhu
@chocobrownie
Apr 24 2017 13:39
It gives me error if I do it this way, cuz the cross domain thing. jsonp is to avoid this problem
@Czpl
XMLHttpRequest cannot load https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://s.codepen.io' is therefore not allowed access.
Anna
@AnnaVih
Apr 24 2017 13:40
@kirbyedy i tried all methods and did not work.Maybe something wrong with my code
Someone help me with footer please...i lost 2 hours and still can not find out
thinkC
@thinkC
Apr 24 2017 13:43
Hi All..pls can someone help me with the base url of twitchtv api ?
Czpl
@Czpl
Apr 24 2017 13:52
@chocobrownie then you have to use that _jsonp
 function generate() {

  $.ajax({
    url: "https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&_jsonp=myCallback",
    jsonp: "callback",
    dataType: "jsonp",
    success: function(data) {
      window[data];
    }
  });
}

function myCallback(data) {
  console.log(data);
}
this should work
No Name
@ilincicd
Apr 24 2017 13:54
How to centre this picture ?
pitanje.jpg
WillTheCruzan
@WillTheCruzan
Apr 24 2017 13:56
try adding the class text-center
Ming Zhu
@chocobrownie
Apr 24 2017 13:59
@Czpl No, console.log didn't give me anything this time... I just think maybe this is a broken API? Maybe I should stop wasting time on it?
WillTheCruzan
@WillTheCruzan
Apr 24 2017 14:02
How could I center a title in the middle of a background?
CamperBot
@camperbot
Apr 24 2017 14:09
:bulb: to format code use backticks! ``` more info
Sean
@Egglton
Apr 24 2017 14:10
Woops!

Change the background-color property of the blue and yellow classes to their respective colors. Notice how the colors look different next to each other than they do compared against the white background.

What am I doing wrong?

<style>
body {
background-color: #FFFFFF;
}
.blue {
background-color: blue;
}
.yellow {
background-color: yellow;
}
div {
display: inline-block;
height: 100px;
width: 100px;
}
</style>

<div class="blue"></div>
<div class="yellow"></div>
This message was deleted
Ken Haduch
@khaduch
Apr 24 2017 14:12
@Egglton - just a helpful note - you can go back and edit your recent posts by clicking on the three dots next to the timestamp, and then make changes so you don't have to repost. You have a few minutes after the post was made to edit or delete it. It keeps the chat from getting too cluttered with repeated / junky posts.
Sean
@Egglton
Apr 24 2017 14:12
@khaduch Thanks!
CamperBot
@camperbot
Apr 24 2017 14:12
egglton sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2789 | @khaduch |http://www.freecodecamp.com/khaduch
Ken Haduch
@khaduch
Apr 24 2017 14:15
@Egglton - not sure what you are asking in your post - there appears to be a small gap between the two divs? But what are you really wanting to know?
Sean
@Egglton
Apr 24 2017 14:18
@khaduch It asks to change each class's background property to it's respective color (blue and yellow). But when I submit the answer above, it doesn't allow me to progress. Not sure if it is a bug or something I am missing
Ken Haduch
@khaduch
Apr 24 2017 14:19
@Egglton - perhaps they want you to use the hex format notation for the blue and yellow?
Sean
@Egglton
Apr 24 2017 14:21
<style>
  body {
    background-color: #FFFFFF;
  }
  .blue {
    background-color:#0000FF;
  }
  .yellow {
    background-color:#FFFF00;
  }
  div {
    display: inline-block;
    height: 100px;
    width: 100px;
  }
</style>
<div class="blue"></div>
<div class="yellow"></div>
Still fails me :worried:
Ken Haduch
@khaduch
Apr 24 2017 14:22
@Egglton - which lesson is this, please?
Sean
@Egglton
Apr 24 2017 14:24
@khaduch Applied Visual Design: Learn about Complementary Colors. I should mention this is on the beta. That is why I think it may be a bug. But I wanted to check first to see if I was missing something small.
Ken Haduch
@khaduch
Apr 24 2017 14:24
@Egglton - oh, that's why I can't find it. Can you post the URL for the lesson, maybe I can see it directly?
Ken Haduch
@khaduch
Apr 24 2017 14:28
@Egglton - I'm seeing the same thing. The divs are different colors, but the tests are not passing. Check for a bug that might be filed before filing another one, if you are going to file a bug report.
@Egglton - I see a bug report that says that this works in Chrome browser, but not in FireFox - are you using FireFox or other browsers?
Sean
@Egglton
Apr 24 2017 14:32
@khaduch That would do it
Ken Haduch
@khaduch
Apr 24 2017 14:32
I just went and tried it in Chrome and it seems to pass if you put the correct color codes in there.
Sean
@Egglton
Apr 24 2017 14:33
@khaduch Gotcha. Thanks for your help!
CamperBot
@camperbot
Apr 24 2017 14:33
egglton sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:warning: egglton already gave khaduch points
Ken Haduch
@khaduch
Apr 24 2017 14:34
@Egglton - if you want to read the discussion, it is issue #10749 - the actual link I'm looking at is freeCodeCamp/freeCodeCamp#10749
gulptech
@gulptech
Apr 24 2017 14:48
Man....now i want to test out the beta....now i need to start over :(
Gulsvi
@gulsvi
Apr 24 2017 15:06

@chocobrownie Not sure if you got this figured out - they have a code sample on using ajax in the documentation. You'll get the same quote every time you click the "New Quote" button unless you specify "cache: false":

  $.ajax({
    url: "https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=",
    cache: false,
    success: function(data) {

Add that to your $.ajax and your project will be finished :)

Paradox5
@Paradox5
Apr 24 2017 15:06
Its a sky
throws ultra ball
Ah pokemon
The only place where you can capture cute little monsters and make them your slaves
Hm
Gulsvi
@gulsvi
Apr 24 2017 15:07
Good morning @Paradox5 :)
:balloon:
closest emoji to an ultra ball I think
WillTheCruzan
@WillTheCruzan
Apr 24 2017 15:08
How do I put a title in the middle of an image background?
Paradox5
@Paradox5
Apr 24 2017 15:08
Cant deny that chespin is adorable
Gulsvi
@gulsvi
Apr 24 2017 15:08
@WillTheCruzan If you're using background-image in your CSS, you should be able to place text anywhere you want over it. Otherwise, you have to use position: absolute
WillTheCruzan
@WillTheCruzan
Apr 24 2017 15:10
how do I move text a few lines down?
Paradox5
@Paradox5
Apr 24 2017 15:10
Margin-top: 50px
Gulsvi
@gulsvi
Apr 24 2017 15:10
Use margin-top
Paradox5
@Paradox5
Apr 24 2017 15:10
Try that
WillTheCruzan
@WillTheCruzan
Apr 24 2017 15:10
oh ok
Paradox5
@Paradox5
Apr 24 2017 15:10
No capital
God dang it captial autocorrect
Grrr
WillTheCruzan
@WillTheCruzan
Apr 24 2017 15:13

<header>
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Lobster" />
</link>
</header>

<div class = "container-fluid">
<ul class = "nav nav-pills float-left" <li class="nav-item">
<a class="nav-link active" href="#">Will Cruzan</a>
</ul>
<ul class="nav nav-pills float-right" </li>
<li class="nav-item">
<a class="nav-link active" href="#">About Me</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="#">Portfolio</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="#">Contact Me</a>
</li>
</ul>
<div class = "pageOne">
<h1 class="text-center">Will Cruzan</h1>
</div>
<div class="btnlist text-center">
<a class="btn btn-default" href'#'>Twitter</a>
<a class="btn btn-default" href'#'>GitHub</a>
<a class="btn btn-default" href'#'>CodePen</a>
</div>
</div>

Spyrantis Theodoros
@thodorisanta
Apr 24 2017 15:13
im almost done with the tic tac toe with the two player version. Now i have to add the bot (vs computer). but i seriously have no clue on how to do that. one way would be to throw in random computer moves but thats too random and easy to do. so(maybe if i put it as an "easy" diffuculty)... any ideas? :P
Paradox5
@Paradox5
Apr 24 2017 15:13
Oh god text overload
Ok cant help you with chess not there yet unfortunately
@WillTheCruzan whats the problem
And please format the code in the future
WillTheCruzan
@WillTheCruzan
Apr 24 2017 15:15

<header>
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Lobster" />
</link>
</header>

<div class = "container-fluid">
<ul class = "nav nav-pills float-left" <li class="nav-item">
<a class="nav-link active" href="#">Will Cruzan</a>
</ul>
<ul class="nav nav-pills float-right" </li>
<li class="nav-item">
<a class="nav-link active" href="#">About Me</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="#">Portfolio</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="#">Contact Me</a>
</li>
</ul>

<div class = "pageOne">
<h1 class="text-center">Will Cruzan</h1>
</div>

<div class="btnlist text-center">
<a class="btn btn-default" href'#'>Twitter</a>
<a class="btn btn-default" href'#'>GitHub</a>
<a class="btn btn-default" href'#'>CodePen</a>
</div>
</div>
css:
.nav-pills{
font-family: lobster;
font-size:1.7em;
background-color: white;
opacity: .7;
margin-left: -1%;
margin-right: -1%;
}
.btn-default{
background-color: black;
border-color: black;
font-size: 1.7em;
}
background-color: blue;

.title{
font-family: lobster;
padding: 0px;
margin-top: 50px;
}
body {
background-image:url("https://images2.alphacoders.com/683/thumb-1920-68370.jpg");
background-size:cover;
height: 800px;
}

.float-right {
background-color: white;
}

.float-left{
background-color: white;
}

I cant seem to change the h1 text font and margin (sorry if this a lot)

Gulsvi
@gulsvi
Apr 24 2017 15:15
@WillTheCruzan can you send a link to your codepen instead? That's a lot of unformatted hard to read code :p
WillTheCruzan
@WillTheCruzan
Apr 24 2017 15:15
oops im sorry
Gulsvi
@gulsvi
Apr 24 2017 15:16
lol, it's okay
Paradox5
@Paradox5
Apr 24 2017 15:16
Ok add an id to the h1
Then margin top it
Or class
Which ever you prefer
WillTheCruzan
@WillTheCruzan
Apr 24 2017 15:16
thats what i did but it wont work
Paradox5
@Paradox5
Apr 24 2017 15:16
Because i dont see any thing related to the h1
Wait a minute
Gulsvi
@gulsvi
Apr 24 2017 15:17
<ul class = "nav nav-pills float-left" <li class="nav-item">
<a class="nav-link active" href="#">Will Cruzan</a>
</ul>
<ul class="nav nav-pills float-right" </li>
<li class="nav-item">
<a class="nav-link active" href="#">About Me</a>
</li>
^^ You have a missing > at the end of your <ul> tags. and your </li> is misplaced on the fourth line. Plus, if you float all of that, your title is going to sit right on top of everything.
Paradox5
@Paradox5
Apr 24 2017 15:17
Do tou want the h1 below the buttons @WillTheCruzan
WillTheCruzan
@WillTheCruzan
Apr 24 2017 15:17
yes
Paradox5
@Paradox5
Apr 24 2017 15:17
Sky
Just move the h1 element below the buttons
Boom
Oh
Or use br
Gulsvi
@gulsvi
Apr 24 2017 15:18
No, do not use <br>....
Paradox5
@Paradox5
Apr 24 2017 15:18
Why not
Gulsvi
@gulsvi
Apr 24 2017 15:18

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/br

Notes

Do not use <br> to increase the gap between lines of text; use the CSS margin property or the <p> element.

Paradox5
@Paradox5
Apr 24 2017 15:19
sigh
TIL
Gulsvi
@gulsvi
Apr 24 2017 15:19
¯\_(ツ)_/¯
WillTheCruzan
@WillTheCruzan
Apr 24 2017 15:25
the issue is that when I add the title class to h1 it doesn't "link" with the css .title
Jesse Jafa
@awareness481
Apr 24 2017 15:26
Hello :). I'm trying to get back to FCC after not doing any programming for two months and I'm trying to recall what I've learned in the past. Could you guys tell me if my use of data is correct here?
https://codepen.io/tstusr/pen/ZKpXQx?editors=1010
I'm trying to get a working early version of the weather app so I can build from there
Paradox5
@Paradox5
Apr 24 2017 15:33
Y
Buhaianu Remus
@Remus432
Apr 24 2017 15:34

function caseInSwitch(val) {
  var answer = "";
  // Only change code below this line
  switch (val) {
    case 1:
      val = "alpha";
      break;
    case 2:
      val = "beta";
      break;
    case 3:
      val = "gamma";
      break;
    case 4:
      val = "delta";
      break;
  }


  // Only change code above this line  
  return answer;  
}

// Change this value to test
caseInSwitch(1);
Can someone help me with it?I am stuck
gulptech
@gulptech
Apr 24 2017 15:36
@Remus432 you are setting val not answer
Buhaianu Remus
@Remus432
Apr 24 2017 15:37
oh
yeah val is the argument
thanks man
Gulsvi
@gulsvi
Apr 24 2017 15:39
@tstusr441 You are using function(data) correctly, but not parsing the JSON correctly. There is no JSON yet either way because you need an API key for your weather API url, and it needs to start with HTTP://. To save you some time as you get back into coding, codepen will start requiring HTTPS:// soon, so it's probably best to choose a different weather API like Weather Underground, Apixu, or Dark Sky. Those are all free and support HTTPS.
Streeter220
@Streeter220
Apr 24 2017 15:47
Hey, i'm having an issue where i'm doing a story on the country "Norway", i've added the national song, but i want the text to break after a couple of words, been trying with <br>, but the sentences are still too long. Thanks for help in advance.
Gulsvi
@gulsvi
Apr 24 2017 15:49
@Streeter220 You can apply a width to the text in your CSS
<br> is meant for poems, addresses, etc. so it should be breaking the line for you. If it isn't maybe there's an error somewhere - show us your code and maybe we can help
WillTheCruzan
@WillTheCruzan
Apr 24 2017 15:50
My h1 wont link with .title any ideas?
Streeter220
@Streeter220
Apr 24 2017 15:50
ah, thanks. i Solved it by giving my <p> a class, and making the width of the div smaller. But will this make any problems?
Jorge
@flawedLogic506
Apr 24 2017 15:50
hey wazzup guys
Gulsvi
@gulsvi
Apr 24 2017 15:51
Morning, Jorge
@Streeter220 That seems like it should work too. Can't really say if it will cause any problems without seeing all of your code, but in general, no, it's a good approach.
Jorge
@flawedLogic506
Apr 24 2017 15:51
all good Sky?
Streeter220
@Streeter220
Apr 24 2017 15:52
@SkyCoder01 , is there a way to center a <p> in the middle of the screen without using margins?
Gulsvi
@gulsvi
Apr 24 2017 15:52
I broke my toe...aside from that, doing just fine
@Streeter220 Use text-align: center on the outer element
Jorge
@flawedLogic506
Apr 24 2017 15:52
you did? that sucks! haha .. do u have a cast?
Gulsvi
@gulsvi
Apr 24 2017 15:53
@WillTheCruzan I think you need to try and use the navbar instead of nav pills. https://v4-alpha.getbootstrap.com/components/navbar/
I tried to write something up quickly for you, but you have some fancy CSS and it's probably better to let you play around with that instead ^^
No cast! Just tape to keep it from moving and a lot of ice, elevation
An air boot I have to wear for 4 weeks....
WillTheCruzan
@WillTheCruzan
Apr 24 2017 15:54
alright thanks @SkyCoder01 !
CamperBot
@camperbot
Apr 24 2017 15:54
willthecruzan sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:star2: 1161 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Jorge
@flawedLogic506
Apr 24 2017 15:55
ahh ok nice .. yeah at least no cast, that's good .. i guess u won't be moving a lot in the next few weeks
Gulsvi
@gulsvi
Apr 24 2017 15:56
I can walk around alright, just have to be careful not to bump my toe into anything.
But yeah, no sports... for a while
Streeter220
@Streeter220
Apr 24 2017 15:58
@SkyCoder01 Tried doing text-align: center to my paragraphs class or id, but didn't center it, what am i doing wrong, haha.
Gulsvi
@gulsvi
Apr 24 2017 15:59
It's really hard to say without seeing more of the code. On a blank page, that should work fine.
Jorge
@flawedLogic506
Apr 24 2017 16:00
yeah .. must suck, i've never broken a bone. One time i kinda dislocated my knee and the popped it back in at the same time, that sucked ..
Gulsvi
@gulsvi
Apr 24 2017 16:00
Ouch, that sounds painful
Streeter220
@Streeter220
Apr 24 2017 16:01
What other options than <br> can i use, i'm trying to divide each verse, works with <br>, but been told i shouldnt use it?
Gulsvi
@gulsvi
Apr 24 2017 16:03

@Streeter220 If it's for a song, that is what <br> is meant for.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/br

The HTML <br> element produces a line break in text (carriage-return). It is useful for writing a poem or an address, where the division of lines is significant.

Poems, street addresses, etc.. That's what it is designed to do :)
Do not use it to make a bunch of vertical space though - use margins.
Anna
@AnnaVih
Apr 24 2017 16:05
guys need help with footer!The footer not lay on the bottom of page.Try few thing it didn't work
Streeter220
@Streeter220
Apr 24 2017 16:06
ah okay, thanks :D
Jorge
@flawedLogic506
Apr 24 2017 16:09
hey Sky .. how did you do the smallest common multiple challenge ? not the code, but how did you tackle the problem?
Jesse Jafa
@awareness481
Apr 24 2017 16:10
Thanks @SkyCoder01
CamperBot
@camperbot
Apr 24 2017 16:10
tstusr441 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:star2: 1162 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Jorge
@flawedLogic506
Apr 24 2017 16:10
@AnnaVih it does lay at the bottom of the page?
Anna
@AnnaVih
Apr 24 2017 16:11
@OrangeKulture no
Gulsvi
@gulsvi
Apr 24 2017 16:11
@OrangeKulture I used the euclidean algorithm to get the Greatest Common Divisor. Wikipedia had some pseudo code that helped me walk through it, I'll try to find the link
Jorge
@flawedLogic506
Apr 24 2017 16:11
@OrangeKulture if I go to your pen and go full page and scroll, then i see the footer at the bottom of your site
@#%^ .. i meant @AnnaVih
@AnnaVih what would you like to do with the footer?
@SkyCoder01 and then you run it through the array of numbers?
Gulsvi
@gulsvi
Apr 24 2017 16:13
least common multiple of a,b = (a*b) / the greatest common divisor of a,b
https://en.wikipedia.org/wiki/Least_common_multiple#Computing_the_least_common_multiple
Kevin S
@TDGA
Apr 24 2017 16:13
I would appreciate it if someone could critique my fast try for the tribute page and tell what I should change.
Gulsvi
@gulsvi
Apr 24 2017 16:13
Yeah, then you run that formula through each number in the array
Jorge
@flawedLogic506
Apr 24 2017 16:13
right .. yeah that makes sense
I was just trying to do it all on my own, you know coming up with the logic .. and I suck at high level math, so i was not aware of that algorithm
well i dont suck, i just havent done any classes or anything
Anna
@AnnaVih
Apr 24 2017 16:14
i want footer lay exactly on the bottom of page...but for the moment there is white space around 3mm between footer and page
Jorge
@flawedLogic506
Apr 24 2017 16:14
@AnnaVih ahh ok ...
hold on
Gulsvi
@gulsvi
Apr 24 2017 16:14
It's boring, but the wikipedia articles on Least Common Multiple, Greatest Common Divisor, and Euclidean Algorithm will help you come up with a good solution
mapacarta
@mapacarta
Apr 24 2017 16:16
@TDGA I don't know much but there are too many container div. One container div is enough I guess
Jorge
@flawedLogic506
Apr 24 2017 16:16
@SkyCoder01 yeah i did already solved it .. but i wrot my own function kinda .. im sure there's ways to make it with less code, but i was trying to do come up with the logic on my own ...
dam was that a mistake :smile: :smile:
Gulsvi
@gulsvi
Apr 24 2017 16:17
lol, bet you learned a lot :)
Kevin S
@TDGA
Apr 24 2017 16:17
@mapacarta yea I need to clean the code up a bit.
Jorge
@flawedLogic506
Apr 24 2017 16:17
@AnnaVih its the margin you have on the <p> elements
gulptech
@gulptech
Apr 24 2017 16:17
i was just typing that
Jorge
@flawedLogic506
Apr 24 2017 16:18
yeah i did .. here is my code in case you wanna tear it apart .. i was sure there was supposed to be a much simpler way .. but anways..
mapacarta
@mapacarta
Apr 24 2017 16:18
@TDGA not sure but you shouldn't nest a container inside another
Jorge
@flawedLogic506
Apr 24 2017 16:19
function smallestCommons(arr) {
  var newArr = [];
  var total, firstRes, secondRes, test;
  var count = 1;
  // sort array smallest to largest
  arr.sort(function(a, b) {
    return a - b;
  });


  // new array with all values between two ints
  for (var i = arr[0]; i <= arr[1]; i++) {
    newArr.push(i);
  }


  for (var d = 0; d < arr.length; d++) {
    test = arr[d] * count;
    while (true) {
      if (testArr(test)) {
        if (arr[d] === arr[0]) {
          firstRes = test;
        } else {
          secondRes = test;
        }
        count = 1;
        break;
      }
      count++;
      test = arr[d] * count;
    }

  }

  if (firstRes === secondRes) {
    console.log(firstRes);
  }


  // function to test if it's divisible by all
  function testArr(val) {
    var score = 0;
    for (var j = 0; j < newArr.length; j++) {
      if (val % newArr[j] === 0) {
        score += 1;
      }
    }
    if (score === newArr.length) {
      return true;
    } else
      return false;
  }

} // end 
smallestCommons([1, 13]);
shit that's long .. sry people for the spam
gulptech
@gulptech
Apr 24 2017 16:19
@AnnaVih the default for bootstrap gives that p tag a bottom margin of 1 rem (at least with bootstrap 4)
Kevin S
@TDGA
Apr 24 2017 16:20
@mapacarta Isn't it ok if I nest two containers inside one so I can change the entire thing and the 2 containers separably?
Gulsvi
@gulsvi
Apr 24 2017 16:21
Love seeing how everyone figures this stuff out. Nice work @OrangeKulture but yeah, maybe more efficient to do it differently. Mine is pretty long too - around 25 lines of code I think.
Jorge
@flawedLogic506
Apr 24 2017 16:22
@SkyCoder01 thanks, yeah .. there's def room for improvement .. i guess we newbs use a lot of loops :smile:
CamperBot
@camperbot
Apr 24 2017 16:22
orangekulture sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:star2: 1163 | @skycoder01 |http://www.freecodecamp.com/skycoder01
mapacarta
@mapacarta
Apr 24 2017 16:23
@TDGA "due to padding and more, neither container is nestable." days bootstrap documents
@TDGA you should use row
Anna
@AnnaVih
Apr 24 2017 16:23
@gulptech and what does it mean?
Jorge
@flawedLogic506
Apr 24 2017 16:24
@SkyCoder01 ... and by we, I mean me ... (insert .okay rage face meme here)
gulptech
@gulptech
Apr 24 2017 16:25
@AnnaVih it means every time you use a <p> element there will be margin added to the bottom (1 rem)
Kevin S
@TDGA
Apr 24 2017 16:25
@mapacarta ok thanks will change it
CamperBot
@camperbot
Apr 24 2017 16:25
:warning: @mapacarta's account is not linked with freeCodeCamp. Please visit the settings and link your GitHub account.
tdga sends brownie points to @mapacarta :sparkles: :thumbsup: :sparkles:
Gulsvi
@gulsvi
Apr 24 2017 16:25
lol, @OrangeKulture :rage4:
gulptech
@gulptech
Apr 24 2017 16:26
@AnnaVih rem is a unit of measure like em, px, etc
Jorge
@flawedLogic506
Apr 24 2017 16:26
hahah
if only cbot would serve our conversation needs by supply the right meme at the right time .. the world would be a better place
Anna
@AnnaVih
Apr 24 2017 16:26
@gulptech yes i know what is rem em px, but how it can help?
gulptech
@gulptech
Apr 24 2017 16:27
@AnnaVih bootstrap adds that to all p tags..so you need to take that into account when using it
@AnnaVih since you used a p tag in your footer...there will be a margin at the bottom
hmm...I am liking the beta of freecode camp so far. I just wish they listed the requirments for the challenges insead of going to the example page and running the tests.
WillTheCruzan
@WillTheCruzan
Apr 24 2017 16:31
how do I make buttons link to a different page?
Derek
@dsoucie
Apr 24 2017 16:31
hi, can someone thats good with JSONP that has a few munutes help me debug a problem I'm having with my twitch API project?
Jorge
@flawedLogic506
Apr 24 2017 16:31
@gulptech how so ? u mean the challenge page with the video?
beta looks promising .. can't wait for the release
gulptech
@gulptech
Apr 24 2017 16:32
yep...i know the videos don't work...but the user stories(requirements) are not listed
Jorge
@flawedLogic506
Apr 24 2017 16:32
i have been wanting to start out on some backend projects .. ive done a lil node and mongo in the past, but i saw they want us to use Cloud 9 .. so im not sure what to use
@gulptech oh right! yeah u can't do much .. i was also hoping they included some more challenges on some other certificates here, but i guess they won't include more content here, if they're working on the beta
mapacarta
@mapacarta
Apr 24 2017 16:41
@AnnaVih thanks for the pen, I cheated a bit :D
Paulo Kembo
@kembolino
Apr 24 2017 16:45
Hello everyone, I'm struggling to add a frame around my page "Tribute Page" ! Any help will be appreciate. Thanks a lot. Regards.
Jorge
@flawedLogic506
Apr 24 2017 16:45
cbot should at least say what it can do .. dont u think?
CamperBot
@camperbot
Apr 24 2017 16:45
you called?
Jorge
@flawedLogic506
Apr 24 2017 16:45
list functions
Gulsvi
@gulsvi
Apr 24 2017 16:45
commands
CamperBot
@camperbot
Apr 24 2017 16:45

commands:

  • isCommand
  • cbot
  • botversion
  • botstatus
  • botenv
  • archive
  • init
  • tooNoisy
  • rooms
  • find
  • commands
  • music
  • announce
  • eightball
  • wiki
  • thanks
  • about
  • showInfoCallback
  • explain
  • bot
  • hi
  • index
  • thank
  • log
  • archives
Gulsvi
@gulsvi
Apr 24 2017 16:45
:)
Jorge
@flawedLogic506
Apr 24 2017 16:45
umm ok .. thats someting
hahah maan i would love to work on AI
Anna
@AnnaVih
Apr 24 2017 16:46
@mapacarta ??
Gulsvi
@gulsvi
Apr 24 2017 16:46
@kembolino You might be interested in the Jumbotron class: http://v4-alpha.getbootstrap.com/components/jumbotron/
JD Tadlock
@jdtdesigns
Apr 24 2017 16:46
cbot knows all :D
CamperBot
@camperbot
Apr 24 2017 16:46
you called?
Jorge
@flawedLogic506
Apr 24 2017 16:46
@mapacarta ?? (..suspenseful music...)
can we get explanation of commands on chat?
Gulsvi
@gulsvi
Apr 24 2017 16:47
I don't think half of those commands work, I tried them in camperbotplayground the other day. Maybe some of them are specific to certain rooms.
Jorge
@flawedLogic506
Apr 24 2017 16:48
the very essence of cbot resides within FCC, tho .. yes? :D
camperbot play ground sounds fun ..
Gulsvi
@gulsvi
Apr 24 2017 16:48
pure joy :joy:
Jorge
@flawedLogic506
Apr 24 2017 16:49
hahah yeah .. if i ever become a decent coder, i'd love to play around with some AI logic, definitely fun for me
mapacarta
@mapacarta
Apr 24 2017 16:49
@AnnaVih I was having a hard time in building personal portfolio task, I was about to quit making it. I saw your pen and it helped me. so thanks
CamperBot
@camperbot
Apr 24 2017 16:49
mapacarta sends brownie points to @annavih :sparkles: :thumbsup: :sparkles:
:cookie: 227 | @annavih |http://www.freecodecamp.com/annavih
WillTheCruzan
@WillTheCruzan
Apr 24 2017 16:49
<div class="btnlist text-center">
<a class="btn btn-default" href'#'>Twitter</a>
<a class="btn btn-default" href'#'>GitHub</a>
<a class="btn btn-default" href'#'>CodePen</a>
</div>
How can I make these buttons links?
Jorge
@flawedLogic506
Apr 24 2017 16:49
href?
WillTheCruzan
@WillTheCruzan
Apr 24 2017 16:50
oh my bad im stupid
JD Tadlock
@jdtdesigns
Apr 24 2017 16:50
@SkyCoder01 @OrangeKulture Building chat bots for streaming services is a great way to get started with some basic AI ;)
Gulsvi
@gulsvi
Apr 24 2017 16:50
Not stupid @WillTheCruzan :) just coding.
Jorge
@flawedLogic506
Apr 24 2017 16:50
@jdtdesigns oh man .. that sounds awesome, have you done any yourself?
One of the first ^^
Anna
@AnnaVih
Apr 24 2017 16:51
@mapacarta you are welcome... i did not sleep 2 nights for it=)))
Jorge
@flawedLogic506
Apr 24 2017 16:51
have u guys seen the tshirt that says ... hold on, let me find it
Gulsvi
@gulsvi
Apr 24 2017 16:52
Nope, haven't seen that one
Jorge
@flawedLogic506
Apr 24 2017 16:52
t
bloodprisom
@bloodprisom
Apr 24 2017 16:52
www
Gulsvi
@gulsvi
Apr 24 2017 16:52
hahaha
bloodprisom
@bloodprisom
Apr 24 2017 16:53
hahahaha
JD Tadlock
@jdtdesigns
Apr 24 2017 16:53
@OrangeKulture A few. I currently have one that i'm working on in my free time. Here's a couple of vids I streamed to youtube. I'll probably keep adding them as I had about 30 people show up in chat to watch lol.
https://www.youtube.com/watch?v=GRuhtODBFd8
Jorge
@flawedLogic506
Apr 24 2017 16:53
really cracks me up
@jdtdesigns oh shit dude, for sure .. that's awesome
gonna watch them
what environment do you use?
mapacarta
@mapacarta
Apr 24 2017 16:55
@AnnaVih still too ugly
JD Tadlock
@jdtdesigns
Apr 24 2017 16:56
it's a mix of quite a few things (Conemu, Sublime, cygwin, linux shells, xmpp clients, irssi clients) @OrangeKulture
took awhile to get a nice env together on windows
Anna
@AnnaVih
Apr 24 2017 16:57
@mapacarta so you can change it now)
JD Tadlock
@jdtdesigns
Apr 24 2017 16:57
i have a nice one on a mac at work too :D
Jorge
@flawedLogic506
Apr 24 2017 16:58
@jdtdesigns that sounds awesome .. hopefully one day
Redfox403
@Redfox403
Apr 24 2017 16:59
<div class="row">

<div class="col-md-16"><button type="button" class="btn btn-primary btn-lg"><i class="fa fa-facebook"></i></button></div>
<div class="col-md-16"><button type="button" class="btn btn-primary btn-lg"><i class="fa fa-instagram"></i></button></div>


<div class="col-md-16"><button type="button" class="btn btn-primary btn-lg"><i class="fa fa-linkedin"></i></button></div>

</div>
I'm trying to build this profile back but none of my bootstrap is working. thoughts?
*Profile page
Sandesh Shrestha
@UnovaXan
Apr 24 2017 17:00
@Redfox403 did you import the fa css file?
font-awesome.min.css i think its called
```
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
also you can't have col-md-16
the max no. of rows is 12
Redfox403
@Redfox403
Apr 24 2017 17:02
I thought I did. This is the link I have on my page: //maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css
ahh gotcha.
I didn't know there was a limit.
Sandesh Shrestha
@UnovaXan
Apr 24 2017 17:03
@Redfox403 the numbers in any particular row must always add up to 12
that's how the grid works
WillTheCruzan
@WillTheCruzan
Apr 24 2017 17:03
whats the coding to make a new tab when openning a link?
drowningpool5
@drowningpool5
Apr 24 2017 17:04
Hi guys! Can someone help me with minimax algorithm? ty :))
Sandesh Shrestha
@UnovaXan
Apr 24 2017 17:04
so if you have one col-md-4 another should be col-md-8
Redfox403
@Redfox403
Apr 24 2017 17:04
@UnovaXan Thanks!
CamperBot
@camperbot
Apr 24 2017 17:04
redfox403 sends brownie points to @unovaxan :sparkles: :thumbsup: :sparkles:
:cookie: 272 | @unovaxan |http://www.freecodecamp.com/unovaxan
Gulsvi
@gulsvi
Apr 24 2017 17:04
@WillTheCruzan target="_blank"
drowningpool5
@drowningpool5
Apr 24 2017 17:04
I am stuck... and I don't want to watch other people's code and complete Tic Tac Toe's AI
Sandesh Shrestha
@UnovaXan
Apr 24 2017 17:04
@WillTheCruzan target="_blank"
WillTheCruzan
@WillTheCruzan
Apr 24 2017 17:04
thanks @UnovaXan and @SkyCoder01
CamperBot
@camperbot
Apr 24 2017 17:04
willthecruzan sends brownie points to @unovaxan and @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 273 | @unovaxan |http://www.freecodecamp.com/unovaxan
:star2: 1165 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Sandesh Shrestha
@UnovaXan
Apr 24 2017 17:05
cbot
CamperBot
@camperbot
Apr 24 2017 17:05
you called?
Sandesh Shrestha
@UnovaXan
Apr 24 2017 17:05
hey cbot
cbot hey
CamperBot
@camperbot
Apr 24 2017 17:05
you called?
drowningpool5
@drowningpool5
Apr 24 2017 17:06
cbot slut
CamperBot
@camperbot
Apr 24 2017 17:06
you called?
Sandesh Shrestha
@UnovaXan
Apr 24 2017 17:06
@drowningpool5 XD
drowningpool5
@drowningpool5
Apr 24 2017 17:06
it listens well
Sandesh Shrestha
@UnovaXan
Apr 24 2017 17:06
haha
JD Tadlock
@jdtdesigns
Apr 24 2017 17:08
@OrangeKulture You'll also get some real seasoned devs coming into your chat. I had a 15 year dev come in and give me tips. I ALWAYS take tips from these guys/girls. The information will usually take you to the next level. ;)
Redfox403
@Redfox403
Apr 24 2017 17:09
I changed the link and the grid but it still looks wrong. All my buttons are showing like a list on the left side of my screen..
drowningpool5
@drowningpool5
Apr 24 2017 17:09
guys any tips on Tic Tac Toe?
Gulsvi
@gulsvi
Apr 24 2017 17:12
@Redfox403 Click on "Settings" in codepen, then click on "CSS". Add this link to bootstrap: https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
Jorge
@flawedLogic506
Apr 24 2017 17:12
@jdtdesigns oh yeah for sure .. i bet it's really good. Even at my level, you get to learn a lot from other ppl
Redfox403
@Redfox403
Apr 24 2017 17:13
@SkyCoder01 you're a saint. Thanks!
CamperBot
@camperbot
Apr 24 2017 17:13
redfox403 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:star2: 1166 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Gulsvi
@gulsvi
Apr 24 2017 17:15
:angel:
JD Tadlock
@jdtdesigns
Apr 24 2017 17:15
@OrangeKulture How many years have you been coding?
Tom
@moT01
Apr 24 2017 17:16
@drowningpool5 my process was, ...have the computer check for winning moves... check for blocking moves, and i just added a few cases other than those two, ...hit center if its open, or hit a corner if its open, ...its almost unbeatable
Jorge
@flawedLogic506
Apr 24 2017 17:16
@jdtdesigns not too many at all .. maybe 2 on and off , i've started full time learning less than a year ago
or about a year .. i did a lot of reading on a lot of stuff, before i decided to really just do this
played around with LUA and corona for about another year, before all of this probs .. that's a lot of fun too
Jesse Jafa
@awareness481
Apr 24 2017 17:23

How do I get temp_f from this api? I'm using

 $.ajax({
      url: "https://http://api.wunderground.com/api/31b64aae5013a9b7/conditions/q/37.776289,-122.395234.json",
      dataType: "jsonp",
      success: function(data) {
        var temp_f = data["current_observation"]["temp_f"];
        console.log(temp_f);
        $("#temperature").html(temp_f);
      }
    });

API: http://api.wunderground.com/api/31b64aae5013a9b7/conditions/q/37.776289,-122.395234.json

JD Tadlock
@jdtdesigns
Apr 24 2017 17:24
@OrangeKulture Nice, the journey never ends :P
Jesse Jafa
@awareness481
Apr 24 2017 17:27
Nevermind, had an error in my URL :P
Pagnito
@Pagnito
Apr 24 2017 17:30
hey can someone explain to me this code i found, i cant figure out there more complicated conditions inside the filter() and how return false and return true is working here
function whatIsInAName(collection,source) {
  // What's in a name?
  var arr = [];
  var keys = Object.keys(source);
  var filtered = collection.filter(function(item1){

    for(var key in source){
      if(source[key]!==item1[key])

        return false;
       console.log(item1[key])
    }
    return true;

  })
  console.log(filtered)
}
and why does item1[key] works, isnt it only supposed to apply to source
JD Tadlock
@jdtdesigns
Apr 24 2017 17:34
@Pagnito Do you know how .filter() works in general?
Pagnito
@Pagnito
Apr 24 2017 17:35
yea i think, it filter out all the elements that pass a certain condition
Pagnito
@Pagnito
Apr 24 2017 17:40
@jdtdesigns still there?
JD Tadlock
@jdtdesigns
Apr 24 2017 17:41
@Pagnito In a business call. Be back in just a minute.
Pagnito
@Pagnito
Apr 24 2017 17:42
k
JD Tadlock
@jdtdesigns
Apr 24 2017 17:55
@Pagnito The filter iterates over the array and returns each item one by one to the callback function. You can then use the data inside each of the array values to either remove that value by returning false or keeping it by returning true.
So they're iterating over the collection and for each value in the collection array, they're looping over the source array and checking if the current collection object key matches the key in the source object. If they do, remove that object from the collection, else keep it there.
Pagnito
@Pagnito
Apr 24 2017 17:59
how come item1[key] works tho, isnt key only applies to for in loop for source?
Matt
@Misaiah
Apr 24 2017 17:59
Hello all!
can someone here help me with PHP?
JD Tadlock
@jdtdesigns
Apr 24 2017 18:00
@Misaiah what's the question?
key is the current key in the collection object @Pagnito
Matt
@Misaiah
Apr 24 2017 18:01
@jdtdesigns I was wondering, is the only significance in using PHP establishing the linkage between a server and a website?
JD Tadlock
@jdtdesigns
Apr 24 2017 18:01
it's a string value of the key, so you can pass it to the source loop too
Pagnito
@Pagnito
Apr 24 2017 18:01
@jdtdesigns but it was declared in the for in source
JD Tadlock
@jdtdesigns
Apr 24 2017 18:02
correct, so you can use it inside the for anywhere you plase @Pagnito ;)
Matt
@Misaiah
Apr 24 2017 18:02
I have created a site, and am trying to complete my contact us form and dont see a way around using PHP. I feel that it would be necessary in using it because it never hurts to learn I suppose @jdtdesigns
Pagnito
@Pagnito
Apr 24 2017 18:02
@jdtdesigns ah
Matt
@Misaiah
Apr 24 2017 18:02
and I know nothing about PHP
JD Tadlock
@jdtdesigns
Apr 24 2017 18:02
@Misaiah If it's just a contact form, you don't need php.
Matt
@Misaiah
Apr 24 2017 18:03
but to link the informatino submitted in the contact form to an email....still no need for PHP?
JD Tadlock
@jdtdesigns
Apr 24 2017 18:03
@Misaiah use this:
<form action="https://formspree.io/your@email.com"
      method="POST">
    <input type="text" name="name">
    <input type="email" name="_replyto">
    <input type="submit" value="Send">
</form>
Matt
@Misaiah
Apr 24 2017 18:03
its that easy?
JD Tadlock
@jdtdesigns
Apr 24 2017 18:03
yep, formspree service is great for simple data that needs to passed to an email
it handles the backend for you
Matt
@Misaiah
Apr 24 2017 18:04
Do I have to sign up for the formspree service?
JD Tadlock
@jdtdesigns
Apr 24 2017 18:04
just don't use it for secure stuff like credit cards and such
nope @Misaiah works out of the box ;)
Matt
@Misaiah
Apr 24 2017 18:04
okay. And in that case, PHP would be recommended?
JD Tadlock
@jdtdesigns
Apr 24 2017 18:05
php or any other backend will be used for that @Misaiah
you'd need to do token verification with your payment service before taking/charging payments
Matt
@Misaiah
Apr 24 2017 18:06
okay. and you can embed PHP in an html file right? or do you have to creat an external php document linked to the html?
JD Tadlock
@jdtdesigns
Apr 24 2017 18:06
php isn't html, but you can write html inside a php file
so no, you can't just write php in static html
won't work
Matt
@Misaiah
Apr 24 2017 18:07
so it would be best to use <link.....rel....type/>?
basically to creat a .php file?
and linke it to the html?
link*
Pagnito
@Pagnito
Apr 24 2017 18:08
@jdtdesigns one thing i still dont uderstand is in the third case, the source object has two keys and one matches all three collection objects, but it should return only the ones that have both the keys of the source
whatIsInAName([{ "a": 1, "b": 2 }, { "a": 1 }, { "a": 1, "b": 2, "c": 2 }], { "a": 1, "b": 2 })
JD Tadlock
@jdtdesigns
Apr 24 2017 18:08
if the server has php installed, then you can submit to a php file and the php file can handle the request
@Misaiah
Matt
@Misaiah
Apr 24 2017 18:08
I think I understand. I am just trying to link my site to my gmail and thought the only way around that is PHP
JD Tadlock
@jdtdesigns
Apr 24 2017 18:09
@Misaiah That's more complex as google requires oauth verification before sharing account data with sites
@Pagnito link me to the fcc challenge please
Gulsvi
@gulsvi
Apr 24 2017 18:10
@Misaiah If you use your gmail with your contact form, use a burner account or bots will send you lots of spam :p
Matt
@Misaiah
Apr 24 2017 18:10
Hmmm. do you recomend me creating another email from a different server @jdtdesigns ?
a burner account? @SkyCoder01
Gulsvi
@gulsvi
Apr 24 2017 18:11
Set u a new gmail.com email account
Pagnito
@Pagnito
Apr 24 2017 18:11
@jdtdesigns the code works, but i still cant understand how it filters out the ones that have all the keys matching source
JD Tadlock
@jdtdesigns
Apr 24 2017 18:11
just create a contact_submission@gmail.com account @Misaiah
Jaizon Carlos
@Jaizon
Apr 24 2017 18:11
Can anyone help me here? Navs are pretty hard to me so I got one from Bootstraps documentation and changed as I wanted, but now I see that when it collapses it just disappear and there's no button to make it visible again
Gulsvi
@gulsvi
Apr 24 2017 18:12
One that you don't mind getting spam on. Bots scan web pages for email addresses and send junk mail
Matt
@Misaiah
Apr 24 2017 18:12

I see. good Idea! and I can use that with :smile:

<form action="https://formspree.io/contact_submission@gmail.com" method="POST">
Text <input type="text" name="name">
Email <input type="email" name="_replyto">
<input type="submit" value="Send">

@SkyCoder01 @jdtdesigns ?
JD Tadlock
@jdtdesigns
Apr 24 2017 18:12
correct
Gulsvi
@gulsvi
Apr 24 2017 18:12
Yes :)
Matt
@Misaiah
Apr 24 2017 18:13
awesome! thank you guys!! @SkyCoder01 @jdtdesigns
CamperBot
@camperbot
Apr 24 2017 18:13
misaiah sends brownie points to @skycoder01 and @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 919 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
:star2: 1167 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Gulsvi
@gulsvi
Apr 24 2017 18:19

@Jaizon I think navbar-dark is from a previous alpha version of Bootstrap 4. If you replace your first line of code with this, it will work:

<nav class="navbar navbar-toggleable-md navbar-inverse bg-faded">
    <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNav1" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
      </button>
    <a class="navbar-brand" href="#">Navbar</a>

You'll also need to add jQuery and Bootstrap.js to the JavaScript settings in your codepen.

Gulsvi
@gulsvi
Apr 24 2017 18:21
@Jaizon Actually, use navbar-inverse instead of navbar-light in that example above (edited)
WillTheCruzan
@WillTheCruzan
Apr 24 2017 18:22
How do I change the color of the text in a nav bar? I cant get it to change.
http://codepen.io/WillTheCruzan/pen/qmaBvP?editors=1100
JD Tadlock
@jdtdesigns
Apr 24 2017 18:23
I cleaned up unnecessary code and added some comments to maybe help you @Pagnito
function whatIsInAName(collection, source) {
  return collection.filter(function(obj) {
    var key;
    for ( key in source ) {
      // if value of source['first'] doesn't match value of obj['first]
      // remove the object from the collection
      // the value of the first object in the collection matching obj['first'] is Romeo
      if(source[key]!==obj[key])

        return false;
    }
    return true;

  });
}
Gulsvi
@gulsvi
Apr 24 2017 18:23
@WillTheCruzan In your CSS, use this:
.navbar-light .navbar-nav .nav-link {
    color: purple; /* or whatever color you want :) */
}
WillTheCruzan
@WillTheCruzan
Apr 24 2017 18:23
ohhhh ok
Gulsvi
@gulsvi
Apr 24 2017 18:25

You'll have to apply a similar CSS for the active element and the brand element. Like:

.navbar-light .navbar-nav .nav-link {
  color: purple; /* or whatever color you want :) */
}

.navbar-light .navbar-nav .nav-link.active {
  color: green;
}

.navbar-light .navbar-brand {
  color: red;
}

Best way to figure this stuff out is to right-click the element and choose "Inspect" to see how it is styled by bootstrap.

Jaizon Carlos
@Jaizon
Apr 24 2017 18:26
@SkyCoder01 I changed that but still, when it collapses the button now shows up, but the drop down menu doesn't appear when clicked
Gulsvi
@gulsvi
Apr 24 2017 18:27
@Jaizon Did you add jQuery and Bootstrap.js to the JavaScript settings in your codepen?
Jaizon Carlos
@Jaizon
Apr 24 2017 18:27
yep
Gulsvi
@gulsvi
Apr 24 2017 18:27
nvm, I see you did - make sure that jQuery is listed first - above bootstrap.js
Jaizon Carlos
@Jaizon
Apr 24 2017 18:28
@SkyCoder01 Oh, thank you, now it works
CamperBot
@camperbot
Apr 24 2017 18:28
jaizon sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:star2: 1168 | @skycoder01 |http://www.freecodecamp.com/skycoder01
WillTheCruzan
@WillTheCruzan
Apr 24 2017 18:29
thanks @SkyCoder01 ! Also, how would I change the color of the navbar-brand?
CamperBot
@camperbot
Apr 24 2017 18:29
willthecruzan sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:star2: 1169 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Pagnito
@Pagnito
Apr 24 2017 18:29
@jdtdesigns so when it goes over the second object in collection which didnt get get pushed out the first time, then it doesnt find the 2nd source key in it and so then it pushes it out
Gulsvi
@gulsvi
Apr 24 2017 18:31
@WillTheCruzan I put it up there in that second CSS example, it's the third one listed. Practice using your developer tools inspector and see if you can find it - really helpful for future projects. Great work on the new navbar, by the way.
@Pagnito It may help to use a smaller data set and play around with it in a codepen to see what's going on. .every() would be a better choice inside that filter, IMO - returns true or false based on a condition without you having to set up a for..in loop with a condition that returns false.
(don't let me jump in and confuse though :) )
JD Tadlock
@jdtdesigns
Apr 24 2017 18:37
@SkyCoder01 Post your .every example for him too. ;)
Gulsvi
@gulsvi
Apr 24 2017 18:38
  return collection.filter(prop => {
    return Object.keys(source).every(name => {
      return prop[name] && prop[name] === source[name];
    });
  });
I realize now I should have used .hasOwnProperty(), but it worked at the time.
JD Tadlock
@jdtdesigns
Apr 24 2017 18:40
and you throw in es6 just for kicks too lol
Gulsvi
@gulsvi
Apr 24 2017 18:40
started doing that about halfway through the challenges lol
I thought for...in was ES6? Maybe for..of?
for..in definitely not ES6 lol
JD Tadlock
@jdtdesigns
Apr 24 2017 18:44
yeah for in is old school
Pagnito
@Pagnito
Apr 24 2017 18:45
sry stepped away for some food, ok, yea i see, i seen the every method and i think i understand that solution, but i also wanted to understand the other one too
aceroAD
@aceroAD
Apr 24 2017 18:48
can you add css to bootstrap clases?
Gulsvi
@gulsvi
Apr 24 2017 18:52
@aceroAD Yes, you can
Buhaianu Remus
@Remus432
Apr 24 2017 18:58

var count = 0;

function cc(card) {
  // Only change code below this line


  return "Change Me";
  // Only change code above this line
}

// Add/remove calls to test your function.
// Note: Only the last will display
cc(2); cc(3); cc(7); cc('K'); cc('A');
How the hell I have to make it?I tried using switch and if and else statements and didn't work
You will write a card counting function. It will receive a card parameter and increment or decrement the global count variable according to the card's value (see table). The function will then return a string with the current count and the string "Bet" if the count is positive, or "Hold" if the count is zero or negative. The current count and the player's decision ("Bet" or "Hold") should be separated by a single space.
JD Tadlock
@jdtdesigns
Apr 24 2017 18:59
@Remus432 I don't see any of your code. Can you post what you've done so far?
Buhaianu Remus
@Remus432
Apr 24 2017 19:02

var count = 0;

function cc(card) {
// Only change code below this line
if (card == 2,3,4,5,6) {
count++;
return count + " Bet";
}

else if (card == 7,8,9) {
return count + " Hold";
}

return "Change Me";
// Only change code above this line
}

// Add/remove calls to test your function.
// Note: Only the last will display
cc(2); cc(3); cc(7); cc('K'); cc('A');


var count = 0;

function cc(card) {
  // Only change code below this line
  if (card == 2,3,4,5,6) {
    count++;
    return count + " Bet";
  }

  else if (card == 7,8,9) {
    return count + " Hold";
  } 

  return "Change Me";
  // Only change code above this line
}

// Add/remove calls to test your function.
// Note: Only the last will display
cc(2); cc(3); cc(7); cc('K'); cc('A');
Gulsvi
@gulsvi
Apr 24 2017 19:06
@Remus432 Comparisons can't be used like that. For example, 2 == 2,3,4,5,6 would return false because 2 is not equal to 2,3,4,5,6.
2 is greater than 1 and less than 7 though (hint)
alfredim88
@alfredim88
Apr 24 2017 19:06
sky
need help here
Gulsvi
@gulsvi
Apr 24 2017 19:07
You're at twitch already? :) you've been coding!
alfredim88
@alfredim88
Apr 24 2017 19:07
why is my variable i is undefined?
yeah man
:D
JD Tadlock
@jdtdesigns
Apr 24 2017 19:07
@SkyCoder01 Don't you wish we could chain operations like that lol
Gulsvi
@gulsvi
Apr 24 2017 19:07
lol, would make things convenient if JS could just read our minds a little more :)
@alfredim88 This is a good read on why that's not working for you: http://stackoverflow.com/questions/13343340/calling-an-asynchronous-function-within-a-for-loop-in-javascript
TL;DR, use a .forEach() instead of a for loop.
alfredim88
@alfredim88
Apr 24 2017 19:09
good hint
Thank's @SkyCoder01
CamperBot
@camperbot
Apr 24 2017 19:09
alfredim88 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:star2: 1170 | @skycoder01 |http://www.freecodecamp.com/skycoder01
alfredim88
@alfredim88
Apr 24 2017 19:09
But can you explain me why the streamers variable is scooped and the i is not?
Gulsvi
@gulsvi
Apr 24 2017 19:10
the i is the variable that's changing on every loop
streamers is the same array with the same elements inside the whole time
Try this and you'll see the same issue:
for (var i = 0; i < 10; i++) {
  setTimeout(function() {
    console.log(i)
  });
}
alfredim88
@alfredim88
Apr 24 2017 19:12
not clear yet
but i will read about it
take a look at my wiki challenge
Anna
@AnnaVih
Apr 24 2017 19:16
CAN i use background image in CodePan ???
alfredim88
@alfredim88
Apr 24 2017 19:16
yes
Gulsvi
@gulsvi
Apr 24 2017 19:16
@alfredim88 Nice work. Try hitting the "Tidy" button for your code - it will help make it more readable. The down arrow, in the top, right-hand corner of the HTML, JS, and CSS panels. "Tidy HTML", "Tidy CSS", "Tidy JS", there's also an analyze option that will give some pointers.
alfredim88
@alfredim88
Apr 24 2017 19:17
ok Thank you @SkyCoder01
CamperBot
@camperbot
Apr 24 2017 19:17
alfredim88 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:warning: alfredim88 already gave skycoder01 points
alfredim88
@alfredim88
Apr 24 2017 19:17
nice tips!
Gulsvi
@gulsvi
Apr 24 2017 19:17
Those settings have helped me a bunch
alfredim88
@alfredim88
Apr 24 2017 19:37
made it! thank you @SkyCoder01
CamperBot
@camperbot
Apr 24 2017 19:37
alfredim88 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:warning: alfredim88 already gave skycoder01 points
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:37
I cant get my navbar to go to the very top of the page
alfredim88
@alfredim88
Apr 24 2017 19:37
margin = 0
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:38
i did that
alfredim88
@alfredim88
Apr 24 2017 19:38
body margin
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:38
oh the body has a margin?
alfredim88
@alfredim88
Apr 24 2017 19:38
yes
try it
Paulo Kembo
@kembolino
Apr 24 2017 19:38
@SkyCoder01 Thanks, I'll have a look !
CamperBot
@camperbot
Apr 24 2017 19:38
kembolino sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:star2: 1171 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Gulsvi
@gulsvi
Apr 24 2017 19:39
@WillTheCruzan Add the fixed-top class to your navbar
I'm guessing you mean you want to keep it at the top when you scroll?
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:39
well the nav bar is like 20 pixels below the top of the page
alfredim88
@alfredim88
Apr 24 2017 19:40
have you tried the body margin = 0?
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:40
yes
alfredim88
@alfredim88
Apr 24 2017 19:40
not working?
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:40
yea
alfredim88
@alfredim88
Apr 24 2017 19:40
good
:)
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:41
yes as in yes to not working
alfredim88
@alfredim88
Apr 24 2017 19:41
LOL
paste your link here
Gulsvi
@gulsvi
Apr 24 2017 19:41
:joy:
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:41
lol
Gulsvi
@gulsvi
Apr 24 2017 19:41
Time to share code :p
alfredim88
@alfredim88
Apr 24 2017 19:43
you don't have the body margin = 0
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:43
i dont?
oh i think i forgot to hit save
Gulsvi
@gulsvi
Apr 24 2017 19:47
@WillTheCruzan hint* <div class="first-page">
alfredim88
@alfredim88
Apr 24 2017 19:48
yeah!
that's wky the body margin is not working
gulptech
@gulptech
Apr 24 2017 19:48
@WillTheCruzan just add fixed-top class to the navbar like @SkyCoder01 said
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:48
got it! thanks @SkyCoder01 and @alfredim88
CamperBot
@camperbot
Apr 24 2017 19:48
willthecruzan sends brownie points to @skycoder01 and @alfredim88 :sparkles: :thumbsup: :sparkles:
:star2: 1172 | @skycoder01 |http://www.freecodecamp.com/skycoder01
:cookie: 268 | @alfredim88 |http://www.freecodecamp.com/alfredim88
alfredim88
@alfredim88
Apr 24 2017 19:49
what is brownie points?
gulptech
@gulptech
Apr 24 2017 19:49
points given when you say thanks to someone
alfredim88
@alfredim88
Apr 24 2017 19:50
that's it?
Gulsvi
@gulsvi
Apr 24 2017 19:50
If you get enough brownie points, you get a free trip to Las Vegas :)
(not really)
alfredim88
@alfredim88
Apr 24 2017 19:50
lol
do you get any acess because of brownie points?
Gulsvi
@gulsvi
Apr 24 2017 19:51
No, they're worthless :)
alfredim88
@alfredim88
Apr 24 2017 19:51
lol ok
Gulsvi
@gulsvi
Apr 24 2017 19:51
You get one for every challenge you complete and every time someone says thanks
alfredim88
@alfredim88
Apr 24 2017 19:51
it's nice to be apreciated
Gulsvi
@gulsvi
Apr 24 2017 19:52
That's true
alfredim88
@alfredim88
Apr 24 2017 19:52
gonna finish my challenge
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:52
I have the whole day to code tomorrow because im still sick
alpox
@alpox
Apr 24 2017 19:53
@SkyCoder01 Hmm i think they can be good to show off for job applications, but nothing more
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:53
are any of you guys in school?
Gulsvi
@gulsvi
Apr 24 2017 19:53
Yeah
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:54
what grade are you in?
Gulsvi
@gulsvi
Apr 24 2017 19:54
I'm in college
alpox
@alpox
Apr 24 2017 19:54
@WillTheCruzan College, halftime
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:54
what are you guys going to college for?
gulptech
@gulptech
Apr 24 2017 19:55
@WillTheCruzan change the from margin-top to padding-top .pageOne
Gulsvi
@gulsvi
Apr 24 2017 19:55
Linguistics
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:55
no idea what that is lol
Gulsvi
@gulsvi
Apr 24 2017 19:55
Study of languages :)
alpox
@alpox
Apr 24 2017 19:55
@SkyCoder01 Oh rly? My friend studies linguistics of russian and german :D
Gulsvi
@gulsvi
Apr 24 2017 19:55
Or, as some say, getting ready to be a barrista when I graduate lol
gulptech
@gulptech
Apr 24 2017 19:56
now if he could only speak more than english it would be great :)
Gulsvi
@gulsvi
Apr 24 2017 19:56
I study Romance Linguistics, spanish italian portuguese, etc..
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:56
thanks @gulptech
CamperBot
@camperbot
Apr 24 2017 19:56
willthecruzan sends brownie points to @gulptech :sparkles: :thumbsup: :sparkles:
:cookie: 303 | @gulptech |http://www.freecodecamp.com/gulptech
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:57
when i get into high school im going to take coding classes
Gulsvi
@gulsvi
Apr 24 2017 19:58
I wish I did that, just took typing classes lol
WillTheCruzan
@WillTheCruzan
Apr 24 2017 19:59
lol
what does <meta> do?
WillTheCruzan
@WillTheCruzan
Apr 24 2017 20:14
http://codepen.io/WillTheCruzan/pen/qmaBvP
I cant get rid of the white space any suggestions?
alpox
@alpox
Apr 24 2017 20:17
@SkyCoder01 Hmm i have enough coding classes now :D with studies in CS
Paradox5
@Paradox5
Apr 24 2017 20:18
Sky ive been meaning to ask
Whats your wpm
Gulsvi
@gulsvi
Apr 24 2017 20:18
@alpox lol, I can imagine. My roommate is a CS major
alpox
@alpox
Apr 24 2017 20:18
@SkyCoder01 Cool :D does he help you code?
Gulsvi
@gulsvi
Apr 24 2017 20:18
@Paradox5 Around 70 unless I take one of those typing tests online and do it over and over lol
Paradox5
@Paradox5
Apr 24 2017 20:19
Cool
Gulsvi
@gulsvi
Apr 24 2017 20:19
@alpox Yeah, he helps a lot, we go to a JavaScript meetup on the weekends too
alpox
@alpox
Apr 24 2017 20:19
@SkyCoder01 Cool :D ive never been to any meetups. Is it worth it?
I'm not even sure if there are any in switzerland
Gulsvi
@gulsvi
Apr 24 2017 20:19
He's the one who got me to sign up for free code camp, so I could understand what he was talking about lol
alpox
@alpox
Apr 24 2017 20:19
Ah :D nice. And you like it enough to stay?
Gulsvi
@gulsvi
Apr 24 2017 20:19
The one we go to is great - like 150 people :)
Paradox5
@Paradox5
Apr 24 2017 20:20
So many :smile: faces
alpox
@alpox
Apr 24 2017 20:20
Cool thing :D and what do you do at such meetups?
Gulsvi
@gulsvi
Apr 24 2017 20:20
Yeah, I have to admit though, i like the design side of things much more than the coding
We just sit around, drink coffee, beer and work on code on our laptops
chat with people about problems we have and usually someone say - oh someone over here can help you with that!
Paradox5
@Paradox5
Apr 24 2017 20:20
Sounds beautiful
Gulsvi
@gulsvi
Apr 24 2017 20:21
Then we sit down, go over each others code and help each other out. It's fun
alpox
@alpox
Apr 24 2017 20:21
This sounds cool, right :D
Gulsvi
@gulsvi
Apr 24 2017 20:22
You can always try to start one? That probably would look good for a job too
@alpox Not sure how close you are to Zurich, but https://www.meetup.com/opentechschool-zurich/
At least some people who might want to do another meetup :)
alpox
@alpox
Apr 24 2017 20:45
@SkyCoder01 I go to university to zurich :D
@SkyCoder01 Sounds cool, but they seem to prefer C++ :D
Paradox5
@Paradox5
Apr 24 2017 20:49
Ive never seen a sentence from you without a smile @alpox
:smiley:
Federico Dente
@fez994
Apr 24 2017 20:49
Hi guys, i have a table with 9 td, how do i randomly display an "X" or an "O" on them?
Gulsvi
@gulsvi
Apr 24 2017 20:51
@fez994 A loop?
If it's jquery, you can loop through all elements with a class name or tag (<td> using $.each
otherwise, with vanilla js, getElementsByClassName or getElementsByTagName and use a for loop
Federico Dente
@fez994
Apr 24 2017 20:52
Yeah i was thinking about generating a random number like var random = Math.floor(Math.random() * 9); and simply put that number in the position on the table
wait i'll put my code into a pen
Gulsvi
@gulsvi
Apr 24 2017 20:53
I haven't done tic tac toe yet, but learning a lot from the challenges everyone else are hitting
Gulsvi
@gulsvi
Apr 24 2017 20:59

@fez994 Yeah, you could give each square a class name and then with your current random number code, you assign a random square the aiChoice letter:

function aiMove() {
    if(playerChoice === "X") {
        aiChoice = "O";
    } else {
        aiChoice = "X";
    }
    console.log('ITS AI TURN');
  var random = Math.floor(Math.random() * 9);
  document.getElementsByClassName('piazza')[random].textContent = aiChoice
}

^^ You'll need to check it isn't already selected by the user and choose another, but that's the general idea.

alpox
@alpox
Apr 24 2017 21:00
@Paradox5 Hmm i have to express my feelings, you know? :D
@fez994 Go sure to eliminate the already occupied positions from the result
alpox
@alpox
Apr 24 2017 21:05
@SkyCoder01 I've done it yesterday afternoon. Was fun :D
Gulsvi
@gulsvi
Apr 24 2017 21:05
Probably best to have an array with squares remaining and choose from that?
alpox
@alpox
Apr 24 2017 21:05
Except that that stupid AI doesn't want to let me win
@SkyCoder01 An array with positions, yes
Gulsvi
@gulsvi
Apr 24 2017 21:06
Oh yeah, sorry, I didn't see it! You mentioned it above and I forgot to ask - think I was talking to three people at once
The styling is not very good, i cared more about functionality
Gulsvi
@gulsvi
Apr 24 2017 21:07
You can tell the computer thinks hard for the right move :)
Paradox5
@Paradox5
Apr 24 2017 21:07
Function
Gulsvi
@gulsvi
Apr 24 2017 21:08
Wonder if you can have the AI play against the same AI and learn - maybe there's a deep flaw in minimax?
Federico Dente
@fez994
Apr 24 2017 21:08
@SkyCoder01 @alpox Thank you guys, i'm slowing figuring it out
CamperBot
@camperbot
Apr 24 2017 21:08
fez994 sends brownie points to @skycoder01 and @alpox :sparkles: :thumbsup: :sparkles:
:cookie: 971 | @alpox |http://www.freecodecamp.com/alpox
:star2: 1175 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Paradox5
@Paradox5
Apr 24 2017 21:09
Breaking news tic tac toe ai takes over the world
Gulsvi
@gulsvi
Apr 24 2017 21:09
^^ Exactly :p
chouston3
@chouston3
Apr 24 2017 21:09
I'm trying to put in a navbar on my tribute page using this site. https://www.w3schools.com/bootstrap/bootstrap_navbar.asp for some reason it doesn't work in codepen. any ideas why?
Gulsvi
@gulsvi
Apr 24 2017 21:11
@chouston3 W3 Schools uses Bootstrap 3, but codepen gives you Bootstrap 4 by default. Open your codepen settings and replace bootstrap 4 with this link to Bootstrap 3: https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
alpox
@alpox
Apr 24 2017 21:11
@SkyCoder01 Haha thats just because of my timeout :D
Gulsvi
@gulsvi
Apr 24 2017 21:11
Oh lol, I was imagining some intense computation
(for 9 squares) :joy:
alpox
@alpox
Apr 24 2017 21:12
@SkyCoder01 I didn't try that :D i could once try it ^^
I mean AI vs AI
chouston3
@chouston3
Apr 24 2017 21:12
@SkyCoder01 Thanks! I was pulling my hair out trying to figure out why it didn't work
CamperBot
@camperbot
Apr 24 2017 21:12
chouston3 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:star2: 1176 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Gulsvi
@gulsvi
Apr 24 2017 21:12
Have it play each other 1000 times non-stop and keep score :)
no problem, chouston! Happens to everyone
alpox
@alpox
Apr 24 2017 21:15
@SkyCoder01 Ya maybe once :D
@SkyCoder01 I noticed that minimax sometimes prefers a lock-in of its enemy against a win in the same round
Means it could win in this round but it chooses not to because it can do a move where you have no chance to win anymore in the next round
Paradox5
@Paradox5
Apr 24 2017 21:16
A sentence without a smile
:(
alpox
@alpox
Apr 24 2017 21:16
@Paradox5 Ah cmon that can happen :D
Paradox5
@Paradox5
Apr 24 2017 21:17
:)
:D
alpox
@alpox
Apr 24 2017 21:17
:flags:
WillTheCruzan
@WillTheCruzan
Apr 24 2017 21:42
I seriously can't figure out how to get rid of the white space http://codepen.io/WillTheCruzan/pen/qmaBvP
nvm i fixed it
the0ffh
@the0ffh
Apr 24 2017 21:56
Hi all!
Today I have made some primitive css animations 'helper'. Hope some might make use of it.
https://codepen.io/the0ffh/full/MmjGzo/
the0ffh
@the0ffh
Apr 24 2017 22:02
@WillTheCruzan you are not closing the ".first-page" div
Leena
@Leena8392
Apr 24 2017 22:08
Hey Guys. I am making weather app and i got this error(Access to Script at 'https://code.jquery.com/jquery-2.2.5.min.js' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 404.). I don't understand what is the error? .can anyone help me what should i do?
Veronica
@veronicarbulu
Apr 24 2017 22:35
Hi all - I am still trying to finish my portfolio page. It works on desktop, but links on the navigation bar are not working when I view my portfolio page from my iPhone? Any suggestions? Here's the link to my page: http://codepen.io/veronicarbulu/full/GmRQOK/
Jorge
@flawedLogic506
Apr 24 2017 22:38
@Leena8392 you are probably trying to request the info over HTTP and codepen only allows HTTPS responses
@veronicarbulu it does work for me if use emulated size for iphone .. what happens when you see it on mobile?
Moisés Man
@moigithub
Apr 24 2017 22:41
@veronicarbulu probably ur buttons are too small?
Veronica
@veronicarbulu
Apr 24 2017 22:42
@OrangeKulture Hi - A couple of things: 1) the links on the navigation bar do not work. So when i click on portfolio or contact for instance, it doesn't take me to the right part of my site. Issue #2: I was hoping my naviagation bar could be fixed to the top on my iphone as well, but it doesn't. It just moves along when I scroll down the page
@moigithub Hi - I tried making my buttons bigger as well, but it didn't work. I just don;t know what I'm doing wrong. I'm wondering if it's the browser on my iphone
Jorge
@flawedLogic506
Apr 24 2017 22:45
@veronicarbulu try adding jquery and then bootstrap js , after the jquery
Veronica
@veronicarbulu
Apr 24 2017 22:46
@OrangeKulture Under JS?
Jorge
@flawedLogic506
Apr 24 2017 22:46
the nav bar is fixed at the top .. that's why it will scroll along with the rest of the page. You can make it as if it's not fixed and it should just stay at the top? probably .
@veronicarbulu yeah under js .. include jquery first and then bootstrap .. i know bootstrap js handles a lot of the nav bar things .. im not saying that'll solve everything, but im sure it;ll help
Veronica
@veronicarbulu
Apr 24 2017 22:47
trying it now @OrangeKulture
Jorge
@flawedLogic506
Apr 24 2017 22:49
@veronicarbulu yeah im guessing the navbar thing should be relatively easy to fix .. a quick google search can point you in the right direction
yeah, basically when you set the navbar with a property of fixed , it will not dissappear, it'll sort of "follow" when you scroll
Veronica
@veronicarbulu
Apr 24 2017 22:51
@OrangeKulture Thanks. I tried including the jQuery and bootstrap under JS, but the links are still broken on my phone.
CamperBot
@camperbot
Apr 24 2017 22:51
veronicarbulu sends brownie points to @orangekulture :sparkles: :thumbsup: :sparkles:
:cookie: 330 | @orangekulture |http://www.freecodecamp.com/orangekulture
Jorge
@flawedLogic506
Apr 24 2017 22:52
@veronicarbulu yeah the think with the links is, that you are using the HTML tags to get there, with anchor tags .. it should work, but i've found it doesn;t really take you exactly where you want it to be .. you can use jquery or javascript
smooth scrolling and even specify an offset. Haven't done that in a while, tbh .. that's why i don;t know exactly how I would do it, at the top of my head
Veronica
@veronicarbulu
Apr 24 2017 22:54
@OrangeKulture
@OrangeKulture I appreciate your help. I' m new on this, so I can take all the guidance. Thanks again
CamperBot
@camperbot
Apr 24 2017 22:55
veronicarbulu sends brownie points to @orangekulture :sparkles: :thumbsup: :sparkles:
:warning: veronicarbulu already gave orangekulture points
Jorge
@flawedLogic506
Apr 24 2017 22:56
sure! very welcome ..hopefully u did get some guidance. Try and search for a jquery option, or do a google search on click to jump to div, stuff like that
Brian Zelip
@brianzelip
Apr 24 2017 22:56
format
help format
Veronica
@veronicarbulu
Apr 24 2017 22:57
@OrangeKulture will do. Thanks!
CamperBot
@camperbot
Apr 24 2017 22:57
veronicarbulu sends brownie points to @orangekulture :sparkles: :thumbsup: :sparkles:
:warning: veronicarbulu already gave orangekulture points
Jorge
@flawedLogic506
Apr 24 2017 22:57
@veronicarbulu :) welcome
Augusto Wang
@GusWng
Apr 24 2017 22:58
hey ppl again haha i need help one last time haha
Jorge
@flawedLogic506
Apr 24 2017 23:01
@GusWng which links?
Augusto Wang
@GusWng
Apr 24 2017 23:01
@OrangeKulture the links to the channels
they open the exact same page but keep loading forever
Jorge
@flawedLogic506
Apr 24 2017 23:04
@GusWng hmmm yeah i see what u mean
@GusWng i would try linking directly to the URL and see if it works, if it does, then it's a bug in your jquery
Augusto Wang
@GusWng
Apr 24 2017 23:05
hmm ill try...