These are chat archives for FreeCodeCamp/HelpFrontEnd

31st
Dec 2016
Sara Dorris
@saralee233
Dec 31 2016 02:01
So I'm working on my page and i just set my margin to 10% with my nav pills but now my background image looks like it has 2 starting points. Any suggestions? http://codepen.io/SaraLee233/pen/qRWOqj
uriznik
@uriznik
Dec 31 2016 02:04
@saralee233 you have two divs with a class of pageOne - would that cause it?
Sara Dorris
@saralee233
Dec 31 2016 02:05
@uriznik Thanks!
CamperBot
@camperbot
Dec 31 2016 02:05
:cookie: 410 | @uriznik |http://www.freecodecamp.com/uriznik
saralee233 sends brownie points to @uriznik :sparkles: :thumbsup: :sparkles:
Danny Ly
@TheEmpress
Dec 31 2016 02:40
How do you code buttons that lead to other parts of your webpage?
Doneal Bercier
@donealbercier
Dec 31 2016 02:45
I need help on the Twitch Stream app. I'm not sure how to call all the JSON websites and store the information
Icah Banton
@remdata
Dec 31 2016 03:01
Help. I am trying to complete the personal portfolio challenge but I can't seem to get the contact portion to send me an email. Can someone please take a look at it and tell me what is amiss. Also, any suggestion are welcomed. (https://codepen.io/ibanton/pen/GNLpjJ)
CamperBot
@camperbot
Dec 31 2016 03:01
no wiki entry for: i am trying to complete the personal portfolio challenge but i cant seem to get the contact portion to send me an email can someone please take a look at it and tell me what is amiss also any suggestion are welcomed httpscodepenioibantonpengnlpjj
Ben Carp
@carpben
Dec 31 2016 03:12
Hi everyone, I'm working on the Portfolio project using Bootstrap. I'm trying to get my floating to the right and the text floating to the left. I tried to use two method to achieve this: 1. wraping the <p> in <div class="pull-left"> and the image in <div class="pull-right"> 2. wrapping <p> in <div class="col-md-9> and the image in <div class="col-md-3"> both failed :-|
The first one obviously failed because the text took the entire width of the container. Any advice?
Icah Banton
@remdata
Dec 31 2016 03:23
@TheEmpress . You can give ids to different sections of your page (i.e. in your div tags) and use those ids as the href vaue for your button: <a href="#about"><button type="button" class="menu-btn-style">About</button></a>. In this example you would have assign id="about" to the section you want to go to.
Danny Ly
@TheEmpress
Dec 31 2016 03:26
Thank you! :D Now I can stop worrying!
lewis reynolds
@lreynl
Dec 31 2016 03:27
@donealbercier Put your getjson in a loop that steps through the streamers array (and store the results).
Ken Haduch
@khaduch
Dec 31 2016 03:44

@carpben - you have a couple problems with trying to use the column settings - you should have code that looks something like this:

<div class="container">
    <div class="row">  
        <div class="col-md-9">
              your text here
        </div>
        <div class="col-md-3">  <!-- note that you have a typo here - "col-me-3" instead of "col-md-3" -->
            <img >
        </div>
    </div> <!-- end the "row" -->
</div>

Fix your setup to have a <div class="row"> with the two column divs nested in it, and fix the typo on your "col-me-3", should be "col-md-3". Maybe that will fix it.
Also, your class:"col-md-9" should be class="col-md-9" - equal sign instead of colon.

Jakory Dozier
@NAYBOURsound
Dec 31 2016 03:46
So i’m stuck on the "Use CSS Selectors to Style Elements” section and one understand it?
Ken Haduch
@khaduch
Dec 31 2016 03:48
@NAYBOURsound - what do you have for your code at this point?
Jakory Dozier
@NAYBOURsound
Dec 31 2016 03:49

<h2 style="color: red">CatPhotoApp</h2>

<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>

Ken Haduch
@khaduch
Dec 31 2016 03:52
@NAYBOURsound - ok. well, they are telling you do so something different in that lesson. Looking at the test results should guide you through part of the requirements. The description tells you what to do -
  • create a <style> section with that tag and a </style> tag, put that at the top of the editor window.
  • Create a CSS selector for the h2 elements, as they show in the example, but instead of the color in the example, use the color that they want you to use for the problem.
  • Remove the style attribute that is in place on the h2 element.
  • Try the tests again
