These are chat archives for FreeCodeCamp/HelpFrontEnd

6th
Nov 2016
Joshua Swift
@joshuaswift
Nov 06 2016 00:22 UTC
  //Temperature convert on toggle    
var tempSwitch = function () {
  $(".onoffswitch").change(
    function tempSwitchHandler () {
    if (this.checked) {
      alert("this works");

    }
    })
}
I've got a toggle switch on my weather app to switch between celcius and fahrenheit, so I'm trying to use jquery to do something when the toggle is switched
this isn't working so far, any ideas?
miriam-z
@miriam-z
Nov 06 2016 00:34 UTC
Hi!
I am making a navbar with bootstrap and needing to use images for the logos within the navbar menu.
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:35 UTC
Hello I am having issues adding images
either from css or HTML
miriam-z
@miriam-z
Nov 06 2016 00:35 UTC
although it is not showing any responsiveness
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:35 UTC
anyone else experiencing the same issue?
miriam-z
@miriam-z
Nov 06 2016 00:35 UTC
any thoughts on this?
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:36 UTC
@miriam-z did you link the bootstrap css?
I was having the same issue
miriam-z
@miriam-z
Nov 06 2016 00:36 UTC
yes its not a problem with the stylesheet, I feel its the images themselves
I have put each image within a seperate <li> tag and they are all in the <ul> tag
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:38 UTC
try <img class="responsive">
miriam-z
@miriam-z
Nov 06 2016 00:38 UTC
I have tried that, I mean they stay in a fixed position
and don't change position depending on the browser viewport size. An the positioning is not set to fixed either.
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:39 UTC
is it on it's own div?
miriam-z
@miriam-z
Nov 06 2016 00:39 UTC
this is the code
<section id="nav-header">
    <nav class="navbar navbar-dark navbar-nav navbar-full" id="navbar-top">
        <div class="container">
            <!--<p class="logo"><img src="images/bb-logo.png" alt="bigbus-logo" style="width:266px;height:33px;"></p>-->
            <!--<p class="locator"><img src="images/locator.png" alt="locator" style="width:30px;height:30px;"></p>-->
            <!--<p class="ticket"><img src="images/ticket.png" alt="ticket" style="width:30px;height:30px;"></p>-->
            <ul id="top-nav-list">
                <li class="nav-item logo"><img src="images/bb-logo.png" alt="bigbus-logo" style="width:266px;height:33px;"></li>
                <li class="nav-item locator"><img src="images/locator.png" alt="locator" style="width:30px;height:30px;"></li>
                <li class="nav-item ticket"><img src="images/ticket.png" alt="ticket" style="width:30px;height:30px;"></li>
                <li class="nav-item hidden-md-down">Find a Bus Stop</li>
                <li class="nav-item hidden-md-down">Eng &#47; Gpb &#163;</li>
            </ul>
        </div><!--end:container-->
    </nav><!--end:nav-->
</section>
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:42 UTC
it looks right to me
do u have any idea why I can't link images to my pencode?
miriam-z
@miriam-z
Nov 06 2016 00:45 UTC

somehow its not working so well

do you have your code

I can take a look
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:46 UTC
sure

<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<title>Front-End Developer in Miami</title>
</head>
<body>
<div class="container-fluid">
<nav role="navigation" class="navbar navbar-default navbar-fixed-top">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!-- Collection of nav links and other content for toggling -->
<div id="navbarCollapse" class="collapse navbar-collapse">
<ul class="navbar-left">
<li><img src=""></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="#">Home</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div>
</div>
</nav><!--Menu ends-->
<!--Main starts-->
<div class="jumbotron">
<div class="container">
<div class" row">
<div class="col-md-9">
<h1>Juan Angelogianopulos</h1>
<p>
<strong>Front-End Developer and graphic designer</strong>, with practical experience in digital marketing, branding strategy, and art direction; devoted to functional programming and information architecture.
</p>
</div>
<div class="col-md-3">
<img class="responsive" src="http://www.istockphoto.com/photo/responsive-design-mockup-gm516755340-89126979?st=_p_web%20designer">
</div>
</div>
</div>
</div>
<section id="portfolio">
<div class="container">
<h2>PORTFOLIO</h2>
<ul class="grid">
<li><img src=""></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</div>
<section id="contact">
<div class="container">
<h2>CONTACT</h2>
<form id="contactForm">
<div class="form-item">
<label for="name"></label>
<input id="name" type="text" placeholder="Name" required>
</div>
<div class="form-item">
<label for="email"></label>
<input id="email" type="text" placeholder="Email" required>
</div>
<div class="form-item">
<label for="phone"></label>
<input id="Phone" type="text" placeholder="Phone" required>
</div>
<div class="form-item">
<label for="message"></label>
<textarea id="message" rows="5" placeholder="Message" required></textarea>
</div>
<br>
<button type="submit">Send</button>
</form>
</div>
</div>
</div>
</section>
</bod

This is the part that shows a broken link
<div class="col-md-3">
<img class="responsive" src="http://www.istockphoto.com/photo/responsive-design-mockup-gm516755340-89126979?st=_p_web%20designer">
</div>
miriam-z
@miriam-z
Nov 06 2016 00:47 UTC
@angelogianopulos you must use markdown
for that code
i.e. three backticks at the start and 3 at the end
on the right hand side of your comment box there is an M with an arrow pointing dowwards
it gives you the markdown options
so your question is why are the images not rendering?
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:50 UTC
yes
it shows a broken link
miriam-z
@miriam-z
Nov 06 2016 00:51 UTC
you have incorrect syntax
<p class="responsive"><img src="http://www.istockphoto.com/photo/responsive-design-mockup-gm516755340-89126979?st=_p_web%20designer"></p>
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:52 UTC
let me try that
miriam-z
@miriam-z
Nov 06 2016 00:52 UTC
try wrapping it in a <p> tag or <div> tag
you can't write img class=
let me know if it works
also are you pointing your url to the image on istockphoto itself?
have you not a local copy on your machine in your project folder?
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:54 UTC
yes it has worked for me in the past
miriam-z
@miriam-z
Nov 06 2016 00:54 UTC
okay
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:54 UTC
is not working
miriam-z
@miriam-z
Nov 06 2016 00:55 UTC
you could try through css
and the background-image url option
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:55 UTC
same thing
miriam-z
@miriam-z
Nov 06 2016 00:57 UTC
this is the url
issue
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:58 UTC
it looks like it
miriam-z
@miriam-z
Nov 06 2016 00:58 UTC
why don't you try to download the image into your project folder and link the image from your folder
have your tried adding a width and height
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 00:59 UTC
i will need to DL the project onto my cmputer
miriam-z
@miriam-z
Nov 06 2016 00:59 UTC
alt="image name" style="width:266px;height:33px;"
whatever dimensions you want the image to be
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 01:00 UTC
will try that!
miriam-z
@miriam-z
Nov 06 2016 01:00 UTC
try it and let me know
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 01:00 UTC
thanks @miriam-z for your help
CamperBot
@camperbot
Nov 06 2016 01:00 UTC
angelogianopulos sends brownie points to @miriam-z :sparkles: :thumbsup: :sparkles:
:cookie: 249 | @miriam-z |http://www.freecodecamp.com/miriam-z
miriam-z
@miriam-z
Nov 06 2016 01:00 UTC
your welcome
miriam-z
@miriam-z
Nov 06 2016 01:15 UTC
I solved my problem by wrapping the images into a div instead
much better than the ul option
c0d0er
@c0d0er
Nov 06 2016 01:36 UTC
@0x0936 thanks
CamperBot
@camperbot
Nov 06 2016 01:36 UTC
c0d0er sends brownie points to @0x0936 :sparkles: :thumbsup: :sparkles:
:star2: 1812 | @0x0936 |http://www.freecodecamp.com/0x0936
Ryan Apolinar
@ryanapolinar
Nov 06 2016 01:51 UTC
Working on the Simon Game, and after I was able to have the pattern play itself when the combo was updated, the buttons would not change color when pressed. In order the change their color, I used CSS classes like .button:focus. However, they're not changing color after implementing the automated system
Here's a link to the CodePen
Brandon Carlino
@bacarlino
Nov 06 2016 02:33 UTC
In the personal portfolio page, seems a little odd they require page navigation when it wasn't covered in the lessons. I have absolutely no problem reaching out and figuring it out on my own, but I guess I'm just curious if that's why something that wasn't covered is included as a requirement... to test our ability to grow and learn above and beyond what the lessons teach?
Tessa
@TheTessaMurphy
Nov 06 2016 02:56 UTC
Anybody else having trouble getting their quote matchine to work in firefox?
Tessa
@TheTessaMurphy
Nov 06 2016 03:05 UTC
Figured it out. Was using https to call http. Who knew?
Silly question, how do you send brownie points?
Walid Ashri
@walidashri
Nov 06 2016 03:09 UTC
@TheTessaMurphy thanks
CamperBot
@camperbot
Nov 06 2016 03:09 UTC
walidashri sends brownie points to @thetessamurphy :sparkles: :thumbsup: :sparkles:
:cookie: 231 | @thetessamurphy |http://www.freecodecamp.com/thetessamurphy
paintingfire
@paintingfire
Nov 06 2016 03:14 UTC
Just out of curiosity, what happens to the projects (like the tribute page) once we submit them? Is there any kind of feedback?
grantknaver
@grantknaver
Nov 06 2016 03:45 UTC
You guys have any idea why I cant style seem-ably anything through my javascript
https://codepen.io/GrantKnaver/pen/pNvyZE
here is my javascript...
    document.getElementsByTagName("body").style.backgroundColor = "green";
