These are chat archives for FreeCodeCamp/HelpFrontEnd

29th
Sep 2016
Ronald
@ronwthompson
Sep 29 2016 00:00
I'm working on the Weather App intermediate challenge and can't seem to get the API to work. I'm able to get the location from geolocation and I think I've implemented it into the API url correctly but nothing in the getJSON element will work. Could someone please take a look to see if I'm missing something obvious? https://codepen.io/moliviank/pen/kkwzGL
Tyler Moeller
@TylerMoeller
Sep 29 2016 00:01
@zarruk Yes, follow that link, copy and paste the JSON Object and assign it to a variable in your code
Salomon
@zarruk
Sep 29 2016 00:03
@TylerMoeller but will it work in real time?
Tyler Moeller
@TylerMoeller
Sep 29 2016 00:03
@zarruk No, it will not work in real time.
Salomon
@zarruk
Sep 29 2016 00:04
@TylerMoeller Is it worth completing the challenge that way? Should I not better keep on to the next challenge?
Tyler Moeller
@TylerMoeller
Sep 29 2016 00:06
@zarruk It's unfortunate timing, as it seems they're updating that lesson right now. You have to complete it to get your certificate, but I don't see how you fulfill all the user stories with the hard-coded JSON Object they give you. I would probably skip it and come back when they finalize the instructions for that project.
@zarruk If you're up for a bigger challenge, the Twitch.tv API works fine, you just have to have an API key to use it.
@moliviank You're trying to access openWeatherMap over HTTPS, but you need to pay money to use HTTPS. I would recommend trying out Weather Underground instead, it supports HTTPS and it's free for up to 500 connections a day.
JD Tadlock
@jdtdesigns
Sep 29 2016 00:14
Simply use an ip location api for chrome and navigator for other browsers.
Openweather allows 10k hits a day I believe.
Tyler Moeller
@TylerMoeller
Sep 29 2016 00:18
Weather underground lets you get IP Location and Weather all in one URL. Navigator will be deprecated on insecure origins on Firefox soon too: https://www.fxsitecompat.com/en-CA/docs/2016/use-of-geolocation-api-will-be-limited-to-secure-sites/
Not to mention, adblockers block a lot of the IP-based location APIs out there.
Salomon
@zarruk
Sep 29 2016 00:23
@TylerMoeller How do I get the API key? I've been trying but not being able to. I followed the instructions but I can't get it
Tyler Moeller
@TylerMoeller
Sep 29 2016 00:24
@zarruk This link lets you register an application and get an API Key: https://www.twitch.tv/kraken/oauth2/clients/new
You'll need to create an account and log in first
Ronald
@ronwthompson
Sep 29 2016 00:37
@TylerMoeller Thank you!
CamperBot
@camperbot
Sep 29 2016 00:37
moliviank sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 858 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Daniel Cleveland
@dpcleveland
Sep 29 2016 00:44
Could anyone please explain to me why this http://codepen.io/dpcleveland/pen/KgapaE?editors=1111 works perfectly while this http://codepen.io/dpcleveland/pen/XjgQoz every time you click the temperature, it flashes to C but then back to F. The difference is using a link around the div vs using a button. The button version works perfectly while the link is broken. I can't figure out why.
Tyler Moeller
@TylerMoeller
Sep 29 2016 00:51
@dpcleveland Seems you need to make it a dead link or it will try to open the link <a href="#" id="toggle">
Daniel Cleveland
@dpcleveland
Sep 29 2016 00:52
Hmm I have it as <a href="" id="toggle">
Looks like I ran out of API calls, but the functionality stands
Evan W
@Dirtier
Sep 29 2016 00:55
@khaduch Sorry, I'm back. Idk it seems to work differently for different browsers and different operating systems haha idk its weird
Tyler Moeller
@TylerMoeller
Sep 29 2016 00:55
@dpcleveland You need the # to make it a dead link. You could also use <span> instead of <a> and then style as needed in your CSS
Evan W
@Dirtier
Sep 29 2016 00:56
@khaduch The twitter button also doesn't work for some people on iOS Chrome. Which is unfortunate
Daniel Cleveland
@dpcleveland
Sep 29 2016 00:56
@TylerMoeller Oh derp. Thought you meant the other way around. And now it works. Thanks! You wouldn't believe how much time I spent on that...
CamperBot
@camperbot
Sep 29 2016 00:56
dpcleveland sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 859 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Sep 29 2016 00:57
Good news :)
JD Tadlock
@jdtdesigns
Sep 29 2016 01:03
@dpcleveland It's a button so you really should use the button element. Links are for "linking" to content/pages.
Daniel Cleveland
@dpcleveland
Sep 29 2016 01:08
@jdtdesigns makes sense. Will make it look how I want with CSS
TheAndrew2115
@TheAndrew2115
Sep 29 2016 01:08
Hi I'm Andrew Wang does anyone have any pointers on how to get started here?
d wilder
@alhazen1
Sep 29 2016 01:43
@TheAndrew2115 Usually the new guy buys everyone a round, then you're in for life
Michael Davis
@mhdavis
Sep 29 2016 01:45
Can someone help me with some Javascript? I'd go to the HelpJavaScript room but it seems like they are focused on another problem atm
Joseph Padgett
@Jspadgett82
Sep 29 2016 01:46
@mhdavis Depending on how advanced you’re talking about, sure! I can try anyway
Michael Davis
@mhdavis
Sep 29 2016 01:46
shouldn't be too trick
Its the "record collection" problem on FCC
// Setup
var collection = {
    "2548": {
      "album": "Slippery When Wet",
      "artist": "Bon Jovi",
      "tracks": [ 
        "Let It Rock", 
        "You Give Love a Bad Name" 
      ]
    },
    "2468": {
      "album": "1999",
      "artist": "Prince",
      "tracks": [ 
        "1999", 
        "Little Red Corvette" 
      ]
    },
    "1245": {
      "artist": "Robert Palmer",
      "tracks": [ ]
    },
    "5439": {
      "album": "ABBA Gold"
    }
};
// Keep a copy of the collection for tests
var collectionCopy = JSON.parse(JSON.stringify(collection));

// Only change code below this line
function updateRecords(id, prop, value) {
  // if property given is "tracks" but id doesn't have "tracks"
  if (prop === "tracks" && collection.hasOwnProperty("Tracks") === false) {
      collection.tracks = [];
      tracks.push(value);
  }
  //if property is "tracks" and has a value
  if (prop === "tracks" && value !== "") {
      //push value into tracks
      prop.push(value);
  }
  if (prop !== "tracks" && value === "") {
      delete collection.id.prop;
  }

  return collection;
}

// Alter values below to test your code
updateRecords(5439, "tracks", "Take a Chance on Me");
everything in the function is my doing

You are given a JSON object representing a part of your musical album collection. Each album has several properties and a unique id number as its key. Not all albums have complete information.

Write a function which takes an album's id (like 2548), a property prop (like "artist" or "tracks"), and a value (like "Addicted to Love") to modify the data in this collection.

If prop isn't "tracks" and value isn't empty (""), update or set the value for that record album's property.

Your function must always return the entire collection object.

There are several rules for handling incomplete data:

If prop is "tracks" but the album doesn't have a "tracks" property, create an empty array before adding the new value to the album's corresponding property.

If prop is "tracks" and value isn't empty (""), push the value onto the end of the album's existing tracks array.

If value is empty (""), delete the given prop property from the album.