Jakory Dozier
@NAYBOURsound
Dec 31 2016 03:54
Thank you.
Jeff
@pctech5510
Dec 31 2016 04:17
Hello everyone
Om Prakash
@prakash32596
Dec 31 2016 04:18
hi
Jeff
@pctech5510
Dec 31 2016 04:18
I had a question about the codecamp build a tribute page.
I am wanting to know what they are looking for in user story?
and what libraries they are referring to
Or maybe i'm looking to much into it.
welp, wrong room
Sorry all
bjmnpr
@bjmnpr
Dec 31 2016 04:36
how do you make it so that there are sections to your website? All of my coding seems to end up overlapping itself... I can't, for example, make it so that I have different sections of the website as I scroll down. I attempt to change the background color to check to see if I have done it right, but it doesnt work... any help?
LPR-309
@LPR-309
Dec 31 2016 04:39
I'm looking for an expert in Foundation 6 to help me diagnose a problem I'm having with the title-bar component. Links within are giving me a Syntax error, unrecognized expression: #. Please respond if you can help, I'm at wit's end.
I should mention, this error is in jQuery ^. Not my own code.
LPR-309
@LPR-309
Dec 31 2016 04:46
Additional info: Error is caused by data-toggle attribute which provides dropdown functionality. I have no idea how to get around it, seems impossible.
rahma314
@rahma314
Dec 31 2016 04:49
Hi can someone please tell me how I can edit the style attribute of text of only one part of a listing in an unordered list without applying the attribute to the whole <li>?
LPR-309
@LPR-309
Dec 31 2016 04:51
@rahma314 Use a span.
<ul>
  <li>Hey guys text</li>
  <li>Hey guys <span>big text</span></li>
</ul>
Target that span with a class and do whatever you need to do in the css with that class~
rahma314
@rahma314
Dec 31 2016 04:53
Right thanks!
Ken Haduch
@khaduch
Dec 31 2016 04:55
@bjmnpr - you can use the <section> ... </section> tags to mark off different sections of your page. Make sure that all of the tags in the page are balanced - for example, for every <div> there should be a closing </div>, etc. If you want to post a link to your code to have someone take a look, please do so!
LPR-309
@LPR-309
Dec 31 2016 04:56
By the way, if anyone sees :point_up: December 30, 2016 11:49 PM, I figured it out. data-toggle needs the ID of the element it's affecting as a value. data-toggle="anElementID", like that. Something that's conveniently missing from the Foundation Docs. Woo~
Priya Gupta
@PriyaBGupta
Dec 31 2016 06:04
Refused to display 'https://twitter.com/intent/tweet?text=%3Cp%3EThe%20world%20always%20seems%20brighter%20when%20you’ve just made something that wasn&#8217;t there before. </p> Neil Gaiman' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self'".
getting this error in codepen
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 06:09
Hello World! Good Morning! :)
CamperBot
@camperbot
Dec 31 2016 06:09

welcome to FreeCodeCamp @NitinNair89!