any ideas
Jeremiah Biard
@jeremiahbiard
Nov 06 2016 03:50 UTC
@grantknaver getElementsByTagName returns a collection
maybe try ```var elements = document.getElementsByTagName("body");
elements[0].style.backgroundColor = "green";```
grantknaver
@grantknaver
Nov 06 2016 03:51 UTC
gotcha but when I select an id it does the same
Jeremiah Biard
@jeremiahbiard
Nov 06 2016 03:52 UTC
document.getElementsByTagName("body")[0].style.backgroundColor = "green";
^ that works
Tessa
@TheTessaMurphy
Nov 06 2016 03:52 UTC
@jeremiahbiard try this document.body.style.backgroundColor = "green";
Sorry, meant @grantknaver -- try this: document.body.style.backgroundColor = "green";
Jeremiah Biard
@jeremiahbiard
Nov 06 2016 03:54 UTC
Tessa's solution works as well :+1:
grantknaver
@grantknaver
Nov 06 2016 03:54 UTC
thanks
@TheTessaMurphy @jeremiahbiard thanks
CamperBot
@camperbot
Nov 06 2016 03:54 UTC
grantknaver sends brownie points to @thetessamurphy and @jeremiahbiard :sparkles: :thumbsup: :sparkles:
:cookie: 232 | @thetessamurphy |http://www.freecodecamp.com/thetessamurphy
:cookie: 346 | @jeremiahbiard |http://www.freecodecamp.com/jeremiahbiard
RakeshNerkar
@Rakesh18754
Nov 06 2016 04:06 UTC
in angular js Can we view the partials in the chromes sources tab ...as i am able to view my JS , CSS of a compnent only thing missing all the HTML partials ...i am also anle to view the index.html file but not the partials .....any suggestions on this?
grantknaver
@grantknaver
Nov 06 2016 04:29 UTC
shouldn't this generate a random color
var number = Math.floor(Math.random()*256);
rgb(number,number,number);
grantknaver
@grantknaver
Nov 06 2016 04:54 UTC
how about this...
var randomColor = rgb(Math.floor(Math.random()256) + "," + Math.floor(Math.random()256) +","+ Math.floor(Math.random()*256));
document.body.style.backgroundColor = rgb(randomColor);
Tessa
@TheTessaMurphy
Nov 06 2016 04:58 UTC
@grantknaver I use math random in my program. I have this: Math.floor(Math.random() *6 -- you might be missing the asterik is your first two math randoms.
grantknaver
@grantknaver
Nov 06 2016 05:02 UTC
That is an idea but... my selectors are giving me hell should this work or is it my computer
document.getElementById("id1").style.backgroundColor = "orange";
Jax
@jax11000
Nov 06 2016 05:06 UTC
can someone tell me whats up with my JavaScript? im working on my portfolio page trying to create a nav bar, and the JS is throwing up a bunch of errors.
Tessa
@TheTessaMurphy
Nov 06 2016 05:08 UTC
@grantknaver That looks like it should work.
grantknaver
@grantknaver
Nov 06 2016 05:14 UTC
ya... uggg
one problem after another
RakeshNerkar
@Rakesh18754
Nov 06 2016 05:14 UTC
Hi...any one knows angular js?
Tessa
@TheTessaMurphy
Nov 06 2016 05:15 UTC
@jax11000 What are you trying to do here?
Jax
@jax11000
Nov 06 2016 05:17 UTC
@TheTessaMurphy trying to do the portfolio page challenge. specifically im trying to make a nav bar that when you click the button it jumps you to the corresponding place on the page... if that makes sense.
Tessa
@TheTessaMurphy
Nov 06 2016 05:25 UTC
@jax11000 yes it makes sense, but you don't need the if statement at all. I'm curious why your doing this is in js. It can be done entirely in html and styled with css.
Jax
@jax11000
Nov 06 2016 05:26 UTC
i was looking at ways to make a nav bar, as ive never done it before at all, and the instruction i read told me to do it.
@TheTessaMurphy so what youre saying is it will work fine without the javascript stuff i have written?
Aarya Bhorra
@aarya1302
Nov 06 2016 05:28 UTC
@jax11000 you can do the nav bar in css and html
But if you want it to collapse and stuff you could probably use javascript
@jax11000 comment out your javascript code and see if your nav bar works
Jax
@jax11000
Nov 06 2016 05:30 UTC
@aarya1302 probably going to sound stupid but... how exactly would i go about testing that?
Tessa
@TheTessaMurphy
Nov 06 2016 05:32 UTC
@jax11000 Yes, that's what I'm saying. http://www.w3schools.com/css/css_navbar.asp has a very good tutorial on how to create a nav bar. That's the first thing to do, just set up a navbar. Then, to get to different parts of your page, you give your div an id and in the navbar you call that id.
Jax
@jax11000
Nov 06 2016 05:33 UTC
thank you, i feel like its going to take years to really know all this stuff lol @TheTessaMurphy
CamperBot
@camperbot
Nov 06 2016 05:33 UTC
jax11000 sends brownie points to @thetessamurphy :sparkles: :thumbsup: :sparkles:
:cookie: 233 | @thetessamurphy |http://www.freecodecamp.com/thetessamurphy
Tessa
@TheTessaMurphy
Nov 06 2016 05:34 UTC
I know this is a silly question, but how do people send brownie points?
Jax
@jax11000
Nov 06 2016 05:35 UTC
i think its just when you "@" that person and say thank you
Tessa
@TheTessaMurphy
Nov 06 2016 05:35 UTC
@jax11000 thank you.
CamperBot
@camperbot
Nov 06 2016 05:35 UTC
thetessamurphy sends brownie points to @jax11000 :sparkles: :thumbsup: :sparkles:
:cookie: 121 | @jax11000 |http://www.freecodecamp.com/jax11000
Tessa
@TheTessaMurphy
Nov 06 2016 05:35 UTC
:)
Jax
@jax11000
Nov 06 2016 05:36 UTC
xD
Aarya Bhorra
@aarya1302
Nov 06 2016 05:39 UTC
var obj = {
  "somestuff":"someotherstuff"
};
$(document).ready(function() {
  $("#getQuotes").on("click", function(){
  $.getJSON(obj, function(json){
      $(".message").html(JSON.stringify(json));
    });
   });
});
Can anyone help me with this
?
I have been trying to make the button get this json object but nothing happens when i press it
That's the project
Sorin Ruse
@sorinr
Nov 06 2016 05:56 UTC
@aarya1302 you don't need $.getJSON function to read your local obj. this function is trying to access the obj as an url and you get a 404 not found error
Aarya Bhorra
@aarya1302
Nov 06 2016 05:57 UTC
@sorinr what do i use instead?
Tessa
@TheTessaMurphy
Nov 06 2016 05:58 UTC
@grantknaver Is this what you were looking for? backColor = "rgb(" + Math.floor(Math.random() 256) + "," + Math.floor(Math.random() 256) + "," + Math.floor(Math.random() *256) + ")";
document.getElementById("data").style.backgroundColor = backColor;
Sorin Ruse
@sorinr
Nov 06 2016 06:00 UTC
@aarya1302 you can make your obj as an array of quotes and create a function that will random return a quote from the array. take a look at this example
@aarya1302 only that i'm returning quotes sequentially not randomly
Aarya Bhorra
@aarya1302
Nov 06 2016 06:02 UTC
Thanks @sorinr
CamperBot
@camperbot
Nov 06 2016 06:02 UTC
aarya1302 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 820 | @sorinr |http://www.freecodecamp.com/sorinr
Aarya Bhorra
@aarya1302
Nov 06 2016 06:03 UTC
Nice quote machine btw
Sorin Ruse
@sorinr
Nov 06 2016 06:05 UTC
@aarya1302 its more a full around with xml. my original quote pen is: quotes
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 06:07 UTC
Hello World! :)
CamperBot
@camperbot
Nov 06 2016 06:07 UTC

welcome to FreeCodeCamp @NitinNair89!

Sorin Ruse
@sorinr
Nov 06 2016 06:08 UTC
welcome back
Aarya Bhorra
@aarya1302
Nov 06 2016 06:08 UTC
Wow @sorinr
Brandon
@bwolfram1
Nov 06 2016 06:08 UTC
what's up?
Aarya Bhorra
@aarya1302
Nov 06 2016 06:08 UTC
That's a good looking website
How long did it take you to do that?
Sorin Ruse
@sorinr
Nov 06 2016 06:12 UTC
don't remember but i think no more then 30 min - 1 hour including the api's research time
Aarya Bhorra
@aarya1302
Nov 06 2016 06:12 UTC
OMG
You are an expert
Sorin Ruse
@sorinr
Nov 06 2016 06:14 UTC
nope. i'm not. but having some prev experience with html/css/js helped me
c0d0er
@c0d0er
Nov 06 2016 06:30 UTC
does anybody know why my .timer div include work and break 4 small buttons even timer div is behind the work and break buttons? code is very short, thanks, http://codepen.io/c0d0er/pen/eBmgQP?editors=1010
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 06:34 UTC
@c0d0er I didn't understand your question :(
c0d0er
@c0d0er
Nov 06 2016 06:36 UTC
@NitinNair89
<div class='col-xs-12 col-sm-6 work'>
    <h3>work</h3>
    <button class='wo1 small'>-</button>
    <span class='time2'>2</span>
    <button class='wo2 small'>+</button>
    </div>

  <div class='timer'>// this div is under above tags, why this div include the above tags?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 06:38 UTC
@c0d0er include means what exactly? I put a color for the break class and all div appear to be separate:
.break{
  background-color:green;
}
Alexander Huynh
@caesarsalad93
Nov 06 2016 06:38 UTC
Hi guys, why is my variable assignment not working in this code?
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(function(position){
var lat = position.coords.latitude;
});
}
console.log(lat);
c0d0er
@c0d0er
Nov 06 2016 06:41 UTC
@NitinNair89 why this div include the above tags? should be why this timer div's background color include the above tags?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 06:43 UTC
@c0d0er Did you see my css?
c0d0er
@c0d0er
Nov 06 2016 06:43 UTC
@NitinNair89 the timer div blue background color does cover the work and break button area
@NitinNair89 i saw that
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 06:47 UTC
@c0d0er That's because your bootstrap grid is broken. Whenever you exhaust the total number of columns in a row for a specific device screen, you need to add a clearfix and visible class like below:
<div class='col-xs-12 col-sm-6 break'>
    <h3>break</h3>
    <button class='br1 small'>-</button>
    <span class='time1'>1</span>
    <button class='br2 small'>+</button>
  </div>
  <div class="clearfix visible-xs-block"></div> <!-- Since xs has exhausted 12 columns -->
  <div class='col-xs-12 col-sm-6 work'>
    <h3>work</h3>
    <button class='wo1 small'>-</button>
    <span class='time2'>2</span>
    <button class='wo2 small'>+</button>
  </div>
  <div class="clearfix visible-xs-block"></div> <!-- Since xs has again exhausted 12 columns -->

  <div class='timer'>
  ...
  ...
