These are chat archives for FreeCodeCamp/HelpFrontEnd

10th
Dec 2016
Tyler Moeller
@TylerMoeller
Dec 10 2016 00:00
@LewisLA It is also fixed if you remove:
.container-fluid {
    padding: 0;
}
In addition to the (margin-right: 0 for your row)
Frank Joseph
@frankmaayn
Dec 10 2016 00:26
guys how can i make this page responsive to any screen size?
Adam
@Adnosk
Dec 10 2016 00:57
Silly question, but i am working on my personal portfolio page and looking at some bootstrap examples of collapsible header navigation etc. - I understand the code quite good but should i just copy it always or do you really memorize things like that? Because i forget easily some parts :)
Serg
@Serg911
Dec 10 2016 00:58
Greetings, I'm running into an issue building the personal portfolio page. The 'page titles' are hiding behind the navbar. I know it's something simple but I'm a bit stuck. http://codepen.io/Serg911/pen/eBjvgL
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 01:11
@Serg911 everything looks good from here
darn
hold on...
right soo...
back.. :)
Tyler Moeller
@TylerMoeller
Dec 10 2016 01:23
@Serg911 This is a known issue with a few solutions mentioned here: twbs/bootstrap#1768
This is what I do:
  // Adjust scroll position when clicking on bookmark links
  const scrollAdjust = () => scrollBy(0, -50);
  if (location.hash) scrollAdjust();
  window.addEventListener('hashchange', scrollAdjust);
Modify the -50 as desired
Hiago Patrick
@HiagoPatrick
Dec 10 2016 01:32
Good night guys.
Can anybody help me? I have this first chalenge which is to build a tribute page on code pen. But i'm not understanding that thing there.
How in the hell am i supposed to work with that?? I don even know how to work there. They said not to look at the code of the page, but in the video he shows it a bit, and he has a lot os .class in the html, and no class writen in the css, except for body.
I'm like COMPLETELY lost
and confused.
he has a lot of **
Serg
@Serg911
Dec 10 2016 01:45
Thanks @TylerMoeller. I'll try that tomorrow. @HiagoPatrick, I just finished that project this morning. The only css code you need in the css panel is: .body {
margin-top: 60px;
}
CamperBot
@camperbot
Dec 10 2016 01:45
:warning: could not find receiver for hiagopatrick
:star2: 1128 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
serg911 sends brownie points to @tylermoeller and @hiagopatrick :sparkles: :thumbsup: :sparkles:
Serg
@Serg911
Dec 10 2016 01:46
@HiagoPatrick, the only css you need in the css pane is:
.body {
margin-top: 60px;
}
Hiago Patrick
@HiagoPatrick
Dec 10 2016 01:47
@Serg911 ok, but then, how am i supposed to know what <div class> to use if i havent writen any ???
Serg
@Serg911
Dec 10 2016 01:49
@HiagoPatrick, before you got to this project, there were a couple of instances where you/we were asked to use div classes.
Hiago Patrick
@HiagoPatrick
Dec 10 2016 01:49
yeah, but they said what to use, so i knew what div class i could use.
But thanks anyway, i'll just go back for the very first exercise, cus i'm trying dis chalenge for more than a mounth.
and i still dont know what to there
Thnx
Serg
@Serg911
Dec 10 2016 01:51
http://www.w3schools.com/w3css/w3css_containers.asp go there and find out a bit more about classes. One of the goals of that project is to come up with a solution to 'replicate' the tribute page without looking at the code.
John
@flyboy1565
Dec 10 2016 01:56
@HiagoPatrick, the reason they ask you not to look at the code, is that the is built using higher level skills, that you might not have. The way I accomplished this was to look at the substance of the page and try to replicate it with my limited knowledge. Once I thought it was good I posted it to be review by others, they made notes about what to do and how to improve it.
Hiago Patrick
@HiagoPatrick
Dec 10 2016 01:56
Look, i'm used to work with classes in dreamweaver, where i need to write them in the css before using, so i know how to use them, but i dont know how to work with classes i havent write.
so, that can help in which way @Serg911 ?
John
@flyboy1565
Dec 10 2016 01:57
No, problem..
Serg
@Serg911
Dec 10 2016 02:03

@TylerMoeller; this did the trick:

<script>
window.addEventListener("hashchange", function() { scrollBy(0, -90) })
</script>

Thanks
Hiago Patrick
@HiagoPatrick
Dec 10 2016 02:03
ok, i give up, i'm lost, so i'll go back. again, thx anyway
Tyler Moeller
@TylerMoeller
Dec 10 2016 02:05
No problem, @Serg911
Serg
@Serg911
Dec 10 2016 02:10
@HiagoPatrick, bootstrap comes pre-defined classes. All you have to do is call them on your code. For the extensive list of pre-defined classes, go here: https://bootstrapcreative.com/resources/bootstrap-3-css-classes-index/
once there, just look for .text , .container , .image to see what you can or wish to use for this project.
Franco Rufo
@francorufo
Dec 10 2016 02:30

Does anyone know how you would type $(".randomClass").css("animation")?

Like would it be something like --> $(".randomClass").css("animation", "bounce", "1s", "ease", "0s", "forwards")