AND these are the instructions for the challenege
right now I have it as series of "if" statements but i plan to change it once I have figured out the logic to solving the problem
my main issue is two things
making sure that im accessing the right areas of the JSON object abstractly through the function
and then appending those and such
what i tried to do thus far is translate the conditions described in the problem as close to code as I could think of it
Ken Haduch
@khaduch
Sep 29 2016 02:07
@mhdavis - hello there. You have to be consistent with your spelling of the properties, for one thing. "tracks" vs "Tracks". Next, collection is an object, and the properties that key into the different "record albums" is a numeric value, passed into the function as an argument contained in the variable id. That is a variable being used to access an object, it being a property of the object. You should review the lesson on accessing object properties with a variable, it has to do with use of "dot" notation vs. "bracket" notation. Also, any time you are referencing something in the collection, you have to be using the id value in the expression, so that you directly refer to a single object within the collection. (Hint: collection.id is not correct. Review the lessons on accessing object properties using variables.)
d wilder
@alhazen1
Sep 29 2016 02:23
@mhdavis Also I don't think the first test case will be true in any of your if statements so collection won't be updated. Looks like your possibilities are 1 value empty, 2 value - prop not tracks, 3 value - prop is tracks, 4 value - prop is tracks but no tracks array yet. (or something like that). divide and conquer with if or if else tests to catch all possibilities in the fewest steps
Kyle W Pilkinton
@tadake
Sep 29 2016 03:15
hey guys does anyone know why theres white space on my page?
Hassen Rmili
@hassenrmili
Sep 29 2016 03:24
@tadake hahaha white space again ??
JD Tadlock
@jdtdesigns
Sep 29 2016 03:25
@tadake the skills section?
Hassen Rmili
@hassenrmili
Sep 29 2016 03:25
@tadake there is no white space my friend
Kyle W Pilkinton
@tadake
Sep 29 2016 03:27
yeah It keeps coming back. im horribly confused because its not there sometimes and then it is. its at the bottom of the contact section. its not there when I run it locally but when I put it on my server it is. it might be a mobile problem. Im sorry guys Im sure I can figure it out when I get to my desktop. thanks @hassenrmili @jdtdesigns .
CamperBot
@camperbot
Sep 29 2016 03:27
tadake sends brownie points to @hassenrmili and @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 322 | @hassenrmili |http://www.freecodecamp.com/hassenrmili
:cookie: 624 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Kyle W Pilkinton
@tadake
Sep 29 2016 03:27
can you guys see the white space here
Hassen Rmili
@hassenrmili
Sep 29 2016 03:28
@tadake nope
JD Tadlock
@jdtdesigns
Sep 29 2016 03:29
@tadake nope
ah i see it
when you shrink the screen size
Hassen Rmili
@hassenrmili
Sep 29 2016 03:31
@jdtdesigns where !!????
JD Tadlock
@jdtdesigns
Sep 29 2016 03:32
it's weird
only when you have it fullscreen mode
fork it and goto debug then shrink browser down
found the issue @tadake
remove height: 100vh; from contact section
change it to min-height: 100vh; and it will work for desktop and mobile
your 'Contact Me' button is overlapping the 'full stack' text at smaller sizes too ;)
VaseJS
@VaseJS
Sep 29 2016 03:37
Hello everyone. After a full day of literally getting nothing accomplish with my quote machine challenge, I need some help. I don't know how to get api data. The api course was useless to me. I learned nothing so I can't get anywhere. Been online from this morning looking up what i can to no avail.
Kyle W Pilkinton
@tadake
Sep 29 2016 03:38
ahhh thanks! @jdtdesigns geez ive been scratching my head on that for a while Ill try it out now!
CamperBot
@camperbot
Sep 29 2016 03:38
tadake sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: tadake already gave jdtdesigns points
VaseJS
@VaseJS
Sep 29 2016 03:39
I have some Pens but they're show random code that I got from online that i can't get to work. tried jQuery (which i'm not good at) and pure javascript
JD Tadlock
@jdtdesigns
Sep 29 2016 03:39
@VaseJS have you watched any api/jquery vids on youtube?
VaseJS
@VaseJS
Sep 29 2016 03:41
@jdtdesigns I've watched a bunch of stuff. most people use jquery so yea. but I can't seem to get any of it to work.
JD Tadlock
@jdtdesigns
Sep 29 2016 03:42
i can show you how to make it work, but if you don't basic jQuery, you'll be lost
VaseJS
@VaseJS
Sep 29 2016 03:43
I understand jQuery I just don't use it but i can follow it...but that's probably not true because here i am :D
JD Tadlock
@jdtdesigns
Sep 29 2016 03:43
what quote api are you using?
@VaseJS
http://api.icndb.com/jokes/random this is actually json data
the first link was to the site
JD Tadlock
@jdtdesigns
Sep 29 2016 03:44
you using codepen?
VaseJS
@VaseJS
Sep 29 2016 03:44
Yes
JD Tadlock
@jdtdesigns
Sep 29 2016 03:46
@VaseJS don't use the codepen console
use the browser console
you'll see errors and other messages that codepen won't show
VaseJS
@VaseJS
Sep 29 2016 03:47
@jdtdesigns really? So that could have been my issue? That sucks. I wasn't getting errors and it was confusing because nothing was happening at all
JD Tadlock
@jdtdesigns
Sep 29 2016 03:48
@VaseJS Load it without https and take the ?callback= off the url and you're good :D
you can't load a page on https and then call an api with http
it's called mixed content and won't work
VaseJS
@VaseJS
Sep 29 2016 03:50
@jdtdesigns I'm in chrome dev tool js console but still don't see anything. can you paste your code so i can see
VaseJS
@VaseJS
Sep 29 2016 03:53
@jdtdesigns so the preview of codePen won't bring it up? I have to run the code in the console to get it to work, correct?
JD Tadlock
@jdtdesigns
Sep 29 2016 03:54
the codepen console isn't a full js console
it won't do half of what the browser console/terminal console will
@VaseJS are you referring to the html preview?
VaseJS
@VaseJS
Sep 29 2016 03:58
@jdtdesigns I'm looking in the console
JD Tadlock
@jdtdesigns
Sep 29 2016 03:58
are you seeing the output? @VaseJS
VaseJS
@VaseJS
Sep 29 2016 03:59
but if something popped up there, that would be great. Any feedback is what i'm looking for. but your code worked. I had to put the code in the console. the preview does not work and that's what I was looking to do an auto console.log execution as it has done before
JD Tadlock
@jdtdesigns
Sep 29 2016 03:59
@VaseJS what do you mean by preview?
VaseJS
@VaseJS
Sep 29 2016 04:00
@jdtdesigns maybe i'm using the wrong term. the auto update feature
JD Tadlock
@jdtdesigns
Sep 29 2016 04:00
you should be able to right click on the codepen browser window and hit inspect and click on console and see the output coming the from the codepen js panel
@VaseJS
and it does auto-update
VaseJS
@VaseJS
Sep 29 2016 04:07
@jdtdesigns SOB!!!! it was my F**ing browser this whole time?!!!! I loaded up codepen in firefox and everything worked fine! A 10 hour day wasted but a major lesson learned and some assurance that I'm not slow.
thanks @jdtdesigns
CamperBot
@camperbot
Sep 29 2016 04:08
vasejs sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 625 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Joshua Swift
@joshuaswift
Sep 29 2016 04:12
hey guys, so I'm trying to write a function so that if the JSON data labelled "quoteAuthor" is blank, it's displayed on the page as "Unknown Author" instead
So far I have a function called unknownAuthorFix which attempts this
But I'm struggling to understand where to call the function to achieve the required functionality
anybody got any suggestions?
JD Tadlock
@jdtdesigns
Sep 29 2016 04:15
@Joshuaswift you can just set it up easily with a var in your api call
Joshua Swift
@joshuaswift
Sep 29 2016 04:15
@jdtdesigns you mean inside the getQuote function?
JD Tadlock
@jdtdesigns
Sep 29 2016 04:17
@Joshuaswift
var getQuote = function() { $.getJSON('http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=?', function(json) {
      var quoteAuthor = json.quoteAuthor ? json.quoteAuthor : 'Unknown Author';

      $("#quotebox").animate({
        opacity: 0
      }, 375, function () {
        $(this).animate({
          opacity: 1
        }, 750); $("#quotebox").html("<i class = 'fa fa-quote-left fa-2x quote-mark'></i>" + json.quoteText + "<br>" + "<h3>" + quoteAuthor + "</h3>");
      });
    });
  };
Aaron
@crazyxrp
Sep 29 2016 04:18
i have a question,how did you guys know the http://api.forismatic.com/ to get the quote text?
Joshua Swift
@joshuaswift
Sep 29 2016 04:19
@jdtdesigns thanks for this, I'm not sure exactly what this code does, what does the ? mean?
CamperBot
@camperbot
Sep 29 2016 04:19
joshuaswift sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 626 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Joshua Swift
@joshuaswift
Sep 29 2016 04:19
@crazyxrp not sure what you mean, are you asking how to call the API?
Aaron
@crazyxrp
Sep 29 2016 04:20
not exactly.
JD Tadlock
@jdtdesigns
Sep 29 2016 04:20
@Joshuaswift It's a ternary operator. It works like a basic if/else.
var myVar  = condition ? //do this : // do something else;
Aaron
@crazyxrp
Sep 29 2016 04:21
so i know how to code ,but i don’t know which api to call
such as the api in Build a Random Quote Machine Project
Joshua Swift
@joshuaswift
Sep 29 2016 04:23
@crazyxrp I just googled quote API, this was one of the top suggestions, it's fairly well documented also
Aaron
@crazyxrp
Sep 29 2016 04:23
oh,thanks :smile:
Joshua Swift
@joshuaswift
Sep 29 2016 04:24
@jdtdesigns ah I see, so what is the condition checking for? It looks like it's just checking if json.quoteAuthor = json.quoteAuthor?
JD Tadlock
@jdtdesigns
Sep 29 2016 04:26
@crazyxrp If you're asking how to call the forismatic api, you can do it like this http://jsbin.com/qakegi/edit?js,console
Aaron
@crazyxrp
Sep 29 2016 04:27
ok,thank you
@jdtdesigns
JD Tadlock
@jdtdesigns
Sep 29 2016 04:28
@Joshuaswift It's checking if json.quoteAuthor is true and if it is, set the variable to the json data author, else set it to 'Unknown Author'.
@Jspadgett82 an empty string is a falsey value so you can evaluate it like a boolean
if it makes more sense, you can read it like this
if (  json.quoteAuthor ) {
  quoteAuthor = json.quoteAuthor;
} else quoteAuthor = 'Unknown Author';
Joshua Swift
@joshuaswift
Sep 29 2016 04:46
@jdtdesigns ahh I understand now, very clever. Thanks again that was very helpful!
CamperBot
@camperbot
Sep 29 2016 04:46
joshuaswift sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: joshuaswift already gave jdtdesigns points
Erick Delfin
@Nifled
Sep 29 2016 05:28
How do I make it so that when a button is clicked on or activated, another element's attributes are changed?
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 06:24
Good day guys! Need some help about the weather app.
Pradnya Joshi
@pradxj07
Sep 29 2016 06:54
@gsuxlzt , what help do you need?
Darth Skywalker
@adityaparab
Sep 29 2016 06:57
@jdtdesigns : More efficient way to do the same would be
quoteAuthor = json.quoteAuthor ? json.quoteAuthor : 'Unknown Author';
ennayramonale
@ennayramonale
Sep 29 2016 06:57
hello everybody! I am in the portfolio page.. I am already in 90% done but with a problem: i am making my portfolio for 2 weeks now,,,... i want to go on to the next stage pleaseeeee :'(
1) the image in the company part needs to be in center.
2) the contact form needs to be in center too...
please help.... here's my link...
http://codepen.io/ennayramonale/full/QKGBRv/
Trevor
@electrostaticfleece
Sep 29 2016 07:00
@ennayramonale For 1) Set the containing div of the image's position to relative. Set the image's position to relative and the margin to auto.
ennayramonale
@ennayramonale
Sep 29 2016 07:02
ok sir @electrostaticfleece , i will try.. i will get back to you after.. thanks
CamperBot
@camperbot
Sep 29 2016 07:02
ennayramonale sends brownie points to @electrostaticfleece :sparkles: :thumbsup: :sparkles:
:cookie: 380 | @electrostaticfleece |http://www.freecodecamp.com/electrostaticfleece
Pradnya Joshi
@pradxj07
Sep 29 2016 07:02
@ennayramonale, if you need a break, you can continue to the next sections and come back to work on the portfolio a little later.
Sorin Ruse
@sorinr
Sep 29 2016 07:02
@ennayramonale set margin: 0 auto; to the img3 class
ennayramonale
@ennayramonale
Sep 29 2016 07:03
@pradxj07 , is that ok?
@sorinr , yes i will try that. thanks.
CamperBot
@camperbot
Sep 29 2016 07:04
ennayramonale sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 737 | @sorinr |http://www.freecodecamp.com/sorinr
Pradnya Joshi
@pradxj07
Sep 29 2016 07:05
@ennayramonale , yes. Nothing stops you. Anyway, the portfolio will be a working project because you will want to add projects as you complete them. You might even re-write it as you learn more. It is your online CV, isn't it?
Trevor
@electrostaticfleece
Sep 29 2016 07:06
@ennayramonale Also, I would say use a flexbox for the form element and use justify-content center. It should be easier to get the labels/inputs to line up that way
ennayramonale
@ennayramonale
Sep 29 2016 07:06
@pradxj07 , yes,,, its somehow an online CV.. :) thanks for your advice.
CamperBot
@camperbot
Sep 29 2016 07:06
ennayramonale sends brownie points to @pradxj07 :sparkles: :thumbsup: :sparkles:
:cookie: 324 | @pradxj07 |http://www.freecodecamp.com/pradxj07
ennayramonale
@ennayramonale
Sep 29 2016 07:07
@electrostaticfleece i still did not encounter about flexbox but i will search for that one
Trevor
@electrostaticfleece
Sep 29 2016 07:09
https://css-tricks.com/snippets/css/a-guide-to-flexbox/ <-- really helpful guide about flexbox. positioning elements becomes so easy once you get used to them.
ennayramonale
@ennayramonale
Sep 29 2016 07:13
thank you.. @electrostaticfleece
CamperBot
@camperbot
Sep 29 2016 07:13
ennayramonale sends brownie points to @electrostaticfleece :sparkles: :thumbsup: :sparkles:
:warning: ennayramonale already gave electrostaticfleece points
bkd705
@bkd705
Sep 29 2016 07:16
yoyoyoyo
ennayramonale
@ennayramonale
Sep 29 2016 07:23
@electrostaticfleece and @sorinr thank you, for the image problem it worked! :)
CamperBot
@camperbot
Sep 29 2016 07:23
ennayramonale sends brownie points to @electrostaticfleece and @sorinr :sparkles: :thumbsup: :sparkles:
:warning: ennayramonale already gave sorinr points
:warning: ennayramonale already gave electrostaticfleece points
ennayramonale
@ennayramonale
Sep 29 2016 07:23
now for the contact form..
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 07:24
@pradxj07 my geolocation is working in desktop and mobile except for safari. i don't know why :(
Pradnya Joshi
@pradxj07
Sep 29 2016 07:26
@gsuxlzt , does apple block geolocation?
Sorin Ruse
@sorinr
Sep 29 2016 07:27
@ennayramonale then close your h2 tag here: <h2 class="text-center text-success"><b>CONTACT</b></h2>
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 07:28
@pradxj07 I really don't know. it is supposed to ask if I can access the location right? in other browsers there's a popup asking to allow location. however in apple devices, there is no popup.
ennayramonale
@ennayramonale
Sep 29 2016 07:29
thank you @sorinr your reviewing my code. thanks a lot :)
CamperBot
@camperbot
Sep 29 2016 07:29
ennayramonale sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: ennayramonale already gave sorinr points
Trevor
@electrostaticfleece
Sep 29 2016 07:30
If anyone here has time to take a look at the working version of the book trading app I just got around to finish tonight, I'd more than appreciate any feedback: https://book2book.herokuapp.com/
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 07:32
@electrostaticfleece it looks neat bro! when I hover on certain books the eye changes to color blue, while on others it's color black. is that normal?
Trevor
@electrostaticfleece
Sep 29 2016 07:32
You have to hover on the icon for the effect to work
It works on all books, but the icon only changes colors when it's hovered on, not the book itself.
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 07:33
oh is that so. nice! Can't wait to try building that app too.
great job!
Trevor
@electrostaticfleece
Sep 29 2016 07:34
Thx!
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 07:34
@electrostaticfleece is the submit button on the settings supposed to work?
Pradnya Joshi
@pradxj07
Sep 29 2016 07:37
@gsuxlzt , by any chance, did you disallow geolocation for testing?
Trevor
@electrostaticfleece
Sep 29 2016 07:37
Should work, last I checked. I used an optimistic update, so the change happens pretty quick. If the text changed to the left of the input fields and there were no server errors it should be fine.
huh i just got a 503 error on that. I'll take a look into it.
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 07:39
@pradxj07 is it on my side of the code or the browser's side? if it's on the browser side, there is no prompt asking if I can allow or disallow my location.
if it helps, here's my code https://codepen.io/kingjami/full/wzZGbp/
Pradnya Joshi
@pradxj07
Sep 29 2016 07:50
@gsuxlzt , I tried opening the codepen on safari on my iphone. It worked fine.
I can see the date, time and "it is sunny in" and "temp" with a sun icon at top left
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 07:52
is that so. then maybe it's my phone's settings. Thank you for your help @pradxj07 ! and sorry my code is not yet done. lol it only changes the location and not the weather.
CamperBot
@camperbot
Sep 29 2016 07:52
gsuxlzt sends brownie points to @pradxj07 :sparkles: :thumbsup: :sparkles:
:cookie: 325 | @pradxj07 |http://www.freecodecamp.com/pradxj07
Pradnya Joshi
@pradxj07
Sep 29 2016 07:53
that's alright :). I think you may have disable location services because of some other app. I did that on my desktop browser while testing the geolocation:)
Trevor
@electrostaticfleece
Sep 29 2016 07:54
@gsuxlzt Thanks for pointing that out. Turns out there was a request timeout because I forgot that the ORM I'm using returns an array rather than a number for updates.
CamperBot
@camperbot
Sep 29 2016 07:54
electrostaticfleece sends brownie points to @gsuxlzt :sparkles: :thumbsup: :sparkles:
:cookie: 266 | @gsuxlzt |http://www.freecodecamp.com/gsuxlzt
Pradnya Joshi
@pradxj07
Sep 29 2016 07:55
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 07:55
@pradxj07 yeah I thought so too. I checked the location settings and it my safari doesn't allow the access. thank you again!
CamperBot
@camperbot
Sep 29 2016 07:55
gsuxlzt sends brownie points to @pradxj07 :sparkles: :thumbsup: :sparkles:
:warning: gsuxlzt already gave pradxj07 points
Pradnya Joshi
@pradxj07
Sep 29 2016 07:55
@gsuxlzt , ok. you are welcome.
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 07:56
@electrostaticfleece I don't know what ORM is yet, but glad I could help!
kirbyedy
@kirbyedy
Sep 29 2016 08:00
@gsuxlzt why no temperature?
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 08:01
@kirbyedy It's not yet done. I am just checking if it's displaying the right location. I still have to work on the weather and the temperature. I'll let you know when I'm done. Hopefully by tomorrow!
kirbyedy
@kirbyedy
Sep 29 2016 08:01
works ok
come ooooon tomorrow ?! :)
5 minute fix and you are done :D
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 08:02
@kirbyedy thank you!
CamperBot
@camperbot
Sep 29 2016 08:02
gsuxlzt sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1420 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 08:02
how I wish lol. I'll begin working with the code after cooking and eating dinner. :)
kirbyedy
@kirbyedy
Sep 29 2016 08:03
oh come on :)
you just pull the temperature from the api and shove it into that temp div, done
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 08:06
That part is easy. I still need to design it though :P but since you asked I'll do it know :smile:
Sorin Ruse
@sorinr
Sep 29 2016 08:09
@ennayramonale made some changes to contact section : portfolio
ennayramonale
@ennayramonale
Sep 29 2016 08:11
oh. thanks @sorinr , i made it also like that at the very first.. but i think too long,, hehe.. oh by the way.. i already made it to be on center.. wait i will show you :)
CamperBot
@camperbot
Sep 29 2016 08:11
ennayramonale sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 738 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Sep 29 2016 08:15
@ennayramonale i've seen. only that you should realign the labels too
ennayramonale
@ennayramonale
Sep 29 2016 08:17
yes.... still working.. hehehe :) thank you :)
Matko Hromin
@Dayfiri
Sep 29 2016 08:32
Can someone help me with twitch api question ?
Henry Cabello
@hacu9
Sep 29 2016 08:38
http://codepen.io/cabello986/pen/VKWbEZ?editors=1010 How can i prevent that someone changes the timer values when clock is active?
Adam Lichter
@spot1000
Sep 29 2016 08:41
@hacu9 there are a couple of ways to go about it, you can just hide the elements all together making then unclickable, or yo ucn make the element unselectable with jquery $('.button').disableSelection();
or add a css tag
 .button {
        user-select: none;}