Similarly, if other device screens also exhausted their columns, you can combine the clearfix classes like:
<div class="clearfix visible-xs-block visible-sm-block"></div> <!-- xs and sm has exhausted 12 columns -->
c0d0er
@c0d0er
Nov 06 2016 06:50 UTC
@NitinNair89 i add this <div class="clearfix visible-xs-block"></div>, but still shows the same thing
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 06:50 UTC
@c0d0er I added, and it shows correct for me
c0d0er
@c0d0er
Nov 06 2016 06:51 UTC
could you give me your codepen link?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 06:51 UTC
ok, let me fork it
your current code will work only for 'xs' and 'sm'. For larger screens add 'md' and 'lg' as well
@c0d0er
c0d0er
@c0d0er
Nov 06 2016 06:54 UTC
the timer div still include the work and break buttons in your code
@NitinNair89 the timer div still include the work and break buttons in your code
@NitinNair89 thanks
CamperBot
@camperbot
Nov 06 2016 06:54 UTC
c0d0er sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 344 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 06:55 UTC
@c0d0er refresh the pen
c0d0er
@c0d0er
Nov 06 2016 06:56 UTC
@NitinNair89 refreshed same
c0d0er
@c0d0er
Nov 06 2016 06:56 UTC
@NitinNair89 now changed
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 06:57 UTC
I did not give any background colors for break and work.. also added the "lg" column
Sorin Ruse
@sorinr
Nov 06 2016 06:58 UTC
@c0d0er this is what u want example ?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 06:58 UTC
Shall I delete my pen? I hope it helped you
c0d0er
@c0d0er
Nov 06 2016 06:59 UTC
@sorinr yep, thanks
CamperBot
@camperbot
Nov 06 2016 06:59 UTC
c0d0er sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 821 | @sorinr |http://www.freecodecamp.com/sorinr
c0d0er
@c0d0er
Nov 06 2016 06:59 UTC
@NitinNair89 sure, please
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 06:59 UTC
:)
Sorin Ruse
@sorinr
Nov 06 2016 07:00 UTC
@c0d0er welcome
c0d0er
@c0d0er
Nov 06 2016 07:01 UTC
@sorinr why do you add the row class of div which wrap the work break buttons and big circle area?
Sorin Ruse
@sorinr
Nov 06 2016 07:02 UTC
@c0d0er coz this is the normal structure of the grid in bootstrap. the row can contain columns
c0d0er
@c0d0er
Nov 06 2016 07:05 UTC
@sorinr what is the consequenz if not add row? or the benefits to add row?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 07:05 UTC
You get a messy grid that won't work always
and undetectable problems with the layout
c0d0er
@c0d0er
Nov 06 2016 07:07 UTC
@NitinNair89 @sorinr got it, thanks!
CamperBot
@camperbot
Nov 06 2016 07:07 UTC
c0d0er sends brownie points to @nitinnair89 and @sorinr :sparkles: :thumbsup: :sparkles:
:warning: c0d0er already gave nitinnair89 points
:warning: c0d0er already gave sorinr points
c0d0er
@c0d0er
Nov 06 2016 07:17 UTC
@NitinNair89 @sorinr i added only row div wrap the work break button, it fixed the issue too
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 07:18 UTC
That's good, but for a fully functional grid you need container > rows > columns hiearchry
Sorin Ruse
@sorinr
Nov 06 2016 07:19 UTC
@c0d0er if you want to use bootstrap i would just stick with the docs here http://getbootstrap.com/css/#grid to be sure the all layout is going to work as expected
c0d0er
@c0d0er
Nov 06 2016 07:22 UTC
@NitinNair89 do i need to always use something like this?
<div class="container">
  <div class="row">
    <div class="col-*-*"></div>
@sorinr thanks
CamperBot
@camperbot
Nov 06 2016 07:23 UTC
c0d0er sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: c0d0er already gave sorinr points
c0d0er
@c0d0er
Nov 06 2016 07:24 UTC
@NitinNair89 do i need to add <div class="container"> before <div class='row'> in the following code?
 <h1 class='title'>Pomodoro Clock</h1>
    <div class='row'>
<div class='col-xs-12 col-sm-6 col-md-6 col-lg-6 break'>
    <h3>break</h3>
    <button class='br1 small'>-</button>
     <span class='time1'>1</span>
    <button class='br2 small'>+</button>
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 07:24 UTC
@c0d0er Yeah, I usually follow that :D
Think of container like a wrapper or something that will hold everything
So yes, you can add container before the row in your above code
c0d0er
@c0d0er
Nov 06 2016 07:25 UTC
@NitinNair89 is this correct?
 <h1 class='title'>Pomodoro Clock</h1>
<div class="container">
    <div class='row'>
<div class='col-xs-12 col-sm-6 col-md-6 col-lg-6 break'>
    <h3>break</h3>
    <button class='br1 small'>-</button>
     <span class='time1'>1</span>
    <button class='br2 small'>+</button>
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 07:25 UTC
yes, for a wider width, you can use container-fluid
c0d0er
@c0d0er
Nov 06 2016 07:26 UTC
@NitinNair89 why do i need add this? i already add container-fluid in the beginning e.g. the following
  <div class='container-fluid text-center'>

    <h1 class='title'>Pomodoro Clock</h1>
    <div class='row'>
<div class='col-xs-12 col-sm-6 col-md-6 col-lg-6 break'>
    <h3>break</h3>
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 07:27 UTC
Then you don't need to add
Sometimes, you might need different containers inside different <section> tags and a common full width container to wrap every other containers you have in your code. :)
Sorin Ruse
@sorinr
Nov 06 2016 07:28 UTC
@c0d0er you can also take a look here https://css-tricks.com/snippets/css/a-guide-to-flexbox/ for using flexbox instead of bootstrap's grid
RakeshNerkar
@Rakesh18754
Nov 06 2016 07:35 UTC
Any one knows any IDE which provides localhost like webstorm ???
but is free to use unlike webstorm?
c0d0er
@c0d0er
Nov 06 2016 07:35 UTC
@sorinr @NitinNair89 got it, thanks!
CamperBot
@camperbot
Nov 06 2016 07:35 UTC
c0d0er sends brownie points to @sorinr and @nitinnair89 :sparkles: :thumbsup: :sparkles:
:warning: c0d0er already gave sorinr points
:warning: c0d0er already gave nitinnair89 points
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 07:36 UTC
@Rakesh18754 For HTML,CSS,JS I use Brackets
You can also simple use Eclipse with Tomcat or install WAMP server
c0d0er
@c0d0er
Nov 06 2016 07:38 UTC
@NitinNair89 when i add <div class='container'> before <div class='row'>, my work and break buttons come closer each other, the distance of the work and break buttons getting shorter, why?
<div class='container-fluid text-center'>
<h1 class='title'>Pomodoro Clock</h1>
    <div class='container'>
    <div class='row'>
<div class='col-xs-12 col-sm-6 col-md-6 col-lg-6 break'>
    <h3>break</h3>
    <button class='br1 small'>-</button>
     <span class='time1'>1</span>
    <button class='br2 small'>+</button>