Serg
@Serg911
Dec 10 2016 02:34
dumb question perhaps, but where/how do I submit a pen project for review by peers?
Sam Griffen
@ssgriffen
Dec 10 2016 03:06
For the weather app I found out you have to prepend your codepen url with Https to use the navigator.geolocation. Do people recommend using a differnt way of getting location?
Ken Haduch
@khaduch
Dec 10 2016 03:09
@Serg911 - you can use the CodeReview room - https://gitter.im/FreeCodeCamp/CodeReview
Merlain Makiadi
@MagicInfinity
Dec 10 2016 03:12
Hi guys, sorry. I'm new to this and have just completed the CSS/HTML chapter, but i'm stuck on the first responsive design challenge.
Franco Rufo
@francorufo
Dec 10 2016 03:17
Is it the portfolio page?
Janina Pohorecki
@janepohorecka
Dec 10 2016 03:25
Hey guys!!! I really, really need your help. Can someone here please explain the following conundrum? When I turn my website into mobile view and open the three bars to expand the menu it causes the logo to move over. What is happening here??
Frank Joseph
@frankmaayn
Dec 10 2016 03:30
guys how do you add a line decoration?
Franco Rufo
@francorufo
Dec 10 2016 03:33
@frankmaayn <hr> I think that's what you mean
oh never mind that's probably not what you mean
text-decoration: underline;
Frank Joseph
@frankmaayn
Dec 10 2016 03:33
no not that lol
@francorufo http://bashooka.com/wp-content/uploads/2012/10/portfolio-templates-28.jpg like this for example.. theres a line next to the &
Franco Rufo
@francorufo
Dec 10 2016 03:36
you could probably do that with 2 <hr> with a & in the middle
otherwhise I don't know xD
Tyler Moeller
@TylerMoeller
Dec 10 2016 03:37
@frankmaayn Here's an example of how to do it: http://codepen.io/TylerMoeller/pen/VmzppJ
Frank Joseph
@frankmaayn
Dec 10 2016 03:38
there it is lol
Tyler Moeller
@TylerMoeller
Dec 10 2016 03:41
@francorufo .css() format is ('property', 'value') so, something like: $(".randomClass").css("animation", "bounce 1s ease")
or put it in curly braces and type it just like you would with regular CSS: $(".randomClass").css({"animation": "bounce 1s ease"})
Frank Joseph
@frankmaayn
Dec 10 2016 03:44
for navbar
would u have to use javascript to make it scroll down instead of going to the section without any animation?
Tyler Moeller
@TylerMoeller
Dec 10 2016 03:45
Yes, javascript is needed to animated the scroll effects - I suppose it might be possible with CSS, but would be much more complicated than with javascript
Frank Joseph
@frankmaayn
Dec 10 2016 03:47
and would use the code by $() .scrollTo()?
or is it more complicated than that?
@TylerMoeller
is der a more simple way? lol
@TylerMoeller
Tyler Moeller
@TylerMoeller
Dec 10 2016 03:51
Search for "smooth scroll" and see what works best for you
Stephen
@stephepush
Dec 10 2016 03:53
Hey, I have a question. Is there a way to have two divs stay next to eachother at different viewport sizes without using media queries or bootstrap?
Tyler Moeller
@TylerMoeller
Dec 10 2016 03:54
@frankmaayn I gotta go - hope that helped
jacobus-brogly
@jacobus-brogly
Dec 10 2016 03:54
woot
Frank Joseph
@frankmaayn
Dec 10 2016 03:54
@TylerMoeller thanks and it did
jacobus-brogly
@jacobus-brogly
Dec 10 2016 03:54
mapapp
CamperBot
@camperbot
Dec 10 2016 03:54
:star2: 1129 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
frankmaayn sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
jacobus-brogly
@jacobus-brogly
Dec 10 2016 03:55
find blood donors nearby
CamperBot
@camperbot
Dec 10 2016 03:55
find blood donors nearby
nothing found
jacobus-brogly
@jacobus-brogly
Dec 10 2016 03:55
mapapp.png
isnt she pretty
find blood donors on the map or add yourself to the map,
CamperBot
@camperbot
Dec 10 2016 03:56
find blood donors on the map or add yourself to the map
nothing found
jacobus-brogly
@jacobus-brogly
Dec 10 2016 03:56
camperbot is getting on my nerves
Sam Griffen
@ssgriffen
Dec 10 2016 04:06
Can anyone offer a clear explanation why my lat variable isn't changing? It's almost as if it is out of scope but I declared it globally so I'm a little confused... https://codepen.io/ssgriffen/pen/bBjoqm
jacobus-brogly
@jacobus-brogly
Dec 10 2016 04:07
ok i will take a look
grantknaver
@grantknaver
Dec 10 2016 04:19
question for you guys. I am about to finish up the wiki project, but I have a quick question.
when I preform a search invovling an API after the second request the search takes an extended amount of time. How do I address this issue?
I have tried to use empty() on apiContainer prior to the getJSON, but it freezes the whole request, and stops my ability to search
Janina Pohorecki
@janepohorecka
Dec 10 2016 04:37
Hey guys!!! I really, really need your help. Can someone here please explain the following conundrum? When I turn my website into mobile view and open the three bars to expand the menu it causes the logo to move over. What is happening here??
This is the website: https://janepohorecka.github.io/Test-Northwest/
lyndxe
@lyndxe
Dec 10 2016 04:50
back again, I was embedding an Instagram picture into my tribute (since I don't have any way of uploading that particular photo anywhere else), and their embed code is quite lengthy with a ton of mark-up and CSS. would anyone consider that "cheating" since it's pre-coded? I actually read through the code myself and could understand aspects/tweak them, but it looks good just keeping it as is. obviously I understand the "img src" aspects, and could even alt text of my own... but it works. though is it problematic because it's "pre-coded?"
Greg D
@mosaic-greg
Dec 10 2016 05:26
@grantknaver sounds like you need to learn about asyncronous (non-blocking) functions
@janepohorecka hi i think this happens because the elements are on the same "layer" and won't overlap. Try setting the z-index via css so the menu can go over the title
Greg D
@mosaic-greg
Dec 10 2016 05:34
@lyndxe that sounds ok. You can host images here for your tribute https://postimage.org/
@jacobus-brogly is this like a vampire thing ?
jayisray
@jayisray
Dec 10 2016 05:38
Hey guys I need help with my tribute page. http://attractive-porter.surge.sh/
I want to make it responsive to browser resize.
But I’m not really sure how to go about this.
I want the site to always look like how it looks when it is full screen.
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 05:43
Good Morning! Hello World! :)
Uzair Ali
@uajkhan
Dec 10 2016 05:45
Guys I need some help
http://codepen.io/uajkhan/pen/rWKXVZ?editors=1100
in this pen I am going for a responsive layout but the problem is the place holder boxes in images tend to get smaller in size on mobile devices and I want that left and right padding are turned off at 524px so I added a media query but it doesn't seem to work ?
Greg D
@mosaic-greg
Dec 10 2016 05:54
@stephepush put them inside another div with fixed positioning maybe?
Uzair Ali
@uajkhan
Dec 10 2016 06:25
Would anyone help ?
Harikrishnan
@krharikrishnan
Dec 10 2016 07:08
![alt](http://discourse-user-assets.s3.amazonaws.com/original/3X/9/2/92ddf3e2b769b5e87a8cc63ca9f88c4e5ff99547.png)
jayisray
@jayisray
Dec 10 2016 07:28
FrontEnd Question: Is it possible to have both parallax scrolling & a position fixed effect like Stack Overflow?
Stephen
@stephepush
Dec 10 2016 07:29
@mosaic-greg Will try, thanks
CamperBot
@camperbot
Dec 10 2016 07:29
stephepush sends brownie points to @mosaic-greg :sparkles: :thumbsup: :sparkles:
:cookie: 414 | @mosaic-greg |http://www.freecodecamp.com/mosaic-greg
jayisray
@jayisray
Dec 10 2016 07:39
FrontEnd Question: Is it possible to have both parallax scrolling & a position fixed effect like Stack Overflow?
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 07:54
if stack overflow did that, it means that is possible
Uzair Ali
@uajkhan
Dec 10 2016 08:00
Would anyone help ?
Brian
@BrianCodes33
Dec 10 2016 08:02
@uajkhan whats up
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 08:03
@uajkhan ?+
Uzair Ali
@uajkhan
Dec 10 2016 08:04
@BrianCodes33 @NitinNair89 I am going for a responsive layout but the problem is the place holder boxes in images tend to get smaller in size on mobile devices and I want that left and right padding are turned off at 524px so I added a media query but it doesn't seem to work ?
here's the pen
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 08:06
where's your media query for padding?
Uzair Ali
@uajkhan
Dec 10 2016 08:07
@NitinNair89 I deleted it when it did'nt work
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 08:08
Didn't quite get this - " problem is the place holder boxes in images tend to get smaller in size on mobile devices "
Uzair Ali
@uajkhan
Dec 10 2016 08:10
@NitinNair89 well instead of placeholder images I made boxes
and when I check it on dev tools and make the width smaller the boxes get less and less wide because of padding and margin
I want that padding to go away afyer 524px
after*
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 08:11
i don't see boxes changing its width when i resize your codepen
Uzair Ali
@uajkhan
Dec 10 2016 08:11
do it in dev tools and resize to iphone's width @NitinNair89
@BrianCodes33 ? @NitinNair89 ??
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 08:17
Try this:
@media only screen and (max-width: 524px){
    .fixed-size {
        /* your code here */
    }
}
Uzair Ali
@uajkhan
Dec 10 2016 08:18
tried exactly that @NitinNair89
now I fixed it by just removing the margins and padding
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 08:19
ok
Tanmoy Sarkar
@Tanmoy-Sarkar
Dec 10 2016 08:21
hey guys i am in the tribute page....i added the photo but how can i add the caption ?
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 08:28
figcaption tag
Naudeep
@Naudeep
Dec 10 2016 08:57
i am lost confused.
i have this second challenge to make a portfolia page
i don't know what to do, where to start
any help!!!!
grantknaver
@grantknaver
Dec 10 2016 09:23
anyone up
ionut
@ionutinz
Dec 10 2016 09:50
Hey EVERYONE :)
Sorin Ruse
@sorinr
Dec 10 2016 10:03
@ionutinz @grantknaver hi there
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 10:24
hi
Shivank Sharma
@shivanksharma91
Dec 10 2016 11:18
@NitinNair89 hi
@Naudeep start by making a layout on a piece of paper of how you want your page to look, then divide each segments and start writing html.
İnci Qasımova
@inci-august
Dec 10 2016 11:37

Hi everyone. I'm trying to build Weather App. Here's my JavaScript.

// Prepend https:// to codepen url in order for navigator.geolocation to work

$(document).ready(function() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      var lat = position.coords.latitude;
      var lon = position.coords.longitude;
      var url = "api.openweathermap.org/data/2.5/weather?lat=" +? lat +"&lon=" + lon + "&APPID=ab09a588e8ad08a884b31f34757d6492";
      $.ajax({
        type: 'GET',
        url: url,
        success: function(data) {
          var country = data.sys.country;
          var weatherDescription = data.weather[0].description;
          var icon = data.weather[0].icon;
          var celsius = data.main.temp - 273.15;
          var fahrenheit = celsius * 9/5 + 32;
          $(".info").html("<p>" + country + "</p><p>" + weatherDescription + "<span>" + icon + "</span></p><p class='celsius'>" + celsius + "</p><p class='fahrenheit'>" + fahrenheit + "</p>");
        }
      });
    });
  }
});

Weather info won't show. I've checked console. It says "Failed to load resource: the server responded with a status of 404 ()". I can't figure out where the problem is. Can you help me?

Sorin Ruse
@sorinr
Dec 10 2016 11:39
@inci-august waiting for the js code :)
@inci-august its not going to work. coz openweather api needs http and for geolocation you should use https. not sure if its still working the crossorigin.me proxy for that. what i mean is to prepend url like "https://crossorigin.me/http://api.openweather...."
Sorin Ruse
@sorinr
Dec 10 2016 11:44
@inci-august also I would add to the ajax call: dataType: 'json' or 'jsonp',
İnci Qasımova
@inci-august
Dec 10 2016 11:45
@sorinr Thank you so much for your help. Now I know where the problem is. Maybe I'll use something else for detecting geolocation that don't need https
CamperBot
@camperbot
Dec 10 2016 11:45
inci-august sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 923 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Dec 10 2016 11:48
@inci-august you can go for some ip location api. that usually works over http. the downturn for this is the fact that for users that have dynamic ips it may return a wrong location. if you still wanna use geolocation there is another api called apixu that have also free plan that works on both http and https
İnci Qasımova
@inci-august
Dec 10 2016 11:53
@sorinr I didn't even look for another weather api since this one is recommended by FCC. But maybe I'll try apixu. Thanks again :+1:
CamperBot
@camperbot
Dec 10 2016 11:53
inci-august sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: inci-august already gave sorinr points
Sorin Ruse
@sorinr
Dec 10 2016 11:54
@inci-august they say you can use any api, any library. there is no problem. that was just an example from FCC. you have just to meet the user stories
ERWIN JOHN T. CARPIO, MD, FPCR
@RadEdje
Dec 10 2016 12:02
Hi, I'm done with front end... was about to submit for the 5 min last step certificate then I realized by old twich app stopped working? I checked the forums... it seems twitch now wants a client Id.... I followed instructions but couldn't seem to get one.... any ideas would be most appreciated thanks! here's the link... https://blog.twitch.tv/client-id-required-for-kraken-api-calls-afbb8e95f843#.l8vbhnwsj
kenobijr
@kenobijr
Dec 10 2016 12:04

Hey Ho! I got problems with my twitch viewer :( I created a JS Document Fragment and appended all channel list elements to it. But appending the document fragment to my main container at the end does not work. I also logged the doc fragment to my console, and it looks fine! Also, there´s no error thrown to my console.
Anybody got an idea what the problem is? That would be very great! :)

Here´s my pen:

http://codepen.io/kenobijr/pen/VmBxeo