Henry Cabello
@hacu9
Sep 29 2016 08:50
@spot1000 thanks,hidding it kinda works xD was thinking on not letting the function run based on timerID but hiding it is nicer
CamperBot
@camperbot
Sep 29 2016 08:50
hacu9 sends brownie points to @spot1000 :sparkles: :thumbsup: :sparkles:
:cookie: 376 | @spot1000 |http://www.freecodecamp.com/spot1000
Adam Lichter
@spot1000
Sep 29 2016 08:50
no problem @hacu9 ! That's acutally what i did in my timer too haha
Henry Cabello
@hacu9
Sep 29 2016 08:53
Nice design,wonder what will happen when minutes hit 0 xD
Adam Lichter
@spot1000
Sep 29 2016 08:53
haha
i tihnk i made it so you can actually set work minutes to zero just to see that
haha
Henry Cabello
@hacu9
Sep 29 2016 08:54
just found out,nice xD im just working on mine's functionality first then ill work on the design
Adam Lichter
@spot1000
Sep 29 2016 08:54
that's the way that I work too
I'm just working on my simon Game now, for the longest time it was just 4 buttons lined up in a row
Henry Cabello
@hacu9
Sep 29 2016 08:56
lol been there done that xD
Adam Lichter
@spot1000
Sep 29 2016 08:56
didyou already do the simon game?
ennayramonale
@ennayramonale
Sep 29 2016 09:00
@sorinr still there?
Sorin Ruse
@sorinr
Sep 29 2016 09:01
@ennayramonale yep
Henry Cabello
@hacu9
Sep 29 2016 09:01
nope still on the pomodoro,simon is next i believe
Adam Lichter
@spot1000
Sep 29 2016 09:01
ah, yeah.
ennayramonale
@ennayramonale
Sep 29 2016 09:01
cant make it at the label, i want them to keep in the left part
Adam Lichter
@spot1000
Sep 29 2016 09:02
my first go at the simon game was so discouraging, i quit for 2 months...
ennayramonale
@ennayramonale
Sep 29 2016 09:02
@sorinr cant make it at the label, i want them to keep in the left part
Adam Lichter
@spot1000
Sep 29 2016 09:02
back now, and it's almost done
Sorin Ruse
@sorinr
Sep 29 2016 09:02
@ennayramonale i know. looking into that
ennayramonale
@ennayramonale
Sep 29 2016 09:02
hehehe.. thanks
Sorin Ruse
@sorinr
Sep 29 2016 09:05
@ennayramonale ok. cut the class="text-center" from the form tag. then cance in css the input, text area entry but add width: 50% !important; margin: auto !important; to your form entry after padding
ennayramonale
@ennayramonale
Sep 29 2016 09:06
ok i will do it
@sorinr , i already have the width and margin as what you said... where do you mean of the padding?
Sorin Ruse
@sorinr
Sep 29 2016 09:15
@ennayramonale you move the two entries under the input, textarea in css to form {} and then cut the input, textarea entry
ennayramonale
@ennayramonale
Sep 29 2016 09:15
oh.. ok...
Henry Cabello
@hacu9
Sep 29 2016 09:16
@spot1000 feel free to show me when you're done
Sorin Ruse
@sorinr
Sep 29 2016 09:16
@ennayramonale and also cancel the class="text-center" from your <form> tag in html part
ennayramonale
@ennayramonale
Sep 29 2016 09:16
woooowww.... big thanks to you @sorinr
CamperBot
@camperbot
Sep 29 2016 09:16
ennayramonale sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 739 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Sep 29 2016 09:17
@ennayramonale welcome. gtg now. if need more help just pm me and i'll try to help
ennayramonale
@ennayramonale
Sep 29 2016 09:17
my portfolio is ok already :) can submit the link..hehehe.. yehhey.. i am going to the next stage
Adam Lichter
@spot1000
Sep 29 2016 09:18
@hacu9 Will do! http://codepen.io/spot1000/full/vKVPQw/ here's what I have so far, strict still doesn't work, and i need to add a few more features still (like sound, and winning)
make the colours a little better
ennayramonale
@ennayramonale
Sep 29 2016 09:18
wow.. thanks.. ok i got that.. i'll pm you right away.. take care!
@sorinr wow.. thanks.. ok i got that.. i'll pm you right away.. take care!
CamperBot
@camperbot
Sep 29 2016 09:18
ennayramonale sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: ennayramonale already gave sorinr points
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 09:20
need help regarding my jQuery function. is this a valid function:
function animate() {
  if (Boolean($(this).css("font-size","20"))) {
    $(this).animate({opacity: 0.2, 
                 fontSize: '16px'}, 200);
  } else {
    $(this).animate({opacity: 1,
                 fontSize:'16px'},200);
  }
}
Stephen James
@sjames1958gm
Sep 29 2016 09:22
@gsuxlzt What do you think $(this).css("font-size","20") is returning?
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 09:22
it's returning true in my console.
i will put it inside an onclick event like this
$("#temp").on('click',function(){
    animate();
  })