</div>
Sorin Ruse
@sorinr
Nov 06 2016 07:38 UTC
@Rakesh18754 or u can use node.js
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 07:39 UTC
@c0d0er That's because the container class adds margins. Try the same with container-fluid
c0d0er
@c0d0er
Nov 06 2016 07:42 UTC
@NitinNair89 even with container-fluid there is little margins, but if without any container or container-fluid wrapping work break buttons, then it doesnt have any margin, why?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 07:43 UTC
That's how your browser interpret it. You can add your own class and define some specific margins without using the containers.
@c0d0er There's always a default margin unless you specify margin:0 in your CSS
c0d0er
@c0d0er
Nov 06 2016 07:45 UTC
@NitinNair89 you are correct, i think that is because i used margin: 0 somewhere
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 07:45 UTC
:P
Ricky11
@ricky11
Nov 06 2016 08:22 UTC
anyone know flexbox well, trying to get a flexbox with a title and underneath a image on the left and a UL on the right middle.
Erick Delfin
@Nifled
Nov 06 2016 08:48 UTC
blob
joshandevera
@joshandevera
Nov 06 2016 08:48 UTC
i want put the timeline below the thumbnail do have any suggestion so my page will look a little better?
Erick Delfin
@Nifled
Nov 06 2016 08:48 UTC
Could someone help me out with this? Click on a text area to put whatever the form overlaps my footer
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 08:49 UTC
@joshandevera Set some height and width for the image
@Nifled Didn't understand clearly
Erick Delfin
@Nifled
Nov 06 2016 08:50 UTC
@NitinNair89 Did you see the screenshot?
here it is again
blob
joshandevera
@joshandevera
Nov 06 2016 08:51 UTC
@NitinNair89 should i do that on css or is there a bootstrap class for that?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 08:51 UTC
do it in css @joshandevera Also add the responsive image class from bootstrap
@Nifled how did you code your footer? absolute / fixed?
Sorin Ruse
@sorinr
Nov 06 2016 08:52 UTC
@ricky11 something like: example ?
Erick Delfin
@Nifled
Nov 06 2016 08:54 UTC
@NitinNair89 It's absolutely positioned
here's what is looks like normally, then what it looks like when i click on the text area
blob
Ricky11
@ricky11
Nov 06 2016 08:54 UTC
@sorinr hi, once you set flex-direction: column;, how do you then get the image and the paragraph on one row?
doest flex-direction: column; mean it all has to be in columns?
Sorin Ruse
@sorinr
Nov 06 2016 08:55 UTC
@ricky11 display: inline-flex;
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 08:55 UTC
@Nifled Yeah i guessed. The absolute position causes this. What if you remove the absolute positioning?
Ricky11
@ricky11
Nov 06 2016 08:55 UTC
@sorinr thanks, i will look in to what inline-flex does
CamperBot
@camperbot
Nov 06 2016 08:55 UTC
ricky11 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 823 | @sorinr |http://www.freecodecamp.com/sorinr
Erick Delfin
@Nifled
Nov 06 2016 08:56 UTC
@NitinNair89 I've tried that, and many other things too :worried:
But it always does the same thing.
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 08:57 UTC
@Nifled I am not sure, can u share the code?
Ricky11
@ricky11
Nov 06 2016 08:57 UTC
@sorinr instead of display:inline-flex, we can also use float:left also?? or no?
Sorin Ruse
@sorinr
Nov 06 2016 08:57 UTC
@ricky11 with flexbox no need to use floats
@ricky11 here some good video on flexbox:video
Ricky11
@ricky11
Nov 06 2016 08:59 UTC
@sorinr cool.. do you know how flexbox makes a image responsive and scales it down when viewport width is reduced?
joshandevera
@joshandevera
Nov 06 2016 09:10 UTC
http://codepene.io/joshdv92/pen/ZBYpQw how can i center and resize the photo
Sorin Ruse
@sorinr
Nov 06 2016 09:17 UTC
@ricky11 here a pen(not mine) to inspire for responsive imgs: pen
Ricky11
@ricky11
Nov 06 2016 09:22 UTC
@sorinr cool. i checked it out, but not sure which part of the img css makes the image responsive, just image:100%; ?
Nikhil Singh
@nikhilmufc7
Nov 06 2016 10:00 UTC
hi guys, Let me know your thoughts on this portfolio project, thanks http://codepen.io/Nikhilmufc7/full/MbYaGX/
Sorin Ruse
@sorinr
Nov 06 2016 10:18 UTC
@nikhilmufc7 move your img from imgur to someother hosting place. codepen does not work with imgur
Ricky11
@ricky11
Nov 06 2016 10:45 UTC
does anyone know how i can send someone my gitter contact info ?
Parvinder Kumar
@parvinder09
Nov 06 2016 10:59 UTC
Hi campers, done with half part of tic tac toe. Any feedback?
Only two players game is working as of now.
http://codepen.io/parvinder09/full/LRogZE/
Mihók Balázs
@mihokbalazs
Nov 06 2016 11:07 UTC
Hai guys! I want to make my Portfolio page but can't make work my jQuery. Can somebody check what is the problem?
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 11:08 UTC
@Recas the last one: type="text/javascript" src=".../file.php"? Don't know if that's correct
@Recas jQuery works for me on your site. So I guess your code has an error
Mihók Balázs
@mihokbalazs
Nov 06 2016 11:10 UTC
the php thing is just the webhost added
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 11:10 UTC
@Recas k
Mihók Balázs
@mihokbalazs
Nov 06 2016 11:10 UTC
so, in your browser the background is now red?
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 11:11 UTC
nope
I just executed a jQuery function with the developer tools
and this one worked
Mihók Balázs
@mihokbalazs
Nov 06 2016 11:11 UTC
so u can use libary
that's something
xD
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 11:11 UTC
=D
@Recas docoument
is not defined :P
(write document instead)
Mihók Balázs
@mihokbalazs
Nov 06 2016 11:13 UTC
poh afoasf al -.- xd
thx
fk my life
xd
and this $("button").addClass("animated bounce"); jQuery animations no longer support?
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 11:18 UTC
@Recas try include jQuery UI
Don't know if that's what you need but it's worth a try ;)
Erick Delfin
@Nifled
Nov 06 2016 11:21 UTC
@nikhilmufc7 Looks good!The only problem I'm seeing is that your about-section image is not showing.
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 11:22 UTC
@Recas the 'animated bounce' class is not from jQuery but from 'Animate' CSS by drayden
include the animate.css file in your code
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 11:23 UTC
bounce is also in jQuery UI: https://api.jqueryui.com/bounce-effect/
/or was, I don't know
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 11:23 UTC
@Otto-AA That doesn't look good :P
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 11:24 UTC
@NitinNair89 But it bounces ^_^
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 11:24 UTC
@Otto-AA Yeah, but still.. :P
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 11:24 UTC
@NitinNair89 Yeah, I know :)
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 11:25 UTC
:laughing:
Mihók Balázs
@mihokbalazs
Nov 06 2016 11:26 UTC
yea, i'm tried to include the jquery ui cdn but nothing happend, so the solution will be the animate.css as you mentioned Nitin
thought it's a jquery thing because of freecodecamp basic jquery lesson
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 11:28 UTC
it might be as @Otto-AA says
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 11:28 UTC
@Recas You can find bounce animations everywhere :smile:
@Recas If you want to see more of these: https://codepen.io/search/pens?q=bounce&limit=all&type=type-pens
Mihók Balázs
@mihokbalazs
Nov 06 2016 11:29 UTC
yes, but jquerry's version seems pretty repulsive
:D
mkey, thanks the helps
docoument :clap: :D
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 11:32 UTC
;)
Mihók Balázs
@mihokbalazs
Nov 06 2016 11:33 UTC
finally it bounce XDD
now I can do the real work
libaries working
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 11:34 UTC
@Recas I was working hard, for hours and hours, and now... it bounces =D
Mihók Balázs
@mihokbalazs
Nov 06 2016 11:35 UTC
actually... it almost true
I suffered evening too, to make this libaries working
buiphuking
@buiphuking
Nov 06 2016 12:09 UTC
anyone help me , Bastien VINH <--- you guys know him ?
Sorin Ruse
@sorinr
Nov 06 2016 12:12 UTC
@buiphuking nope. but here his LinkedIn page if that helps and is the right guy: https://www.linkedin.com/in/bastienv/en
Hristijan Gjorgjievski
@hristijankiko
Nov 06 2016 12:49 UTC
Anyone can help me with positioning my slider for "Strict" in the Simon game? The slider is on top of the text "Strict" and i can't move it. Here is the pen: http://codepen.io/hristijankiko/pen/KNwVWr
Dan Stockham
@DanStockham
Nov 06 2016 12:51 UTC
Does anyone see where the error is coming from? http://codepen.io/DanStockham/pen/vXVQNO?editors=0010
It's not so much a syntax error then it is with an error in React.
Something is coming up as undefined.
Rav404
@Rav404
Nov 06 2016 12:54 UTC
@DanStockham I couldn't help you on that have not done react yet...sorry
U-ways
@U-ways
Nov 06 2016 12:56 UTC
@hristijankiko Remember when you want to absolute position, the parent should have the position relative so the absolute position can take effect within the parent content!
Hristijan Gjorgjievski
@hristijankiko
Nov 06 2016 12:58 UTC
@U-ways The .switch class is the parent of all the absolute elements for the slider. Am i missing somthing?
U-ways
@U-ways
Nov 06 2016 13:01 UTC
@hristijankiko 1 moment I will have a look now :D
Hristijan Gjorgjievski
@hristijankiko
Nov 06 2016 13:01 UTC
@U-ways Okay thanks :)
CamperBot
@camperbot
Nov 06 2016 13:01 UTC
hristijankiko sends brownie points to @u-ways :sparkles: :thumbsup: :sparkles:
:cookie: 547 | @u-ways |http://www.freecodecamp.com/u-ways
F22rapt
@F22rapt
Nov 06 2016 13:03 UTC
how ushers life tis cold cold morning?
U-ways
@U-ways
Nov 06 2016 13:05 UTC

@hristijankiko

Your parent element was too small :D Below are the changes made:

        .switch
        width: 100px  /* increased width by 40px */
        .slider
          width: 50%  /* decreased width by 50% */
          top: 0
          right: 0    /* Removed  left so it will settle at the right */
          bottom: 0