Ananda Johnson
@Sovember
Dec 31 2016 06:17
anybody know how to write a css style that's more specific than an id? : ( for example #exampleID { } ) does it matter what order I add an element or class selector and would that help with the weight of the specificity?
Coy Sanders
@coymeetsworld
Dec 31 2016 06:34
order shouldn't matter @Sovember
id's have precedence over classes
unless you give a class style the !important flag
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 06:55
Wishing you all a very Happy New Year 2017 in advance!! :gift_heart:
Ananda Johnson
@Sovember
Dec 31 2016 06:55
Thanks Coy , great info i'll try it out now
Baha Aiman
@bhshkh
Dec 31 2016 07:09
How do I get the input box and the button to the center of the page?
I mean vertically align to the center
Coy Sanders
@coymeetsworld
Dec 31 2016 07:13
try looking into flexbox @BahaAiman, vertical centering is tough w/o it
Baha Aiman
@bhshkh
Dec 31 2016 07:14
@coymeetsworld I did.
Could you please look at code once?
I don't understand what I am missing.
Coy Sanders
@coymeetsworld
Dec 31 2016 07:17
input is a selfclosing tag
you have a typo in your body tag calling for the wrong class
Baha Aiman
@bhshkh
Dec 31 2016 07:20
Made the changes
But the same issue
Sorin Ruse
@sorinr
Dec 31 2016 07:24
@BahaAiman as @coymeetsworld said flexbox is a very good option. another one could be like:
.mainDiv{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
Baha Aiman
@bhshkh
Dec 31 2016 07:32
Thanx @sorinr @coymeetsworld for help!!
Solved by adding html{height:100%} and body{height:100%}
CamperBot
@camperbot
Dec 31 2016 07:32
bahaaiman sends brownie points to @sorinr and @coymeetsworld :sparkles: :thumbsup: :sparkles:
:star2: 1708 | @coymeetsworld |http://www.freecodecamp.com/coymeetsworld
:star2: 1015 | @sorinr |http://www.freecodecamp.com/sorinr
Coy Sanders
@coymeetsworld
Dec 31 2016 07:32
nice work @BahaAiman wasn't able to figure it out exactly, been a while since i worked w/ CSS
and flexbox
Sorin Ruse
@sorinr
Dec 31 2016 08:07
@BahaAiman instead of background-size: 100% i would make it like:
    background-size: cover;
    background-position: center;
DavidMinAZ
@DavidMinAZ
Dec 31 2016 08:18
@anyone Stumped again - either I've linked an incorrect external CSS for the icons or my code sucks (actually, that's most likely). Trying to get my <i> element to change icons by modifying the .className in jQuery /JS, but I'm not seeing the icon. Any help appreciated!
http://codepen.io/dmattiuz/pen/MbNLRg?editors=1111
Sorin Ruse
@sorinr
Dec 31 2016 08:21
@DavidMinAZ everything its ok execpt your i class should be like class="wi wi-owm-800" not just class="wi-owm-800 "
DavidMinAZ
@DavidMinAZ
Dec 31 2016 08:22
@sorinr Oh my... yes, that would make sense I suppose, just as is the case with Font Awesome.
Sorin Ruse
@sorinr
Dec 31 2016 08:22
@DavidMinAZ yep
DavidMinAZ
@DavidMinAZ
Dec 31 2016 08:23
@sorinr Thanks, Sorin! I now officially feel more foolish than usual, but I do sincerely appreciate the catch!
CamperBot
@camperbot
Dec 31 2016 08:23
:star2: 1016 | @sorinr |http://www.freecodecamp.com/sorinr
davidminaz sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
Sorin Ruse
@sorinr
Dec 31 2016 08:24
@DavidMinAZ don't worry about that. it happens a lot to all of us to miss something into the code and don't see it :)
DavidMinAZ
@DavidMinAZ
Dec 31 2016 09:00
:D
ricky2412
@ricky2412
Dec 31 2016 09:06
https://codepen.io/ricky2412/full/ENBERE/ whenever i clicking on contact on navigation bar not directed to proper contact section please help
Sandev2003
@Sandev2003
Dec 31 2016 09:06
How do i adjust background color with css again?
Kenneth Nwaeze
@kengin2013
Dec 31 2016 09:11
Help with
CamperBot
@camperbot
Dec 31 2016 09:11
no wiki entry for: with
Idowu Wasiu
@Hoxtygen
Dec 31 2016 09:12
@Sandev2003 background-color:
Sandev2003
@Sandev2003
Dec 31 2016 09:17
@Hoxtygen ok thanks
CamperBot
@camperbot
Dec 31 2016 09:17
sandev2003 sends brownie points to @hoxtygen :sparkles: :thumbsup: :sparkles:
:cookie: 307 | @hoxtygen |http://www.freecodecamp.com/hoxtygen
Sandev2003
@Sandev2003
Dec 31 2016 09:19
what should i write about on my tribute page?
fijeko
@fijeko
Dec 31 2016 09:26
@ricky2412 resize your window to be smaller and you'll see that navigation works fine
Sandev2003
@Sandev2003
Dec 31 2016 09:37
How do i center pictures?
Robert Purcea
@RobertPurcea
Dec 31 2016 09:39
@Sandev2003 img tag or background-images?
Scharom
@scharom16
Dec 31 2016 11:43
@Sandev2003 you can center things in different ways look at this documentation of the W3:
How to center things
Cristian Polycarpou
@OmniPoly
Dec 31 2016 12:38
Hi
HOw do you use Jquery in Codepen?
in the js section?
Stephen James
@sjames1958gm
Dec 31 2016 12:39
@OmniPoly There is a gear icon in each section - click the one in the js section and you can add external libraries such as jquery
Cristian Polycarpou
@OmniPoly
Dec 31 2016 12:39
iv added
  $(document).ready(function() {

$("button").addClass("animated shake");

});