however, i dunno if the $(this).css("font-size","20") will still return true.
Stephen James
@sjames1958gm
Sep 29 2016 09:24
@gsuxlzt According to jquery site .css returns the jquery object
@gsuxlzt What are you trying to test with the if?
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 09:25
if the font-size of the "#temp" is 20, it will animate it, and then will animate the "#otherTemp" too.
@sjames1958gm if it helps, here's my codepen: https://codepen.io/kingjami/pen/wzZGbp?editors=0011
basically i want to toggle the size and opacity of the two temperatures.
Stephen James
@sjames1958gm
Sep 29 2016 09:27
@gsuxlzt I think you want
if ($(this).css("font-size") === "20px")
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 09:28
ah. yes that's it. thank you @sjames1958gm !
CamperBot
@camperbot
Sep 29 2016 09:28
gsuxlzt sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 3550 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Sep 29 2016 09:28
@gsuxlzt :+1:
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 09:30
it's still not working :(
@sjames1958gm I fixed it lol I added a parameter on animate.
Stephen James
@sjames1958gm
Sep 29 2016 09:32
@gsuxlzt :+1:
grantknaver
@grantknaver
Sep 29 2016 09:55
anyone up at this hour?
Aaron
@crazyxrp
Sep 29 2016 09:56
i’m
grantknaver
@grantknaver
Sep 29 2016 09:56
awesome I have two questions can you help out?
Aaron
@crazyxrp
Sep 29 2016 09:57
let me try
grantknaver
@grantknaver
Sep 29 2016 09:58
@crazyxrp thx man
CamperBot
@camperbot
Sep 29 2016 09:58
grantknaver sends brownie points to @crazyxrp :sparkles: :thumbsup: :sparkles:
:cookie: 264 | @crazyxrp |http://www.freecodecamp.com/crazyxrp
Nkwazema Chidiebere Raphael
@KingCyrus
Sep 29 2016 09:58
Hi all...please how does the Bonfire exercises work? I tried to click on the editor to edit the code to return true, however, it started showing me pictures.
Aaron
@crazyxrp
Sep 29 2016 09:59
what’s wrong?
@grantknaver
grantknaver
@grantknaver
Sep 29 2016 10:00
  1. I cant figure out why the carousel indicators are not centered in my carousel below 400px width
Aaron
@crazyxrp
Sep 29 2016 10:01
show me your project
grantknaver
@grantknaver
Sep 29 2016 10:02
  1. How to more effectively center the title "Creative Adrenline" below 400px width
Aaron
@crazyxrp
Sep 29 2016 10:04
hold on,i’ll back 15mins
grantknaver
@grantknaver
Sep 29 2016 10:04
awesome thanks
Henry Cabello
@hacu9
Sep 29 2016 10:06
http://codepen.io/cabello986/pen/VKWbEZ How can i like...Make the numbers come,show and then just removing em ?
Aaron
@crazyxrp
Sep 29 2016 10:43
@grantknaver it looks like your div class named "navbar-header" is too small
grantknaver
@grantknaver
Sep 29 2016 10:48
oh...
how about the carousel indicators
any ideas
Aaron
@crazyxrp
Sep 29 2016 10:56
set img width equals it's father div's width
try it
grantknaver
@grantknaver
Sep 29 2016 11:00
the images use the img-responsive class that will probably break something right?
Alexandro Pequeno
@Argestis
Sep 29 2016 11:02
Guys, I'm trying to refresh the value of a variable after clicking a button, I want to change the value of a variable from 0 to 1 every time a button is clicked but is not working, any ideas?
tcar
@tcar
Sep 29 2016 11:05
hi, can somebody help me with Build a Random Quote Machine ... i dont know how to retweet quote. have somebody some advice
Aaron
@crazyxrp
Sep 29 2016 11:16
@grantknaver no
kirbyedy
@kirbyedy
Sep 29 2016 11:17
Vojislav Šešelj :)))))))
Aaron
@crazyxrp
Sep 29 2016 11:18
In fact,img-responsive add the css display: block; max-width: 100%; height: auto;
arindam312
@arindam312
Sep 29 2016 11:20
guyz i need help

<style>
body {
font-family: Monospace;
}
h1 {
color:green;
}

</style>

<h1> Hello world </h1>

ADIL KARMOUZI
@mradil16
Sep 29 2016 11:20
hi,how can my figure's element fill the width of the main container while being responsive at 768px display in this example ? http://codepen.io/mradil16/pen/KgmNNR
arindam312
@arindam312
Sep 29 2016 11:20
any one here to help?
ADIL KARMOUZI
@mradil16
Sep 29 2016 11:22
@arindam312 what's the problem with your code ?
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 11:22
Hi!
arindam312
@arindam312
Sep 29 2016 11:22

<style>
body {
font-family: Monospace;
}
h1 {
color:green;
}

</style>