@hristijankiko Doesn't look best. But this is just for outlining what you need to do! You will be able to figure out the rest from here!
Hristijan Gjorgjievski
@hristijankiko
Nov 06 2016 13:08 UTC
@U-ways Okay i will try to fix it :)
U-ways
@U-ways
Nov 06 2016 13:11 UTC
@hristijankiko Is that invoker as your avatar? :D (played Dota1/2 for over 6000hours back in the good old days :P Invoker was my favourite hero!
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 13:11 UTC
hiya @F22rapt long time no see :)
F22rapt
@F22rapt
Nov 06 2016 13:12 UTC
hai
been thru a lot lately hehe. just now able to get back to studying bootstrap
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 13:12 UTC
cool
F22rapt
@F22rapt
Nov 06 2016 13:15 UTC
love it when things click :D
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 13:16 UTC
:P
Ricky11
@ricky11
Nov 06 2016 13:38 UTC
any advice from the group are most welcome for my personal page : http://codepen.io/ricky11/full/VmYWdw/
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 13:41 UTC
@ricky11 the arrow has a dead link (#)
Ricky11
@ricky11
Nov 06 2016 13:41 UTC
@Otto-AA oh its just a fa fa icon arrow, no link there.
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 13:42 UTC
then don't put it in <a>...</a> but instead give it a CSS of cursor:pointer;
And tbh, it looks really overloaded. So it's quite nice, but not for a real Personal Page ;)
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 13:44 UTC
GM guys, I am struggling with aligning social media codes
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 13:44 UTC
@angelogianopulos GM=?
Ricky11
@ricky11
Nov 06 2016 13:44 UTC
@Otto-AA good morning maybe GM?
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 13:44 UTC
yes good morning
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 13:44 UTC
Ok, 2pm for me ;P
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 13:44 UTC
<div class="col-md-6 right">
<h2>AROUND THE WEB</h2>
<ul>
<li><a href="#" class="button social">
<i class="fa fa-fw fa-linkedin"></i> </a>
</li>
<li><a href="#" class="button social">
<i class="fa fa-fw fa-github"></i></a></li>
</ul>
</div>
I am in the US eastern time 9am here
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 13:45 UTC
@angelogianopulos do you have a codepen with it?
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 13:45 UTC
yes
Ricky11
@ricky11
Nov 06 2016 13:45 UTC
@angelogianopulos have you tried using flexbox to align ? display:flex align-items:center something like that. sadly flexbox is not taught here.
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 13:45 UTC
can you share that link, makes it much easier for me ;)
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 13:45 UTC
sure
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 13:48 UTC
@angelogianopulos flexbox is a nice thing to learn. Another way would be simply: footer li { display: inline-block; }
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 13:51 UTC
that aligned my icons!! But it won't change the color to white
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 13:51 UTC
@angelogianopulos What do you want to be white?
Juan Angelogianopulos
@angelogianopulos
Nov 06 2016 13:52 UTC
no worries I fixed it!
Thanks for your help @Otto-AA
CamperBot
@camperbot
Nov 06 2016 13:52 UTC
angelogianopulos sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:cookie: 361 | @otto-aa |http://www.freecodecamp.com/otto-aa
Marcin Kluska
@marcinkluska
Nov 06 2016 13:53 UTC
Hi i have problem with getJson dont work can someone help me?
$.getJSON("http://ip-api.com/json", function(ipJson){
var url = "http://api.openweathermap.org/data/2.5/weather?q=" + ipJson.city + "&units=imperial&APPID=090df93fca915b0729df1d32d8d37595";
$("#data").html(url);
});
dont show url
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 13:56 UTC
@marcinkluska do you have it in codepen?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 13:56 UTC
what's your console.log messages say? @marcinkluska
probably cross browser origin issue @Otto-AA ? What you think?
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 13:58 UTC
@NitinNair89 I wouldn't know why there should be one.
But tbh I mostly start thinking about these problems when I've got a Pen to work with O.o
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 13:59 UTC
most of them think so :P
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 13:59 UTC
Because that's pretty much guessing
:)
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 13:59 UTC
:laughing:
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 14:00 UTC
Is there any list for all smileys?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:02 UTC
just type : and some alphabets :P
:walking:
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 14:02 UTC
:alien:
lol
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:02 UTC
hahahaha
F22rapt
@F22rapt
Nov 06 2016 14:02 UTC
what advantages are gained from nesting grid columns?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:03 UTC
a complicated but stable grid
F22rapt
@F22rapt
Nov 06 2016 14:06 UTC
dammit coding, stop being complicated!
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 14:06 UTC
dammit painters, stop using colors ;P
F22rapt
@F22rapt
Nov 06 2016 14:07 UTC
yeah exactly!
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:07 UTC
:panda_face:
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 14:09 UTC
:koala:
F22rapt
@F22rapt
Nov 06 2016 14:09 UTC
:department_store:
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:10 UTC
:tada: I hope I don't get blocked for spamming emojis :P
F22rapt
@F22rapt
Nov 06 2016 14:10 UTC
sensitive bot is sensitive?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:11 UTC
i don't know
F22rapt
@F22rapt
Nov 06 2016 14:21 UTC
there is sooo much to go through
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 14:22 UTC
there won't likely be an end of learning :laughing:
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:22 UTC
can someone give me good docs on how to build a chatbot?
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 14:22 UTC
but the more you do, the better results you'll see
@NitinNair89 not really, but that could be interesting: https://medium.freecodecamp.com/creating-a-chat-bot-42861e6a2acd#.a2jlr8nrq
F22rapt
@F22rapt
Nov 06 2016 14:24 UTC
im sitll stuck on the portfolio <.>
i duno what i should do for a layout/..
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 14:26 UTC
F22rapt
@F22rapt
Nov 06 2016 14:31 UTC
tanks
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:35 UTC
@Otto-AA Thanks for the article, had a lot of info, but i can't create one by reading it :(
CamperBot
@camperbot
Nov 06 2016 14:35 UTC
nitinnair89 sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:cookie: 362 | @otto-aa |http://www.freecodecamp.com/otto-aa
Adel
@AdelMahjoub
Nov 06 2016 14:38 UTC
hi, using twbs, at small screens the left button list become unclickable, can't find how to fix it http://codepen.io/SultanCodeCamper/full/JboXwv/
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 14:42 UTC
@NitinNair89 But you can get inspired and many ideas for layouts and stuff. And if you need you can visit the page (if available) and inspect the code ;) Thought you meant something different
F22rapt
@F22rapt
Nov 06 2016 14:42 UTC
making the next twithc chatbot?
twitch*
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:43 UTC
@Otto-AA I wanted to build a simple custom bot for work (I have managed to build one using simple file reading techniques with fixed set of commands) and it is not human-like .. I know NLP is way far too much for me right now :(
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 14:44 UTC
@NitinNair89 you could do some kind of console instead, where you type a command like google abc and then it executes it. That would be a bit easier :)
Anyway, buy guys
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:45 UTC
@Otto-AA Yep, did that ;) bye @Otto-AA see ya later
F22rapt
@F22rapt
Nov 06 2016 14:46 UTC
bye
ah wait i twas late
so if i make a nav bar in which each section is on another page, would that mean i have to create seperate pages for each?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:50 UTC
you can do it in same page @F22rapt
F22rapt
@F22rapt
Nov 06 2016 14:51 UTC
this is what i'd like to do http://jeremypeters.co.uk/ with my buttons
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:53 UTC
@F22rapt that's different pages per section..and different folders too (for SEO) ..each folder probably having an index.htm/html or index.php file (that's why you can't see the file name in the URL)
F22rapt
@F22rapt
Nov 06 2016 14:54 UTC
folders..?<.>
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:54 UTC
yea
when you click the menu, you can see the change in URL
if you check my website, i have made it in single page so the URL won't change :)
Don't think much
F22rapt
@F22rapt
Nov 06 2016 14:57 UTC
<.> eh
ar eyou tlaking like a uhm..scroll?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 14:57 UTC
yep
F22rapt
@F22rapt
Nov 06 2016 15:00 UTC
ok
F22rapt
@F22rapt
Nov 06 2016 15:21 UTC
i type so gud 10/10
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 15:22 UTC
:P
F22rapt
@F22rapt
Nov 06 2016 15:28 UTC
does container fluid automagically center headers?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 15:30 UTC
nope
F22rapt
@F22rapt
Nov 06 2016 15:31 UTC
hmmm ok
Maybe im jsut missing something. im not seeing where in the code they center it
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 15:32 UTC
pen?
text-center class?
F22rapt
@F22rapt
Nov 06 2016 15:32 UTC
oh no its not centered. derp. just the preview image that looks that way xD
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 15:32 UTC
margin:0 auto ?
lol
ok
F22rapt
@F22rapt
Nov 06 2016 15:32 UTC
xuse me :D
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 15:33 UTC
excused :D
F22rapt
@F22rapt
Nov 06 2016 15:37 UTC
would Position abosolute be a good way to move my headers down the page?
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 15:38 UTC
You can.. but not good for responsivesness.. though it depends
*responsive-ness
Sorin Ruse
@sorinr
Nov 06 2016 15:47 UTC
@F22rapt @NitinNair89 i think moving navigation to the bottom on desktops its kinda bad UX because when u first look at a page you always see the top half of the page and then you look down at the bottom of the page. hope it makes sense
F22rapt
@F22rapt
Nov 06 2016 15:47 UTC
wait who said anything about moving nav bar to the bottom?
Sorin Ruse
@sorinr
Nov 06 2016 15:51 UTC
sorry when you said headers i was imagined the nav part :)
F22rapt
@F22rapt
Nov 06 2016 15:52 UTC
xD no probs useful information is useful nontheless
Nikolay Belolipetskiy
@kolyambo
Nov 06 2016 15:54 UTC
hey, everyone! can i ask someone for help with Bootstrap & Navbar collapsing? can't fix it in Portfolio task :\
i can't make examples from getbootstrap.com to work
F22rapt
@F22rapt
Nov 06 2016 15:58 UTC
still learning bootstrap ymself :(
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 16:07 UTC
@kolyambo Did you import jquery and bootstrap files?
your jquery file should be before the bootstrap one
Nikolay Belolipetskiy
@kolyambo
Nov 06 2016 16:14 UTC
@NitinNair89 MATE, YOU SAVED ME :D thank you a really lot :)
CamperBot
@camperbot
Nov 06 2016 16:14 UTC
kolyambo sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 346 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
Nikolay Belolipetskiy
@kolyambo
Nov 06 2016 16:14 UTC
it work now
AashickJohn
@aashickjohn
Nov 06 2016 16:27 UTC
Hi guys. I am able to login IN codepen.io.
Through the freecodecamp given link
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 16:54 UTC
@kolyambo welcome :)
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 16:54 UTC
@NitinNair89 Do you have your console somewhere in the internet?
I would love to see it :)
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 16:55 UTC
console?
@Otto-AA
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 16:55 UTC
@NitinNair89 The thing witch google commands? Didn't you say you did one
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 16:56 UTC
oh that! @Otto-AA I don't. it's at work. Will upload it when i get time :)
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 16:57 UTC
@NitinNair89 ah ok. :smile:
Nitin Chandran Nair
@NitinNair89
Nov 06 2016 16:58 UTC
but it's easy
it's just like how to add the tweet button to the quotes machine
@Otto-AA
Noah Fleitz
@burningPluto
Nov 06 2016 17:06 UTC
So when I add a div to my site for a new section it doesnt separate the divs. When I put a new heading inside the new div it creates a gap. How can I fix that?
I've got it thanks
Kartikeya Gupta
@kartikeya100
Nov 06 2016 17:14 UTC
what are some basic/intermediate react apps i can do since i find game of life hard
Sorin Ruse
@sorinr
Nov 06 2016 17:36 UTC
@burningPluto any h1,h2, etc are having by default some margins. take a look to this example example just add to h1in css margin: 0; to see the effect
BehindTheMath
@BehindTheMath
Nov 06 2016 17:45 UTC
Even though funcTwo is a named function, it's not scoped locally.
Sorin Ruse
@sorinr
Nov 06 2016 17:52 UTC
@BehindTheMath u get a ref error coz the funcTwo is attached to the var obj. its like writing: var obj ={ funcTwo: function(){console.log("funcTwo called.");}};
Tessa
@TheTessaMurphy
Nov 06 2016 17:57 UTC
I'm using firefox to work on my weather app because chrome doesn't allow geolocating. In firefox I keep getting this error. --Error: Bootstrap's JavaScript requires jQuery -- but I've loaded jquery both into my css and my js settings within codepend. I'm stuck.
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 17:57 UTC
@TheTessaMurphy did you load it before bootstrap?
Sorin Ruse
@sorinr
Nov 06 2016 17:58 UTC
@TheTessaMurphy chrome allows geolocation only that ou have to run the pen or app over https not http
Tessa
@TheTessaMurphy
Nov 06 2016 17:58 UTC
no, should I have?
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 17:58 UTC
give it a try ;)
Gopherine
@gopherine
Nov 06 2016 17:59 UTC

@atharvajava

function palindrome(str) {
// Good luck!
str=str.toLowerCase();
str=str.replace(/[^\Wa-z0-9]/gi," ");
str=str.replace(/[.,\s]/g, '');
str=str.replace(/\//g, "");
str=str.replace("(", "").replace(")", "").replace("-", "");
var a=str.split("");
a=a.reverse();
a=a.join("");
if(str===a){
return true;
}
else {
return a;
}

}

palindrome("0_0 (: /-\ :) 0-0");
hi guys any idea what i am doing wrong here

Tessa
@TheTessaMurphy
Nov 06 2016 18:02 UTC
@Otto-AA No, still getting the error message. Plus this: An iframe which has both allow-scripts and allow-same-origin for its sandbox attribute can remove its sandboxing. -- My quote machine works just fine in firefox, and also uses jquery, so maybe it's my code. Also, now that I think about it, I'm not using bootstrap. I haven't done any styling at all.
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 18:03 UTC
@TheTessaMurphy Can you link the pen?
I've got a bunch of geolocation stuff commented out because I want to get the open weather api working first. I've also removed bootstrap from javascript, at least for the moment.
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 18:09 UTC
@TheTessaMurphy In the js-settings, put your bootstrap.min.js at the bottom and it should work :)
Sorin Ruse
@sorinr
Nov 06 2016 18:11 UTC
@TheTessaMurphy what @Otto-AA is saying is that you have to load js libs like jquery first, then bootstrap.js after, then bootstrap-ui.js , etc
Tessa
@TheTessaMurphy
Nov 06 2016 18:14 UTC
@sorinr yes, thank you I got that. I've stopped getting the error code but am still getting the warnings and my code still doesn't work.
CamperBot
@camperbot
Nov 06 2016 18:15 UTC
thetessamurphy sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 824 | @sorinr |http://www.freecodecamp.com/sorinr
Tessa
@TheTessaMurphy
Nov 06 2016 18:15 UTC
@Otto-AA thank you
CamperBot
@camperbot
Nov 06 2016 18:15 UTC
thetessamurphy sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:cookie: 363 | @otto-aa |http://www.freecodecamp.com/otto-aa
Tessa
@TheTessaMurphy
Nov 06 2016 18:15 UTC
Although I am getting undefined which I suppose is a step in the right direction.
Tulsi Leathers
@tulsileathers
Nov 06 2016 18:23 UTC
Hi all, I'm working on the Random Quote Machine. I have it working but wanted to make some changes locally. I exported to zip from codepen. In the local copy codepen generated however, my new quote button does not work. The tweet button does work so codepen linked the script file correctly not sure what I need to do make the new quote button work. I'd appreciate any help. My codepen is here http://codepen.io/jayceleathers/pen/WoNQVK
Tulsi Leathers
@tulsileathers
Nov 06 2016 18:30 UTC
getting closer checked the console and I'm getting this when I press the button
'Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&_=1478456954914. (Reason: CORS header ‘Access-Control-Allow-Origin’ does not match ‘http://null’).'
Wim Huiskes
@wimhuiskes
Nov 06 2016 18:31 UTC
good evening all, any wordpress wizards on???
wordpress/ajax
Wim Huiskes
@wimhuiskes
Nov 06 2016 18:45 UTC
no one???
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 18:48 UTC
@wimhuiskes not really :/
Tessa
@TheTessaMurphy
Nov 06 2016 18:49 UTC