Sorin Ruse
@sorinr
Dec 10 2016 12:05
@inci-august one more tip. if you scarred that you will exceed the free quota you can do this way: 1st disable the enabled of auto updating preview in pen->settings->behaviour; 2nd make some test calls to the api until you get a the response you want from the api; 3rd grab the json response in the devtools and assign it to a var response = copy paste the grabbed json; 4th work with that var response until you are satisfied with the design of your app then switch back to direct api calls
ERWIN JOHN T. CARPIO, MD, FPCR
@RadEdje
Dec 10 2016 12:09
@kenobijr could your problem be the same as mine? I don't think you have a client ID....
twitch seems to have updated a lot... even it's api is now version 5 i believe..
actually I have issues sharing a twitch api id? on codepen.... can we just leave the project as is?
kenobijr
@kenobijr
Dec 10 2016 12:12
@RadEdje No, the problem is not my API call. I updated it and it works fine. U can copy the URL in my Code and use it - i googled some time to solve this problem ;)
all the infos of the channels are fetched succesfully - but appending the doc fragment just doesn´t work - and there´s no error thrown
Sorin Ruse
@sorinr
Dec 10 2016 12:19
@kenobijr i'm not using that url but i have a client id and the twitch api works as expected. here mine: twitch
kenobijr
@kenobijr
Dec 10 2016 12:23
@sorinr Nice work, Sir ;) I just want mine to work that way, too ;)
Adi2Point0
@Adi2Point0
Dec 10 2016 12:24

@kenobijr

@sorinr Nice work, Sir ;) I just want mine to work that way, too ;)

Use the force Obi-Wan!

kenobijr
@kenobijr
Dec 10 2016 12:26
Lol! I tried several hours, but it didn´t work :)
Sorin Ruse
@sorinr
Dec 10 2016 12:27
maybe the force is weak now but as you learn you will manage to use it :)
ERWIN JOHN T. CARPIO, MD, FPCR
@RadEdje
Dec 10 2016 12:29
@sorinr wow! I plugged in your ID and it works again... how did you get it? I don't get any options for a client id at the twitch settings. :-(
arshel
@arshel
Dec 10 2016 12:30
how do i make my <li> element come next to my text
Sorin Ruse
@sorinr
Dec 10 2016 12:31
@RadEdje read here: https://dev.twitch.tv/docs/authentication/ you have to register your app but its free
kenobijr
@kenobijr
Dec 10 2016 12:31
@sorinr I hoped so! I learned a lot, made all my advanced frontend-projects, and now i´m stuck at this twitch project :)
ERWIN JOHN T. CARPIO, MD, FPCR
@RadEdje
Dec 10 2016 12:31
@arshel you want int on the same line? maybe use <span> some text </span>
kenobijr
@kenobijr
Dec 10 2016 12:32
hey guys u can also use this URL, in that case u won´t have to register:
just try it in your browsers ;)
Sorin Ruse
@sorinr
Dec 10 2016 12:33
@kenobijr yep. that one its working too but over some months they have changed it a couple of times
kenobijr
@kenobijr
Dec 10 2016 12:34
@sorinr ur right, that´s the disadvantage of that solution
ERWIN JOHN T. CARPIO, MD, FPCR
@RadEdje
Dec 10 2016 12:44
@sorinr got it THANKS!
CamperBot
@camperbot
Dec 10 2016 12:44
radedje sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 924 | @sorinr |http://www.freecodecamp.com/sorinr
arshel
@arshel
Dec 10 2016 12:50
how do i share my codepen on here
Ken Haduch
@khaduch
Dec 10 2016 12:51
@arshel - just copy and paste the URL
how do i make my bullets come closer to my text
Ken Haduch
@khaduch
Dec 10 2016 12:55
@arshel - you should not center a bulleted list. It does not look good. Use the bootstrap grid to move the list toward the center of the screen. But keep the normal alignment
arshel
@arshel
Dec 10 2016 12:56
@khaduch thanks i will try that
CamperBot
@camperbot
Dec 10 2016 12:56
arshel sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2074 | @khaduch |http://www.freecodecamp.com/khaduch
Sorin Ruse
@sorinr
Dec 10 2016 13:01
@khaduch there is also a trick to work on a bulleted list to override that behavior. i'm trying to find it again. i don't remember how i did it for somebody else
Ken Haduch
@khaduch
Dec 10 2016 13:04
@sorinr - I think i have seen that, but I think that the jagged edge of a bulleted list just looks unkempt.
Sorin Ruse
@sorinr
Dec 10 2016 13:16
@arshel @khaduch here how i would do it:
ul{
  display: table;
  margin-left: 50%;
  transform: translate(-50%);

}
Parsa
@Parsa1009
Dec 10 2016 13:20
hello
has anyone done the portfolio Project?
Shivank Sharma
@shivanksharma91
Dec 10 2016 13:31
@Parsa1009 yes, i have , tell me how can i help you?
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 13:45
hello could someone check if this is working correctly ?? https://mr-kumar-abhishek.github.io/weather/
i don't have any geo location
arshel
@arshel
Dec 10 2016 13:49
http://codepen.io/arshel/pen/xRJjYo why did my color go away
markygan123
@markygan123
Dec 10 2016 13:51

Hi guys!

Currently working on my portfolio project. The p doesn't changes the margin and font-size, only the font-family works. Unlike the h1 and h2.

http://codepen.io/markygan123/pen/bBMmdz?editors=1100

Shivank Sharma
@shivanksharma91
Dec 10 2016 13:54
@markygan123 remove space between value ans px
lazypterodactyl
@lazypterodactyl
Dec 10 2016 13:54
Screen Shot 2016-12-10 at 10.48.23 PM.png
So I've been having some trouble with codepin lately. I don't think jquerry has been running properly. I've gotten code up and running one day, and then the next it's been broken. I noticed my quote code worked if I used http instead of https on my address bar, but I haven't been able to get my other projects working. I got my weather app working on xcode, but I couldn't get it to grab the info from the weather api. I decided to move on to the next project since I did get the weather app working not in codepin. But on the wikipedia viewer I can't even view the example code. Here is the page I get.
Shivank Sharma
@shivanksharma91
Dec 10 2016 13:55
*px
blob
@markygan123
markygan123
@markygan123
Dec 10 2016 13:56
@shivanksharma91 sheeesh.. thanks man!
CamperBot
@camperbot
Dec 10 2016 13:56
markygan123 sends brownie points to @shivanksharma91 :sparkles: :thumbsup: :sparkles:
:cookie: 149 | @shivanksharma91 |http://www.freecodecamp.com/shivanksharma91
Shivank Sharma
@shivanksharma91
Dec 10 2016 13:56
@markygan123 np
lazypterodactyl
@lazypterodactyl
Dec 10 2016 14:03
Anyone want to help me with some codepen issues?
Sorin Ruse
@sorinr
Dec 10 2016 14:06
@arshel what color?
@Mr-Kumar-Abhishek yep. for me its working
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 14:11
@sorinr anything I need to add more except IP fallback ?
mpasanen
@mpasanen
Dec 10 2016 14:12
How can I get my ul li list centered?
Sorin Ruse
@sorinr
Dec 10 2016 14:12
@Mr-Kumar-Abhishek i think not
mpasanen
@mpasanen
Dec 10 2016 14:12
text-center centers only text part of the list
Sorin Ruse
@sorinr
Dec 10 2016 14:12
@mpasanen :point_up: December 10, 2016 3:16 PM for a solution
mpasanen
@mpasanen
Dec 10 2016 14:13
@sorinr thank you!
CamperBot
@camperbot
Dec 10 2016 14:13
mpasanen sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 925 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Dec 10 2016 14:14
@mpasanen welcome.
lazypterodactyl
@lazypterodactyl
Dec 10 2016 14:22
update on my problem in case anyone was curious. I was able to find a wikipedia viewer on codepen that does work so I've been using that as a reference. I still have no idea why I can't see codecamps example project.
Sorin Ruse
@sorinr
Dec 10 2016 14:31
@lazypterodactyl the idea is to read and learn how touse an api documentation in order to use that api in a manner to suit ur needs. any api offers u some options to call it and if you call it the right way you get the right response u expect :)
lazypterodactyl
@lazypterodactyl
Dec 10 2016 14:48
@sorinr Oh, I got it working. Just not on codepen. I had to use a different editor. Codepen just would not work.
Sorin Ruse
@sorinr
Dec 10 2016 14:50
@lazypterodactyl what errors do u get on codepen?
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 14:50
apixu api is free right?
coz my weather app on codepen does not work anymore
lazypterodactyl
@lazypterodactyl
Dec 10 2016 14:51
on the codecamp wikiviewer I get this window
Screen Shot 2016-12-10 at 10.48.23 PM.png
Sorin Ruse
@sorinr
Dec 10 2016 14:51
@NitinNair89 yep and it works on http and https with a limit of 5000 calls / month
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 14:51
thanks @sorinr could you have a second eye on my weather app?
CamperBot
@camperbot
Dec 10 2016 14:51
nitinnair89 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 926 | @sorinr |http://www.freecodecamp.com/sorinr
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 14:52
i wanna know if it is the weather data or the IP address it is unable to find
Sorin Ruse
@sorinr
Dec 10 2016 14:52
@NitinNair89 resahare ur pen link
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 14:53
lazypterodactyl
@lazypterodactyl
Dec 10 2016 14:55
@NitinNair89 if it helps there are some weird errors when you use https and http vice versa. My code was working and then it randomly stopped too. I changed from using the findIP method to the geolocation one. That worked for a little bit and then it stopped working too. Eventually I Just started using a different editor for the code
Sorin Ruse
@sorinr
Dec 10 2016 14:56
@NitinNair89 load the pen over http and make the ajax call like:
 $.ajax({
    dataType: 'jsonp',
    url: "http://ip-api.com/json/?callback=?",
@NitinNair89 and it will work
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 14:57
tried
doesn't
Sorin Ruse
@sorinr
Dec 10 2016 14:58
@NitinNair89 this way? example
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 14:59
ok got it
what if i want it on https? apixy will work right?
*apixu
Sorin Ruse
@sorinr
Dec 10 2016 15:02
@NitinNair89 apixu works over https but not sure if ip location works over https. at least you can use geolocation in that case
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:04
ok let me tr
*try
c0d0er
@c0d0er
Dec 10 2016 15:16
hi, could anybody help to find why the Heading text was moved to the right when i set the title Markdown Previewer in the middle? this is my link: http://codepen.io/c0d0er/pen/aBjVpV?editors=0110
Sorin Ruse
@sorinr
Dec 10 2016 15:21
@c0d0er coz of this: h1{
text-align: center;
c0d0er
@c0d0er
Dec 10 2016 15:22
@sorinr thanks! any way to fix?
CamperBot
@camperbot
Dec 10 2016 15:22
c0d0er sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 927 | @sorinr |http://www.freecodecamp.com/sorinr
Tyler Moeller
@TylerMoeller
Dec 10 2016 15:24
@NitinNair89 You can use this IP-based location API over HTTP and HTTPS: https://ipinfo.io/json. Useful when browsers don't support geolocation or the user blocks it.
Sorin Ruse
@sorinr
Dec 10 2016 15:24
@c0d0er in what way? just remove the class text-center :)
c0d0er
@c0d0er
Dec 10 2016 15:24
@sorinr but i still want to set h1 in the center
Tyler Moeller
@TylerMoeller
Dec 10 2016 15:24
And one more alternative :) https://freegeoip.net/json/
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:24
will look into it, thanks @TylerMoeller
CamperBot
@camperbot
Dec 10 2016 15:24
nitinnair89 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1130 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
lazypterodactyl
@lazypterodactyl
Dec 10 2016 15:31
thanks @sorinr
CamperBot
@camperbot
Dec 10 2016 15:31
lazypterodactyl sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 928 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Dec 10 2016 15:34

@c0d0er try:

#right{
  background: #111;
    // margin-right: -5%;
}