<h1> Hello world </h1>

Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 11:22
@mradil16 did you try setting the width to 100%?
arindam312
@arindam312
Sep 29 2016 11:23
Give your body element the color property of green.
@mradil16 please help
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 11:23
@arindam312 the "color:green" should be inside the body. did you try it already?
ADIL KARMOUZI
@mradil16
Sep 29 2016 11:25
@arindam312 try to set body {background-color:green;}
tcar
@tcar
Sep 29 2016 11:25
@kirbyedy XD yeah i wanted to do just vojislav seselj quote machine, but i was lazy to find his quotes XD
ADIL KARMOUZI
@mradil16
Sep 29 2016 11:27
@gsuxlzt yes I set the width to 100% , the figure's still don't fill the entire width of the parent element
arindam312
@arindam312
Sep 29 2016 11:28
@mradil16 bro i've already did it
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 11:28
@mradil16 it is probably due to the padding of the parent element. Try setting it to 0.
arindam312
@arindam312
Sep 29 2016 11:29
??
what should i do now
im stuck
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 11:30
@arindam312 what challenge are you bro?
arindam312
@arindam312
Sep 29 2016 11:30
53
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 11:31
challenge name?
arindam312
@arindam312
Sep 29 2016 11:32
Inherit Styles from the Body Element
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 11:33
inside the body, write "color:green"
this will make all of the children of the body have a green font-color.
arindam312
@arindam312
Sep 29 2016 11:34
thanks @gsuxlzt
CamperBot
@camperbot
Sep 29 2016 11:34
arindam312 sends brownie points to @gsuxlzt :sparkles: :thumbsup: :sparkles:
:cookie: 267 | @gsuxlzt |http://www.freecodecamp.com/gsuxlzt
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 11:34
no worries :)
ADIL KARMOUZI
@mradil16
Sep 29 2016 11:34
@gsuxlzt it doesn't work
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 11:34
@mradil16 can you show me your link?
i'll check it.
ADIL KARMOUZI
@mradil16
Sep 29 2016 11:35
@gsuxlzt sure, here is http://codepen.io/mradil16/pen/KgmNNR
@gsuxlzt the problem at 768px diplay
@gsuxlzt display
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 11:36
at 768px you want the image to cover the whole container right?
ADIL KARMOUZI
@mradil16
Sep 29 2016 11:36
@gsuxlzt yes
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 11:38
if you right click and inspect your img, you'll see that the <figure> has a right margin of 45px. then the container has a right padding of 15 px.
try setting the <figure>'s margin to -15px both sides.
i was wrong lol. set the figure's margin to 0 and width to 100%. maybe it will work.
Adetunji Iyaniwura
@Iadetunji
Sep 29 2016 11:46
http://codepen.io/Iadetunji/pen/KgvzkX, can anyone help with reactjs
ADIL KARMOUZI
@mradil16
Sep 29 2016 12:05
guys I'm wondring why a css style work using style attribute instead of css file (I used the code many times on css file and it's doesn't work [the css file is linked], it works only when I use style attribute).
Florencia
@flopywood
Sep 29 2016 12:05
Hello everyone! I need some help with my Simon Game. When the game ends, you get a message to Play Again and it resets the board but the START button doesn't appear. I tried solving it with jQuery but I can't. Can anyone help me? Here's my codepen: http://codepen.io/flopy_dv/pen/kkwbBp
Sorin Ruse
@sorinr
Sep 29 2016 12:07
@Iadetunji first in the pen settings js part add react and react-dom
@Iadetunji then change this React.render(<DisplayContainer />,document.getElementById("container")); to this ReactDOM.render(<DisplayContainer />,document.getElementById("container"));
Sorin Ruse
@sorinr
Sep 29 2016 12:13
@Iadetunji and you get un undefined marked() in here: `var rawMarkup = marked(value, {sanitize: true});
Adetunji Iyaniwura
@Iadetunji
Sep 29 2016 12:16
@sorinr ,ill look into it
Adetunji Iyaniwura
@Iadetunji
Sep 29 2016 12:24
@sorinr ,hv done all you prescribed and am not getting results
Sorin Ruse
@sorinr
Sep 29 2016 12:29
@Iadetunji i've seen but i haven't looked into your logic. i was just suggested how to close the errors in the console.
@Iadetunji i'll try to take a look into it
Adetunji Iyaniwura
@Iadetunji
Sep 29 2016 12:30
@sorinr ,wht can be done to make the project better ?
Sorin Ruse
@sorinr
Sep 29 2016 12:33
@Iadetunji where do you defined this "marked()" ?
Sorin Ruse
@sorinr
Sep 29 2016 12:38
@Iadetunji done. add this cdn https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.6/marked.js to your pen settings->javascript after react and react-dom and it will work
@Iadetunji here is the working pen: react project
Adetunji Iyaniwura
@Iadetunji
Sep 29 2016 12:47
@sorinr , i have done that and its not still working
Sorin Ruse
@sorinr
Sep 29 2016 12:53
@Iadetunji have you looked at my link?
Adetunji Iyaniwura
@Iadetunji
Sep 29 2016 12:55
@sorinr ,yes
Sorin Ruse
@sorinr
Sep 29 2016 12:57
@Iadetunji so, you have to load react first and after react-dom and then marked.js. then get rid of the semicolon ";" after the return part in the DisplayContainer class
Sorin Ruse
@sorinr
Sep 29 2016 13:05
@Iadetunji and also add in pen settings in css part the bootstrap lib as long as you use it
@Iadetunji and you are done
Adetunji Iyaniwura
@Iadetunji
Sep 29 2016 13:08
@sorinr , Thank You
CamperBot
@camperbot
Sep 29 2016 13:08
iadetunji sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 740 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Sep 29 2016 13:08
@Iadetunji welcome
Muhammad Hasham
@MohammadHasham
Sep 29 2016 13:35
blob
How can i make it cover the above white space and the white space at left and right corners
@sorinr
can anyone help me with that?
Stephen James
@sjames1958gm
Sep 29 2016 13:39
@MohammadHasham When you use the inspector what does it show for margin?
Muhammad Hasham
@MohammadHasham
Sep 29 2016 13:40
i can't see any margins bascially have used a ul element
@sjames1958gm
Sorin Ruse
@sorinr
Sep 29 2016 13:47
@MohammadHasham html, body {margin: 0; padding: 0;) in css part
Muhammad Hasham
@MohammadHasham
Sep 29 2016 13:48
@sorinr i have already done that but still it won't do that
Sorin Ruse
@sorinr
Sep 29 2016 13:49
@MohammadHasham do u have it on codepen?
JD Tadlock
@jdtdesigns
Sep 29 2016 13:49
@adityaparab lol, i was showing someone how a ternary works
Muhammad Hasham
@MohammadHasham
Sep 29 2016 13:49
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="psd.css">
  </head>

     <body>
      <ul>
        <li class="email">CS@OMNIHIL.COM</li>

        <div class = "login">
        <li><a href="#">login</a></li>
        <li><a href="#">Business</a></li>
        </div>

      </ul>


     </body>
Here is my HTML @sorinr
@sorinr Here is CSS
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: grey;

  }
 .email{
     padding-left:20%;
     float:left;


 }
 .bus{
   float:right;
   padding-right:20%;

 }
 .login{
     float:right;
     padding-right:20%;
         }

 li
 {
     display: inline-block;
     padding:20px;

 }
JD Tadlock
@jdtdesigns
Sep 29 2016 13:51
@MohammadHasham Do you have an example of what you're trying to achieve?
Sorin Ruse
@sorinr
Sep 29 2016 13:51
@MohammadHasham i said add in css: html, body {margin: 0px; padding: 0px;}
Muhammad Hasham
@MohammadHasham
Sep 29 2016 13:52
@sorinr Thanks
CamperBot
@camperbot
Sep 29 2016 13:52
mohammadhasham sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 741 | @sorinr |http://www.freecodecamp.com/sorinr
Muhammad Hasham
@MohammadHasham
Sep 29 2016 13:52
@jdtdesigns Thanks
CamperBot
@camperbot
Sep 29 2016 13:52
mohammadhasham sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 627 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
Muhammad Hasham
@MohammadHasham
Sep 29 2016 13:52
why did it worked on keeping that to 0
@sorinr
Sorin Ruse
@sorinr
Sep 29 2016 13:53
@MohammadHasham coz every browser give an implicit margin and padding to the rendered body so you had to reset them to zero
Muhammad Hasham
@MohammadHasham
Sep 29 2016 13:54
Thanks @sorinr that really helped!
CamperBot
@camperbot
Sep 29 2016 13:54
:warning: mohammadhasham already gave sorinr points
mohammadhasham sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
Muhammad Hasham
@MohammadHasham
Sep 29 2016 13:54
:-)
Sorin Ruse
@sorinr
Sep 29 2016 13:54
@MohammadHasham welcome
jeffm64
@jeffm64
Sep 29 2016 14:32
Does anyone know if anything change with the twitch api data recently? My project for that was working fine but is now totally broken without me changing anything on it.
Sorin Ruse
@sorinr
Sep 29 2016 14:46
@jeffm64 you need to register and get a user key
@jeffm64 its free
christocarr
@christocarr
Sep 29 2016 14:49
Im having a bit of trouble. Pls help.
Sorin Ruse
@sorinr
Sep 29 2016 14:50
@christocarr what problem?
Stephen James
@sjames1958gm
Sep 29 2016 14:51
@jeffm64 Its called a client_id
christocarr
@christocarr
Sep 29 2016 14:52
@sorinr I have a fixed navigation bar and when I click on one of the navigation links it takes me to the right section but the header of that section is hidden behind the navigation.
jeffm64
@jeffm64
Sep 29 2016 14:52
hmmm ok I'll check that out
Sorin Ruse
@sorinr
Sep 29 2016 14:53
@christocarr give a padding-top to that section of xx px where xx its the height of navbar
christocarr
@christocarr
Sep 29 2016 14:57
too obvious... thanks @sorinr
CamperBot
@camperbot
Sep 29 2016 14:57
christocarr sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 742 | @sorinr |http://www.freecodecamp.com/sorinr
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 15:15
Hello there! I just finished my local weather app. Could you check and tell me if it works? Thanks a lot! Here's the link: https://s.codepen.io/kingjami/debug/wzZGbp
Stephen James
@sjames1958gm
Sep 29 2016 15:16
@gsuxlzt Works for me - I like the look outside suggestion :)
Darth Skywalker
@adityaparab
Sep 29 2016 15:16
@gsuxlzt : Works like a charm!
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:16
is it okay to use - values in html is that a good practice wouldn't that effect responsiveness ?
@sjames1958gm
like margin-left : -35px for example
Jan Miguel Carangan
@gsuxlzt
Sep 29 2016 15:17
thank you @sjames1958gm and @adityaparab ! glad you like it :P
CamperBot
@camperbot
Sep 29 2016 15:17
gsuxlzt sends brownie points to @sjames1958gm and @adityaparab :sparkles: :thumbsup: :sparkles:
:star2: 3559 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
:cookie: 697 | @adityaparab |http://www.freecodecamp.com/adityaparab
Darth Skywalker
@adityaparab
Sep 29 2016 15:17
@MohammadHasham : you mean `style="margin-left:-35px;" in html?
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:17
yes @adityaparab
Darth Skywalker
@adityaparab
Sep 29 2016 15:18
That's a bad practice only if you're supporting responsiveness
for sure, -35px will be a big thing on small screens like that of a phone
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:19
http://codepen.io/Mohammad_Hasham/pen/kkogvd?editors=1100
is this pen okay i mean any bad practices i have used please let me know ?
@adityaparab
Darth Skywalker
@adityaparab
Sep 29 2016 15:20
@MohammadHasham : Looks good to me. Except the <!Doctype html> is missing.
Which is understandable because you're on codepen
but in real templates, it's best to use it
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:21
actually i am trying to make a template from psd to html and i have to submit that so i want not to make any non sense bugs or flaws
is that fine except the <!DOCTYPE html>
@adityaparab
Darth Skywalker
@adityaparab
Sep 29 2016 15:21
@MohammadHasham : Next thing, avoid &nbsp; &nbsp;
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:21
is that acceptable?
Darth Skywalker
@adityaparab
Sep 29 2016 15:21
use padding or margins instead
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:22
okay i'll note that
please if u find any other bad practices or flaws do let me know
Darth Skywalker
@adityaparab
Sep 29 2016 15:22