to the js seciton but
nothing happening
i think im out of my depth
hello
Stephen James
@sjames1958gm
Dec 31 2016 12:44
@OmniPoly Do you have classes for animated/shake in the css section and buttons in the html section?
@OmniPoly You can post your codepen link here for others to take a look
Cristian Polycarpou
@OmniPoly
Dec 31 2016 12:44
i have buttons in the htlm section
not the css section ok il check that out thatnks
no i dont know what you mean
class in css section?
Sorin Ruse
@sorinr
Dec 31 2016 12:48
@OmniPoly do you have your code on codepen? if yes, just post the link to your pen here
Cristian Polycarpou
@OmniPoly
Dec 31 2016 12:51
no i wont my basic site is embarrassing lol
how do i add a class for my button in the css section @sorinr
@sjames1958gm how do i add a class for my button in the css section
Stephen James
@sjames1958gm
Dec 31 2016 12:53

@OmniPoly you want to add the animated class there

.animated {
}

Then your js will add the class to the button

Sorin Ruse
@sorinr
Dec 31 2016 12:54
@OmniPoly in html you should have something like <button class="myclass">My description here</button> and in css you should have .myclass{styling properties in here}
@OmniPoly never be afraid to show your code. good or bad. as long as you r learning your code will be better and better.
Cristian Polycarpou
@OmniPoly
Dec 31 2016 12:58
ok thanks
i have the html not the css
il keep at it
Sorin Ruse
@sorinr
Dec 31 2016 13:00
@OmniPoly html is for the structure of a web page while css is for the styling of the html elements on that page
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:01
yeah but code pen is different to what they were showing at first i just have to get my head arund it i think
Ali
@UmutAlihan
Dec 31 2016 13:03
l trying to write binary to decimal converter but getting this error all the time, what is wrong with my code?? Please help!!
from math import *

bin_list = input()
bin_list = bin_list.split()
raw_conv = []