to see it is centered

markygan123
@markygan123
Dec 10 2016 15:36

Need help guys. I set my h1 and h2 positions as fixed, but they now they're messed up

http://codepen.io/markygan123/pen/bBMmdz?editors=1100

c0d0er
@c0d0er
Dec 10 2016 15:38
@sorinr but the heading text still in the middle, and it should be in the left side,
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:39
@markygan123 Your html is wrong. Adding a <span> inside a heading tag is incorrect
Sorin Ruse
@sorinr
Dec 10 2016 15:39
@c0d0er you just said you want it centered :point_up: December 10, 2016 5:24 PM
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:40
@markygan123 just fix your margin-* css code for h1 and h2
markygan123
@markygan123
Dec 10 2016 15:40
@NitinNair89 i see. i did this so that i can put my heading along with the buttons
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:40
wrap them in some div
c0d0er
@c0d0er
Dec 10 2016 15:40
@sorinr i want h1 title centered, and heading move back to normal in the left side
@NitinNair89 thanks
CamperBot
@camperbot
Dec 10 2016 15:41
c0d0er sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 362 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:41
wrap them in some div
@markygan123
@c0d0er are you saying you want "mardown ..." center and "heading" text to the left?
c0d0er
@c0d0er
Dec 10 2016 15:42
@NitinNair89 yes
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:42
@markygan123 No! Please refer bootstrap documentation for templates.
@c0d0er So give that title some ID and CSS styles accordingly. You have two <h1> in your code, if you notice. That's the reason your CSS is applied to both <h1>
c0d0er
@c0d0er
Dec 10 2016 15:44
i only have 1 h1 @NitinNair89
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:44
@c0d0er
#title{
    text-align: center;
    margin-bottom: 1%;
}
You have 2 <h1> @c0d0er One is your markdown text, another is the one you are generating through your code.
c0d0er
@c0d0er
Dec 10 2016 15:45
i dont have this title id @NitinNair89
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:45
i am saying, add it
Tyler Moeller
@TylerMoeller
Dec 10 2016 15:45
@markygan123 You may want to start here: http://getbootstrap.com/components/#nav. Check out Pills and Navbars - they provide some sample code you can use as a baseline for getting started with the top links of your portfolio
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:45
<h1 id="title"> Markdown Previewer</h1>
@c0d0er
<div dangerouslySetInnerHTML={this.loadMark()}></div>
This is creating the other <h1> along with every other tags. That's how the sub headings, horizontal rules, etc. appear
c0d0er
@c0d0er
Dec 10 2016 15:47
@NitinNair89 weired, i didnt add this title id, where did you find it
markygan123
@markygan123
Dec 10 2016 15:47
@TylerMoeller thanks man!
CamperBot
@camperbot
Dec 10 2016 15:47
markygan123 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1131 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
markygan123
@markygan123
Dec 10 2016 15:47
@NitinNair89 thanks
CamperBot
@camperbot
Dec 10 2016 15:47
markygan123 sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:cookie: 363 | @nitinnair89 |http://www.freecodecamp.com/nitinnair89
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:48

@c0d0er I am saying, add some ID to your h1 and give it style through CSS.

h1{
    text-align: center;
    margin-bottom: 1%;
}

The above style gets applied to all <h1>. Got my point?