in your case removing &nbsp; &nbsp; and adding

i.fa {
  margin-right:5px;
}

should work

Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:23
okay i'll add that
apart from that
is that fine ?
@adityaparab
Darth Skywalker
@adityaparab
Sep 29 2016 15:23
rest looks good to me
are you going to develop this as a responsive template?
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:24
no i am not using any framework just pure html so it won'y be responsive
Darth Skywalker
@adityaparab
Sep 29 2016 15:24
if yes, you need to add appropriate meta tags. (Google it for more info)
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:24
is it okay to add div tags in ul tags
Darth Skywalker
@adityaparab
Sep 29 2016 15:25
@MohammadHasham : Just for clarification, responsiveness has got nothing to do with whether you're using framework or not.
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:25
@adityaparab
Okay so an html document can be responsive as well?
Darth Skywalker
@adityaparab
Sep 29 2016 15:25
It's handled using media queries which you can do without a framework (framework internally does the same thing)
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:26
i see.is it okay to add div tags in ul tags
@adityaparab
Darth Skywalker
@adityaparab
Sep 29 2016 15:26
regarding whether to use divs inside li tags - I'd suggest you avoid it.
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:26
i have used it inside <ul> is it fine?
@adityaparab
Ashton
@Atomic18
Sep 29 2016 15:28
hey guys
Darth Skywalker
@adityaparab
Sep 29 2016 15:29
@MohammadHasham : Sorry, I missed it.
No that is not fine
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:29
how can i make that fine?
Darth Skywalker
@adityaparab
Sep 29 2016 15:29
first child of ul must be li
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:29
so if i make a class in li
@adityaparab
is that fine
Ashton
@Atomic18
Sep 29 2016 15:30
im having some trouble trying to center my li on my page...i am a newbie.....
Greg Harrison
@greg-harrison
Sep 29 2016 15:31
centering the text or centering the whole element?
Ashton
@Atomic18
Sep 29 2016 15:32
both
Greg Harrison
@greg-harrison
Sep 29 2016 15:32
text-align: center will center the text
Ashton
@Atomic18
Sep 29 2016 15:32
well centering the text inside the div ive done
Greg Harrison
@greg-harrison
Sep 29 2016 15:33
But you can use "margin: 0 auto" to horizontally align it
That's a good trick if you have something you want horizontally centered
Darth Skywalker
@adityaparab
Sep 29 2016 15:36
@MohammadHasham : yes.
you can style li elements to make them inline
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:36
i am changing the whole thing i'll resend you the pen in 10 minutes
@adityaparab
Darth Skywalker
@adityaparab
Sep 29 2016 15:37
okay
Lucien
@jmlucien
Sep 29 2016 15:46
It's been over a week. Sorry I have failed you. Back in full force working on my front end project and will check in daily (weekdays). How's everyone doing?
Muhammad Hasham
@MohammadHasham
Sep 29 2016 15:48
@adityaparab
are u there?
http://codepen.io/Mohammad_Hasham/pen/kkogvd?editors=1100
Can you check my pen is that fine? have i made any blunders?
jolio007
@jolio007
Sep 29 2016 16:04
Hey guys could you check out my code, my horizontal menu seems to have little problem. It doesn't connect completely to the end of the screen - http://codepen.io/jolio007/pen/OXZLyG
hindraxxx
@hindraxxx
Sep 29 2016 16:08
@jolio007 add padding and/or margin 0 to body.
is it done ?
jolio007
@jolio007
Sep 29 2016 16:20
yes thank you @hindraxxx
CamperBot
@camperbot
Sep 29 2016 16:20
jolio007 sends brownie points to @hindraxxx :sparkles: :thumbsup: :sparkles:
:cookie: 36 | @hindraxxx |http://www.freecodecamp.com/hindraxxx
Muhammad Hasham
@MohammadHasham
Sep 29 2016 16:37
 <div class = "banner-image">
        <img src = "front.png" />
      </div>