>>> i = -1
>>> j = 0
>>> for i in bin_list:
... raw_conv = int(bin_list[i])*int(pow(2,j))
... i -= 1
... j += 1
...
Traceback (most recent call last):
File "<stdin>", line 2, in <module>
TypeError: list indices must be integers or slices, not str
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:04
@sorinr css was always in the html <style></style> not s separte section???
Sorin Ruse
@sorinr
Dec 31 2016 13:04
@OmniPoly its not at all different. in a web page you have the html part and they have a html pane for it, you have css styling that can go in codepen's css pane and you may have javascript for adding interactivity to the webpage that will go to JS part in codepen
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:05
im such a novice
lol
i tried putting my code from my <style> in the css section but its didnt do anthing
Sorin Ruse
@sorinr
Dec 31 2016 13:06
@OmniPoly if you put whatever styling you have between <style></style> in codepen's css part, codepen will take care of the rest:)
@OmniPoly just post your link of the codepen and we will advise how to proceed
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:07
haha ok
@sorinr body{
background-color:black; isnt working in the css seciton?
@sorinr how would one post their pen on herE?
Sorin Ruse
@sorinr
Dec 31 2016 13:12
@OmniPoly because it should be background-color: black;
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:12
@sorinr it worked in the <style> tags though lol
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 13:14
@sorinr What's the difference in both?
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:14
@sorinr didnt work
Sorin Ruse
@sorinr
Dec 31 2016 13:15
@OmniPoly go to your browser search bar on the tab that you have opened that pen and copy the url in there and paste it in here
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 13:15
@OmniPoly Could you please post your code or share codepen link?
Sorin Ruse
@sorinr
Dec 31 2016 13:16
@NitinNair89 none. i mistakenly saw it as background-color-black
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 13:20
@OmniPoly Get rid of the <link> tag you gave inside HTML editor. use the codepen settings to add Bootstrap files. Then give all CSS styles inside the CSS editor. The code will work ONLY AFTER you remove the <link> tag
Sorin Ruse
@sorinr
Dec 31 2016 13:21
@OmniPoly yep do as @NitinNair89 said and it will work
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:22
ok cool thanks that al worked im now using the css setion
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 13:22
Cool!
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:22
but why isnt my button animated or shaking?
@NitinNair89 but why isnt my button animated or shaking?
@sorinr but why isnt my button animated or shaking?
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 13:28
@OmniPoly Include the Animate.css file by drayden
via codepen settings
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:30
@NitinNair89 ok iv done that
atill not working
@NitinNair89 ahh i had to add JQuery \thanks
guys big help
@NitinNair89 thanks
CamperBot
@camperbot
Dec 31 2016 13:30
omnipoly sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 367 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:31
@sorinr thanks
CamperBot
@camperbot
Dec 31 2016 13:31
omnipoly sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1018 | @sorinr |http://www.freecodecamp.com/sorinr
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 13:32
Welcome @OmniPoly :)
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:32
` @NitinNair89 how would one loop the animated shake?
lol
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 13:33
add the "infinite" class
@OmniPoly
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:34
@NitinNair89 thakns
thanks
@NitinNair89 thanks
CamperBot
@camperbot
Dec 31 2016 13:34
omnipoly sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:warning: omnipoly already gave nitinnair89 points
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 13:34
Glad to help @OmniPoly ;)
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:34
can i get a ist of classes?
@NitinNair89
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 13:35
Yep! Why not? @OmniPoly , I refer the official site - https://daneden.github.io/animate.css/
It's easy, you select the effect and see it happen ;)
Cristian Polycarpou
@OmniPoly
Dec 31 2016 13:53
@NitinNair89 thanks
CamperBot
@camperbot
Dec 31 2016 13:53
omnipoly sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:warning: omnipoly already gave nitinnair89 points
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 13:54
:)
c0d0er
@c0d0er
Dec 31 2016 14:22
in the following code, could anybody explain the detailed purpose and function and use of const handleAsync function and the Redux.applyMiddleware(ReduxThunk.default) in the following code? this code is from Redux 12 Use Middleware to Handle Asynchronous Actions under http://hysterical-amusement.surge.sh/. Thanks!
const REQUESTING_DATA = 'REQUESTING_DATA'
const RECEIVED_DATA = 'RECEIVED_DATA'

const requestingData = () => { return {type: REQUESTING_DATA} }
const receivedData = (data) => { return {type: RECEIVED_DATA, users: data.users} }

const handleAsync = () => {
return function(dispatch) {
dispatch(requestingData());
setTimeout(function() {
let data = {
users: ['Jeff', 'William', 'Alice']
}
dispatch(receivedData(data));
}, 2500);
}
};

const defaultState = {
fetching: false,
users: []
};

const asyncDataReducer = (state = defaultState, action) => {
switch(action.type) {
case REQUESTING_DATA:
return {
fetching: true,
users: []
}
case RECEIVED_DATA:
return {
fetching: false,
users: action.users
}
default:
return state;
}
};

const store = Redux.createStore(
asyncDataReducer,
Redux.applyMiddleware(ReduxThunk.default)
);
Ken Haduch
@khaduch
Dec 31 2016 15:48
@c0d0er - I don't have a clue, but I'm going through that course, I guess I'll need to know it eventually... :)
koder3
@koder3
Dec 31 2016 16:53
Fulfill the below user stories. Use whichever libraries you need. Give it your own personal style. what does this mean?
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 16:53
user stories are requirements @koder3
"functionalities to be achieved" written in short and simple way
Mykj23
@Mykj23
Dec 31 2016 17:05

Need help with the random quote machine. Trying to get the api I'm using (with key) to pull up. $(document).ready(function () {
function(getQuote){
$.ajax({
url: "http://api.forismatic.com/api/1.0/",
type: "GET",
dataType: "json",
success:

$("#new-quote").click(function(){
showData;
$("#quote").html();
})
});

Nitin Chandran Nair
@NitinNair89
Dec 31 2016 17:07
what error do you get?
codepen link pls?
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 17:35
Happy New Year 2017 guys!
Tyler Moeller
@TylerMoeller
Dec 31 2016 17:43
@Mykj23 Change your URL to http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=?
You also have some syntax errors, maybe start with this and then work out the errors from there:
function getQuote() {
  $.ajax({
    url: "http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=?",
    dataType: "json",
    success: showData
  });
}

function showData(data) {
  // do something with the data
}
Happy New Year :tada::tada::confetti_ball::confetti_ball:
Aspen Hollyer
@ahollyer
Dec 31 2016 17:45
Hey everyone :smile: I'm just reaching the Basic Front End Projects section, and I notice it says to use CodePen. I'm coming from The Odin Project, so I've already got a development environment set up on my desktop and have been practicing workflows with GitHub and whatnot. Would it be better experience to keep practicing on my desktop, or is it better to just use Codepen for these tutorials? Thanks
Sorin Ruse
@sorinr
Dec 31 2016 17:49
@NitinNair89 Hello from the past. we still enjoy 2016 :)
Tyler Moeller
@TylerMoeller
Dec 31 2016 17:49
@ahollyer Use the development environment you feel most comfortable with. When you need help with code, however, it's easiest to just share a codepen link. Otherwise, we'd have to fork your repo and get it running locally to help with debugging. You can always copy/paste your code from your desktop into a codepen and share it out if needed.
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 17:50
11:20 pm here @sorinr ;)
Tyler Moeller
@TylerMoeller
Dec 31 2016 17:50
9:50am here :)
Sorin Ruse
@sorinr
Dec 31 2016 17:50
19:50here
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 17:51
awesome
Sorin Ruse
@sorinr
Dec 31 2016 17:52
. @TylerMoeller our advantage is that we still have some time to do what ever we wanted to do in 2016 and we didn't :) :)
Aspen Hollyer
@ahollyer
Dec 31 2016 17:53
@TylerMoeller :+1: Ok thanks! I think I'll go the copy-paste route when I need help
CamperBot
@camperbot
Dec 31 2016 17:53
ahollyer sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1233 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Dec 31 2016 17:53
@sorinr haha, yes, big day ahead! Still plenty of time to eat unhealthy food and not exercise :)
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 17:53
:P
Guys i found out something
Sign up here - joinhoney.com/ref/g2qf5o
Tyler Moeller
@TylerMoeller
Dec 31 2016 17:54
@ahollyer No problem! Good luck with your Free Code Camp projects.
Sorin Ruse
@sorinr
Dec 31 2016 17:54
@TylerMoeller yep. let the cholesterol grow high five :)
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 17:54
and then it will auto apply coupons and save you money during checkout
i just bought a course on Udemy using it
worked like a charm
i bought the 60$ course just for 10$ :laughing:
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 18:33
12:02 AM
Start of 2017 seems ok guys.. Come onboard! :)
Ken Haduch
@khaduch
Dec 31 2016 18:37
@NitinNair89 - Happy New Year!
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 18:40
Thank you!
I wish i can give brownie points to everyone right now :P
Thank you All!!
@camperbot Thank Everyone for me :wink:
CamperBot
@camperbot
Dec 31 2016 18:41
nitinnair89 sends brownie points to @camperbot :sparkles: :thumbsup: :sparkles:
:star2: 2805 | @camperbot |http://www.freecodecamp.com/camperbot
James Moore
@James-N-M
Dec 31 2016 19:09
If No ones done it yet, check out Wes Bos Free J.S 30 Videos, I did the first one today, It was quick and fun // saw alot of new things that I just googled really quick cause i wasnt sure what they were but, The html and Css is super basic and the JavaScript is plain enough to still have an idea of whats going on if your like me and dont have alot of exp in j.s
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 19:16
Nice!
Can you share the link?
Jonathan Marx Domah
@marxcom
Dec 31 2016 19:31
can someone help me with a random bible verse api
i want to work on the js for my random quote machine
dont know how to start
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 19:40
start by getting the url of that api
Baha Aiman
@bhshkh
Dec 31 2016 19:43
@sorinr I've made the changes to background css. Thanx
CamperBot
@camperbot
Dec 31 2016 19:43
bahaaiman sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1020 | @sorinr |http://www.freecodecamp.com/sorinr
Baha Aiman
@bhshkh
Dec 31 2016 19:44
Wikipedia viewer (https://codepen.io/bhshkh/pen/BpBKVr/)
Why aren't the elements of records array getting displayed in ng-repeat?
All I see is {{x]}
Never mind
Got it
James Moore
@James-N-M
Dec 31 2016 19:55
@NitinNair89 https://javascript30.com/ Hey man ! do the first one today and msg me if your game to like pair program the next one ??
Or discus Whats talked about or even edit what we do to make it our own ?? @NitinNair89
Venkatesh Thapan
@thenerdyouknow
Dec 31 2016 20:25
  $.ajax({
    type: "GET",
    url: "http://quotes.stormconsultancy.co.uk/random.json",
    contentType : "application/json",
    dataType : "json",
    success: function(author, quote){
      $("#Quote").html(author);
      $("#author").html(quote);
    }
 });
What's wrong with this AJAX call?
for
Tyler Moeller
@TylerMoeller
Dec 31 2016 20:28
@thenerdyouknow If you check your browser's console, you should see an error like this:
XMLHttpRequest cannot load http://quotes.stormconsultancy.co.uk/random.json. Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight response.
One way to address these issues is to add ?callback=? to the end of the URL - it tells jQuery to treat the request as JSONP for cross-domain requests like these
Long story short, use this URL: http://quotes.stormconsultancy.co.uk/random.json?callback=?
Nitin Chandran Nair
@NitinNair89
Dec 31 2016 20:29
Sure @James-N-M I will PM you
Venkatesh Thapan
@thenerdyouknow
Dec 31 2016 20:31
@TylerMoeller Okay it started working.
But it won't show quote or author.
Just success.
Where am I going wrong?
Tyler Moeller
@TylerMoeller
Dec 31 2016 20:32
@thenerdyouknow That API only returns one object, so your success function should be function(json)
You can then parse json to get the author and the quote - do a console.log(json) to see how to parse it
julienalexandre
@julienalexandre
Dec 31 2016 20:35
why am I not able to add +3 to my array? What's wrong with my code?
Venkatesh Thapan
@thenerdyouknow
Dec 31 2016 20:36
@TylerMoeller Saw the author, id and quote in console.
Now how do I assign author and quote to respective divs?
(Sorry I've been searching all over but haven't gotten far)
Tyler Moeller
@TylerMoeller
Dec 31 2016 20:38
@thenerdyouknow Glad that worked out for you. Did you do this challenge by chance? https://www.freecodecamp.com/challenges/accessing-objects-properties-with-the-dot-operator
It shows how to access individual properties in a JSON object. Once you figure out how to access the quote and the author, you can use the .html() method like you are trying to do in your sample code to write the data to the web page.
(trying to help you figure out the answer without giving it to you :))
Venkatesh Thapan
@thenerdyouknow
Dec 31 2016 20:40
@TylerMoeller More than enough.
I shall figure it out now.
Thanks.
A LOT.
Like a whole bunch xD
CamperBot
@camperbot
Dec 31 2016 20:40
thenerdyouknow sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1234 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Dec 31 2016 20:40
Sara Soliman
@solimansara
Dec 31 2016 20:45
Hi, I have been spacing out the content of my webpage by using the <br> </br>, is there a better way of doing this. My webpage is in bootstrap.
Tyler Moeller
@TylerMoeller
Dec 31 2016 20:48
@solimansara Yes, use the CSS margin, padding, and height/min-height properties.
Venkatesh Thapan
@thenerdyouknow
Dec 31 2016 20:49
@TylerMoeller I DID IT XD
IT TOOK ME 3 DAYS TO FIGURE OUT HOW TO USE AN API BUT I DID IT XD
Tyler Moeller
@TylerMoeller
Dec 31 2016 20:49
Congrats! :+1: :)
DarylKnapp
@DarylKnapp
Dec 31 2016 20:50

Good afternoon,

Can someone help me with getting my bullet points the same as the First challenge " Tribute page" Thanks!

https://codepen.io/DarylKnapp/pen/mRbPRR/

Venkatesh Thapan
@thenerdyouknow
Dec 31 2016 20:52
@DarylKnapp All a <ul> or an <ol> tag and enclose all <li> in between them.
They let HTML know you want an ordered list or an unordered one.
Add*
Wesley Rezende
@WesRezende
Dec 31 2016 20:57
Guys, my bio/tribute page doesn't work on large screens.
yOussef
@WinteRaven
Dec 31 2016 21:16
anybody here with pygame experience?
Sara Soliman
@solimansara
Dec 31 2016 21:21
I am still having trouble with the spacing, can you review my code. This is the last think i need to do before submitting this task. http://codepen.io/Solimansara/pen/ENzQzw/
Thing*
ahrichardson
@ahrichardson
Dec 31 2016 22:17
Hey gang, first time posting here. On the tribute page assignment, and here's my effort so far. Click through to full view and such if you'd like, anyone have any thoughts? Anything is appreciated. http://codepen.io/ahrichardson/pen/YNKzpa/
Sarah
@Shoyren
Dec 31 2016 22:26
Is it a best practice to use "col-md-12" to fill the center? I feel like there should be a more efficent way of doing this. http://codepen.io/shoyren/pen/MJgpEE
@ahrichardson Looks pretty good on desktop screens, but the way that the containers get stacked in a narrower window makes it so that Carrie Fisher's name appears about a third down the page.
Sarah
@Shoyren
Dec 31 2016 22:31
@ahrichardson This site has some info on how the columns get stacked on a smaller screen. I hope this helps: http://getbootstrap.com/css/#grid
ahrichardson
@ahrichardson
Dec 31 2016 22:41
@Shoyren That's certainly been a problem so far. Thanks for the link, I'll give it a look and see if I can't get it right.
CamperBot
@camperbot
Dec 31 2016 22:41
ahrichardson sends brownie points to @shoyren :sparkles: :thumbsup: :sparkles:
:cookie: 118 | @shoyren |http://www.freecodecamp.com/shoyren
Phillip Troutman
@troutman21
Dec 31 2016 22:42
Im having some trouble trying to get my header and nav bar sit at the bottom of the header section (the black background) can anyone help me out ? how do i get it to drop down? http://codepen.io/Troutman21/pen/PbrQqE?editors=1100
Phillip Troutman
@troutman21
Dec 31 2016 22:53
anyone? lol
Walid Ashri
@walidashri
Dec 31 2016 22:55
@troutman21 u can add margin-top to ur header and nav tag
Phillip Troutman
@troutman21
Dec 31 2016 22:59
in my css right ? @walidashri
Walid Ashri
@walidashri
Dec 31 2016 23:01
@troutman21 :+1:
Phillip Troutman
@troutman21
Dec 31 2016 23:04
not working =( @walidashri ... it just pushes the whole header section down. making it thinker.
Tyler Moeller
@TylerMoeller
Dec 31 2016 23:24
@troutman21 Consider using the fixed-top navbar: https://getbootstrap.com/components/#navbar-fixed-top
Here's an example of one in use: http://s.codepen.io/TylerMoeller/pen/xRagVr?editors=1010
Phillip Troutman
@troutman21
Dec 31 2016 23:27
sir... you are the man.. thanks @TylerMoeller
CamperBot
@camperbot
Dec 31 2016 23:27
troutman21 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1237 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Ken Haduch
@khaduch
Dec 31 2016 23:34

@Shoyren - I don't know if you're really using the Bootstrap grid properly. For instance, you have your <div class="row" align="center"> but it has no content, the </div> follows immediately. I think that the proper use of the Bootstrap grid requires that the column divs be nested within a "row" div. At least the docs on http://getbootstrap.com/css/#grid show that that is the way. I don't know exactly what happens when you don't do things that way? Perhaps because the content that you have doesn't really do anything too fancy with the grid - nothing multi-column, for example, it just works out okay?
But I think that it looks good, my one comment for pages like this is that I would not make the image so large that it occupies the entire page - I like to see some of the information show up on the page along with the image.

I ran it through the HTML validator at https://validator.w3.org/, and it mentions a few things - one of them is related to the way that CodePen uses a template to generate the output. You have included a <body> tag, but the CodePen template already provides that. Simple to just remove it. (And the browser probably handles it - at least a desktop browser will. Mobile browsers might not do as well.) The validator complains that the align attribute is obsolete - use CSS instead. You have a </br> tag, which is not valid. And some unclosed <div> somewhere along the way? Perhaps just the container-fluid div?