Could someone tell me what I'm missing in this code? I'm not getting anything.

$("#btnWeather").on("click", function(){ $.getJSON("http://api.openweathermap.org/data/2.5/forecast/daily?q=api.openweathermap.org/data/2.5/weather?q=Bremerton&APPID=ee6596241130f193adf1ba90e625cc10",function(result){

alert("Weather: "+ result.main.temp);
});

});

Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 18:51 UTC
@TheTessaMurphy Are you sure that the key is valid?
(Just opened http://api.openweathermap.org/data/2.5/forecast/daily?q=api.openweathermap.org/data/2.5/weather?q=Bremerton&APPID=ee6596241130f193adf1ba90e625cc10 and got {"cod":401, "message": "Invalid API key. Please see http://openweathermap.org/faq#error401 for more info."} as a result
Try this @TheTessaMurphy , I used it with my API Key and it worked for me.
@TheTessaMurphy this is the JSON that I received
{
coord: {
lon: -122.63,
lat: 47.57
},
weather: [
{
id: 804,
main: "Clouds",
description: "overcast clouds",
icon: "04d"
}
],
base: "stations",
main: {
temp: 285.96,
pressure: 1017,
humidity: 87,
temp_min: 284.15,
temp_max: 288.15
},
visibility: 16093,
wind: {
speed: 4.6,
deg: 180
},
clouds: {
all: 90
},
dt: 1478456100,
sys: {
type: 1,
id: 2923,
message: 0.1609,
country: "US",
sunrise: 1478444650,
sunset: 1478479417
},
id: 5788054,
name: "Bremerton",
cod: 200
}
Tessa
@TheTessaMurphy
Nov 06 2016 18:55 UTC
@SEGrooms Still not working on my pen. Although if it worked for you, that's good, right?
Waqas Abbasi
@Waqas909
Nov 06 2016 18:56 UTC
Hello!
Does Anyone know how to change background color OnClick with smooth transition
Shawn Grooms
@SEGrooms
Nov 06 2016 18:56 UTC
Waqas Abbasi
@Waqas909
Nov 06 2016 18:57 UTC
I'm aware on how to change color, but how do i make it a smooth transition
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 18:57 UTC
@Waqas909 add transition: background-color 1s ease-in-out or something like that to the elements CSS
Shawn Grooms
@SEGrooms
Nov 06 2016 18:58 UTC
@TheTessaMurphy showed up when you pasted this link into your URL??
Waqas Abbasi
@Waqas909
Nov 06 2016 18:58 UTC
@Otto-AA Thanks, needed a start. I'll look into it!
CamperBot
@camperbot
Nov 06 2016 18:58 UTC
waqas909 sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:cookie: 364 | @otto-aa |http://www.freecodecamp.com/otto-aa
Tessa
@TheTessaMurphy
Nov 06 2016 18:58 UTC
I got this. {"cod":401, "message": "Invalid API key. Please see http://openweathermap.org/faq#error401 for more info."}
Shawn Grooms
@SEGrooms
Nov 06 2016 18:59 UTC
Hmmm…you’re sure that you have the correct API key?
Tessa
@TheTessaMurphy
Nov 06 2016 19:00 UTC
This is my key. I'll try it again. 8a874af5a7e56ffad7280ba108e941ef
@SEGrooms It worked! Thank you thank you thank you!
CamperBot
@camperbot
Nov 06 2016 19:01 UTC
thetessamurphy sends brownie points to @segrooms :sparkles: :thumbsup: :sparkles:
:cookie: 376 | @segrooms |http://www.freecodecamp.com/segrooms
Shawn Grooms
@SEGrooms
Nov 06 2016 19:01 UTC
YAY!!! :D
you’re welcome! I was in your shoes like 4 weeks ago! Keep chugging along! :clap:
Marcin Kluska
@marcinkluska
Nov 06 2016 19:04 UTC
hello you help me with the code https://codepen.io/marcinkl1987/pen/pEPrLR
why #data dont change on url?
what is wrong?
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Nov 06 2016 19:10 UTC
@marcinkluska Because your $.getJson call fails
$.getJSON("http://ip-api.com/json").done(function(ipJson) {
  console.log("done");
  var url = "http://api.openweathermap.org/data/2.5/weather?q=" + ipJson.city + "&units=imperial&APPID=090df93fca915b0729df1d32d8d37595";
  $("#data").html(url);
}).fail(function() {
  console.log("fail")
});;
Marcin Kluska
@marcinkluska
Nov 06 2016 19:12 UTC
why is fail?
http://ip-api.com/json -> {"as":"AS29007 Petrotel's commercial IP network Chemikow 7, Plock Poland","city":"Płock","country":"Poland","countryCode":"PL","isp":"Petrotel Sp. z o.o.","lat":52.55,"lon":19.7,"org":"Petrotel Sp. z o.o.","query":"46.182.102.221","region":"MZ","regionName":"Masovian Voivodeship","status":"success","timezone":"Europe/Warsaw","zip":"09-400"}
Tessa
@TheTessaMurphy
Nov 06 2016 19:19 UTC
This just happened to me. Have you checked that your appid is valid? Also, you may want to change the name of your variable. url might be confusing things.
Marcin Kluska
@marcinkluska
Nov 06 2016 19:20 UTC
it works now thank you for help @Otto-AA
CamperBot
@camperbot
Nov 06 2016 19:20 UTC
marcinkluska sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:cookie: 365 | @otto-aa |http://www.freecodecamp.com/otto-aa
Shawn Grooms
@SEGrooms
Nov 06 2016 19:24 UTC
@TheTessaMurphy if you’re using Chrome, I highly recommend adding the extension JSONView for when you are looking at JSON in the browser.
Tessa
@TheTessaMurphy
Nov 06 2016 19:25 UTC
Right now I'm using firefox but chrome is my usual browser. How do I add that?
Is it in developer tools?
Shawn Grooms
@SEGrooms
Nov 06 2016 19:26 UTC
On the right side of the URL form there are 3 dots
Click settings
Then extensions
Check the box next to developer mode at the top
oh, nvm
Click this and add it to chrome, lol
Tessa
@TheTessaMurphy
Nov 06 2016 19:35 UTC
Wow, either firefox has become buggy or something's going on with my wifi. Chrome works fine, though.
@SEGrooms thank you again!
CamperBot
@camperbot
Nov 06 2016 19:35 UTC
thetessamurphy sends brownie points to @segrooms :sparkles: :thumbsup: :sparkles:
:warning: thetessamurphy already gave segrooms points
Shawn Grooms
@SEGrooms
Nov 06 2016 19:35 UTC
You’re welcome! iIt helped me out with the API projects :)
BehindTheMath
@BehindTheMath
Nov 06 2016 19:37 UTC
@sorinr
Whoops.
@sorinr is there any way to separate the function in order to be able to call it directly elsewhere?
Dan Stockham
@DanStockham
Nov 06 2016 19:53 UTC
H?ey all
NITIN RAGHAV
@nitinraghav
Nov 06 2016 19:53 UTC
can somebody pls tell me how can i fix "about me" section's width. I want tomake it 100% but something is going wrong
Dan Stockham
@DanStockham
Nov 06 2016 19:54 UTC
@nitinraghav What's wrong with the section width?
@nitinraghav It looks fine to me.
Shawn Grooms
@SEGrooms
Nov 06 2016 19:55 UTC
@nitinraghav it looks fine to me too.
Robert Purcea
@RobertPurcea
Nov 06 2016 19:55 UTC
what's wrong?
it's not 100%
you can see an empty space on the right
NITIN RAGHAV
@nitinraghav
Nov 06 2016 19:55 UTC
@DanStockham @SEGrooms theres some empty space
which i want to remove
Shawn Grooms
@SEGrooms
Nov 06 2016 19:56 UTC
@nitinraghav I didn’t realize it popped up when you scrolled.
Dan Stockham
@DanStockham
Nov 06 2016 19:56 UTC
@nitinraghav You have extra margin on the right side
@nitinraghav set the margin to 0. Or to be specific margin-right should be 0
NITIN RAGHAV
@nitinraghav
Nov 06 2016 19:58 UTC
@DanStockham tried margin-right: 0; did nothing
its still the same]
Dan Stockham
@DanStockham
Nov 06 2016 19:59 UTC
@nitinraghav in the .about selector?
Shawn Grooms
@SEGrooms
Nov 06 2016 19:59 UTC
@nitinraghav change the div from .row to .container-fluid
Robert Purcea
@RobertPurcea
Nov 06 2016 19:59 UTC
@DanStockham
.about{
margin: 0px;
}
CamperBot
@camperbot
Nov 06 2016 19:59 UTC
you need to ask about @someone!
Robert Purcea
@RobertPurcea
Nov 06 2016 19:59 UTC
type that
fixed
Shawn Grooms
@SEGrooms
Nov 06 2016 20:00 UTC
@nitinraghav it worked for me!
NITIN RAGHAV
@nitinraghav
Nov 06 2016 20:00 UTC
@DanStockham now i tried removing width:100%; and adding margin-right: 0; it worked
Tessa
@TheTessaMurphy
Nov 06 2016 20:00 UTC
In Chrome, if I use https, I can get geolocation to work, but not the Open Weather API. If I use http, the weather api works but geolocation doesn't. Has anybody run into this issue and if so, found a workaround?
NITIN RAGHAV
@nitinraghav
Nov 06 2016 20:00 UTC
@SEGrooms did u remove width: 100%??
Dan Stockham
@DanStockham
Nov 06 2016 20:01 UTC
@nitinraghav if you just add margin:0 in your .about selector that would work.
Shawn Grooms
@SEGrooms
Nov 06 2016 20:01 UTC
@nitinraghav nope, just switched from .row to .container-fluid
Dan Stockham
@DanStockham
Nov 06 2016 20:01 UTC
@nitinraghav The problem was there was extra margin on the right side.
Shawn Grooms
@SEGrooms
Nov 06 2016 20:01 UTC
@DanStockham margin: 0 worked too
NITIN RAGHAV
@nitinraghav
Nov 06 2016 20:02 UTC
@SEGrooms thanks
CamperBot
@camperbot
Nov 06 2016 20:02 UTC
nitinraghav sends brownie points to @segrooms :sparkles: :thumbsup: :sparkles:
:cookie: 377 | @segrooms |http://www.freecodecamp.com/segrooms
NITIN RAGHAV
@nitinraghav
Nov 06 2016 20:02 UTC
@DanStockham thanks
CamperBot
@camperbot
Nov 06 2016 20:02 UTC
nitinraghav sends brownie points to @danstockham :sparkles: :thumbsup: :sparkles:
:cookie: 514 | @danstockham |http://www.freecodecamp.com/danstockham
Dan Stockham
@DanStockham
Nov 06 2016 20:03 UTC
@nitinraghav No problem! :D
NITIN RAGHAV
@nitinraghav
Nov 06 2016 20:03 UTC
i guess i need to check out difference between container and container-fluid again.
Shawn Grooms
@SEGrooms
Nov 06 2016 20:03 UTC
@nitinraghav glad to be of help :smile:
container has a defined width
container-fluid will always take up 100% of the container that holds it.
NITIN RAGHAV
@nitinraghav
Nov 06 2016 20:04 UTC
that makes it quite clear..
Shawn Grooms
@SEGrooms
Nov 06 2016 20:04 UTC
Container has breakpoints such as: lg, md, sm, xs
Container fluid doesn’t have breakpoints and will always be 100% width.
better?
NITIN RAGHAV
@nitinraghav
Nov 06 2016 20:05 UTC
yes thanks
Shawn Grooms
@SEGrooms
Nov 06 2016 20:06 UTC
:+1:
NITIN RAGHAV
@nitinraghav
Nov 06 2016 20:06 UTC
also as u can see i dint use bootstrap for navbar.
reason being I cudnt find a way around to style a defaut or inverse navbar. is it something thats possible to do
Shawn Grooms
@SEGrooms
Nov 06 2016 20:08 UTC
.navbar-inverse will invert the colors of your navbar
It turns the navbar black
NITIN RAGHAV
@nitinraghav
Nov 06 2016 20:10 UTC
great.
i ll go through that link
@SEGrooms thanks agn
CamperBot
@camperbot
Nov 06 2016 20:10 UTC
nitinraghav sends brownie points to @segrooms :sparkles: :thumbsup: :sparkles:
:warning: nitinraghav already gave segrooms points
Shawn Grooms
@SEGrooms
Nov 06 2016 20:10 UTC
np! :)
Brandon
@bd1887
Nov 06 2016 20:16 UTC
Hi everyone. I'm working on the twitch.tv api and having some trouble getting getting the json. If I put the url in the browser, I get it, but when I try to make the request in codepen, it isn't completing. Here's my code:
$.ajax({
dataType: "json",
url: 'https://wind-bow.hyperdev.space/twitch-api/users/tictac_hs',
success: function() {
console.log("wow!");
}
});
Shawn Grooms
@SEGrooms
Nov 06 2016 20:17 UTC
$.ajax({
dataType: "json",
url: 'https://wind-bow.hyperdev.space/twitch-api/users/tictac_hs',
success: function() {
console.log("wow!");
}
});
@bd1887 I was just making it easier to read
Clyde Lobo
@oppiniated
Nov 06 2016 20:18 UTC
@bd1887 Does the twitch api need a key?
Shawn Grooms
@SEGrooms
Nov 06 2016 20:19 UTC
@bd1887 I don’t think that is the right request, because it isn’t returning data about the game.
@bd1887 One of the user stories is that your can see additional details about what they are streaming
Brandon
@bd1887
Nov 06 2016 20:21 UTC
@oppiniated It does, but that url is a pass-through given as part of the challenge
Brandon
@bd1887
Nov 06 2016 20:27 UTC
@SEGrooms In that case, I'd just replace /users with /channels, but neither are completing the ajax call
creativegirl
@creativegirl
Nov 06 2016 20:29 UTC
hello there
Clyde Lobo
@oppiniated
Nov 06 2016 20:29 UTC
@bd1887 can you post the codepen link?
Shawn Grooms
@SEGrooms
Nov 06 2016 20:29 UTC
@bd1887 still thinking
@bd1887 have you gotten an API key?
Brandon
@bd1887
Nov 06 2016 20:30 UTC
@oppiniated sure but none of the js is up yet.
@SEGrooms Free Code Camp recommends using this url in order to avoid having to get an api key from twitch (I think it might be kind of complicated. I'm not sure.)
Shawn Grooms
@SEGrooms
Nov 06 2016 20:32 UTC
oh right!
Clyde Lobo
@oppiniated
Nov 06 2016 20:33 UTC
error "{"error":"Unprocessable Entity","status":422,"message":"Channel 'channel is unavailable"}"
Shawn Grooms
@SEGrooms
Nov 06 2016 20:33 UTC
Sorry @bd1887 , I forgot that they did that. I couldn’t get hyperdev to work, so I just got an API key. Twitch allows you to show it too, so you aren’t breaking any rules.
If you use an API key, you can make a request the usual way.
    $.ajax({
      dataType: 'json',
      url: 'https://api.twitch.tv/kraken/streams/ESL_SC2',
      headers: {
        'Accept': 'application/vnd.twitchtv.v3+json',
        'Client-ID': '1cif9hquapcfo1i4h9kcr5eubsrx5ek'
      },
      success: throw a dance part,
      error: cry yourself to sleep
  });
@bd1887 wish I could be of more help
Brandon
@bd1887
Nov 06 2016 20:38 UTC
@SEGrooms Oh ok. I was worried it might be hyperdev, so I tried to sign up for a twitch api key. But it requires that I fill in a Redirect URI... I'm not even sure what that is.
That will take you to your dashboard. I don’t remember anything about a URI
@bd1887 if you go to the link, you should be able to hit show key, and PRESTO!
Brandon
@bd1887
Nov 06 2016 20:43 UTC
@SEGrooms @oppiniated Awesome, thanks. It's working now. I won't have to cry myself to sleep.
CamperBot
@camperbot
Nov 06 2016 20:43 UTC
:cookie: 323 | @oppiniated |http://www.freecodecamp.com/oppiniated
bd1887 sends brownie points to @segrooms and @oppiniated :sparkles: :thumbsup: :sparkles:
:cookie: 378 | @segrooms |http://www.freecodecamp.com/segrooms
Shawn Grooms
@SEGrooms
Nov 06 2016 20:43 UTC
@bd1887 haha! :+1:
Clyde Lobo
@oppiniated
Nov 06 2016 20:53 UTC
Done with the challenges, too lazy to start with the projects :worried:
Keskah
@KeskahJune
Nov 06 2016 21:50 UTC
Hey, I just got to the build a tribute page project and.... I don't even know where to start. Does anyone have some good tips? I haven't really been doing this consistently so it's like all of the useful information I had been trying to remember has just disappeared from my brain >.<
Shawn Grooms
@SEGrooms
Nov 06 2016 21:51 UTC
@KeskahJune step1: take a deep breath
@KeskahJune step2: realize that you can’t do anything wrong
Keskah
@KeskahJune
Nov 06 2016 21:51 UTC
Haha, thank you
Shawn Grooms
@SEGrooms
Nov 06 2016 21:51 UTC
@KeskahJune step3: start putting in some html
Coy Sanders
@coymeetsworld
Nov 06 2016 21:51 UTC
@KeskahJune you can use the Bootstrap library you've been using on the previous challenges to help style your page
they have pretty good documentation and examples if you forgot a few things
Shawn Grooms
@SEGrooms
Nov 06 2016 21:52 UTC
@KeskahJune @coymeetsworld stole my punchline! ;)
Coy Sanders
@coymeetsworld
Nov 06 2016 21:52 UTC
sorry :)
Keskah
@KeskahJune
Nov 06 2016 21:52 UTC
@coymeetsworld @SEGrooms Thank you so much!!
CamperBot
@camperbot
Nov 06 2016 21:52 UTC
keskahjune sends brownie points to @coymeetsworld and @segrooms :sparkles: :thumbsup: :sparkles:
:cookie: 379 | @segrooms |http://www.freecodecamp.com/segrooms
:star2: 1492 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
Shawn Grooms
@SEGrooms
Nov 06 2016 21:52 UTC
haha np!
Coy Sanders
@coymeetsworld
Nov 06 2016 21:52 UTC
:ok_hand: good luck with it @KeskahJune
Shawn Grooms
@SEGrooms
Nov 06 2016 21:53 UTC
@KeskahJune the biggest thing for me was not being scared of messing up the project. Will it look like a million bucks? Probably not, but you’re new!!!!
@KeskahJune Bootstrap did wonders for me. Best of luck!
Keskah
@KeskahJune
Nov 06 2016 21:54 UTC
@SEGrooms Exactly! That's the hardest thing to get over, hah, and thank you again! I'll get to it...
CamperBot
@camperbot
Nov 06 2016 21:54 UTC
keskahjune sends brownie points to @segrooms :sparkles: :thumbsup: :sparkles:
:warning: keskahjune already gave segrooms points
Coy Sanders
@coymeetsworld
Nov 06 2016 21:54 UTC
yeah don't worry about it being perfect, just try to get something going and pass the User Stories
you can always go back and improve on it later
thats what i did on alot of my projects when i didn't dig deeper into CSS
NITIN RAGHAV
@nitinraghav
Nov 06 2016 21:56 UTC
I've made changes and heres my final portfolio, kindly comment/ suggest improvements. thanks
http://codepen.io/nitinraghav/pen/QGwaeP?editors=1100
Shawn Grooms
@SEGrooms
Nov 06 2016 21:57 UTC
wow @nitinraghav that looks great!
The dropdown doesn’t close when clicked, but other than that it is excellent. Better than mine!
NITIN RAGHAV
@nitinraghav
Nov 06 2016 21:58 UTC
@SEGrooms thanks shawn. n also added bootstrap to this one. its responsive for small screens
CamperBot
@camperbot
Nov 06 2016 21:58 UTC
nitinraghav sends brownie points to @segrooms :sparkles: :thumbsup: :sparkles:
:cookie: 380 | @segrooms |http://www.freecodecamp.com/segrooms
NITIN RAGHAV
@nitinraghav
Nov 06 2016 21:59 UTC
:)
Shawn Grooms
@SEGrooms
Nov 06 2016 21:59 UTC
I need to add some pretty photos to mine, lol
NITIN RAGHAV
@nitinraghav
Nov 06 2016 21:59 UTC
dropdown works fine for me
Shawn Grooms
@SEGrooms
Nov 06 2016 22:00 UTC
What browser are you using?
NITIN RAGHAV
@nitinraghav
Nov 06 2016 22:00 UTC
chrome
Coy Sanders
@coymeetsworld
Nov 06 2016 22:00 UTC
@nitinraghav I like the font choice
i would change the font color of My Work to something that contrasts the orange though
NITIN RAGHAV
@nitinraghav
Nov 06 2016 22:01 UTC
@SEGrooms i picked these photos from unsplash.com
Shawn Grooms
@SEGrooms
Nov 06 2016 22:01 UTC
@nitinraghav The buttons are working, but the menu isn’t closing when you click one. You have to manually toggle the icon-bars
Coy Sanders
@coymeetsworld
Nov 06 2016 22:01 UTC
also minor detail is when you hover over your buttons on your navbar the navbar height increases to make room for the underline
NITIN RAGHAV
@nitinraghav
Nov 06 2016 22:01 UTC
@coymeetsworld thanks. ya u rite it sort of mixes with BG ill change that
CamperBot
@camperbot
Nov 06 2016 22:01 UTC
nitinraghav sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:star2: 1493 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
Coy Sanders
@coymeetsworld
Nov 06 2016 22:01 UTC
i would try to fix it so that it doesn't do that, but overall nice work
NITIN RAGHAV
@nitinraghav
Nov 06 2016 22:02 UTC
@coymeetsworld i hope you wouldnt notice height of navbar ;)
i tried fixing that but cudnt..
Coy Sanders
@coymeetsworld
Nov 06 2016 22:03 UTC
if you give it a fixed height it should work
NITIN RAGHAV
@nitinraghav
Nov 06 2016 22:03 UTC
@SEGrooms oh k i get what u mean
Coy Sanders
@coymeetsworld
Nov 06 2016 22:04 UTC
but not a big deal, its something you can always look at later
NITIN RAGHAV
@nitinraghav
Nov 06 2016 22:04 UTC
@coymeetsworld will try that
Coy Sanders
@coymeetsworld
Nov 06 2016 22:04 UTC
JavaScript more important to learn than that
Shawn Grooms
@SEGrooms
Nov 06 2016 22:05 UTC
@nitinraghav thanks for the photo link! These are excellent!
CamperBot
@camperbot
Nov 06 2016 22:05 UTC
:cookie: 264 | @nitinraghav |http://www.freecodecamp.com/nitinraghav
segrooms sends brownie points to @nitinraghav :sparkles: :thumbsup: :sparkles:
NITIN RAGHAV
@nitinraghav
Nov 06 2016 22:07 UTC
@coymeetsworld luks lik height issue is fixed:
http://codepen.io/nitinraghav/pen/QGwaeP?editors=1100
@SEGrooms my pleasure sir :)
Coy Sanders
@coymeetsworld
Nov 06 2016 22:09 UTC
nice work @nitinraghav
NITIN RAGHAV
@nitinraghav
Nov 06 2016 22:09 UTC
suddenly the world seems lik a happy place... when ur code starts to work
hahhhaha
i was struggling from 2 days with it
@coymeetsworld thanks :)
CamperBot
@camperbot
Nov 06 2016 22:10 UTC
nitinraghav sends brownie points to @coymeetsworld :sparkles: :thumbsup: :sparkles:
:warning: nitinraghav already gave coymeetsworld points
Coy Sanders
@coymeetsworld
Nov 06 2016 22:11 UTC
yeah I know, felt like that when I got done with the last 2 D3 projects recently, and tic-tac-toe months ago
Shawn Grooms
@SEGrooms
Nov 06 2016 22:12 UTC
@coymeetsworld well I know who I’m talking to in a couple weeks!
Coy Sanders
@coymeetsworld
Nov 06 2016 22:12 UTC
hah yeah I'm around, usually
right now just procrastinating learning React
Shawn Grooms
@SEGrooms
Nov 06 2016 22:13 UTC
I’m just trying to zip through the last few frontend projects before they come out with the new curriculum!
I have 5 algos, and the advanced projects left!
Coy Sanders
@coymeetsworld
Nov 06 2016 22:15 UTC
yeah a little annoyed at what i was hearing, they're taking away alot of the meat
not sure if anything changed but sounds like they're making it easier
Shawn Grooms
@SEGrooms
Nov 06 2016 22:16 UTC
Don’t get ahead of yourself though! You won’t know until it arrives :)
Coy Sanders
@coymeetsworld
Nov 06 2016 22:18 UTC
there are some things that do get a little annoying and i understand, like Twitch did make some changes to their API and everyone project broke
but it wasn't a big deal to fix it, took me a few hours i think
Shawn Grooms
@SEGrooms
Nov 06 2016 22:19 UTC
Yeah the twitch challenge was pretty bad, but I’m looking forward to it.
The biggest thing that I don’t think FCC really predicted was how active of a community they would have.
Coy Sanders
@coymeetsworld
Nov 06 2016 22:19 UTC
i like that they're adding more sections
Clyde Lobo
@oppiniated
Nov 06 2016 22:20 UTC
I have not done any of the projects yet.
Coy Sanders
@coymeetsworld
Nov 06 2016 22:20 UTC
just don't want them to remove projects, unless they're adding other projects as replacements
Shawn Grooms
@SEGrooms
Nov 06 2016 22:20 UTC
Breaking it up was a nice touch
They’re still going to have projects
Coy Sanders
@coymeetsworld
Nov 06 2016 22:21 UTC
but yeah well see
Shawn Grooms
@SEGrooms
Nov 06 2016 22:21 UTC
Anyways, I g2g for now. I’m still chipping away at my calculator.
c0d0er
@c0d0er
Nov 06 2016 22:25 UTC
@nankeuriseu thanks
CamperBot
@camperbot
Nov 06 2016 22:25 UTC
c0d0er sends brownie points to @nankeuriseu :sparkles: :thumbsup: :sparkles:
:cookie: 376 | @nankeuriseu |http://www.freecodecamp.com/nankeuriseu
Dan Stockham
@DanStockham
Nov 06 2016 22:33 UTC
I need your guys' (and gals') opinion. Is the single application design still trending?
Or is there a different layout that people are into?
tyl-er
@tyl-er
Nov 06 2016 22:56 UTC