Robert Purcea
@RobertPurcea
Dec 10 2016 15:48
In the simon game project, I am supposed to use border-radius to draw the 4 coloured buttons or how should I do it?
I am reffering to fcc's example
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:48
why do you feel only your main heading gets aligned to center and not the sub-heading @c0d0er ? :smiley:
Tyler Moeller
@TylerMoeller
Dec 10 2016 15:49
@c0d0er I'd recommend against using CSS on the markdown results - let the user specify if they want the text centered in their own markdown. You're just providing a preview of what they enter.
Sorin Ruse
@sorinr
Dec 10 2016 15:49
@TylerMoeller :+1:
c0d0er
@c0d0er
Dec 10 2016 15:49
@NitinNair89 you are very correct, just checked elements, thanks!
CamperBot
@camperbot
Dec 10 2016 15:49
c0d0er sends brownie points to @nitinnair89 :sparkles: :thumbsup: :sparkles:
:warning: c0d0er already gave nitinnair89 points
c0d0er
@c0d0er
Dec 10 2016 15:49
@TylerMoeller thanks!
CamperBot
@camperbot
Dec 10 2016 15:49
c0d0er sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1132 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:51
Glad i could be of help! :)
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 15:53
when you are code pairing with someone and you discover a security breach of the other's website .... :/
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 15:53
then you step in and help fix it
Sorin Ruse
@sorinr
Dec 10 2016 15:55
@Robertb4 you can use whatever technique you want to design your simon game
Nitin Chandran Nair
@NitinNair89
Dec 10 2016 16:06
is there any website or api that renders great background pics depending on the network connection of the client?
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 16:06
yes sure.... but my point was crackers are not tar-getting any any corporates these days but individuals
targeting *
c0d0er
@c0d0er
Dec 10 2016 16:09
this is my markdown previewer, any idea to make better? http://codepen.io/c0d0er/pen/aBjVpV
Tyler Moeller
@TylerMoeller
Dec 10 2016 16:11
@c0d0er Your text area and previewer are overlapping at 1000px wide. Add this markdown to test
![alt text](https://placehold.it/900x320/B3DCE6?text=Blue Image)
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 16:14
i am checking my system too if anyone is an expert at this do suggest https://gist.github.com/Mr-Kumar-Abhishek/c27c0851713082088fb6a6562bb8701d
oops....
Tyler Moeller
@TylerMoeller
Dec 10 2016 16:14
Also, you may want to convert the rest to ES6 if you're using const, for example, change this loadMark: function () to loadMark ()
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 16:15
forgot its gitter
markygan123
@markygan123
Dec 10 2016 16:15
Should all elements be wrapped in a <div> tag?
Sorin Ruse
@sorinr
Dec 10 2016 16:17
@markygan123 div its just a way to group elements that belong together and have a conceptual meaning
Sorin Ruse
@sorinr
Dec 10 2016 16:22
@markygan123 it is widely used because it has no semantic meaning respect to HTML5. its just a content divider
markygan123
@markygan123
Dec 10 2016 16:25
i see.. i was confused by it's usage when it was introduced on the tutorial. thanks!
Sorin Ruse
@sorinr
Dec 10 2016 16:31
@markygan123 welcome
May Kittens Devour Your Soul
@diomed
Dec 10 2016 16:43
anyone here using Heroku?
Sorin Ruse
@sorinr
Dec 10 2016 16:45
not me
Ojas Mehta
@dekhLunga
Dec 10 2016 16:47
hey
I cant design the web portfolio
putting various scrollable objects in same page
single page web portfolio
can someone help?
Eric Scott
@Escotty
Dec 10 2016 16:49
Hey y'all. How should I submit my link from codepen on FCC?
With the default address that's in my browser, or is there a special link I can find?
Ojas Mehta
@dekhLunga
Dec 10 2016 16:50
the address in your addressbar when you are on your codepen
Sorin Ruse
@sorinr
Dec 10 2016 16:50
@Escotty yep. the default url
Ojas Mehta
@dekhLunga
Dec 10 2016 16:50
thats the link
hey sorin
have you done that portfolio thing?
I am stuck there
Sorin Ruse
@sorinr
Dec 10 2016 16:52
@dekhLunga yep. some time ago. why do u think your stuck in there?
Ojas Mehta
@dekhLunga
Dec 10 2016 16:52
@sorinr
Uros Tadic
@urketadic
Dec 10 2016 16:52
How can i include this https://github.com/etienne-martin/mapify in my own project on codepen. I dont want to download it, i just want to add a link
Ojas Mehta
@dekhLunga
Dec 10 2016 16:52
I dont think I have enough skills to do it in this position
like adding that navbar thing and scroll buttons which links up different parts of the same page
:/
Eric Scott
@Escotty
Dec 10 2016 16:53
thanks @dekhLunga
CamperBot
@camperbot
Dec 10 2016 16:53
escotty sends brownie points to @dekhlunga :sparkles: :thumbsup: :sparkles:
:cookie: 121 | @dekhlunga |http://www.freecodecamp.com/dekhlunga
Eric Scott
@Escotty
Dec 10 2016 16:54
thanks @sorinr
CamperBot
@camperbot
Dec 10 2016 16:54
escotty sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 929 | @sorinr |http://www.freecodecamp.com/sorinr
Ojas Mehta
@dekhLunga
Dec 10 2016 16:54
Thnx mate:)
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Dec 10 2016 17:03
@urketadic You can select a file and then click on "Raw". Then just copy this link. For example: <script src="https://raw.githubusercontent.com/etienne-martin/mapify/master/src/mapify.js" type="text/javascript">
Eric Scott
@Escotty
Dec 10 2016 17:07
Does somebody grade these projects?
I couldn't watch the video because I was at work, but I totally added css to the tribute page. whoops.
Sam Griffen
@ssgriffen
Dec 10 2016 17:26
Can anyone help with why my getJSON data.name request isn't working?https://codepen.io/ssgriffen/pen/bBjoqm?editors=1010
kirbyedy
@kirbyedy
Dec 10 2016 17:31
@ssgriffen Uncaught SyntaxError: Unexpected token & in your console.log
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Dec 10 2016 17:32
Instead of returning a json
Sorin Ruse
@sorinr
Dec 10 2016 17:33
@ssgriffen already sent an answer on help channel
Sam Griffen
@ssgriffen
Dec 10 2016 17:33
@sorinr ya i blast all of them for max chancce at getting responses
aRtoo
@artoodeeto
Dec 10 2016 17:33
hallooo guys. need help. i have navigation with drop down. the drop and the navigation links are separated. can someone help me about this issue. codepen here: http://codepen.io/artoo/pen/ZBbYyM?editors=1100
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Dec 10 2016 17:37
@artoodeeto at your .main_drop replace float: rightwith display: inline;
aRtoo
@artoodeeto
Dec 10 2016 17:38
@Otto-AA ill try it sir. thank you
CamperBot
@camperbot
Dec 10 2016 17:38
artoodeeto sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:cookie: 380 | @otto-aa |http://www.freecodecamp.com/otto-aa
aRtoo
@artoodeeto
Dec 10 2016 17:40
@Otto-AA it works sir. but the drop down is moved to the right.
Ghost
@ghost~57b1df1e40f3a6eec05f92a8
Dec 10 2016 17:41
@artoodeeto Have you tried to give the .main_drop position: relativeand then do something with right or left on the drop_down?
kirbyedy
@kirbyedy
Dec 10 2016 17:41
@artoodeeto its because you have text-align: center; on .nav
aRtoo
@artoodeeto
Dec 10 2016 17:42
@Otto-AA yea. done that but as im changing the monitor size itll move.
@kirbyedy what do you mean?
kirbyedy
@kirbyedy
Dec 10 2016 17:43
Screen Shot 2016-12-10 at 19.43.13.png
aRtoo
@artoodeeto
Dec 10 2016 17:44
@kirbyedy thank you sir. ill try it.
CamperBot
@camperbot
Dec 10 2016 17:44
artoodeeto sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1643 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
Stefaan Walleghem
@lawfets
Dec 10 2016 17:46
ok I have a question, I 'm trying out the geolocation of the navigator on my open weather map api. I'm not yet at the point where I want to solve the https problem so I coded everything in brackets and I uploaded it to my codepen for you to see my code
now the navigator code works when pushing the button celsius or fahrenheit but it doesn not work on document ready although it's placed in document ready at the beginning
aRtoo
@artoodeeto
Dec 10 2016 17:47
@artoodeeto sorry sir but doesnt work
@kirbyedy sorry sir but doesnt work.
@kirbyedy tried it then everything goes to the left.
Stefaan Walleghem
@lawfets
Dec 10 2016 17:48
I even placed it before the document ready but it doesn't load in time for some reason
kirbyedy
@kirbyedy
Dec 10 2016 17:48
@artoodeeto so add an id for your submenu and add atribute you want
Stefaan Walleghem
@lawfets
Dec 10 2016 17:49
do any of you people know why this happens, is there some kind of order of execution
aRtoo
@artoodeeto
Dec 10 2016 17:50
@kirbyedy already did sir. I even position it as a relative
kirbyedy
@kirbyedy
Dec 10 2016 17:51
@lawfets did you see errors in your console ?
@artoodeeto is this what you want ?
Screen Shot 2016-12-10 at 19.52.06.png
Stefaan Walleghem
@lawfets
Dec 10 2016 17:52
@kirbyedy, no I coded it in brackets and the browser console doesn't show any problem except for the fact that the first lat and long are undefined, which means that the geolocation isn't correct, but when I used the buttons, it seems that geolocation is done anyhow, it just doesn't show up in my document ready code
aRtoo
@artoodeeto
Dec 10 2016 17:53
@kirbyedy yes sir. ill try addigng this
Robert Purcea
@RobertPurcea
Dec 10 2016 17:53
I have a div inside an absolute positioned element, and if I set a paragraph inside it, the text won't appear, but if I set a button it's all right. Please hava a look I highlighted the parts that cause problems
kirbyedy
@kirbyedy
Dec 10 2016 17:53
@lawfets this is what I see
Screen Shot 2016-12-10 at 19.53.12.png
Stefaan Walleghem
@lawfets
Dec 10 2016 17:54
@kirbyedy I know i'll get errors in codepen, that's not my question, I just made it work on my homepage, check http://www.pc-freak.be/weather.html
here, I used my city as location and it works just fine
but after I change to code to use the navigator.location it only works after I push a button and not when the screen loads
kirbyedy
@kirbyedy
Dec 10 2016 17:55
@lawfets codepen gives you this errors
hang on\
Stefaan Walleghem
@lawfets
Dec 10 2016 17:56
@kirbyedy so then I changed the code to this above
and the geolocation is loading but seemingly too late
$(document).ready(function() {
     var lat;
     var long;

     navigator.geolocation.getCurrentPosition(function(position) {
        lat = position.coords.latitude;
        long = position.coords.longitude;});


    // http://api.openweathermap.org/data/2.5/weather?weather?lat={lat}&lon={lon}... 
    $.getJSON("http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon="+ long + "&units=metric&lang=en&appid=42e91b77a8d770fbed2e4371c4c84b1c",function(json) {

        var html = "";
kirbyedy
@kirbyedy
Dec 10 2016 17:58
Screen Shot 2016-12-10 at 19.57.45.png
when I comment out all your code except geolocation this is what I get
undefined
Sorin Ruse
@sorinr
Dec 10 2016 17:58
@Robertb4 what about adding to:
#controls{
   display: flex;
   border-radius: 50%;
kirbyedy
@kirbyedy
Dec 10 2016 18:00
if (navigator.geolocation) {

    navigator.geolocation.getCurrentPosition(function(location) {
      latitude = location.coords.latitude;
      longitude = location.coords.longitude;
      console.log(latitude + " " + longitude);
    }
}
try this
Stefaan Walleghem
@lawfets
Dec 10 2016 18:00
@kirbyedy , yes, but if I push one of the buttons, the navigator code is loaded
@kirbyedy I know what you mean, my only question is, why is it undefined but if I push the button, it's defined
kirbyedy
@kirbyedy
Dec 10 2016 18:01
well the only idea I have is to put the api call inside that geolocation call
Stefaan Walleghem
@lawfets
Dec 10 2016 18:02
@kirbyedy oh, that could be a good idea, I'll try something out, thx already for the info
CamperBot
@camperbot
Dec 10 2016 18:02
lawfets sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1644 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
kirbyedy
@kirbyedy
Dec 10 2016 18:04
@lawfets src="javascripts/weather.js" this points to the non existent file in your head
that sounded weird... I mean link is incorrect :D
aRtoo
@artoodeeto
Dec 10 2016 18:06
@kirbyedy thank you sir. ill figure this out.
CamperBot
@camperbot
Dec 10 2016 18:06
artoodeeto sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:warning: artoodeeto already gave kirbyedy points
soccer1996
@soccer1996
Dec 10 2016 18:06
hey does anyone know is the tribute page the last lesson on freecodecamp?
Stefaan Walleghem
@lawfets
Dec 10 2016 18:07
@kirbyedy don't mind those mistakes, that's because I used an external js file with brackets and I just uploaded my code to codepen so I could link it to the chat easily
@kirbyedy you're bound to find even more mistakes
kirbyedy
@kirbyedy
Dec 10 2016 18:08
:D
Stefaan Walleghem
@lawfets
Dec 10 2016 18:08
@soccer1996 the last lesson??? it's just the beginning
@kirbyedy is there a way to force a function to wait until another function has finished and has output?
kirbyedy
@kirbyedy
Dec 10 2016 18:09
maybe with setTimeout ?
Stefaan Walleghem
@lawfets
Dec 10 2016 18:09
@kirbyedy ok thx
CamperBot
@camperbot
Dec 10 2016 18:09
lawfets sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:warning: lawfets already gave kirbyedy points
Uzair Ali
@uajkhan
Dec 10 2016 18:11
how to make a link to not change it's color when i hover and neither have a underline ?
kirbyedy
@kirbyedy
Dec 10 2016 18:11
@lawfets there must be a better way actually but I dont know how is it called
Uzair Ali
@uajkhan
Dec 10 2016 18:12
nevermind
Stefaan Walleghem
@lawfets
Dec 10 2016 18:16
@kirbyedy anyhow, just coded in on brackets and it works
kirbyedy
@kirbyedy
Dec 10 2016 18:16
well codepen is a bit crappy...
Stefaan Walleghem
@lawfets
Dec 10 2016 18:16
seems like the loading of the navigator function takes time
kirbyedy
@kirbyedy
Dec 10 2016 18:17
you can submit your project as it is
on your domain
Stefaan Walleghem
@lawfets
Dec 10 2016 18:17
@kirbyedy don't tell me about it, now I have to adapt everything to get it on codepen, and then I'll have to figure out the https problem
kirbyedy
@kirbyedy
Dec 10 2016 18:17
does not have to be on codepen
Stefaan Walleghem
@lawfets
Dec 10 2016 18:17
@kirbyedy did not know that
brb
Uzair Ali
@uajkhan
Dec 10 2016 18:21
I want to list my listed items vertically instead of horizontally
can someone tell me how to do that
Sorin Ruse
@sorinr
Dec 10 2016 18:22
@uajkhan you can try ul{display:inline;}. sorry that was for horizontal. for vert do nothing. its the normal behaviour
Uzair Ali
@uajkhan
Dec 10 2016 18:24
@sorinr but that worked and it was horizontal at first
Sorin Ruse
@sorinr
Dec 10 2016 18:28
@uajkhan when u define a ul li list normally its column type(block), so each li is on each line. when you say ul{display: inline;} it means they go horizontal each li one after another on the same line
Uzair Ali
@uajkhan
Dec 10 2016 18:29
but the opposite happened to me @sorinr
Sorin Ruse
@sorinr
Dec 10 2016 18:31
@uajkhan what list do you want it to be vertically?
Marianissimus
@Marianissimus
Dec 10 2016 18:31
@uajkhan why didn't you use the bootstrap columns for your footer, as well?
soccer1996
@soccer1996
Dec 10 2016 18:32
@lawfets its because i finished it and clicked completed but it wont send me to another project
Uzair Ali
@uajkhan
Dec 10 2016 18:33
@sorinr the one with the class foot ul
@Marianissimus well that even I don't know :P
Marianissimus
@Marianissimus
Dec 10 2016 18:35
@uajkhan i was curious, i thought it was a trick or something :)
Uzair Ali
@uajkhan
Dec 10 2016 18:36
@Marianissimus well I wanted the 3 columns to drop into a single one when the screen becomes smaller so if you consider it a trick then it is one :P
Marianissimus
@Marianissimus
Dec 10 2016 18:37
col-sm-4, ok:)
Uzair Ali
@uajkhan
Dec 10 2016 18:38
@Marianissimus yeah but where's the fun in that ? :D
Marianissimus
@Marianissimus
Dec 10 2016 18:38
@uajkhan :)) This one was goood! I'll take a note of it
Uzair Ali
@uajkhan
Dec 10 2016 18:39
@Marianissimus well the placeholder boxes are better optimized if you take a look at it
Marianissimus
@Marianissimus
Dec 10 2016 18:40
@uajkhan as you say, now, just for fun, change that class from footish to fetish:)
Uzair Ali
@uajkhan
Dec 10 2016 18:40
@Marianissimus what do yoou think foot stuff stands for :D
foot-stuff :3
Zaurbek Zhakupov
@zzhakupov
Dec 10 2016 19:34
Hello guys, can I have some feedback on my leaderboards react challenge? http://codepen.io/Zooll/pen/dOjXBE
Serg
@Serg911
Dec 10 2016 19:43
@khaduch; thank you.
CamperBot
@camperbot
Dec 10 2016 19:43
serg911 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2075 | @khaduch |http://www.freecodecamp.com/khaduch
Sorin Ruse
@sorinr
Dec 10 2016 19:43
@Zooll8 if you can add some sorting on columns will be quite nice :)
Zaurbek Zhakupov
@zzhakupov
Dec 10 2016 19:45
@sorinr Can you explain what is "add some sorting on columns". English isn't my native, so I think I dont' understand what do you mean
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 19:47
hello could someone help me with my weather app ??
hold ... have to relog
hello could someone help me with my weather app ??
Sorin Ruse
@sorinr
Dec 10 2016 19:51
@Zooll8 like sorting member name column alphabetically, or the other columns by ascending or descending numbers
Jacob
@jdc101214
Dec 10 2016 19:52
Hey guys. Im trying to complete this challenge but it isnt working. Any ideas why?
Code:
function palindrome(str) {
// Good luck!

str.replace(/[^!@#$%&*()" "_-]/gi, '');
str.toLowerCase();
var strS = str;
var strA = str.split("");
var strF = strA.reverse();
var strV = strF.join("");
if(strV === strS){
return true;
} else {
return false;
} 

}
palindrome("racecar");
Zaurbek Zhakupov
@zzhakupov
Dec 10 2016 19:52
@sorinr Ok, I"ll do alphabetical order now
Tyler Moeller
@TylerMoeller
Dec 10 2016 20:02
@jdc101214 It works for racecar but you'll have to modify your regular expression to make it work for the other test cases
Zachary
@Bazill03
Dec 10 2016 20:04
Working on the twitchTV app. I copied and pasted the getJSON request that they provided and I'm getting a 400 error. Anyone else run into this?
Jacob
@jdc101214
Dec 10 2016 20:04
@TylerMoeller I understand it works for racecar. But if I put a space in between them like 'race car' it dosent work like I need it to.
Tyler Moeller
@TylerMoeller
Dec 10 2016 20:05
@jdc101214 From a quick look, it seems you are trying to account for spaces in your regex with " "?
Jacob
@jdc101214
Dec 10 2016 20:05
yes. Is that not the right way?
Tyler Moeller
@TylerMoeller
Dec 10 2016 20:05
Check out the cheat sheet on the right hand side of this page for dealing with spaces: http://www.regexpal.com/
Should help get you on the right track
Jacob
@jdc101214
Dec 10 2016 20:08
ok
@TylerMoeller It seems like I can only use one regulator for the command. Is there a way to do multiple regulators.
Jacob
@jdc101214
Dec 10 2016 20:13
ie: . * \
.
"."
Tyler Moeller
@TylerMoeller
Dec 10 2016 20:13
@jdc101214 You only need to use one regex, you can separate expressions with the vertical bar |
Jacob
@jdc101214
Dec 10 2016 20:13
ok
Tyler Moeller
@TylerMoeller
Dec 10 2016 20:14
e.g: (this|that)
this or that
Jacob
@jdc101214
Dec 10 2016 20:14
ok
Sorin Ruse
@sorinr
Dec 10 2016 20:15
@jdc101214 and you can concatenate functions like: `str = str.split("").reverse().join("") etc instead of defining vars that takes memory space for nothing
Jacob
@jdc101214
Dec 10 2016 20:15
ok
@TylerMoeller, @sorinr How would I replace () commas and periods?
Tyler Moeller
@TylerMoeller
Dec 10 2016 20:20
@jdc101214 You can escape special characters with a backslash \ - there's also the \W
Jacob
@jdc101214
Dec 10 2016 20:21
@TylerMoeller Can you give an example?
Tyler Moeller
@TylerMoeller
Dec 10 2016 20:22
Visit http://www.regexpal.com/ and try out /\W/gi and enter race,car in the text box below
and then try again with /\,/gi
Sorin Ruse
@sorinr
Dec 10 2016 20:24
@jdc101214 i would try to google it like escaping special characters. hope you don't want us to give u the full solution
Jacob
@jdc101214
Dec 10 2016 20:24
@sorinr Not expecting the full solution.
THANK YOU SO MUCH!! @TylerMoeller @sorinr
CamperBot
@camperbot
Dec 10 2016 20:25
jdc101214 sends brownie points to @tylermoeller and @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 932 | @sorinr |http://www.freecodecamp.com/sorinr
:star2: 1133 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Sorin Ruse
@sorinr
Dec 10 2016 20:27
@jdc101214 @TylerMoeller has pointed u in a good direction. i have told u about how to nest functions. now your job its to put everything head to head to make it working. i'm sure u can do it
Jacob
@jdc101214
Dec 10 2016 20:34
@sorinr I finished the project already. I was waiting for it to work before saying thank you.
CamperBot
@camperbot
Dec 10 2016 20:34
jdc101214 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:warning: jdc101214 already gave sorinr points
Sorin Ruse
@sorinr
Dec 10 2016 20:34
@jdc101214 :+1:
@jdc101214 . but part of the job was made by @TylerMoeller
Tyler Moeller
@TylerMoeller
Dec 10 2016 20:38
Happy to help any time - regexpal is a good tool with a useful cheat sheet for regular expressions
Jacob
@jdc101214
Dec 10 2016 20:40

Im just beginning on this code challenge and its saying that my toLowerCase is wrong?


function titleCase(str) {
  var strA = str.split(" ");
  var strB = strA.toLowerCase();
  return str;
}

titleCase("I'm a little tea pot");

Why is it saying that?

Sorin Ruse
@sorinr
Dec 10 2016 20:40
@TylerMoeller i personally hate regex
Tyler Moeller
@TylerMoeller
Dec 10 2016 20:42
@sorinr lol, kind of like writing bash or batch files
Crazy syntax
Sorin Ruse
@sorinr
Dec 10 2016 20:42
@TylerMoeller yeah.
@jdc101214 it seems u haven't learned anyting from the previous one. what do u think str var will contain when you return it?
Jacob
@jdc101214
Dec 10 2016 20:44
@sorinr I figured it out.
I need to lower case it before it gets put in an array
@sorinr How could I split each word in a separate array, in an array(nested arrays)?
function titleCase(str) {
  var strA = str.toLowerCase();
  var strB = strA.split(" ");
  return "";
}

titleCase("I'm a little tea pot");
Tyler Moeller
@TylerMoeller
Dec 10 2016 20:48
@jdc101214 One thing Sorin mentioned for your last exercise that's worth noting:
// Doing this:
var strA = str.toLowerCase();
var strB = strA.split('');
var strC = strB.reverse();
var strD = strC.join('');

// Is the same as this:
var strE = str.toLowerCase().split('').reverse().join('');
Sorin Ruse
@sorinr
Dec 10 2016 20:49
@jdc101214 what is supposed to return your titleCase function when you pass to it this parameter str ="I'm a little tea pot"?
Jacob
@jdc101214
Dec 10 2016 20:52
@sorinr The function is supost to take a string, and cap the first letter of each word.
Sorin Ruse
@sorinr
Dec 10 2016 20:55
@jdc101214 so. our function should return something like: "I'm A Little Tea Pot". right?
Jacob
@jdc101214
Dec 10 2016 20:55
Correct
I thought if I separate each word into a array, I could cap the first letter of each array.
Sorin Ruse
@sorinr
Dec 10 2016 20:57
we can pass the str parameter as we wont like: "i'm A little Tea port". right?
Jacob
@jdc101214
Dec 10 2016 20:58
Im not quite sure what you mean. Like in a if statement?
@sorinr
Sorin Ruse
@sorinr
Dec 10 2016 21:01
@jdc101214 nope. the idea is whatever your str is formated when you pass it to the function, that function must takes some steps in reformatting it in order to process it and send back the expecting result
Jacob
@jdc101214
Dec 10 2016 21:02
I feel like im in a never ending while loop. thats what Im trying to do.
Brandon
@chunb
Dec 10 2016 21:02
For the Twitch API program, putting a link to freecodecamp's twitch channel in the HTML doesn't actually seem to work. The twitch channel is loaded up, but it doesn't start streaming. The example pen has this issue also. Does anyone know how to fix it? Here is my pen: http://codepen.io/bchun/pen/dpxOzB
Sorin Ruse
@sorinr
Dec 10 2016 21:04
@jdc101214 just think logically. you have a string called str. i would first make it all lowercase(i would uniformize that string) because as i said above i can pass that string in whatever case i want
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:05
could somone help me with weather app ? I can't seem to get a plugin to work ....
Jacob
@jdc101214
Dec 10 2016 21:05
This is my code as of right now
function titleCase(str) {
  var strA = str.toLowerCase().split(" ");

  return "";
}

titleCase("I'm a little tea pot");
@sorinr
Ive already done that
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:06
anyone who know git please help .
anyone who knows* git please help .
Sorin Ruse
@sorinr
Dec 10 2016 21:07
@jdc101214 your strA now is like = ["i'm","a","little","tea","port"]. right?
Jacob
@jdc101214
Dec 10 2016 21:07
yes
I want all the words in a seperate array in that array.
How do I do that?
@sorinr
Brandon
@chunb
Dec 10 2016 21:08
@TylerMoeller Really? When I open up my pen, what FCC is currently streaming pops up
@TylerMoeller It doesn't do anything on your end?
Sorin Ruse
@sorinr
Dec 10 2016 21:09
@jdc101214 why do u need that? strA its already an array coz of the split function
Jacob
@jdc101214
Dec 10 2016 21:09
So I can target the first letter of each word easier.
@sorinr
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:10
@TylerMoeller it will do ... https://github.com/Mr-Kumar-Abhishek/weather <-- see here how to clone ... clone URI https://github.com/Mr-Kumar-Abhishek/weather.git or get it from github.. in test branch
Sorin Ruse
@sorinr
Dec 10 2016 21:11
@jdc101214 just iterate the strA array and change the first letter to upprcase
Jacob
@jdc101214
Dec 10 2016 21:11
HOW WOULD I DO THAT?
@sorinr
Sorin Ruse
@sorinr
Dec 10 2016 21:11
@jdc101214 then rejoin the result and return it
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:11
@TylerMoeller the js problem is / or must be fairly simple but text fill isn't working
Tyler Moeller
@TylerMoeller
Dec 10 2016 21:11
@chunb I misunderstood the question - sorry about that.... The error was coming from the closed account Brunofin. The issue you're noticing is a known problem with Chrome. Open it in Firefox and you'll get the channel
And by "the error" I mean in your browser's dev console (Ctrl+Shift+J)
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:13
@TylerMoeller I am trying to fix this problem Mr-Kumar-Abhishek/weather#7
Sorin Ruse
@sorinr
Dec 10 2016 21:14
@jdc101214 there is a function for that in javascript for iterating an array. google search for it is a nice resource
Tyler Moeller
@TylerMoeller
Dec 10 2016 21:14
It seems you can't clone your repository with the command in your readme and you need help with that?
Brandon
@chunb
Dec 10 2016 21:15
@TylerMoeller That was on purpose. I know that the JSON call for Brunofin doesn't work. My placeholder for that streamer is "offline"
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:15
@TylerMoeller erm.... I trying to make text-fill plugin work ... but I don't know what is going wrong... maybe conceptually I am misunderstanding something
Tyler Moeller
@TylerMoeller
Dec 10 2016 21:15
@chunb Yeah, sorry for the confusion. The issue with not being able to view the channel when visiting the link is with Google Chrome. Visit the URL manually, outside of your app, and their channel won't lead either (in Google Chrome)
Brandon
@chunb
Dec 10 2016 21:17
@TylerMoeller Oh, when I put in the Twitch stream url manually, it does work. You're saying my app won't work on Chrome, but it will work on Firefox or Internet explorer?
Tyler Moeller
@TylerMoeller
Dec 10 2016 21:17
@Mr-Kumar-Abhishek I still don't understand your question - the issue you pointed me to seems to talk about long city names creating some layout issues in your app.
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:18
@TylerMoeller copy paste this in command line if you have git ... in readme instructions are given on how to use the command `git clone --recursive https://github.com/Mr-Kumar-Abhishek/weather.git
@TylerMoeller copy paste this in command line if you have git ... in readme instructions are given on how to use the command git clone --recursive https://github.com/Mr-Kumar-Abhishek/weather.git
Tyler Moeller
@TylerMoeller
Dec 10 2016 21:19
@chunb Sort of, I'm saying that Chrome has issues loading Twitch.tv channels. Search for it and you'll find a lot of related problems - something to do with how Chrome handles flash.
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:19
@TylerMoeller yes... for that I want to decrease the font size accordingly and fill the box with text-fill plugin
Tyler Moeller
@TylerMoeller
Dec 10 2016 21:19
Some days it works, other days it does not. Very frustrating issue @chunb
@Mr-Kumar-Abhishek What does this have to do with git? :)
@Mr-Kumar-Abhishek This is why you have me confused...
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:20
@TylerMoeller cuz you need to get the code ??
@TylerMoeller in the test branch
Tyler Moeller
@TylerMoeller
Dec 10 2016 21:20
@Mr-Kumar-Abhishek I haven't used that plugin before - you shouldn't need a whole new library to fix an isolated text layout issue in your app
Use javascript and if the city name is longer than a certain length, decrease the font size
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:21
@TylerMoeller but the word size comes in variety of sizes ... :o if I make them smaller... it wont look good
Brandon
@chunb
Dec 10 2016 21:22
@TylerMoeller Okay, I guess that means I've completed the project. Thanks
CamperBot
@camperbot
Dec 10 2016 21:22
chunb sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1134 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Trevor Pyle
@pyleotrevor
Dec 10 2016 21:22
$(document).ready(function() {

var userArr = [];
var userArr = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"]
var apiBase = "https://wind-bow.gomix.me/twitch-api/";


for (var i = 0; i < userArr.length; i++) {
  var fullAPI;
  var fullAPI = apiBase + "streams/" + userArr[i];
  var fullOfflineAPI;
  var fullOfflineAPI = apiBase + "channels/" + userArr[i];

  $.ajax({
      url: fullAPI,
      crossDomain: true,
      dataType: 'jsonp',
      success: function(userData) {


        if (userData.stream) {
          $(".container").append("<div> online " + userData.stream.channel.status + "</div>")
          console.log(userData);
        }

        else {
            $.ajax({
              url: fullOfflineAPI,
              crossDomain: true,
              dataType: 'jsonp',
              success: function(userDataOffline) {
                console.log(userDataOffline);
                $(".container").append("<div> offline " + userDataOffline.status + "</div>");
              }
            })
          }
        }
    });
    }
    });
Tyler Moeller
@TylerMoeller
Dec 10 2016 21:22
@chunb Definitely not a problem with your app - sorry for that initial confusion with brunofin :)
Trevor Pyle
@pyleotrevor
Dec 10 2016 21:22
Having trouble with this loop. Anyone mind taking a look?
Brandon
@chunb
Dec 10 2016 21:23
@TylerMoeller No problem :)
Tyler Moeller
@TylerMoeller
Dec 10 2016 21:25
@Mr-Kumar-Abhishek If you can put everthing in jsbin / codepen / etc, I'm happy to help out further.
Really don't want to clone your repo and get everything set up for running locally atm - that's a lot to ask
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:26
@TylerMoeller okay
@TylerMoeller thanks :)
CamperBot
@camperbot
Dec 10 2016 21:26
mr-kumar-abhishek sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1135 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Dec 10 2016 21:27
For nothing lol :)
You're welcome though :)
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:31
@TylerMoeller I can't make it to codepen or jsbin unless its weather icons and plugins are live from master branch so that I could hotlink them in the platforms you were asking about....
@TylerMoeller right now only weather icons are live
Tyler Moeller
@TylerMoeller
Dec 10 2016 21:37
@Mr-Kumar-Abhishek You can certainly export it all to codepen: https://s.codepen.io/TylerMoeller/debug/ZBjVzv
You have an issue with the set_background function reading is not defined
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:38
@TylerMoeller I can't text-fill js has no CDN you see so... unless it live and hotlinked it cannot be codepen
Tyler Moeller
@TylerMoeller
Dec 10 2016 21:39
@Mr-Kumar-Abhishek Use rawgit
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:39
@TylerMoeller I can't text-fill js has no CDN you see so... unless it live and hotlinked its cannot be codepen
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:39
@TylerMoeller tried that before doesn't with js calling css like in that plugin
@TylerMoeller I will try again... ~
Tyler Moeller
@TylerMoeller
Dec 10 2016 21:43
Good luck - I have to head out for now. From what I see - it loads just fine in the codepen I created at: https://s.codepen.io/TylerMoeller/debug/ZBjVzv
No errors about trying to load jquery.textfill.js
The library may not be working, however, because you have an old version of jQuery - something to look into.
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:44
@TylerMoeller okay ...I will look into it..
alpox
@alpox
Dec 10 2016 21:45
@Mr-Kumar-Abhishek whats up mate, new issue?
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:47
@alpox yeah, I am some conceptual misunderstanding of design probably ..
@alpox odd ui https://github.com/Mr-Kumar-Abhishek/weather/tree/test don't exactly know how to fix it..
alpox
@alpox
Dec 10 2016 21:50
@Mr-Kumar-Abhishek testfill not defined
Where is the script for it'
?
The directory is empty for me
@Mr-Kumar-Abhishek Ah this is such a submodule again :D
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:51
@alpox submodules are fixed this ...just run the update command
@alpox submodules are fixed this time ...just run the update command
@alpox git submodule update --init
@alpox git submodule update --init
git was updated.... I didn't knew new method of adding submodules before
alpox
@alpox
Dec 10 2016 21:53
@Mr-Kumar-Abhishek Yup works
But the api doesn't respond it seems
Ah now it does
Okay
So
What was the matter :D
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:54
@alpox so how could i make the font responsive text-fill should do that right ?
@alpox one of the boxes should be big if in test branch
alpox
@alpox
Dec 10 2016 21:57
@Mr-Kumar-Abhishek Aha you want them to be bigger?
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 21:58
@alpox quite the opposite the bigger one should be smaller ....
alpox
@alpox
Dec 10 2016 21:59
blob
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:00
@alpox uhmm.... keeping it big will do too... I just want them in the same size thats alll
alpox
@alpox
Dec 10 2016 22:00
@Mr-Kumar-Abhishek Thats what happens with textfill
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:01
@alpox that is only css working .... I am talking on laptop or computer screens
alpox
@alpox
Dec 10 2016 22:01
@Mr-Kumar-Abhishek Whut
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:02
@alpox I will give the image ...hold please
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:07
@alpox in desktop the three are not of the same size http://imgur.com/a/yW5F5
alpox
@alpox
Dec 10 2016 22:08
@Mr-Kumar-Abhishek Ah you are talking about the boxes?
Thats not what textfill does
Textfill makes the text fill out the boxes
You could give your boxes an absolute height
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:09
@alpox that will block the extra content isn't it ?
@alpox how to make font size responsive ?
alpox
@alpox
Dec 10 2016 22:10
font size is responsive with textfill @Mr-Kumar-Abhishek
But the boxes don't care about each others height
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:10
@alpox so textfill + apbsolute height ?
@alpox so textfill + absolute height ? *
alpox
@alpox
Dec 10 2016 22:11
Then, there are different sizes of text @Mr-Kumar-Abhishek
When you have a one-liner in a big box, it fills out full height
If you have a two-liner, both lines will fill out the full box
So if you have one two-liner and one one-liner, the one-liner is twice as big as the two-liner
You can set an absolute height and a specific font-size
Or you can listen for resizing of the div for various reasons and set the maximum height of the three to all of them.
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:14
@alpox how to make their height uniform and text centered in the middle with respect to height and width ?? I have heard of uw and vw units in css , is this required here ?
Garrus Napp
@GarrusNapp
Dec 10 2016 22:14
Hello, question regarding jQuery. I have button with btn-primary and x classes. Will clicking it trigger both $(".btn-primary).on("click" function(){...});and $(".x")..on("click" function(){...}); ?
alpox
@alpox
Dec 10 2016 22:16
@Mr-Kumar-Abhishek I wouldn't go with them. But you can make the text centered through some tweaks. I'll give you an outline in a sec
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:18
$(".btn-primary).on("click" function(){...}); will act for what ever is in that html tag with class I presume ... functions should be independent of each other
$(".btn-primary).on("click" function(){...}); will act for what ever is in that html tag with that class I presume ... functions should be independent of each other
alpox
@alpox
Dec 10 2016 22:18
@Mr-Kumar-Abhishek Actually, since your buttons are buttons, the text is by default centered. Just your p elements give a certain margin. just remove it in your css:
.widgets p {
    color: #343f61;
    line-height: 90px;
    font-weight: 800;
    font-size: 2em;
    text-align: center;
    margin: 0;
}
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:18
@GarrusNapp $(".btn-primary).on("click" function(){...}); will act for what ever is in that html tag with that class I presume ... functions should be independent of each other
alpox
@alpox
Dec 10 2016 22:19
@Mr-Kumar-Abhishek You can set an absolute height on the widgets then
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:19
@alpox and keep the margin auto ?
Garrus Napp
@GarrusNapp
Dec 10 2016 22:20
@Mr-Kumar-Abhishek the thing is, I want all buttons to preform certain function. Also one button has "x" class, and I want it to perform the first one, and additional one.
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:20
@alpox I checking them out..
@alpox I checking them out..
@GarrusNapp why not use an ID for that extra function....?
@GarrusNapp in any case the results would be same :)
@GarrusNapp functions are should be independent of each other
Garrus Napp
@GarrusNapp
Dec 10 2016 22:23
can't use ID due to other needs, "x" class is being added to random button earlier in code
What does it mean independent
You mean one event shouldn't trigger two?
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:25
@GarrusNapp nope unless it is not in js...
@GarrusNapp css class in html can't influence js , mostly block them
alpox
@alpox
Dec 10 2016 22:31
@Mr-Kumar-Abhishek Oh it seems though, that textfill works
But the width will overlap
Axiomteck
@axiomteck
Dec 10 2016 22:32
someone know how to create a wordpress theme using bootstrap. im tired of usign paid or other themes i will love to create my own
alpox
@alpox
Dec 10 2016 22:32
With fixed height though
blob
Axiomteck
@axiomteck
Dec 10 2016 22:33
woow at free code camp show you how to create a weather app
alpox
@alpox
Dec 10 2016 22:34
@axiomteck Right
@axiomteck Creating wordpress themes is another chapter :D this is not covered by freecodecamp and is going mainly into php
Axiomteck
@axiomteck
Dec 10 2016 22:35
yes. im taking freecodecamp courses
is very good
im creating a profile im on the first projects the one that requires 50 hours of projects
alpox
@alpox
Dec 10 2016 22:36
@axiomteck Okay :-) but be aware that it wont teach you php
Axiomteck
@axiomteck
Dec 10 2016 22:36
is ok
im learning HTML CSS and BOOTSTRAP, JAVASCRIPT AND SO ON those are great technologies and i will learn them
and i hope i will be able to create my own backend and front end
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:39
@alpox I just gave a experimental commit... I think I could tweak it on my own now probably , thanks :)
CamperBot
@camperbot
Dec 10 2016 22:39
mr-kumar-abhishek sends brownie points to @alpox :sparkles: :thumbsup: :sparkles:
:cookie: 683 | @alpox |http://www.freecodecamp.com/alpox
alpox
@alpox
Dec 10 2016 22:39
@Mr-Kumar-Abhishek Btw. to make the font size responsive, you can use simple media queries. This is the usual way to go
@Mr-Kumar-Abhishek Btw. your textfills wont do anything since there are no p elements in the buttons at the time of the execution of textfill
Hiago Patrick
@HiagoPatrick
Dec 10 2016 22:41
hello guys, hope yall ok.
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 10 2016 22:42
@alpox okay :) that will be last resort ... I just crashed my system by overwhelmed by mistakes :ambulance:
Hiago Patrick
@HiagoPatrick
Dec 10 2016 22:42
yeside i asked for help with this challenge of building a tribute page. I was really pissed for being more then a mounth on it widout understanding what i had to do.. But the, after i said i would go back to the first exercise, i decided to make what thay wanted the way i could think about it,
i had to do something that lookes like this https://codepen.io/FreeCodeCamp/full/NNvBQW/
but, as i couldnt undestand how i'd use classes i havent write, i did this http://codepen.io/hiagopatrick/details/ENpGQM/
Can anybody help to understand what shoud i do??? is that somehow corrected ?
alpox
@alpox
Dec 10 2016 22:46
@HiagoPatrick The classes they used were defined by bootstrap - a css library. You find a documentation online:
http://getbootstrap.com/css/
http://getbootstrap.com/components/
Where the classes are described in what they are doing. (Maybe bit overwhelming at first)
You can import bootstrap to your codepen through Settings -> CSS -> Quick add (At the bottom) -> Bootstrap
You can also write your own classes (Just write them in the html as class attributes on html tags) and write down the css for them in the CSS part of CodePen
Hiago Patrick
@HiagoPatrick
Dec 10 2016 22:48
"You can also write your own classes (Just write them in the html as class attributes on html tags) and write down the css for them in the CSS part of CodePen" This is how i'm used to work, writing my own css, but since everybody were telling me that for that challenge i just needed to write "body{...}" on the css, i got crazy
But thanks, i'll give a look at these links u sent me
alpox
@alpox
Dec 10 2016 22:50
@HiagoPatrick np
markygan123
@markygan123
Dec 10 2016 22:53