<style>
.banner-image{

  margin: 0 auto;

}
</style>
why is my image not being centered?
Ashton
@Atomic18
Sep 29 2016 16:38
probably because you havent declared a size for the actual page
so its being centered to nothing
im still a newbie myself so plz correct me if i am wrong
Sorin Ruse
@sorinr
Sep 29 2016 16:39
@MohammadHasham move style before div
Muhammad Hasham
@MohammadHasham
Sep 29 2016 16:39
@sorinr still not working
hindraxxx
@hindraxxx
Sep 29 2016 16:40
```
 <div class = "banner-image">
        <img src = "front.png" />
      </div>
<style>
.banner-image{
  display:block;
  margin: 0 auto;

}
</style>
@MohammadHasham try this, as far as i can see you havent tried display block
Tyler Moeller
@TylerMoeller
Sep 29 2016 16:46
@MohammadHasham
<div class="banner-image">
  <img src="front.png" />
</div>
<style>
  .banner-image {
    text-align: center;
  }
</style>

<!-- OR -->
<div class="banner-image">
  <img class="centered-image" src="front.png" />
</div>
<style>
  .centered-image {
    display: block;
    margin: 0 auto;
  }
</style>
text-align: center on the outer <div> or display: block; margin: 0 auto on the <img>
Sorin Ruse
@sorinr
Sep 29 2016 16:50
@MohammadHasham or: .banner-image { display: flex; justify-content: center; }
Muhammad Hasham
@MohammadHasham
Sep 29 2016 16:50
@sorinr @TylerMoeller Thanks
CamperBot
@camperbot
Sep 29 2016 16:50
mohammadhasham sends brownie points to @sorinr and @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 743 | @sorinr |http://www.freecodecamp.com/sorinr
:cookie: 862 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Muhammad Hasham
@MohammadHasham
Sep 29 2016 16:50
that text-align:center finally
TheMightyPingu
@TheMightyPingu
Sep 29 2016 16:57
so what are we supposed to do for the twitch api challenge since twitch requires an api key?
Stephen James
@sjames1958gm
Sep 29 2016 16:57
Request the client_id from twitch
Ethan Rose
@ethanrose
Sep 29 2016 16:59
var virtDOM = '';

var request = new XMLHttpRequest();
request.onload = function(data){
  var myData = JSON.parse(data.currentTarget.responseText);
  var app = document.getElementById('app');

  for (var i = 0; i <= 100; i++){
    virtDOM += '<div><img class=\'test\' src=' + myData[i].img + ' />' + (i+1) + '. ' + myData[i].username + '</div><br>';
  }

  app.innerHTML = "hi";
};
request.open('get', 'https://fcctop100.herokuapp.com/api/fccusers/top/recent', true);
request.send();
is there an obvious reason why my app.innerHTML
doesn't seem to work when it's below the "for" loop?
Stephen James
@sjames1958gm
Sep 29 2016 17:01
@aidansven Are there 101 entries in the data?
@aidansven You should use myData.length not 100 and < not <=
tcar
@tcar
Sep 29 2016 17:05
can somebody help me with twitter button on random quote machine http://codepen.io/Tcar/pen/XjadzB?editors=0010
Ethan Rose
@ethanrose
Sep 29 2016 17:07
@sjames1958gm for some reason myData.length returns undefined
Stephen James
@sjames1958gm
Sep 29 2016 17:07
@aidansven oh weird - then at least you need < not <=
Ethan Rose
@ethanrose
Sep 29 2016 17:07
@sjames1958gm that's what I had tried at first.. maybe because it's an object in an array? Not sure exactly how it works
Stephen James
@sjames1958gm
Sep 29 2016 17:08
@aidansven Are you seeming cannot access .img of undefined in your console.
Ethan Rose
@ethanrose
Sep 29 2016 17:08
nope, I'm able to get the images
var virtDOM = '';

var request = new XMLHttpRequest();
request.onload = function(data){
  var myData = JSON.parse(data.currentTarget.responseText);
  var app = document.getElementById('app');

  for (var i = 0; i < 100; i++){
    virtDOM += '<div><img class=\'test\' src=' + myData[i].img + ' />' + (i+1) + '. ' + myData[i].username + '</div><br>';
  };

  app.innerHTML = virtDOM;
};
request.open('get', 'https://fcctop100.herokuapp.com/api/fccusers/top/recent', true);
request.send();
@sjames1958gm works :)
thank you!!
I assume this is the best way to render 100 things right??
first time I wrote it, I used app.innerHTML 100 times ha...
but I'm not sure about the speed difference between that and just using app.innerHTML with one really long string
Stephen James
@sjames1958gm
Sep 29 2016 17:10
@aidansven I used .map - but essentially the same thing
Ethan Rose
@ethanrose
Sep 29 2016 17:11
@sjames1958gm ahh ok.. yeah! Good thinking. I'm obsessed with for loops lol
@sjames1958gm well.. that's always my go-to LOL .. try it in a for loop first.... I'll try writing it with .map now
Stephen James
@sjames1958gm
Sep 29 2016 17:12
@aidansven It is odd that myData.length is undefined.
Ethan Rose
@ethanrose
Sep 29 2016 17:12
I Know!!!!
driving me crazy as to why??
@sjames1958gm I know I'm supposed to be using react for this app, but I wanted to just try with vanillaJS first to expand my knowledge ha
I actually prefer vanilla over react I think -.-
Stephen James
@sjames1958gm
Sep 29 2016 17:13
@aidansven Ah, that makes sense now, mine was all done in React
Ethan Rose
@ethanrose
Sep 29 2016 17:13
but we'll see when I actaully finish both
I probably just need to get more used to react
Stephen James
@sjames1958gm
Sep 29 2016 17:14
@aidansven React can be overkill for less complex tasks.
Ethan Rose
@ethanrose
Sep 29 2016 17:14
@sjames1958gm ah yes.. I can see that. haha
@aidansven thanks for your help!!!
CamperBot
@camperbot
Sep 29 2016 17:14
sorry aidansven, you can't send brownie points to yourself! :sparkles: :sparkles:
Ethan Rose
@ethanrose
Sep 29 2016 17:14
@sjames1958gm thanks for your help!!
CamperBot
@camperbot
Sep 29 2016 17:14
aidansven sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 3561 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
Stephen James
@sjames1958gm
Sep 29 2016 17:15
@aidansven :+1:
Ethan Rose
@ethanrose
Sep 29 2016 17:15
@sjames1958gm do you work as a developer?
@sjames1958gm by the way, you're #1 on my app, I just realized... LOL!!!!!
Stephen James
@sjames1958gm
Sep 29 2016 17:17
@aidansven I am a developer, but not a web developer. That's me :)
Ethan Rose
@ethanrose
Sep 29 2016 17:17
hahaha!!! awesome. Thanks bro
Calveeen
@Calveeen
Sep 29 2016 17:33
hey does anyone have trouble using codepen? After approximately line 25 of html i can't seem to make new lines, it's like there's a space limit
Saminda
@Saminda1
Sep 29 2016 17:38
Hey im having trouble aligning my bullet point with the bullet text. the text appears centered but the bullet doesnt
<ul>
<li><strong>1967</strong></li>
</ul>
Muhammad Hasham
@MohammadHasham
Sep 29 2016 17:40
is there a grid system in html5
like bootstrap
Calveeen
@Calveeen
Sep 29 2016 17:52
@Saminda1 use this div to nest within your ul, <div style="width: 25%; margin-left: auto; margin-right: auto;">
that should help align the bullets!
Saminda
@Saminda1
Sep 29 2016 18:04
@Calveeen the bullet point is still a good distance away from the text. i used <div class="text-center"> for all the text
nabinsademba
@nabinsademba
Sep 29 2016 18:05
? what is the problem @Saminda1
Saminda
@Saminda1
Sep 29 2016 18:08
my bullet point is too far away from the text, which is centerd
nabinsademba
@nabinsademba
Sep 29 2016 18:08
paste ur code here?
@Saminda1
Saminda
@Saminda1
Sep 29 2016 18:10
<div class="row">
<div class="col-xs-12">
<style>
.gold-background{
background-color: gold;
}
</style>
<div class="text-center">

<div class=gold-background>
<h1 class="text-center"> Kurt Cobain</h1>
<p class="text-center"> The man who sold the world</p>
<figure>
<center><img src="http://www.billboard.com/files/styles/article_main_image/public/media/kurt-cobain-mtv-unplugged-650.jpg"></img><figcaption> Kurt Cobain performs at MTV Unplugged</figcaption></center>
</figure>

<ul>

<li><strong>1967</strong></li>

</ul>

</div>
</div>
</div>
</div>
Ethan Rose
@ethanrose
Sep 29 2016 18:11
curious where I'm going wrong here now---
document.getElementById('btn').addEventListener("click", getList('https://fcctop100.herokuapp.com/api/fccusers/top/alltime'));
is my syntax incorrect? Because the event is firing on its own
Theodore P.
@Ierofantis
Sep 29 2016 18:16
@aidansven get list is a function ?
Juwdohr
@Juwdohr
Sep 29 2016 18:19
@kirbyedy Thank you for your help. It helped me to look at that and I ended up figuring out how to get it done,.
CamperBot
@camperbot
Sep 29 2016 18:19
juwdohr sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1421 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Theodore P.
@Ierofantis
Sep 29 2016 18:20
@aidansven btw you can do it like this but i dont know exactly what do you want to do document.getElementById("btn").click();
@aidansven or you can add getlist function to you button as onclick
@aidansven sth like <button onclick="getList()">Click me</button>
rahulbhargava010
@rahulbhargava010
Sep 29 2016 18:21
in jquery $('btn').on('click' function(){ //your code will go here });
or more simpler ... $( "btn" ).click(function() {
alert( "clicked" );
});
Joaquin Ignacio Sanz
@JoacoSz
Sep 29 2016 18:23
http://codepen.io/Joakosz/pen/kkkzgz?editors=1112
I can't get my console to display the temperature, wiat's wrong with it?
Tyler Moeller
@TylerMoeller
Sep 29 2016 18:23
@aidansven Put it in a callback:
document.getElementById('btn').addEventListener("click", function() {
  getList('https://fcctop100.herokuapp.com/api/fccusers/top/alltime')
});
@JoacoSz That's the temperature in Kelvin. For imperial or metric units, see this section of the documentation: http://openweathermap.org/current#data
austinmo2
@austinmo2
Sep 29 2016 18:25
Re: tribute page. Can I get feedback? I am really new and probably the code is sloppy. Also, had trouble getting the images lined up. I tried a few things and could not get the list to center. I thought the assignment said to just use HTML but I see other people using CSS. http://codepen.io/austinmo2/full/ozwroB/
rahulbhargava010
@rahulbhargava010
Sep 29 2016 18:28
@austinmo2 .. Very Good
Theodore P.
@Ierofantis
Sep 29 2016 18:28
@austinmo2 nice! But for your own learning process stylize images with css or with bootstrap grid system. Google them and It will be a good learning experience!
Muhammad Hasham
@MohammadHasham
Sep 29 2016 18:29
how to add border around an image in html5
Theodore P.
@Ierofantis
Sep 29 2016 18:31
@MohammadHasham css myImage { background:url(path to image file goes here); border: 1px solid #000000; //black border //some width and height values }
rahulbhargava010
@rahulbhargava010
Sep 29 2016 18:31
in html5 just use border="5"
in bootstrap img-thumbnail
Muhammad Hasham
@MohammadHasham
Sep 29 2016 18:32
@rahulbhargava010 where do i have to put border = 5
rahulbhargava010
@rahulbhargava010
Sep 29 2016 18:33
inside img tag
but this is not gud practice..
you have to put border through css and bootstrap.. like @Ierofantis suggest
Ethan Rose
@ethanrose
Sep 29 2016 18:35
@Ierofantis @TylerMoeller thank you guys for the solutions!! yeah getList is a function that I had already defined but I didn't realize I had to put that function inside another callback..? Thanks :) Yeah I'm trying to use vanillaJS for this project to get a better understanding, of what JQuery does behind the scenes
CamperBot
@camperbot
Sep 29 2016 18:35
:cookie: 393 | @ierofantis |http://www.freecodecamp.com/ierofantis
aidansven sends brownie points to @ierofantis and @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 863 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Muhammad Hasham
@MohammadHasham
Sep 29 2016 18:35
@lerofantis that is not working
Theodore P.
@Ierofantis
Sep 29 2016 18:35
@aidansven nice, you are on a good way
Muhammad Hasham
@MohammadHasham
Sep 29 2016 18:35
@Ierofantis can you help me with that?
Theodore P.
@Ierofantis
Sep 29 2016 18:36
@MohammadHasham yes give me your css
and your html
@Ierofantis
Theodore P.
@Ierofantis
Sep 29 2016 18:38
@MohammadHasham where do you want the border?
Atdhe Kurteshi
@atdheekurteshi
Sep 29 2016 18:38
Dedicated only for "Tech Girls" Please apply ..
http://wit.collisionconf.com/?kid=BQCT4
Muhammad Hasham
@MohammadHasham
Sep 29 2016 18:38
just aligned with the image i gues you have to change the border color
so that it becomes visible
@Ierofantis
Theodore P.
@Ierofantis
Sep 29 2016 18:42
@MohammadHasham add this img{ border: 1px solid #000000; //black border //some width and height values } on your css and remove on your css picture one two and three
Muhammad Hasham
@MohammadHasham
Sep 29 2016 18:42
what shall i remove?
can you fork the pen kindly
@Ierofantis
Theodore P.
@Ierofantis
Sep 29 2016 18:43
@MohammadHasham wait
Muhammad Hasham
@MohammadHasham
Sep 29 2016 18:45
but can i make them as thumbnail images in bootstrap
i guess i couldn;t tell u properly maybe
@Ierofantis
Theodore P.
@Ierofantis
Sep 29 2016 18:46
@MohammadHasham yup but you are not using bootstrap neither you had add bootstrap to your css
Muhammad Hasham
@MohammadHasham
Sep 29 2016 18:46
like there are thumbnails in bootstrap
is there no way to do that with html?
actually i am not allowed to use that
@Ierofantis
Theodore P.
@Ierofantis
Sep 29 2016 18:47
@MohammadHasham yes you can with border radius
Muhammad Hasham
@MohammadHasham
Sep 29 2016 18:47
okay
@Ierofantis Thanks
CamperBot
@camperbot
Sep 29 2016 18:48
mohammadhasham sends brownie points to @ierofantis :sparkles: :thumbsup: :sparkles:
:cookie: 394 | @ierofantis |http://www.freecodecamp.com/ierofantis
Muhammad Hasham
@MohammadHasham
Sep 29 2016 18:49
how much border radius shall i use?
@Ierofantis
Calveeen
@Calveeen
Sep 29 2016 18:50
Hey guys i'm a bit stuck on how to create a small tab that you can click on certain titles, and it will scroll you down to that section
i tried using <a href='#middle'>Go to middle</a> butit doesnt do anything
Dylan
@dhcodes
Sep 29 2016 18:51
@Calveeen on your middle div, try adding name="middle"
DJ Pelland
@dna113p
Sep 29 2016 18:51
@Calveeen I believe you have to add a 'name' attribute to the portion of the page you want to go to.
@Calveeen but also that won't make the page smoothly scroll, it will just jump to that spot.
Calveeen
@Calveeen
Sep 29 2016 18:52
oh crap
man this is rough haha, i'm trying my best not to look at the code in the portfolio webpage
the name did work and yeah you're right it just jumps to it
hm
DJ Pelland
@dna113p
Sep 29 2016 18:53
@Calveeen if you want to make it scroll smoothly, You need some javascript. There are a few ways to do it. jQuery would be one of the easiest
Calveeen
@Calveeen
Sep 29 2016 18:54
oh crap i totally forgot i can use jquery with this project haha
thanks!
Maryna Sokolova
@ultramarichka
Sep 29 2016 18:57
I was going to add some features but time goes by.. so take a look at my Quote Machine. I think it looks 'enough to pass'.
http://codepen.io/ultramarichka/full/MyqarK/
Theodore P.
@Ierofantis
Sep 29 2016 18:59
@MohammadHasham 50 % is ok
Tyler Moeller
@TylerMoeller
Sep 29 2016 19:04
@MohammadHasham If you are trying to figure out how bootstrap does it, look at their CSS. Open this file and search for "thumbnail" to see how they add that border around the image: https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.css
Islam Ibakaev
@dagman
Sep 29 2016 19:19

when i run npm start webpack builds bundle.js successfully and express server listening at port 3000.
there is no error thrown by webpack in cmder but localhost doesn't load app

C:\Users\User\Desktop\Recipebook (master) (Recipebook@1.0.0)
λ npm start

> Recipebook@1.0.0 start C:\Users\User\Desktop\Recipebook
> better-npm-run start

running better-npm-run in C:\Users\User\Desktop\Recipebook
Executing script: start

to be executed: "nodemon ./index.js"
[nodemon] 1.10.2
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: index.js C:\Users\User\Desktop\Recipebook\tools/**/* src/server.js src/renderHtmlPage.js
[nodemon] starting `node ./index.js`
==> �  Listening at http://localhost:3000
The react/require-extension rule is deprecated. Please use the import/extensions rule from eslint-plugin-import instead.
webpack built e0acc15d243a7937422f in 88955ms

can you guys please clone repo and help me figure it out
https://github.com/dagman/Recipebook

Hanif Marwat
@Hanifmrwt
Sep 29 2016 19:52
can some one provide me a sample of first FCC project of tribute page?
i just need a design i know how to code.
Suzanne Atkinson
@AdventureBear
Sep 29 2016 20:13
@Hanifmrwt here is mine, it's for my step-brother: http://codepen.io/AdventureBear/full/grQeRG/
Hanif Marwat
@Hanifmrwt
Sep 29 2016 20:14
@AdventureBear thanks
CamperBot
@camperbot
Sep 29 2016 20:14
:cookie: 520 | @adventurebear |http://www.freecodecamp.com/adventurebear
hanifmrwt sends brownie points to @adventurebear :sparkles: :thumbsup: :sparkles:
Suzanne Atkinson
@AdventureBear
Sep 29 2016 20:14
have fun!
Joel Santos
@St3ps
Sep 29 2016 20:36

Hello guys, I'm trying to vertically align some text on my portfolio -- in the About section -- but I just can't do it, and i don't know why.
https://st3ps.github.io/public

any ideas?

myztajay
@myztajay
Sep 29 2016 20:43
blob
having an issue with the quote machine project. I'm trying to figure out why I am not able to pull this json object and stringify it
Joel Santos
@St3ps
Sep 29 2016 20:44

The text i'm aligning is inside a col class -- so this is bootstrap -- and there's another col which holds my image. the image is ok. the text, stays up top. I've tried adding a class that does the following

.vcenter {

    display: inline-block;
    float: none;
    vertical-align: middle;


}

but to no avail.

myztajay
@myztajay
Sep 29 2016 20:46
its very short code does anyone have a second to look at it
cant pull a json object and don't know what I'm doign wrong.
John F Kirkpatrick
@jfkirkpatrick
Sep 29 2016 20:55
it appears that i need an api code to access twitch.tv
Randy
@RandyE8855
Sep 29 2016 21:28
Hi everyone. I am working on the Tribute page. I put in all the content but cannot figure out how to use Bootstrap to style it. Mostly I just want to have everything centered. I can do it with CSS, but the assignment is clear that bootstrap should be used. thanks
maybe i'm out in left field here...i worked all the lessons, and figured it out. felt good about it. but now, i'm am lost. any help here? suggestions?
Hassen Rmili
@hassenrmili
Sep 29 2016 21:31
@jfkirkpatrick yes
Randy
@RandyE8855
Sep 29 2016 21:33
ok, i think i'm good. googled and found a youtube site to help me...
surprised there was no response here at all!
Hassen Rmili
@hassenrmili
Sep 29 2016 21:41
@RandyE8855 good for you my friend
John F Kirkpatrick
@jfkirkpatrick
Sep 29 2016 22:32
@hassenrmili I see it but its still confusing
Hassen Rmili
@hassenrmili
Sep 29 2016 22:35
@jfkirkpatrick register your application first
John F Kirkpatrick
@jfkirkpatrick
Sep 29 2016 22:41
@hassenrmili I did and have the a client id
Florencia
@flopywood
Sep 29 2016 22:45
Hello everyone. Can anyone help me align a link? I gave it a display: inline-block but it still shows on another line. Here's my codepen http://codepen.io/flopy_dv/pen/ozYmow?editors=1100
Rimi.
@Codevotee
Sep 29 2016 22:50
@flopywood Hi! where would you like to align it?
Florencia
@flopywood
Sep 29 2016 22:50
@APRim05 I want it to be in the same line as session time and +
Rimi.
@Codevotee
Sep 29 2016 22:51
@flopywood the minus sign?
Florencia
@flopywood
Sep 29 2016 22:51
@APRim05 yes
@APRim05 but i've already solved it
@APRim05 thanks for the help :)
CamperBot
@camperbot
Sep 29 2016 22:51
flopywood sends brownie points to @aprim05 :sparkles: :thumbsup: :sparkles:
:cookie: 265 | @aprim05 |http://www.freecodecamp.com/aprim05
vínαч puppαl
@vinaypuppal
Sep 29 2016 22:53
@flopywood its text-decoration: none; to remove underline on links
not underline: none;
Florencia
@flopywood
Sep 29 2016 22:53
@vinaypuppal ohhh thanks!
CamperBot
@camperbot
Sep 29 2016 22:53
flopywood sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:cookie: 591 | @vinaypuppal |http://www.freecodecamp.com/vinaypuppal
Florencia
@flopywood
Sep 29 2016 22:54
@vinaypuppal do you have any idea how I can separate the math operators a little from the titles?
Rimi.
@Codevotee
Sep 29 2016 22:55
@flopywood ah ok lol

@flopywood

<div class="timeDiv">
    <h2 id="timeType"></h2>
    <h2 id="title1"><a href="#" id="minus5Clock">-</a>Session Time</h2><a href="#" id="add5Clock">+</a>
  </div>

that's what i did but nvm

vínαч puppαl
@vinaypuppal
Sep 29 2016 22:56
@flopywood try this
#minus5Clock,
#add5Clock,
#minus5Break,
#add5Break{
  margin: 0 10px;
}
Florencia
@flopywood
Sep 29 2016 22:56
@APRim05 you're a cutie pie :)
Rimi.
@Codevotee
Sep 29 2016 22:56
@flopywood :P
Florencia
@flopywood
Sep 29 2016 22:56
@vinaypuppal it worked perfectly thanks!
CamperBot
@camperbot
Sep 29 2016 22:56
flopywood sends brownie points to @vinaypuppal :sparkles: :thumbsup: :sparkles:
:warning: flopywood already gave vinaypuppal points
Tyler Moeller
@TylerMoeller
Sep 29 2016 22:59
@flopywood You can add a space next to the symbol: <a href="#" id="add5Clock">&nbsp;+</a>
or use CSS:
#minus5Clock,
#minus5Break {
  margin-right: 10px;
}
#add5Clock,
#add5Break {
  margin-left: 10px;
}
Florencia
@flopywood
Sep 29 2016 22:59
@TylerMoeller thanks!
CamperBot
@camperbot
Sep 29 2016 22:59
flopywood sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 864 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Joaquin Ignacio Sanz
@JoacoSz
Sep 29 2016 23:48
http://codepen.io/Joakosz/pen/kkkzgz
can you guys see the weather?