Having trouble with the JS calculator. I made a function to add numbers to an array and another function to clear out the array. But the clear function only works sometimes and not other times. Any ideas?

http://codepen.io/tyl-er/pen/vyYbmV?editors=0011

var prob = [];

function clear(){
var prob = [];
console.log(prob);
}
function addOne(num) {
prob.push(num);
console.log(prob);
}

I know there are other ways to remove the items. I'm just curious why this isn't working

kat-mag
@kat-mag
Nov 06 2016 22:58 UTC
@DanStockham Yeah, well. Everybody wants to have an app in one window w/o reloads (you too, I bet). As far as 'normal' websites go - whatever works for a client, layout is a preference, but one pagers are still up & feelin' good.
@tyl-er you're 'trying' to empty your local variable in function clear. this prob is different than the one declared outside your functions
Mitch
@MitchWilkins
Nov 06 2016 23:04 UTC
Hey, I'm having trouble with my for loop and the streamArray. Its displays "ESL_SC2,OgamingSC2,cretetion,freecodecamp,storbeck,mfnmanifest,RobotCaleb,comster404freecodecamp" in the list item.
  var streamArray = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "mfnmanifest", "RobotCaleb", "comster404"];
  var list = "";
 // var key = 'https://wind-bow.hyperdev.space/twitch-api/streams/' + streamArray[0 + i] + '?callback=?';
    for (var i = 0; i < 3; i++) {

$.getJSON('https://wind-bow.hyperdev.space/twitch-api/streams/' + streamArray.slice(0,1) + '?callback=?', function(data) {
  console.log(data);
  streamArray += streamArray[i];
  list += "<li class='list-group-item'> <span class='badge'>" + data.stream.viewers + "</span>" + streamArray +"</li>";

  console.log(list);
  $("#listId").html(list);
tyl-er
@tyl-er
Nov 06 2016 23:04 UTC
@kat-mag Oh got it. Thanks
CamperBot
@camperbot
Nov 06 2016 23:04 UTC
tyl-er sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:cookie: 397 | @kat-mag |http://www.freecodecamp.com/kat-mag
kat-mag
@kat-mag
Nov 06 2016 23:10 UTC
@MitchWilkins what's that supposed to be? streamArray += streamArray[i];
tyl-er
@tyl-er
Nov 06 2016 23:13 UTC

@kat-mag I changed it to this but it still only works once.

var prob = [];

function addOne(num) {
prob.push(num);
console.log(prob);
}
function clear(){
prob.splice(0, prob.length);
console.log(prob);
}

kat-mag
@kat-mag
Nov 06 2016 23:17 UTC
@tyl-er prob = []; maybe... but c'mon. you're overdoing it ;D overthinking. It'd work without some 'not-so-fancy' arrays ;P
strings would be enough & easier to work with
Mitch
@MitchWilkins
Nov 06 2016 23:18 UTC
@kat-mag good call, thanks for the help. I thought that would help increment the values. As in it one iteration would be streamArray[0], the next streamArray[1], etc. Apparently that just added them all up and stored them (that makes sense to me now).
CamperBot
@camperbot
Nov 06 2016 23:18 UTC
mitchwilkins sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:cookie: 398 | @kat-mag |http://www.freecodecamp.com/kat-mag
kat-mag
@kat-mag
Nov 06 2016 23:21 UTC
@MitchWilkins exactly. These things are easy to mess up :fire:
Mitch
@MitchWilkins
Nov 06 2016 23:23 UTC
@kat-mag i also changed the list variable to equal list += "<li class='list-group-item'> <span class='badge'>" + data.stream.viewers + "</span>" + streamArray[i] +"</li>"; it now just prints out the last iteration 4 times
tyl-er
@tyl-er
Nov 06 2016 23:25 UTC
@kat-mag Thanks I know I am overthinking lol. I'm trying to do it without just googling "how to make a js calculator", but that might be a bad idea.
CamperBot
@camperbot
Nov 06 2016 23:25 UTC
tyl-er sends brownie points to @kat-mag :sparkles: :thumbsup: :sparkles:
:warning: tyl-er already gave kat-mag points
kat-mag
@kat-mag
Nov 06 2016 23:28 UTC
@tyl-er don't google 'how to'. just stop & think 'is there an easier way to make it work?'. In this case - there is.
@tyl-er and btw... this website should be your new friend ;D
I'm out, gotta sleep :wave:
tyl-er
@tyl-er
Nov 06 2016 23:33 UTC
@kat-mag 👍
WhiteCaneGamer
@WhiteCaneGamer
Nov 06 2016 23:37 UTC
I've just started the Random Quote Machine project, why is the no mention of the issues you can run into when making cross domain api calls in any of the previous lessons.
Mitch
@MitchWilkins
Nov 06 2016 23:50 UTC
To develop read-search-ask skills I guess haha @WhiteCaneGamer