hi guys, when i set my nav-bar buttons' position to fixed, they go crazy lol

http://codepen.io/markygan123/pen/bBMmdz?editors=1100

alpox
@alpox
Dec 10 2016 22:57
@markygan123 They don't go crazy, they just loose their anchor
@markygan123 just add right: 0;
markygan123
@markygan123
Dec 10 2016 23:01
@alpox so the pull-right is not needed anymore right?
alpox
@alpox
Dec 10 2016 23:25
@markygan123 not really, no
Javier Rivera
@jrivera27
Dec 10 2016 23:29
Just wanted to see if anyone had any pointers? https://codepen.io/jrivera27/full/XNBZrv/
Gabi
@JJcreated
Dec 10 2016 23:33
hey guys, im building the weather machine and im finding it really hard, the lessons taught literally nothing, just kinda gave you some code to copy and paste
how do i go about it, how did you approach it
its a trend aswell, FCC seem to want you to go and find out how to do some things in order to complete the challenges, which is ironic because that's what i signed up to FCC for.....?
Zachary
@Bazill03
Dec 10 2016 23:37
@JJcreated You basically just need to learn how to use api's and how to output that information. It's very similar to the ideas you used to make your quote machine.
Check out https://darksky.net/dev/ That's the api I used.
bitcoinabdi
@bitcoinabdi
Dec 10 2016 23:41
good afternoon folks
i need help with my project please
@Bazill03 can you help ?