These are chat archives for FreeCodeCamp/HelpFrontEnd

2nd
Jun 2017
Nick Danvers
@Ravenor222
Jun 02 2017 00:03
hey guys anyone know how to stretch a navbar across the screen? to cover from top to bottom
Gulsvi
@gulsvi
Jun 02 2017 00:03
@alpox My chat froze lol, but that does sound almighty. I wonder how it would deal with memory if I wanted to resolve some 200 URLs
Nick Danvers
@Ravenor222
Jun 02 2017 00:03
er sorry far left to far right not top to bottom
Gulsvi
@gulsvi
Jun 02 2017 00:04
@Ravenor222 Usually, you add padding to the top of your body element to resolve that. See the note here: http://getbootstrap.com/components/#navbar-fixed-top

Body padding required

The fixed navbar will overlay your other content, unless you add padding to the top of the <body>. Try out your own values or use our snippet below. Tip: By default, the navbar is 50px high.
body { padding-top: 70px; }
@Ravenor222 If you're using bootstrap, and you're building a navbar, it's easiest to use the bootstrap navbar
Nick Danvers
@Ravenor222
Jun 02 2017 00:06
as opposed to the css one
ill google that. thanks
Gulsvi
@gulsvi
Jun 02 2017 00:06
@Ravenor222 Everything to know about the version of bootstrap you've been using in your codepen is here: https://v4-alpha.getbootstrap.com/
@JToddFL What's your question?
Ghost
@ghost~59209a78d73408ce4f6102e8
Jun 02 2017 00:16
When i go into small screen, my navbar becomes vertical rather than horizontal, how do you change this?
Gulsvi
@gulsvi
Jun 02 2017 00:18
Use a toggler @willybeans and it will collapse your links into a button
Ghost
@ghost~59209a78d73408ce4f6102e8
Jun 02 2017 00:18
@SkyC0der you are amazing human being and i appreciate your existence
That was an example with everything in the center - but you see the button if you make the browser window smaller. That's the standard responsive bootstrap navbar behavior
Brad Ledford
@bradledford
Jun 02 2017 00:19
@SkyC0der :clap:
Gulsvi
@gulsvi
Jun 02 2017 00:19
Still making you read the documentation to figure it out though lol :) @willybeans
Ghost
@ghost~59209a78d73408ce4f6102e8
Jun 02 2017 00:20
@SkyC0der thats fine by me! I usually just dont even know where to look is my main problem :-)
Colin
@finkbeca
Jun 02 2017 00:24
Hello, I have been trying to practice up on some of my html and css and have been rewriting code pends to further understand what everything means and helps to visualize them, however I am writing them in brackets, and have noticed that they would not show up. Because of this I quick copy and paste the code into brackets add a css link and the css file and see if it would work before I spend time rewriting it and finding out it doesn't work. Any ideas on why this would be not working . Help would be so greatly appreciated!!!
Brad Ledford
@bradledford
Jun 02 2017 00:25
Are you on a Mac or PC? Could it be character encoding or line ending related?
dinosaurjude
@dinosaurjude
Jun 02 2017 00:26
does anyone know why this comes up as undefined?
 $.getJSON(api + state + "/" + city + ".json", function(weatherData) {
      var tempF = weatherData.temp_f;
      console.log(tempF);
Brad Ledford
@bradledford
Jun 02 2017 00:27
@dinosaurjude could be a lot of things...
maybe the weatherData is just an empty object…try outputting the entire content of that variable with
console.log(weatherData) first thing. Does it have data?
dinosaurjude
@dinosaurjude
Jun 02 2017 00:29
yeah everything comes up fine when i consolelog weatherData
Brad Ledford
@bradledford
Jun 02 2017 00:29
Do you need to JSON parse the text that’s returned? Seems like you shoudn’t need to but I haven’t read the getJSON docs in awhile.
dinosaurjude
@dinosaurjude
Jun 02 2017 00:30

i ran it on jsfiddle and checked the console and got these error messages

Failed to load resource: net::ERR_BLOCKED_BY_CLIENT
fiddle.jshell.net/:45 Uncaught ReferenceError: $ is not defined
at window.onload (fiddle.jshell.net/:45)

Brad Ledford
@bradledford
Jun 02 2017 00:30
that just means jQuery is not loaded in that tool
dinosaurjude
@dinosaurjude
Jun 02 2017 00:31
oh i see. ill try parse
Brad Ledford
@bradledford
Jun 02 2017 00:32
:pray:
Ayush Kumar
@Gr8ayu
Jun 02 2017 00:49

  var longitude;
  var latitude;

$(document).ready(function(){




    if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(function(position) {

      longitude=position.coords.longitude;
    latitude=position.coords.latitude;
    alert(latitude); // LINE1
  });
}alert(latitude);  //LINE2

   var add="https://api.darksky.net/forecast/bc2ba21b2d2ea245b1a67f6dd6c0e766/"+   latitude+","+longitude;

  $.getJSON(add,function(json){
    var temp;
    var humidity;
    var windspeed;
    var pressure;

   temp=json.currently["temperature"] ;

  $(".temp-value").text(temp);
    alert(latitude);
      $(".longitude-value").text(longitude);
      $(".latitude-value").text(latitude);


  });


});
\LINE 1 , is giving value 23 , but \ line 2 is 'undefined'
PLEASE TELL WHY ???
Brad Ledford
@bradledford
Jun 02 2017 00:51
It is due to “scope”. Line 2 is outside of the curly braces { } that define in what scope you’ve set latitude.
getCurrentPosition is invoking a callback with the position variable, which is not populated anywhere but within that inline function’s scope
Manuel Moya
@moyamanuel
Jun 02 2017 00:52
Hello, can someone review my code and see why my ScrollSpy won't work?
<body data-spy="scroll" data-target=".navbar" data-offset="50">
    <nav class="navbar navbar-default navbar-fixed-top">
        <div class="container-fluid">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
                       <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                        <span class="icon-bar"></span>       
                  </button>
                <a class="navbar-brand" href="/" onclick="return false">
                    <h4><span id="myName">Manuel Moya</span> | Front-End Developer</h4>
                </a>
            </div>
            <div class="collapse navbar-collapse" id="myNavbar">
                <ul class="nav navbar-nav navbar-right">
                    <li>
                        <a href="#">
                            <h4>About</h4>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <h4>Portfolio</h4>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <h4>Hire me</h4>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
<br>
<br>
<br>
<br>
<br>
    <div class="container" id="section1">
        <div class="jumbotron">
            <img src="new.jpg" class="img-circle img-responsive center-block">
            <br>
            <h1 class="text-center display-3">Hi,</h1>
            <h2 class="text-center display-4">I'm Manuel Moya</h2>
        </div>
    </div>

<div id="section2" class="container-fluid">
  <h1>Section 2</h1>
  <p>Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!</p>
  <p>Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!</p>
</div>
<div id="section3" class="container-fluid">
  <h1>Section 3</h1>
  <p>Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!</p>
  <p>Try to scroll this section and look at the navigation bar while scrolling! Try to scroll this section and look at the navigation bar while scrolling!</p>
</div>
</body>
@bradledford I have defined latitude at begenning outside every scope.
Gulsvi
@gulsvi
Jun 02 2017 00:53
@moyamanuel delete that code wall and send us a link to your codepen :)
No way to know without seeing how you have codepen set up
Brad Ledford
@bradledford
Jun 02 2017 00:55
@Gr8ayu it’s due to the nature of javascript. Line 2 is actually occurring before line 1! The callback with the position is happening asyncronously and so the alert is occurring prior to the value being set.
Ayush Kumar
@Gr8ayu
Jun 02 2017 00:56
@bradledford If I have to get the value of position.coords.latitude outside that scope , what should I do
Brad Ledford
@bradledford
Jun 02 2017 00:56
Nest the logic which uses latitude into the callback scope
Or use promises…but that’s probably more than you want to learn right now
Ayush Kumar
@Gr8ayu
Jun 02 2017 00:57
@bradledford didnt got what you said
what's logic, any method ??
Gulsvi
@gulsvi
Jun 02 2017 01:00
@Gr8ayu you can pass the latitude and longitude as arguments to another function
var longitude;
var latitude;

navigator.geolocation.getCurrentPosition(function(position) {
  longitude = position.coords.longitude;
  latitude = position.coords.latitude;
  console.log(latitude) // 23

  getTheWeather(latitude);
});

console.log(latitude) // undefined

function getTheWeather(latitude, longitude) {
  console.log(latitude) // 23
}
Ayush Kumar
@Gr8ayu
Jun 02 2017 01:00
@SkyC0der let me try.
Brad Ledford
@bradledford
Jun 02 2017 01:00
noice @SkyC0der
Ayush Kumar
@Gr8ayu
Jun 02 2017 01:01
@SkyC0der @bradledford thnx
CamperBot
@camperbot
Jun 02 2017 01:01
gr8ayu sends brownie points to @skyc0der and @bradledford :sparkles: :thumbsup: :sparkles:
:cookie: 5 | @bradledford |http://www.freecodecamp.com/bradledford
:star2: 1586 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Jun 02 2017 01:05
@moyamanuel In your Javascript settings, make sure jQuery is listed first, before bootstrap.js. Then, you need to set up your navbar links so they work when you click on them. After that, your scroll spy will work.
Welcome, by the way, @bradledford good to see new people here
Brad Ledford
@bradledford
Jun 02 2017 01:07
Thanks @SkyC0der. Looking to reset my skills a bit…just a crusty old dev manager here
CamperBot
@camperbot
Jun 02 2017 01:07
bradledford sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1587 | @skyc0der |http://www.freecodecamp.com/skyc0der
Nikki L.R.
@nikkilr88
Jun 02 2017 01:12
I know this is for frontend, but does anyone here know some PHP by chance?
NormanNotorious
@MichaelPaulNormanII
Jun 02 2017 01:13
About to start my tribute page!
any suggestions on who I should choose?
someone interesting
Ayush Kumar
@Gr8ayu
Jun 02 2017 01:14
@bradledford @SkyC0der LINE 1 in java script not working https://codepen.io/gr8ayu/pen/pwzarG?editors=0010
Brian
@Cornielle
Jun 02 2017 01:14
@nikkilr88 please keep talking about front end , every room need balance :) we apreciate so much that
Nikki L.R.
@nikkilr88
Jun 02 2017 01:15
@Cornielle Well, I don't see a chat for backend, so I figured I would ask.
Brian
@Cornielle
Jun 02 2017 01:16
let me check i think that i can add you
NormanNotorious
@MichaelPaulNormanII
Jun 02 2017 01:16
Can anyone explain the concept of a user story to me? I dont understand what it is
Brian
@Cornielle
Jun 02 2017 01:16
helpbackEnd try to put this in search :)
Nikki L.R.
@nikkilr88
Jun 02 2017 01:17
@Cornielle Thank you!
CamperBot
@camperbot
Jun 02 2017 01:17
nikkilr88 sends brownie points to @cornielle :sparkles: :thumbsup: :sparkles:
:cookie: 2 | @cornielle |http://www.freecodecamp.com/cornielle
Ayush Kumar
@Gr8ayu
Jun 02 2017 01:17
@MichaelPaulNormanII a user who will use your webpage wants certain things , thats user story
Brian
@Cornielle
Jun 02 2017 01:17
@nikkilr88 No problem :)
Ayush Kumar
@Gr8ayu
Jun 02 2017 01:23
can anyone tell what this mean ---> XMLHttpRequest cannot load https://api.darksky.net/forecast/bc2ba21b2d2ea245b1a67f6dd6c0e766/23.3850619,85.30813739999999. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://s.codepen.io' is therefore not allowed access.
Gulsvi
@gulsvi
Jun 02 2017 01:43
@Gr8ayu That's a cross origin error and it means you need to use JSONP. https://www.sitepoint.com/jsonp-examples/
Basically, add callback=? to your URL with getJSON, or dataType: 'jsonp' with ajax.
Ayush Kumar
@Gr8ayu
Jun 02 2017 01:45
@SkyC0der thnx
CamperBot
@camperbot
Jun 02 2017 01:45
gr8ayu sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:warning: gr8ayu already gave skyc0der points
Jeremy
@JeremyAntonoff
Jun 02 2017 01:53
can anyone help
ambuja
@ambuja
Jun 02 2017 02:17
Hi
I want to create a radio button where the content remains the same only when the user selects the radio button the <a href button changes. Any ideas how I can achieve this ?
Tom
@moT01
Jun 02 2017 02:34
@ambuja what content?
dont understand what you are asking
ambuja
@ambuja
Jun 02 2017 02:34
Hi tom , '
Tom
@moT01
Jun 02 2017 02:34
hey
so whats up
ambuja
@ambuja
Jun 02 2017 02:36
I need to create 2 radio buttons with text content , and content has CTA button which will be greyed out , so when the user selects the radio button CTA button will change the color
not tough
Joe Skowronek
@jskowronek
Jun 02 2017 02:38
working on my portfolio. working on nav bar. How come there is no spacing.
Tom
@moT01
Jun 02 2017 02:39
and you want like a label with it? or a text area
Tom
@moT01
Jun 02 2017 02:39
? or im not sure what you mean
a button
radio buttons typically have labels
ambuja
@ambuja
Jun 02 2017 02:41
@moT01 , I can make radio buttons, but I need to put in a logic with JS to change the color of <a > tag or CTA button that lives inside of the radio depending on which radio button the user selects
@ambuja I am trying my best to explain :)
Tom
@moT01
Jun 02 2017 02:42
so you could give the tag an id or class to be able to target it with some js or jquery
im trying my best to answer
@jskowronek need to do some stlying with css
ambuja
@ambuja
Jun 02 2017 02:43
@moT01 thats where I need help , I am learning JS so is there a resource or code that I could look into
Tom
@moT01
Jun 02 2017 02:44
javascript or jquery?
ambuja
@ambuja
Jun 02 2017 02:44
javascript
Tom
@moT01
Jun 02 2017 02:44
they can both accomplish in a different way
giving your elements an id makes targeting them pretty easy
ambuja
@ambuja
Jun 02 2017 02:45
ok
Tom
@moT01
Jun 02 2017 02:45
for instance <a href="website" id="idHere">
ambuja
@ambuja
Jun 02 2017 02:45
ok
tanaya2017
@tanaya2016
Jun 02 2017 02:45
@jskowronek You have to add bootstrap link in external resources
gerome0123
@gerome0123
Jun 02 2017 02:45
hi guys how to justify my amount number in my table by there decimal??
ZaynMalloc
@ZaynMalloc
Jun 02 2017 02:45
https://codepen.io/zachgacer/pen/vmoLzy?editors=1010 I'm working on one of the beta projects. The "12. When I click the #submit button, the email is submitted to a static page" test is not passing. My problem is that when you enter the e-mail and click the submit button, you get the desired static page. However, the test is not passing.
gerome0123
@gerome0123
Jun 02 2017 02:46
Screen Shot 2017-06-02 at 10.43.11 AM.png
ambuja
@ambuja
Jun 02 2017 02:46
@moT01 ok, but then I need set the logic saying only when the radio button is selected change the color of the button
Tom
@moT01
Jun 02 2017 02:47
so theyre gonna probly need a onclick event as well
tanaya2017
@tanaya2016
Jun 02 2017 02:49
@ZaynMalloc Do you want to redirect to any html page ?
Tom
@moT01
Jun 02 2017 02:49
stay with me, ill try and get somethin up and running for you to build on or somethin
ambuja
@ambuja
Jun 02 2017 02:49
@moT01 yeah
ZaynMalloc
@ZaynMalloc
Jun 02 2017 02:50
@tanaya2016 According to the test, the button should have been redirected to https://www.freecodecamp.com/email-submit
tanaya2017
@tanaya2016
Jun 02 2017 02:51
@ZaynMalloc It must have some kind of extension like .htm or .html or .php
this is showing an error "We couldn't find a page for /email-submit"
ZaynMalloc
@ZaynMalloc
Jun 02 2017 02:53
@tanaya2016 so, Should the webpage that I have to redirect to should have an extension at the end?
@tanaya2016 The link that they gave (https://www.freecodecamp.com/email-submit) doesn't have any extension.
tanaya2017
@tanaya2016
Jun 02 2017 02:54
either valid link or extension
which exercise is this?
ZaynMalloc
@ZaynMalloc
Jun 02 2017 02:55
@tanaya2016 It is the product landing page project from the beta
Tom
@moT01
Jun 02 2017 02:57
@ambuja https://codepen.io/moT01/pen/mwbKpB?editors=1011
Zach Berwaldt
@zberwaldt
Jun 02 2017 02:59
Hello can someone give me a slight hint of what I am doing wrong and/or where I need to do next? here is a link to the code pen: https://codepen.io/spiredarc/pen/EXYbVZ
ambuja
@ambuja
Jun 02 2017 02:59
@moT01 thank you Tom , this is helpful . so now I will expand this with the changes I need to make and see how it goes. Will keep you posted
CamperBot
@camperbot
Jun 02 2017 02:59
ambuja sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 679 | @mot01 |http://www.freecodecamp.com/mot01
tanaya2017
@tanaya2016
Jun 02 2017 02:59
@ZaynMalloc I can't find the project. But the link has to be valid that you can open
Gulsvi
@gulsvi
Jun 02 2017 03:00
@ambuja Just reading up - you can use onclick like Tom suggested, and .checked property to see if a radio button is selected.
something like:
radio1.onclick = updateLink;
radio2.onclick = updateLink;

function updateLink(event) {
  if (event.target.id.includes('1')) {
    radio2.checked = false;
    button.style.backgroundColor = '#B30F0F';
  } else {
    radio1.checked = false;
    button.style.backgroundColor = '#003366';
  }
}
ZaynMalloc
@ZaynMalloc
Jun 02 2017 03:02
@tanaya2016 I think I figured out the problem by reading the test. I forgot to put the name attribute. Thank you for taking the time to help me
CamperBot
@camperbot
Jun 02 2017 03:02
zaynmalloc sends brownie points to @tanaya2016 :sparkles: :thumbsup: :sparkles:
:cookie: 227 | @tanaya2016 |http://www.freecodecamp.com/tanaya2016
tanaya2017
@tanaya2016
Jun 02 2017 03:02
@ZaynMalloc welcome :)
ambuja
@ambuja
Jun 02 2017 03:03
@SkyC0der , thank you sky , can you show me how would HTML look ?
CamperBot
@camperbot
Jun 02 2017 03:03
ambuja sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1588 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Jun 02 2017 03:04
@ambuja If you want a CTA button to change color depending on what radio input is selected, you could do this: https://codepen.io/skycoder/pen/QgLxMZ
Not sure if that's what you're trying to do - but the key things to study are onclick and checked
Lots and lots of ways to do it
Tom
@moT01
Jun 02 2017 03:05
that checked property always gave me problems
ambuja
@ambuja
Jun 02 2017 03:06
@SkyC0der , this is great example for me Sky , :) thank you
CamperBot
@camperbot
Jun 02 2017 03:06
ambuja sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:warning: ambuja already gave skyc0der points
Gulsvi
@gulsvi
Jun 02 2017 03:07
@spiredarc You will need to use JSONP to contact the dark sky API. This can be a little tricky to do with XMLHttpRequest. Maybe you want to use the fetch() API and embed the script to your page for JSONP?
Happy to help @ambuja
Zach Berwaldt
@zberwaldt
Jun 02 2017 03:08
@SkyC0der thank you
CamperBot
@camperbot
Jun 02 2017 03:08
spiredarc sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1589 | @skyc0der |http://www.freecodecamp.com/skyc0der
Ken Haduch
@khaduch
Jun 02 2017 03:11
@spiredarc - you need to do xhr.send() - put the parentheses on the end to actually call the function. That gets your transaction kicked off on the network.
Jeremy
@JeremyAntonoff
Jun 02 2017 03:11
How do you test if a variable is a number
Ken Haduch
@khaduch
Jun 02 2017 03:13
@spiredarc - but that still doesn't solve the problem.
Jeremy
@JeremyAntonoff
Jun 02 2017 03:13
@khaduch thank you sir
CamperBot
@camperbot
Jun 02 2017 03:13
jtoddfl sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2934 | @khaduch |http://www.freecodecamp.com/khaduch
Zach Berwaldt
@zberwaldt
Jun 02 2017 03:14
@khaduch it has something to do with security on the API's end of things.
I'm currently reading up on it.
Thanks for your help, regardless @khaduch
CamperBot
@camperbot
Jun 02 2017 03:14
spiredarc sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2935 | @khaduch |http://www.freecodecamp.com/khaduch
Jeremy
@JeremyAntonoff
Jun 02 2017 03:16
@khaduch can you help me with one other thing
Ken Haduch
@khaduch
Jun 02 2017 03:18
@JToddFL - I'll try... what's up?
Jeremy
@JeremyAntonoff
Jun 02 2017 03:18
why wont this work
function removeNumberValues(obj) {
  // your code here
  for (var prop in obj) {
    if (typeof(obj[prop]) == "number") {
      delete obj[prop];
    }
  }
}
removeNumberValues({
  a: 2,
  b: 'remaining',
  c: 4
})
trying to remove the number values
forgot to tag you @khaduch
Zane Rogers
@zanerogers1990
Jun 02 2017 03:22
hey guys, quick question! I am trying to implement the id attribute to my form element and for some reason it will not let me proceed. Any suggestions or help would be greatly appreciated. <form id="cat-photo-app" action="/submit-cat-photo"> <label><input type="radio" name="indoor-outdoor" checked> Indoor</label> <label><input type="radio" name="indoor-outdoor"> Outdoor</label> <label><input type="checkbox" name="personality" checked> Loving</label> <label><input type="checkbox" name="personality"> Lazy</label> <label><input type="checkbox" name="personality"> Energetic</label> <input type="text" placeholder="cat photo URL" required> <button type="submit">Submit</button> </form>
CamperBot
@camperbot
Jun 02 2017 03:22
:bulb: to format code use backticks! ``` more info
Ken Haduch
@khaduch
Jun 02 2017 03:24
@JToddFL - what are you supposed to be doing - returning something to the caller?
Jeremy
@JeremyAntonoff
Jun 02 2017 03:24
im suppose to remove all numbers in the object
@khaduch so that object should come back { b: 'remaining' }
Ken Haduch
@khaduch
Jun 02 2017 03:25
@JToddFL - well, that is working, but in the function you are not returning an object to the caller - you might need to add return obj; after your for loop?
Jeremy
@JeremyAntonoff
Jun 02 2017 03:25
o
mg
@khaduch thats embarassing lol
@khaduch thank you so much
CamperBot
@camperbot
Jun 02 2017 03:26
jtoddfl sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:warning: jtoddfl already gave khaduch points
Ken Haduch
@khaduch
Jun 02 2017 03:26
@JToddFL - well, it's part of learning to make the mistakes and learn from them! ;)
Joe Skowronek
@jskowronek
Jun 02 2017 03:26
@tanaya2016 its added in CSS. Is there another place to add it?
Jeremy
@JeremyAntonoff
Jun 02 2017 03:27
That's a first day mistake though :P thanks though
Ken Haduch
@khaduch
Jun 02 2017 03:27
@JToddFL - sometimes any day can be like a "first day"... you're welcome, glad to help!
Zane Rogers
@zanerogers1990
Jun 02 2017 03:30
oh jeez, i'm blind and didn't realize it was form instead of app. thanks anyways guys!
goodm0urning
@goodm0urning
Jun 02 2017 03:31
WIll someone take a look at my codepen and tell me why my jQuery won't display the URL with the coordinates in it?
I don't need a verbatim answer, I just want to understand so I can get better and fix the issue
countingernie
@countingernie
Jun 02 2017 03:34
sup room - question:
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 03:34
hmm I figured out how to clone yet now I cannot seem to push the files I cloned to my local machine been studying Git for a while now. So I did>> Git Push Origin Master from the working directory it seems to be called. Then it seemed to push the files and at that point I went to git hub and cannot find them when I reload page it still shows the above page... when I do Git status >>> it says working directory clean... very confusing I probably can click a button yet I really want to do every thing from the terminal because its more awesome that way. ;)
Just want to open a terminal and take one repo copy it on my local machine and load it up on another new repo as my portfolio page for editing any one know how to do this??
Zaurbek Zhakupov
@zzhakupov
Jun 02 2017 03:38
Hi guys, I completed my Online Stock Chart Application created with Socket.io, Redux, and React. Please have a look a leave some feedback! https://stocky-wocky.herokuapp.com/ and here is Github: https://github.com/zzhakupov/stocky-wocky
German Gamboa Gonzalez
@germangamboa95
Jun 02 2017 03:40
is there a better way to have a container than using a jumbotron? https://codepen.io/germangamboa95/pen/Zyzjbb
countingernie
@countingernie
Jun 02 2017 03:47
@Zooll8 Great work - only issue I had was the from/to fields changing from month/day/year to year/month/day after I clicked it.
Zaurbek Zhakupov
@zzhakupov
Jun 02 2017 03:49
@countingernie thanks for that point, I'll try to do something about it
CamperBot
@camperbot
Jun 02 2017 03:49
zooll8 sends brownie points to @countingernie :sparkles: :thumbsup: :sparkles:
:cookie: 119 | @countingernie |http://www.freecodecamp.com/countingernie
Zaurbek Zhakupov
@zzhakupov
Jun 02 2017 03:49
:yum:
Ken Haduch
@khaduch
Jun 02 2017 04:03
@germangamboa95 - if you're using Bootstrap, the jumbotron is pretty effective. You can style your own container, or add CSS to customize the jumbotron settings, if you wish. Also, I would recommend that you stick with Bootstrap V3 by loading this URL for the Bootstrap.css - - replace the URL for the CSS element with this: https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css and if you are using bootstrap.js, use this: https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js. It's easier to use than the V4 alpha version, due to the changes that are ongoing in the V4 code (as well as changes that have already been made.) That's just my recommendation - you can use the V4 version, just be aware of the changes that are documented in this page: https://v4-alpha.getbootstrap.com/migration/.
@germangamboa95 - I also notice that you are using a class "fluid-container", and it is "container-fluid" for Bootstrap (V3 at least, I don't know if they changed it.)
fdemaa
@fdemaa
Jun 02 2017 04:06
@khaduch hi ken
:+1:
Ken Haduch
@khaduch
Jun 02 2017 04:07
Hello there
fdemaa
@fdemaa
Jun 02 2017 04:08

can you check my portfolio for any quick feedback , its not finish yet

https://codepen.io/fdemaa/pen/oWOMMX?editors=1100

Manuel Moya
@moyamanuel
Jun 02 2017 04:21
It looks good so far! One suggestion would be to have the showcase photos to the left and the text to the right when dealing with smaller resolutions. @fdemaa
tanaya2017
@tanaya2016
Jun 02 2017 04:23
@jskowronek Check the Version also... we learnt Bootstrap 3 ... So make sure you added bootstrap 3
@fdemaa Looks good... Still in progress I guess ...
fdemaa
@fdemaa
Jun 02 2017 04:26
@moyamanuel thanks man! yes maybe its a bit confusing on smaller resolutions , thanks for the advice, i will fix that
CamperBot
@camperbot
Jun 02 2017 04:26
fdemaa sends brownie points to @moyamanuel :sparkles: :thumbsup: :sparkles:
:cookie: 292 | @moyamanuel |http://www.freecodecamp.com/moyamanuel
fdemaa
@fdemaa
Jun 02 2017 04:26
@tanaya2016 thanks! yes i still have to finish the contact section and footer, and also add colors and fonts
CamperBot
@camperbot
Jun 02 2017 04:26
fdemaa sends brownie points to @tanaya2016 :sparkles: :thumbsup: :sparkles:
:cookie: 228 | @tanaya2016 |http://www.freecodecamp.com/tanaya2016
fdemaa
@fdemaa
Jun 02 2017 04:26
:smile:
tanaya2017
@tanaya2016
Jun 02 2017 04:27
great... happy coding :)
Saeed Jassani
@saeedjassani
Jun 02 2017 04:28
Adam Bohannon
@abohannon
Jun 02 2017 04:39
@saeedjassani I'm on this challenge as well. Yours looks good. Did you have much prior coding experience? Looking at your js there's a lot in there we haven't covered in FCC. I'm stuck on randomizing my JSON items.
Saeed Jassani
@saeedjassani
Jun 02 2017 04:42
@abohannon you can get that using Math.random() function
i have prior experience but not in JavaScript
Ravi Kishore Thella
@ravikishorethella
Jun 02 2017 04:45
Guys, here is my quote generator.
Please give some feedback https://codepen.io/ravikishorethella/pen/rmEjKK?editors=1010
Netrunner21
@Netrunner21
Jun 02 2017 04:47
@ravikishorethella thats pretty much all you need. looks great.
Saeed Jassani
@saeedjassani
Jun 02 2017 04:47
its great!
Manuel Moya
@moyamanuel
Jun 02 2017 04:48
It's a good start @ravikishorethella . I have two suggestions: 1. You should move the background image a bit lower because it interferes with the quotes. 2. You should make it responsive so it works on smaller resolutions as well.
Netrunner21
@Netrunner21
Jun 02 2017 04:48
You can take that font awesome link and place in the gear icon if you'd like @ravikishorethella
@moyamanuel It's only doing that in freecodecamp chat
Ravi Kishore Thella
@ravikishorethella
Jun 02 2017 04:48
@Netrunner21 @saeedjassani @moyamanuel thanks
CamperBot
@camperbot
Jun 02 2017 04:48
ravikishorethella sends brownie points to @netrunner21 and @saeedjassani and @moyamanuel :sparkles: :thumbsup: :sparkles:
:cookie: 270 | @saeedjassani |http://www.freecodecamp.com/saeedjassani
:cookie: 329 | @netrunner21 |http://www.freecodecamp.com/netrunner21
:cookie: 293 | @moyamanuel |http://www.freecodecamp.com/moyamanuel
Netrunner21
@Netrunner21
Jun 02 2017 04:49
when you pop it out into another window, it looks fine
Ravi Kishore Thella
@ravikishorethella
Jun 02 2017 04:49
@Netrunner21 @moyamanuel I will make the changes
@Netrunner21 yes
Manuel Moya
@moyamanuel
Jun 02 2017 04:50
No, it also does it on full-screen on my computer @Netrunner21.
Saeed Jassani
@saeedjassani
Jun 02 2017 04:51
@moyamanuel in my project, when a quote is too big, the buttons below the quote hides away, will you give me any hints on how to reduce the font size when on mobile devices?
Manuel Moya
@moyamanuel
Jun 02 2017 04:53
You are using Bootstrap which is good, but do keep note that it automatically adds Bootstrap 4 instead of Bootstrap 3. Also, make sure to add compiled JavaScript that Bootstrap needs. @saeedjassani
Netrunner21
@Netrunner21
Jun 02 2017 04:54
@moyamanuel may be your browser trying to interpret position: absolute;
absolute positioning is usually the cause of overlapping sections
absolute doesn't respect margins
Manuel Moya
@moyamanuel
Jun 02 2017 04:56
@saeedjassani, you can wrap<div class="container"> to make sure the text is responsive.
Netrunner21
@Netrunner21
Jun 02 2017 04:56
@ravikishorethella there doesn't seem to be a need for absolute positioning on this challnge
Ravi Kishore Thella
@ravikishorethella
Jun 02 2017 04:57
@Netrunner21 okay. Anymore suggestions?
Saeed Jassani
@saeedjassani
Jun 02 2017 04:57
@moyamanuel its already in container
@moyamanuel i changed the bootstrap version to 3.3.7, but still the font size is same!
Netrunner21
@Netrunner21
Jun 02 2017 04:58
@ravikishorethella it looks fantastic. Just curious, do you know the difference between absolute and reletive positioning?
relative*
Ravi Kishore Thella
@ravikishorethella
Jun 02 2017 04:59
@Netrunner21 yes
Jeremy
@JeremyAntonoff
Jun 02 2017 04:59
can someone help me
Netrunner21
@Netrunner21
Jun 02 2017 04:59
Good stuff.
@JToddFL Yeah man
Ravi Kishore Thella
@ravikishorethella
Jun 02 2017 05:00
@Netrunner21 thanks for the suggestions
CamperBot
@camperbot
Jun 02 2017 05:00
ravikishorethella sends brownie points to @netrunner21 :sparkles: :thumbsup: :sparkles:
:warning: ravikishorethella already gave netrunner21 points
Netrunner21
@Netrunner21
Jun 02 2017 05:00
No problem @ravikishorethella
Saeed Jassani
@saeedjassani
Jun 02 2017 05:00
@ravikishorethella which API are you using?
fdemaa
@fdemaa
Jun 02 2017 05:01
Wich is the best way to make my contact section using html only ?
Adam Bohannon
@abohannon
Jun 02 2017 05:01
WOuld anyone be willing to look at my code and offer some direction on randomizing the quotes from my json feed? https://codepen.io/abohannon/pen/XgrPrV
Manuel Moya
@moyamanuel
Jun 02 2017 05:02

Can someone please review my code and see why my ScrollSpy isn't working?

https://codepen.io/manuelmoya/full/JNYBjp/

Ravi Kishore Thella
@ravikishorethella
Jun 02 2017 05:02
@saeedjassani I didn't use any api's. I stored the quotes in array
Saeed Jassani
@saeedjassani
Jun 02 2017 05:02
@ravikishorethella oh ok
@abohannon first of all you dont need "index" values in your JSON Array
Adam Bohannon
@abohannon
Jun 02 2017 05:05
that's actually someone elses JSON feed, but I could edit them out. Is there a way to randomize without
paying attention to them
Saeed Jassani
@saeedjassani
Jun 02 2017 05:05
i = Math.floor(Math.random() * (array.length)); this snippet should initialize random numbers to i
Gulsvi
@gulsvi
Jun 02 2017 05:05
@moyamanuel You need to fix your navbar links and then scroll spy will work fine. Your about link should link to your about section, portfolio to your portfolio section, etc.. right now they all link to Google
Saeed Jassani
@saeedjassani
Jun 02 2017 05:07
@abohannon you dont need foreach loop, just fetch the whole JSON once, generate a random number, and then get a random quote using that random number array[i]
Jessica Mattick
@jmatty16
Jun 02 2017 05:07
I am so confused with the twitch app. It seems like every think I read about it on the forums is conflicting :(
Gulsvi
@gulsvi
Jun 02 2017 05:08
@abohannon use Math.random() to get a random number and then select your quote by json[randomNumber].quote
Adam Bohannon
@abohannon
Jun 02 2017 05:08
@saeedjassani ok thank you for that tip. Would I generate my random number within the function(json)
CamperBot
@camperbot
Jun 02 2017 05:08
abohannon sends brownie points to @saeedjassani :sparkles: :thumbsup: :sparkles:
:cookie: 271 | @saeedjassani |http://www.freecodecamp.com/saeedjassani
German Gamboa Gonzalez
@germangamboa95
Jun 02 2017 05:08
alrighty guys I think I'm done with this one. Please give me any feedback on how I can improve (I know I need to get more creative) https://codepen.io/germangamboa95/pen/YQKvYV
Gulsvi
@gulsvi
Jun 02 2017 05:08
whoops, ninja'd :)
Saeed Jassani
@saeedjassani
Jun 02 2017 05:09
@abohannon yes!
Gulsvi
@gulsvi
Jun 02 2017 05:10
@jmatty16 The only URLs you need are these ones:
Study those to learn what an online/offline/non-existent user looks like
Adam Bohannon
@abohannon
Jun 02 2017 05:11
@saeedjassani what would my array be?
Saeed Jassani
@saeedjassani
Jun 02 2017 05:13
the JSON array in which the quotes are stored
Gulsvi
@gulsvi
Jun 02 2017 05:14
@germangamboa95 Great job - it's responsive and the code looks clean. You spelled the person's name wrong throughout the page though. Turin should be Turing - you're also missing a closing bracket } at the end of your CSS.
Saeed Jassani
@saeedjassani
Jun 02 2017 05:14
do console.log(json[0]) to get an idea of the response you are getting
Jessica Mattick
@jmatty16
Jun 02 2017 05:15
@SkyC0der hmm I am using those urls but nothing is coming up when I run it.
$.getJSON('https://wind-bow.gomix.me/twitch-api/users/ESL_SC2?callback=?', function(data) {
  console.log(data);
});
fdemaa
@fdemaa
Jun 02 2017 05:15
@SkyC0der hey ski!! whats better to use to make my contac form in my portfolio? html or bootstrap form-gruops classes
Manuel Moya
@moyamanuel
Jun 02 2017 05:15
@SkyC0der I see what you mean now. Thank you!
CamperBot
@camperbot
Jun 02 2017 05:15
moyamanuel sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1590 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Jun 02 2017 05:15
@jmatty16 That's a slightly different URL in your code - double check again :)
Saeed Jassani
@saeedjassani
Jun 02 2017 05:16
https://codepen.io/saeedjassani/full/egpBOB/ hey @SkyC0der can you check my code and project too?
Manuel Moya
@moyamanuel
Jun 02 2017 05:17
Really awesome @saeedjassani. Good design and UX
Gulsvi
@gulsvi
Jun 02 2017 05:17
@fdemaa I think it's easiest to use bootstrap form groups :) but that's just my opinion. It has a nice look
Jessica Mattick
@jmatty16
Jun 02 2017 05:18
@SkyC0der Oops! I didn't notice. I need to get more sleep haha. But I tried it again with the url you provided and it's still not working.
$.getJSON('https://wind-bow.glitch.me/twitch-api/users/ESL_SC2?callback=?', function(data) {
  console.log(data);
});
Adam Bohannon
@abohannon
Jun 02 2017 05:19
@saeedjassani ok so console.log(json[i]) comes back undefined, so i tested console.log(quotesList.length) and that also came by undefined.
Gulsvi
@gulsvi
Jun 02 2017 05:19
@jmatty16 Can you share your codepen? Maybe a setup problem - that code works fine for me
@saeedjassani Nice job on the UI, you can use this URL for the API instead of that cross origin hack server
https://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=?
German Gamboa Gonzalez
@germangamboa95
Jun 02 2017 05:19
@SkyC0der Thanks! and facepalms
CamperBot
@camperbot
Jun 02 2017 05:19
germangamboa95 sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1591 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Jun 02 2017 05:20
:) It happens
Saeed Jassani
@saeedjassani
Jun 02 2017 05:21
@abohannon hope this link will help you out! https://stackoverflow.com/a/9420583/4451655
Gulsvi
@gulsvi
Jun 02 2017 05:21
@saeedjassani I made a simple version of a quote machine with that API earlier today: https://s.codepen.io/skycoder/pen/eROEqx?editors=0010
Adam Bohannon
@abohannon
Jun 02 2017 05:21
@saeedjassani actually i think i got it to work by blind luck
haha
Gulsvi
@gulsvi
Jun 02 2017 05:21
It doesn't change colors, but it's the same API - they have nice quotes
Adam Bohannon
@abohannon
Jun 02 2017 05:21
thank you for your help!
Saeed Jassani
@saeedjassani
Jun 02 2017 05:22
@SkyC0der yeah! thanks for all the feedback!
CamperBot
@camperbot
Jun 02 2017 05:22
saeedjassani sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1592 | @skyc0der |http://www.freecodecamp.com/skyc0der
Jessica Mattick
@jmatty16
Jun 02 2017 05:22
@SkyC0der Thanks. Here's my pen. It's still a work in progress. I'm just trying to get it to work for at least one of the users for now. (https://codepen.io/jmatty16/pen/owvMZE)
fdemaa
@fdemaa
Jun 02 2017 05:22
@SkyC0der thanks ski
CamperBot
@camperbot
Jun 02 2017 05:22
fdemaa sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1593 | @skyc0der |http://www.freecodecamp.com/skyc0der
Gulsvi
@gulsvi
Jun 02 2017 05:23
@jmatty16 Not sure what's up - your pen works great for me
image.png
Saeed Jassani
@saeedjassani
Jun 02 2017 05:23
@SkyC0der the problem with that API is that sometimes quoteAuthor is blank!
Gulsvi
@gulsvi
Jun 02 2017 05:24
@saeedjassani True lol, I ignored that problem. You could do something like:
var quoteAuthor = quote.Author || 'unknown';
That will make it the text "unknown" if it isn't defined
Saeed Jassani
@saeedjassani
Jun 02 2017 05:25
hmmm
Gulsvi
@gulsvi
Jun 02 2017 05:26

@saeedjassani Also, this:

$('.quote, .author, .twitter-share, #refresh').removeClass('animated fadeIn');

Is the same as:

$('.quote').removeClass('animated fadeIn');
$('.author').removeClass('animated fadeIn');
$('.twitter-share').removeClass('animated fadeIn');
$('#refresh').removeClass('animated fadeIn');
Really nice work on the quote machine though :) just some minor things you can try in your JS
Saeed Jassani
@saeedjassani
Jun 02 2017 05:28
@SkyC0der thanks for feedback! (i am new to JS)
CamperBot
@camperbot
Jun 02 2017 05:28
saeedjassani sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:warning: saeedjassani already gave skyc0der points
Gulsvi
@gulsvi
Jun 02 2017 05:28
Any time, it's a fun project - good for learning JS. Weather Challenge is next :)
Saeed Jassani
@saeedjassani
Jun 02 2017 05:29
Yeah, will start it after some time!
Jessica Mattick
@jmatty16
Jun 02 2017 05:31
@SkyC0der Thanks! At least it's working for you. For some reason nothing shows up on my console so I assumed it was wrong.
now i got it to show up
something was weird with codepen idk
Saeed Jassani
@saeedjassani
Jun 02 2017 05:32
@SkyC0der https://stackoverflow.com/a/3840118/4451655 here in this answer it says that CORS is better than JSONP!
Michael Karpinski
@karpimpski
Jun 02 2017 05:50
does anybody know how to upload images with weird shapes? for example, right now I'm trying to upload an image of a circle that has a blue background. but right now the blue is a rectangle
Sly Fox
@Gurukorgi
Jun 02 2017 05:50
hey guys am kinda confused on how to link my new pen to the freecodecamp .... pls can anyone help with the procedures ?
Michael Karpinski
@karpimpski
Jun 02 2017 05:50
I know I could use canvas or weird CSS rules to make shapes, but I'd rather make shapes in PS and upload the image
Sly Fox
@Gurukorgi
Jun 02 2017 05:51
hello is there anybody here at all
hmmm ya'll must still be snoozing
Jessica Mattick
@jmatty16
Jun 02 2017 05:52
@Gurukorgi Are you talking about submitting it to the challenge?
you can click on "i've completed this challenge" and can just copy paste the link
Sly Fox
@Gurukorgi
Jun 02 2017 05:52
@jmatty16 yes
@jmatty16 where do i get the link from ?
Johnny
@jtan3
Jun 02 2017 05:53
@Gurukorgi copy and paste your project url from codepen
Sly Fox
@Gurukorgi
Jun 02 2017 05:54
@jtan3 where in the pen is it written , thats the question
h1tag
@h1tag
Jun 02 2017 05:54
From the address bar
Jessica Mattick
@jmatty16
Jun 02 2017 05:54
@Gurukorgi there's nothing special about the url. It's just the same one you see when you are editing
Sly Fox
@Gurukorgi
Jun 02 2017 05:55
@h1tag @jmatty16 thanks
CamperBot
@camperbot
Jun 02 2017 05:55
gurukorgi sends brownie points to @h1tag and @jmatty16 :sparkles: :thumbsup: :sparkles:
:cookie: 267 | @jmatty16 |http://www.freecodecamp.com/jmatty16
:cookie: 821 | @h1tag |http://www.freecodecamp.com/h1tag
Jessica Mattick
@jmatty16
Jun 02 2017 05:56
you're welcome!
Egnaro9
@egnaro9
Jun 02 2017 05:56
<img height="400px" class="img-responsive" src="http://www.telesurtv.net/__export/1414255866338/sites/telesur/img/opinion/2014/10/25/-vasili-arkhipov-009.jpg_1689854194.jpg">
Sly Fox
@Gurukorgi
Jun 02 2017 05:56
@jmatty16 kk let me go and do that
Egnaro9
@egnaro9
Jun 02 2017 05:56
it load great on my lap top but too big on my phone
Michael Karpinski
@karpimpski
Jun 02 2017 05:58
@egnaro9 give the image a Bootstrap class
Egnaro9
@egnaro9
Jun 02 2017 05:58
isnt img-responsive bootstrap?
Michael Karpinski
@karpimpski
Jun 02 2017 05:59
give the parent div a class of 'row' and give the image a class of something like 'col-md-6' to make the image half of the screen size
@egnaro9 yep! that just makes the image responsive. you need to define the width
Egnaro9
@egnaro9
Jun 02 2017 05:59
okay thankyou
Egnaro9
@egnaro9
Jun 02 2017 06:11
instead of row class what if i want to center the pic on the page?
Michael Karpinski
@karpimpski
Jun 02 2017 06:12
class='center row' should work @egnaro9
Egnaro9
@egnaro9
Jun 02 2017 06:12
damn, thankyou!
Michael Karpinski
@karpimpski
Jun 02 2017 06:15
no problem!
still not working
put that
on quick add
you have bootstrap 4 wich is in alpha version
<div class="row">
<div class="col-md-12">
<img class="image-responsive center-block" src="http://www.telesurtv.net/__export/1414255866338/sites/telesur/img/opinion/2014/10/25/-vasili-arkhipov-009.jpg_1689854194.jpg">
</div>
</div>
Egnaro9
@egnaro9
Jun 02 2017 06:23
thank you!
fdemaa
@fdemaa
Jun 02 2017 06:24
:+1:
Egnaro9
@egnaro9
Jun 02 2017 06:26
i think that did it!
fdemaa
@fdemaa
Jun 02 2017 06:27
you should use % on your font sizes
to make them responsive
sorry
use rems
for font sizes
fdemaa
@fdemaa
Jun 02 2017 06:36

Anyone know why i have this stats ?

Longest Streak: 4 daysCurrent Streak: 1 day

i enter all days, and works on my tribute and portfolio ?

i have to submit a challenge per day so it count me as a streaK?

h1tag
@h1tag
Jun 02 2017 06:38
Yes. Or when you help people and they give you brownie points
fdemaa
@fdemaa
Jun 02 2017 06:40
:shipit:
i didnt know it haha
NormanNotorious
@MichaelPaulNormanII
Jun 02 2017 07:08
I'm starting my tripute page and I'm wondering how other people went about it. Did you guys just pretty much look at and copy the code that FCC used for the example? Is that the best approach to learning it?
Akash Das
@akashjohn1111
Jun 02 2017 07:17
guys can anyone give link to their codepen project of random quote generator
Matúš Námešný
@LordMathis
Jun 02 2017 07:50
@MichaelPaulNormanII don't look at the code, try to figure it out for yourself
Tardigra
@Tardigra
Jun 02 2017 08:01
@MichaelPaulNormanII : Just jump into the cold water :)
Cato Myhre
@Zalmez
Jun 02 2017 08:02
can anyone tell me how to make the contact form working? q.q
Tardigra
@Tardigra
Jun 02 2017 08:03
I am currently working on the local weather challenge. How do you cope with pictures and Icons? Did you upgrade your codepen account to pro or can anyone tell me where to find weather icons ready to use like fontawesome?
Matúš Námešný
@LordMathis
Jun 02 2017 08:05
@Tardigra depending on API you are using, they might provide icon urls in the returned json
@Zalmez can you show us your code?
Tardigra
@Tardigra
Jun 02 2017 08:06
@LordMathis : Unfortunately not, I am using the dark sky API.
Matúš Námešný
@LordMathis
Jun 02 2017 08:09
@Tardigra I've found this: https://cdnjs.com/libraries/weather-icons it might exactly what you need
kirbyedy
@kirbyedy
Jun 02 2017 08:10
@Tardigra I used this ones in conjunction with darksky api
Matúš Námešný
@LordMathis
Jun 02 2017 08:10
the project is no longer maintained but it seems to be still working
Adam
@iGiblee
Jun 02 2017 08:18
Can someone look at my page and tell me why I cant get the page jump to work?
https://codepen.io/igiblee/pen/qmGoeB?editors=1100
Matúš Námešný
@LordMathis
Jun 02 2017 08:22
@iGiblee your ABOUT links to an element with an id "Intro" but there is no element with an id "Intro" in your html. Similarly for other links
also put all your CSS into the CSS column, don't have it inside <style> tags
Adam
@iGiblee
Jun 02 2017 08:23
I'll give it a look now, thanks @LordMathis
CamperBot
@camperbot
Jun 02 2017 08:23
igiblee sends brownie points to @lordmathis :sparkles: :thumbsup: :sparkles:
:cookie: 322 | @lordmathis |http://www.freecodecamp.com/lordmathis
I've made the form etc
but not sure how to hook it up
Matúš Námešný
@LordMathis
Jun 02 2017 08:32
for a form you need a backend
or you can use something like this https://formspree.io/
Cato Myhre
@Zalmez
Jun 02 2017 08:34
hmm, I guess it's better to have something working
Matúš Námešný
@LordMathis
Jun 02 2017 08:36
Forms work basically like this: When you click submit the form data will be sent to the specified server where the form data will be processed. Usually it will be your own server but as you are not yet on backend you might use something like formspree
Akash Das
@akashjohn1111
Jun 02 2017 08:38
guys can anyone show their codepen random quote generator
Adole Samuel
@int-elligentSam
Jun 02 2017 08:38
hello world
Cato Myhre
@Zalmez
Jun 02 2017 08:41
@LordMathis thanks ^^
CamperBot
@camperbot
Jun 02 2017 08:41
zalmez sends brownie points to @lordmathis :sparkles: :thumbsup: :sparkles:
:cookie: 323 | @lordmathis |http://www.freecodecamp.com/lordmathis
Akash Das
@akashjohn1111
Jun 02 2017 08:42
@LordMathis thanks
CamperBot
@camperbot
Jun 02 2017 08:42
akashjohn1111 sends brownie points to @lordmathis :sparkles: :thumbsup: :sparkles:
:cookie: 324 | @lordmathis |http://www.freecodecamp.com/lordmathis
Lovro Mekiš
@LovroM
Jun 02 2017 08:45
njordomir
@njordomir
Jun 02 2017 08:58
Can someone help me out with a positioning issue? On lines 39 and 48 I create the two divs with the placeholder images in them. They have a margin around them, or padding from the containing div. I have nothing declared in my css, but I assume the bootstrap css is doing this. How can I track it down and remove it? For clarity, the little box should be connected with the bigger box right of it (unless on mobile). https://codepen.io/Njordomir/pen/owvPpr
Lovro Mekiš
@LovroM
Jun 02 2017 09:07
@njordomir I recommend you to use these placeholders photos (you define the size there) https://placeholder.com/
@njordomir And you can override bootstraps margins and paddings
njordomir
@njordomir
Jun 02 2017 09:08
@akashjohn1111 I really like your quote generator. Probably one of the more beautiful ones I've seen. Looks like Colorado!
Lovro Mekiš
@LovroM
Jun 02 2017 09:08
just define your own
SavvasLimassol
@SavvasLimassol
Jun 02 2017 09:08
@SkyC0der Thank you
CamperBot
@camperbot
Jun 02 2017 09:08
savvaslimassol sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1594 | @skyc0der |http://www.freecodecamp.com/skyc0der
Lovro Mekiš
@LovroM
Jun 02 2017 09:09
@njordomir that qute generator is mine :smile:
njordomir
@njordomir
Jun 02 2017 09:12
@LovroM Thanks. I thought I tried setting the div padding to 0, but I'll try it. And I must have done something screwy when tagging you. Gitter lags for me and I sometimes hit the wrong thing. It looks really good, the font especially.
CamperBot
@camperbot
Jun 02 2017 09:12
njordomir sends brownie points to @lovrom :sparkles: :thumbsup: :sparkles:
:cookie: 389 | @lovrom |http://www.freecodecamp.com/lovrom
njordomir
@njordomir
Jun 02 2017 09:16
@LovroM It worked. I must have been setting margins to 0 on the image instead of padding to 0 on the div.
Lovro Mekiš
@LovroM
Jun 02 2017 09:17
@njordomir Thank you, colors and font is a very important thing in front end :) Im glad it works now :)
CamperBot
@camperbot
Jun 02 2017 09:17
lovrom sends brownie points to @njordomir :sparkles: :thumbsup: :sparkles:
:cookie: 313 | @njordomir |http://www.freecodecamp.com/njordomir
Ehsan Shadmehri
@ehsansh
Jun 02 2017 09:25
Hi , what does app.use(require('./controllers')) mean?
OmarMoh
@OmarMoh
Jun 02 2017 09:40
wikiformat
relikt
@reliktus
Jun 02 2017 09:41
hi there ive got problem with my weather app
it sometimes work fine
and sometimes got mixed content error
i know its problem with http over https
ive changes te geolocation to https
and its get the location data fine
but second api wont work with https
is there any workaround ?
h1tag
@h1tag
Jun 02 2017 09:43
Another API
relikt
@reliktus
Jun 02 2017 09:43
@h1tag :worried: I was afraid of that since Ive ended this project
and now its stoped working
h1tag
@h1tag
Jun 02 2017 09:44
Plus you have other http URLs in your code
relikt
@reliktus
Jun 02 2017 09:44
if ive change all to http it will work ?
h1tag
@h1tag
Jun 02 2017 09:44
I think Codepen started forcing https this month
relikt
@reliktus
Jun 02 2017 09:45
@h1tag I see
h1tag
@h1tag
Jun 02 2017 09:45
means you have to change all links to https
relikt
@reliktus
Jun 02 2017 09:45
if their not working with https that will be big problem to many projects
h1tag
@h1tag
Jun 02 2017 09:45
it will work depending on the website, if it supports https or not
relikt
@reliktus
Jun 02 2017 09:45
yeap, now I understand
@h1tag thank you
CamperBot
@camperbot
Jun 02 2017 09:46
reliktus sends brownie points to @h1tag :sparkles: :thumbsup: :sparkles:
:cookie: 822 | @h1tag |http://www.freecodecamp.com/h1tag
h1tag
@h1tag
Jun 02 2017 09:46
Codepen announced that 2 or 3 month ago
relikt
@reliktus
Jun 02 2017 09:47
didnt noticed cause i used the api which their mentioned in user story
and right know its stoped working :worried:
h1tag
@h1tag
Jun 02 2017 09:49
@reliktus they changed it in the beta version
openweather also stopped working long before that, because geolocation started requiring https to work
relikt
@reliktus
Jun 02 2017 09:50
@h1tag bet version of FCC or codepen ?
h1tag
@h1tag
Jun 02 2017 09:50
fcc
relikt
@reliktus
Jun 02 2017 09:50
@h1tag where could Ive find it ?
im looking at the FCC challenge and still see the sami recomended api which not using the https
geolocation changes to https wokrs fine tho
relikt
@reliktus
Jun 02 2017 09:52
@LovroM thank you
CamperBot
@camperbot
Jun 02 2017 09:52
reliktus sends brownie points to @lovrom :sparkles: :thumbsup: :sparkles:
:cookie: 390 | @lovrom |http://www.freecodecamp.com/lovrom
relikt
@reliktus
Jun 02 2017 09:52
looking for that challenge
h1tag
@h1tag
Jun 02 2017 09:53
@reliktus I think they even removed the weather project at all :)
and yea it's not updated in the current fcc version
though it should be, because every camper here hits this problem when they reach the weather challenge
relikt
@reliktus
Jun 02 2017 09:55
oh thats sad :worried: i think I will host it somewhere else
h1tag
@h1tag
Jun 02 2017 09:56
but you still have to make the links either all http or all https
relikt
@reliktus
Jun 02 2017 09:56
maybe on github since it doesnt need any backend support
yeap but ill get all the http and that should do the trick
@h1tag am i right ?
h1tag
@h1tag
Jun 02 2017 09:58
but geolocation doesn't work over http
h1tag
@h1tag
Jun 02 2017 10:00
I see
relikt
@reliktus
Jun 02 2017 10:00
is it changes to https:// and i dont see ir or is it working ?
h1tag
@h1tag
Jun 02 2017 10:00
thought you're using geolocation
relikt
@reliktus
Jun 02 2017 10:00
nope
right now got all the links http:// but as I said on codepen im forced to use https and it wont work or am I missing something ?
h1tag
@h1tag
Jun 02 2017 10:01
right
relikt
@reliktus
Jun 02 2017 10:02
@h1tag not good
@reliktus any advice on the weather api over https ?
h1tag
@h1tag
Jun 02 2017 10:04
@reliktus darksky, apixu
PipsChips
@PipsChips
Jun 02 2017 10:06
Hi! Since darksky.net recommends not to show a given secret (API) key publicly, I toguht of saving the key as .txt file, on my computer, and then uploading the file from my PC, into a JS variable (as a string). Could someone pls tell me how to do this, or point me to some resources; or maybe there's another way of hiding the key's value inside JS code...? Thnx
h1tag
@h1tag
Jun 02 2017 10:08
@PipsChips I think you need back-end knowledge to do it
Aniket
@Aniket1994
Jun 02 2017 10:08
Hey guys...this is my first tribute page....can you guys please rewiew and let me know if it can be better..!
relikt
@reliktus
Jun 02 2017 10:10
@h1tag thank You again, Ill give it a try
CamperBot
@camperbot
Jun 02 2017 10:10
reliktus sends brownie points to @h1tag :sparkles: :thumbsup: :sparkles:
:warning: reliktus already gave h1tag points
relikt
@reliktus
Jun 02 2017 10:12
back to coding , by
Kris Baillargeon
@krisb1220
Jun 02 2017 10:23
anybody have more trouble with the design aspect less than the code aspect? tips?
h1tag
@h1tag
Jun 02 2017 10:24
@krisb1220 yes, ofc, freecodecamp doesn't teach you design
Kris Baillargeon
@krisb1220
Jun 02 2017 10:25
so I'm not the only one who is struggling with these projects trying to make them perfect? :P
well, i'll be damned :P
h1tag
@h1tag
Jun 02 2017 10:26
but there's some css and bootstrap
don't try to make them perfect at this point, just ship it and improve them later
when u learn more about design
leomartin
@abhirupleo
Jun 02 2017 10:26
can someone help me with the weather app
here is the codepen
link
Kris Baillargeon
@krisb1220
Jun 02 2017 10:27
@Aniket1994 maybe some colors? I google color schemes when I'm in doubt. (i.e color schemes for color1 +color2 )
Also it's not good practice to put css in the <style> tag unless absolutely necessary but otherwise good job!
h1tag
@h1tag
Jun 02 2017 10:31
@abhirupleo you're getting a CORS error on the browser console. add ?callback=? at the end, like this https://api.darksky.net/forecast/7a081737f1d96a569ac7f55a559782c2/42.3601,-71.0589?callback=?
leomartin
@abhirupleo
Jun 02 2017 10:31
okay thanks @h1tag
CamperBot
@camperbot
Jun 02 2017 10:31
abhirupleo sends brownie points to @h1tag :sparkles: :thumbsup: :sparkles:
:cookie: 823 | @h1tag |http://www.freecodecamp.com/h1tag
PipsChips
@PipsChips
Jun 02 2017 10:32
@h1tag
Thank you for the response! Though, this answers are too much for me; I decided to just put (key) it in my code, since I believe it's not inappropriate for this kind of usage (FFC project)... I've managed my URL to work properly, but still can't get a JSON object to manipulate with, due to a problem with CORS...
CamperBot
@camperbot
Jun 02 2017 10:32
pipschips sends brownie points to @h1tag :sparkles: :thumbsup: :sparkles:
:cookie: 824 | @h1tag |http://www.freecodecamp.com/h1tag
h1tag
@h1tag
Jun 02 2017 10:33
@abhirupleo wait
Kris Baillargeon
@krisb1220
Jun 02 2017 10:33
This message was deleted
crap wrong link
thoughts? lol
leomartin
@abhirupleo
Jun 02 2017 10:35
yeah ?
@h1tag
h1tag
@h1tag
Jun 02 2017 10:35
@abhirupleo it didn't work, right?
PipsChips
@PipsChips
Jun 02 2017 10:35
@h1tag
I managed to get a JSON by adding a '?callback=?' at the end of URL. tnhx
leomartin
@abhirupleo
Jun 02 2017 10:35
yeah it didn't work
h1tag
@h1tag
Jun 02 2017 10:36
@abhirupleo I judged the situation without taking a close look at the code, I'll try to figure out what the pronlem is
leomartin
@abhirupleo
Jun 02 2017 10:36
okay sure
BrunoM24
@BrunoM24
Jun 02 2017 10:39
Hey codders, Im doing the TwitchTv project, I need the user information or the channels, I cannot find the difference
h1tag
@h1tag
Jun 02 2017 10:40
@abhirupleo where did u get this .selector parameter in the click listener from?
leomartin
@abhirupleo
Jun 02 2017 10:41
oh sorry i have to remove it
i was using the sublime snippets
and it put it there on it's own
okay i removed it and it's working now i thikn
h1tag
@h1tag
Jun 02 2017 10:42
no, wait
leomartin
@abhirupleo
Jun 02 2017 10:43
it's returning an error
as response
Ayush Kumar
@Gr8ayu
Jun 02 2017 10:43
I am making wikipedia viewer, how can I get related search results for searched keywords??https://codepen.io/FreeCodeCamp/full/wGqEga/
h1tag
@h1tag
Jun 02 2017 10:44
@abhirupleo remove ?callback=? and change datatype to dataType: 'jsonp' and remove data: {}
@Gr8ayu did u check the wikipedia API documentation?
Ayush Kumar
@Gr8ayu
Jun 02 2017 10:45
@h1tag I did but didnt understood what it says
leomartin
@abhirupleo
Jun 02 2017 10:46
okay
leomartin
@abhirupleo
Jun 02 2017 10:47
it's still throwing an error
MadsSN
@MadsSN
Jun 02 2017 10:47
Does someone have a suggestion for why the button's move when you click them? https://codepen.io/MadsSN/pen/OgLxdo
h1tag
@h1tag
Jun 02 2017 10:47
@Gr8ayu is there an exact thing u don't understand?
@abhirupleo did you save your code?
@abhirupleo you have a typo
Ayush Kumar
@Gr8ayu
Jun 02 2017 10:50
@h1tag I didnt find the api link which I am supposed to write in my codes, also the format of api(key/value pair) through which I will use value for my variables
@h1tag like in weather challenge -> there was proper structure of API was given as{temp:23,humidity:0.5......}
h1tag
@h1tag
Jun 02 2017 10:52
@Gr8ayu so, you're receiving an object?
Ayush Kumar
@Gr8ayu
Jun 02 2017 10:53
@h1tag I dont have any link to get that
h1tag
@h1tag
Jun 02 2017 10:55
@Gr8ayu do you see the simple example section in the API documentation?
Ayush Kumar
@Gr8ayu
Jun 02 2017 10:56
@h1tag please give that link
h1tag
@h1tag
Jun 02 2017 10:57
@Gr8ayu I can't point you to that exact part of the page, it's in the first link you gave to me
there's "A simple example" section there
Ayush Kumar
@Gr8ayu
Jun 02 2017 10:57
h1tag
@h1tag
Jun 02 2017 10:57
yes
h1tag
@h1tag
Jun 02 2017 11:01
@Gr8ayu you don't have to use this exact one, there's are variables you can change in the URL, like the action, but all you need is in this section
now start reasearching it
Ayush Kumar
@Gr8ayu
Jun 02 2017 11:03
@h1tag thnx
CamperBot
@camperbot
Jun 02 2017 11:03
gr8ayu sends brownie points to @h1tag :sparkles: :thumbsup: :sparkles:
:cookie: 825 | @h1tag |http://www.freecodecamp.com/h1tag
Thomas
@sjurs1
Jun 02 2017 11:05

I'm trying to store a search bar input as a variable. Isn't this a way to do it?

var searchQuery = $("#searchQuery").val();

My input element has the searchQuery ID

it's for the Wikipedia viewer by the way
h1tag
@h1tag
Jun 02 2017 11:07
@sjurs1 yes
Thomas
@sjurs1
Jun 02 2017 11:08
@h1tag I'm logging it to console, but it just gives me an empty string
h1tag
@h1tag
Jun 02 2017 11:08
@sjurs1 is the code on codepen?
Thomas
@sjurs1
Jun 02 2017 11:11
h1tag
@h1tag
Jun 02 2017 11:14
@sjurs1 you have to add some listener or a button, so that when you click it knows it needs to get the value from the serachbar
PipsChips
@PipsChips
Jun 02 2017 11:15
@h1tag
sorry for bothering you, can you pls help me with my last step: getting the weather icon from a given JSON object. Here's my code: https://codepen.io/PipsChips/pen/XpYvdm
h1tag
@h1tag
Jun 02 2017 11:17
@PipsChips I didn't user weather icons for my project. Does the object u receive from Darksky has icons in it?
PipsChips
@PipsChips
Jun 02 2017 11:19
an object has the 'icon' property, with a string value (like: partly-cloudy-day)...
I mean JSON object*
h1tag
@h1tag
Jun 02 2017 11:20
@PipsChips did you try to access it?
PipsChips
@PipsChips
Jun 02 2017 11:22
yes, it's a string
Lovro Mekiš
@LovroM
Jun 02 2017 11:23
@PipsChips You get a string alright, but you need a url to display it
<img id="icon" src="partly-cloudy-day.png" alt="weather_icon"> That is your final html
to find this picture you would have to have it in your root directory
But you can't do that on codepen
PipsChips
@PipsChips
Jun 02 2017 11:26
I see, thnx.... gonna try this: http://darkskyapp.github.io/skycons/
leomartin
@abhirupleo
Jun 02 2017 11:33
@h1tag where do i have a typo
?
h1tag
@h1tag
Jun 02 2017 11:37
@abhirupleo datatype should be dataType
leomartin
@abhirupleo
Jun 02 2017 11:37
oh ohka
SavvasLimassol
@SavvasLimassol
Jun 02 2017 11:43
Hello guys, can someone tell me why my social media icons look so weird?
https://codepen.io/SavvasLimassol/pen/JJPzrr
Thomas
@sjurs1
Jun 02 2017 11:45
@h1tag , would this be a good start or do you see any glaring faults?
$(document).ready(function() {
  $("button").click(function() {
    var searchQuery = $("#searchQuery").val();
    getArticle(searchQuery);
  });
});

function getArticle(searchWord) {
  $.ajax({
    type: "GET",
    url: "https://en.wikipedia.org/w/api.php?format=json&action=query&prop=extracts&exintro=&explaintext=&titles=" +
      searchWord
  });
}
I'll link the pen again for good measure
h1tag
@h1tag
Jun 02 2017 11:57
@sjurs1 it should. But I'm not getting a result, tried logging the data but I didn't see thing. Also, it's better to give your button an id and use that as the selector, incase u have more than 1
Chris
@ChrisGitter
Jun 02 2017 12:11
in React, when I update props of a component, is there a problem somewhere when my child components unmount and re-mount straight after? Or can that sort of thing happen sometimes?
abraham anak agung
@padunk
Jun 02 2017 12:11
@SavvasLimassol i think you should put font awesome like this <i>fa fa-facebook</i>
and play around with your width and height and padding-top.
relikt
@reliktus
Jun 02 2017 12:19
hi there i got back to weather app which stoped working beacuse the api which didnt support the HTTPS
so i changed the geolocation and get data from html5 geolocation
and switched to the darkskyapi
but even after that i got the cross origin error in console
any suggestions?
Exactly: Access-Control-Allow-Origin error
while trying to get data from API
api adres is ok
kirbyedy
@kirbyedy
Jun 02 2017 12:24
@reliktus add this to your api call line ?callback=?
@SavvasLimassol explain weird ? :)
relikt
@reliktus
Jun 02 2017 12:25
ok
just figured it out :D
second ago :D
@kirbyedy but again thanks alot :D
CamperBot
@camperbot
Jun 02 2017 12:26
reliktus sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 2091 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
relikt
@reliktus
Jun 02 2017 12:26
back to codding :D
PipsChips
@PipsChips
Jun 02 2017 12:29
is there a way to use a string (e.g. stored in a variable) as a part of a function (call) name?
https://codepen.io/PipsChips/pen/XpYvdm
Lovro Mekiš
@LovroM
Jun 02 2017 12:30
I just started the first react project and got it to parse text to html but Im lost with why it is not changing when adding text...Anybody have any ideas? https://codepen.io/LovroM/pen/WwwQva?editors=0010
@PipsChips There is, but musn't be used
In the "go-to" category
Try to find another way, maybe an if() check
or switch if you have more of them
Joshua Briley
@somecallmejosh
Jun 02 2017 12:38
Reposting from Help channel...

Anyone else having a hard time interpreting the Twitch API docs? I can’t seem to find anything on loading multiple users.

Looking at this: https://api.twitch.tv/kraken/users/<user ID> Do I need to do a separate Ajax request for each user I want to load, or can I include a list of user ID’s in the URL?

JD Tadlock
@jdtdesigns
Jun 02 2017 12:40
You have to fire a request for each user @somecallmejosh
Joshua Briley
@somecallmejosh
Jun 02 2017 12:41
OK. That makes sense. Looking at the data this returns:
https://wind-bow.glitch.me/twitch-api/channels/freecodecamp?callback=?
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 12:41
hello is someone here good with git and github I been stuck for 3 days finally i went to the GUI and deleted my new repo.. please help.
Lovro Mekiš
@LovroM
Jun 02 2017 12:41
@Mr-Henderson udacity lesson for github was an eye opener for me
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 12:41
its for the Personal portfolio page
JD Tadlock
@jdtdesigns
Jun 02 2017 12:42
@Mr-Henderson what's the issue?
Joshua Briley
@somecallmejosh
Jun 02 2017 12:42
Thanks @jdtdesigns
CamperBot
@camperbot
Jun 02 2017 12:42
somecallmejosh sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:star2: 1008 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
JD Tadlock
@jdtdesigns
Jun 02 2017 12:43
@somecallmejosh Same data, just no api key required. You can get more data from twitch, but it's not really needed for the challenge.
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 12:43
@jdtdesigns 1. Open terminal and git status all working directories clean... first I cloned with git clone and the given .git URL from the travel site which I am turning into portfolio page... let me see if I can just run through to show you the problem its hard to explain...
  1. Ok notice in the screen shot it references travel site notice the file architecture tree that I am on yet it says origin travel site... it seems this should have the new origin instead which should be portfolio... not sure even how to delete the new repo manually in github and start over ... it seems I am only a few commands away from fixing this... yet how do I get to the screen that shows all my files on the GUI in Github for the new portfolio site created from the travel site..?
Joshua Briley
@somecallmejosh
Jun 02 2017 12:43
I don’t see anything that suggests a live status… Are you running some sort of logic to determine a live status?
I deleted the repo now trying to start over fresh and hopefully remove that commit instance on the travel site which I did inadvertantly
JD Tadlock
@jdtdesigns
Jun 02 2017 12:45
@somecallmejosh just call streams/:user
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 12:45

here are the other notes instead of typing them again: 1. I deleted the local machine portfolio folder with all app files...

  1. deleted the repo in the Github User interface..

  2. When i go to the GUI for the travel site it still has the README.md that I accidently uploaded and committed my idea is to do git remove to remove it yet is there some way to make it like it didnt happen because it will show this in the history right??

  3. I am going to begin from scratch can you tell me which commands to issue such that in terminal the machine will a) Put all files in a folder on local machine.b) make initial commit with message showing all the app files on GIthub in the new portfolio repo when I click commits on the GUI. d.) from this point I can actually start coding and continue as I normally would committing all changes in markup.

Joshua Briley
@somecallmejosh
Jun 02 2017 12:46
@jdtdesigns - You rock! Thanks, buddy!
CamperBot
@camperbot
Jun 02 2017 12:46
somecallmejosh sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: somecallmejosh already gave jdtdesigns points
InHo
@goceman86
Jun 02 2017 12:48
hey guys running into a issue with pulling buttons to the right of the page for some reason it when i use pull-right class. it just pulls the button up can you guys take a look at the code. its the last button "contact me" heres the codepen link https://codepen.io/goceman86/pen/xdeoQv
JD Tadlock
@jdtdesigns
Jun 02 2017 12:53
@Mr-Henderson
1. git clone <url> portfolio 
2. git remote set-url origin <your new git repo url>
3. git add .
4. git push origin master
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 12:54
that looks like something I havent tried yet lol
let me give that a shot.. number 2 looks like it will work
JD Tadlock
@jdtdesigns
Jun 02 2017 12:55
Then you can run git push --set-upstream origin master on your next push to save the master branch as default. Then you'll just need to run git push when you want to update master
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 12:55
ahhh so #1 git clone I put the wrong URL perhaps for the travel site?
JD Tadlock
@jdtdesigns
Jun 02 2017 12:56
@Mr-Henderson #1 is where you get the url of the repo you want to clone
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 12:56
on my account sorry if Im not using the correct terminology
I litterally only want to copy the files and call it a different repo
with terminal
so I guess I cant fork because its on the same account right perhaps clone is incorrect
in other words I built the travel site its an old nodejs project
JD Tadlock
@jdtdesigns
Jun 02 2017 12:59
@Mr-Henderson Forking is done when you want to contribute to a project
Thomas
@sjurs1
Jun 02 2017 13:00
@h1tag Yeah I'll add an id to the button even though I'm probably not gonna have more than one. And yeah I'll have to check my API call again I think. Thanks for the help!
CamperBot
@camperbot
Jun 02 2017 13:00
sjurs1 sends brownie points to @h1tag :sparkles: :thumbsup: :sparkles:
:cookie: 826 | @h1tag |http://www.freecodecamp.com/h1tag
InHo
@goceman86
Jun 02 2017 13:00
can someone help me out
JD Tadlock
@jdtdesigns
Jun 02 2017 13:00
if you're just putting the code on your comp so you can start from where the project was, there's no reason to fork
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:00
ok ... say you have a template site and want to make another fresh repo from it whats the easiest way for this in terminal?
JD Tadlock
@jdtdesigns
Jun 02 2017 13:01
make a new repo in github and then follow the same order I gave you
Ken Haduch
@khaduch
Jun 02 2017 13:01
@goceman86 - yes, you should ask your question and you'll get help. You don't need to ask for help!
JD Tadlock
@jdtdesigns
Jun 02 2017 13:01
@Mr-Henderson
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:01
ok yes fork is for contibuting... I guess cloning is for cloning someone eleses file for use...
ok Ill give that a shot
brb thanks
JD Tadlock
@jdtdesigns
Jun 02 2017 13:02
;)
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:03
@jdtdesigns shall I initialize with README supposidly its easier this way for somereason
InHo
@goceman86
Jun 02 2017 13:03
@khaduch i did but no one responded heres the issue im running into a issue with pulling buttons to the right of the page for some reason it when i use pull-right class. it just pulls the button up can you guys take a look at the code. its the last button "contact me" heres the codepen link https://codepen.io/goceman86/pen/xdeoQv
Ken Haduch
@khaduch
Jun 02 2017 13:04
@goceman86 - sometimes things get busy and they scroll off the screen, and it's hard to go back and find them. I'll take a look, and others will, too.
InHo
@goceman86
Jun 02 2017 13:04
@khaduch kool thx
CamperBot
@camperbot
Jun 02 2017 13:04
goceman86 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2936 | @khaduch |http://www.freecodecamp.com/khaduch
JD Tadlock
@jdtdesigns
Jun 02 2017 13:05
@Mr-Henderson You can. It's no big deal to add it later. You would just create a README.md locally and then when you git add ., it will be on the repo ;)
InHo
@goceman86
Jun 02 2017 13:05
its weird cuz ive tried using css to pull right and got the recommendation to try and just at it to the class but both did the same issue @khaduch
Ken Haduch
@khaduch
Jun 02 2017 13:06
@goceman86 - you aren't including Bootstrap.css in the normal place for CodePen - those CSS URLs should be loaded in the CSS config panel - otherwise things could go wrong, as CodePen loads the page using a template. Let's try moving those and see if it changes.
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:06
that seems easy enough haha shouldnt take 3 days hopefully for that
kirbyedy
@kirbyedy
Jun 02 2017 13:06
@goceman86
  <button class="btn-primary cmbtn pull-right"><a href="#" class="btnfont" style="font-family:'Lobster'; font-size:1.8em;">Contact Me</a></button>
InHo
@goceman86
Jun 02 2017 13:07
@khaduch not to sure what you mean you mean to go into the setting and quick add bootstrap?
kirbyedy
@kirbyedy
Jun 02 2017 13:08
Screen Shot 2017-06-02 at 16.07.33.png
is this what you want ?
InHo
@goceman86
Jun 02 2017 13:08
@kirbyedy yes oh my god i see where i went wrong i placed the class in the anchor
Ken Haduch
@khaduch
Jun 02 2017 13:08
@goceman86 - you can do that, b ut it will add Bootstrap V4 - just copy the URL that you have and paste it in one of the external resource slots. Same for your font.
InHo
@goceman86
Jun 02 2017 13:09
jezz im retarded lol tried so many different things lol @kirbyedy
kirbyedy
@kirbyedy
Jun 02 2017 13:09
@goceman86 it will be better dough, to move all your styling into the css section
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:09
@jdtdesigns gonna call my portfolio Camp Code haha because Im litterally Coding in a camper all over the country... we are in SoCal by Elsinore now... hopefully we get service in Denali National park haha plan on staying there for a while
InHo
@goceman86
Jun 02 2017 13:09
@khaduch thx
CamperBot
@camperbot
Jun 02 2017 13:09
goceman86 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:warning: goceman86 already gave khaduch points
InHo
@goceman86
Jun 02 2017 13:10
@kirbyedy yeah i tried that and for some reason had the weird issue let me try it again
Alexie Nepeh
@Nepeh
Jun 02 2017 13:10
@goceman86 Check this out....https://codepen.io/goceman86/pen/xdeoQv.....is this what you want?
JD Tadlock
@jdtdesigns
Jun 02 2017 13:12
@Mr-Henderson Haha, nice! My dream come true
InHo
@goceman86
Jun 02 2017 13:13
@kirbyedy i use float:right correct?
Ken Haduch
@khaduch
Jun 02 2017 13:13
@goceman86 - just make sure that you don't load bootstrap twice - remove those links from the HTML panel (and your quick-add of Bootstrap is V4, CodePen's default. Make sure that you are using the proper reference material to get the classes. Stick with the V3 version if you are trying things based on the freeCodeCamp lessons...)
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:14
it took 10 years now I have time to learn programming... all you need is 5 houses Im on #5 now. 10 years of focus and thats beggining with TERRIBLE CREDIT... made the repo now heading to the terminal ... @jdtdesigns
kirbyedy
@kirbyedy
Jun 02 2017 13:14
@goceman86 no I used bootstraps pull-right
InHo
@goceman86
Jun 02 2017 13:14
@khaduch oh ok
@kirbyedy well i mean in the css how does that work .cmbtn{ ?:pull-right;}
kirbyedy
@kirbyedy
Jun 02 2017 13:16
@goceman86 I was referring to the font style and type
that one should go to the css
InHo
@goceman86
Jun 02 2017 13:17
ah ok
kirbyedy
@kirbyedy
Jun 02 2017 13:17
pull right remains in the html
InHo
@goceman86
Jun 02 2017 13:17
@kirbyedy ah ok thank you
CamperBot
@camperbot
Jun 02 2017 13:17
goceman86 sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 2092 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
InHo
@goceman86
Jun 02 2017 13:17
@kirbyedy ill be sure to clean that up you right that sounds much more proper
kirbyedy
@kirbyedy
Jun 02 2017 13:17
font-family:'Lobster'; font-size:1.8em; all of this
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:22
@jdtdesigns ok I created a new file on local machine called camp-code it has zero files in it... my idea is to copy the files over and then do steps #2,3,4 because im not cloning right...?
wow I finally am showing a commit haha
I will wait dont want to mess this up
  1. git clone <url> portfolio
  2. git remote set-url origin <your new git repo url>
  3. git add .
  4. git push origin master
Ashley Owens
@yelhsa
Jun 02 2017 13:26
I do not understand how to space so that my title is on the left and the menu is on the right if anyone could help that'd be great. https://codepen.io/yelhsa/pen/YQKewG
Juan Carlos Orozco
@juank0610
Jun 02 2017 13:34
Hello! @all/
Tom
@moT01
Jun 02 2017 13:36
@yelhsa ive used flexbox to accomplish this https://css-tricks.com/snippets/css/a-guide-to-flexbox/
but theres probly many ways
@juank0610 hey
Ken Haduch
@khaduch
Jun 02 2017 13:37
@yelhsa - one thing - the class for the container is container-fluid NOT fluid-container - that makes a difference
Ashley Owens
@yelhsa
Jun 02 2017 13:37
:) Thanks! I'll give it a try @moT01
CamperBot
@camperbot
Jun 02 2017 13:37
yelhsa sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 680 | @mot01 |http://www.freecodecamp.com/mot01
Ashley Owens
@yelhsa
Jun 02 2017 13:38
thanks @khaduch that helped with my keep my text on the screen problem lol
CamperBot
@camperbot
Jun 02 2017 13:38
yelhsa sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2937 | @khaduch |http://www.freecodecamp.com/khaduch
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:41
so confused why wont this thing recognize my local files with git status and then commit... it shows working directory clean yet only README.md on the repo... how do I stage all the files on my local folder to go to the repo
Tom
@moT01
Jun 02 2017 13:43
i dont know a whole lot there, @Mr-Henderson , but i think theres an add command to stage the files
git add file
before you commit
Matúš Námešný
@LordMathis
Jun 02 2017 13:43
git add .
Tom
@moT01
Jun 02 2017 13:43
might be what you're looking for
Matúš Námešný
@LordMathis
Jun 02 2017 13:43
to add the whole working directory
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:44
@jdtdesigns told me to do this 1. git clone <url> portfolio
  1. git remote set-url origin <your new git repo url>
  2. git add .
  3. git push origin master
yet it seems like if I clone it will mess something up.. let me try the git add .
James Bouchard
@jdbouch
Jun 02 2017 13:45
I'm working on the Weather API and using ip-api.com/json but my Geolocation is coming back with the routers geolocation in Texas. I'm not in Texas. How do I get my "local" location? Thanks.
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:45
on google maps right click settings menu its in there... the coords
use a mobile device right click and share your location
set location on
Juan Carlos Orozco
@juank0610
Jun 02 2017 13:47
I have an issue with a jquery accordion (so classic). I have various accs for various sections (one for each section) with products in the content, and i also have a function that filters de products inside all acc pans according to another parameter (one is product type filters and the other is brand acc sections). The thing is: i need each accordion to open when i click a filter (done) ONLY IF it is going to show products, else it should remain closed (or be disabled). What i found out is no matter if i use .delay(), .ready(), .setTimeout() it always reads the visibility of products while opening and at the same time they are transitioning (according to the filter function)
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:47
this will let you email yourself the coords or text it to your laptop
@jdbouch
or @jdbouch type in your location on laptop google maps then you will see the coords
Tom
@moT01
Jun 02 2017 13:50
that probly wont work for that project though
Ken Haduch
@khaduch
Jun 02 2017 13:50
@jdbouch - if you are going to use CodePen, it will require you to use https:// and then you should be able to use the geolocation API. So that's the way to do it, and the recommendation (as I recall) is going to be to use the "darksky" site, which supports https access.
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:53
yeh you have to share location info with google Im having a problem finding my coorinates on the laptop now
JD Tadlock
@jdtdesigns
Jun 02 2017 13:53
@Mr-Henderson Did you have issues or are you helping somebody?
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:53
Yesu I still have issues so I was helping him find coordinates on maps its right in the URL @jdbouch
@jdtdesigns I got stuck on that 4 step process I was nervous to clone because the conditions changed since you told me that
so I didnt do step 1
heres the new repo
JD Tadlock
@jdtdesigns
Jun 02 2017 13:55
did you already code some stuff that's newer than the repo you're cloning?
@Mr-Henderson
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:56
well I took the files from travel site created local camp-code folder and pasted the travel site into the folder,.,.
JD Tadlock
@jdtdesigns
Jun 02 2017 13:57
so you had all the files locally already?
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:57
yes
on my old travel-site folder
there is also a travel site repo
JD Tadlock
@jdtdesigns
Jun 02 2017 13:57
you're just needing to push that to a new repo?
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:57
yes lol I know it seems super easy right
just push the files to the new repo somehow and messege the commit
JD Tadlock
@jdtdesigns
Jun 02 2017 13:58
1. git remote add origin <new repo url>
2. git add .
3. git commit -m 'initial'
4. git push --set-upstream origin master
and done ;)
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 13:59
ok haha I was super nervous about #1
JD Tadlock
@jdtdesigns
Jun 02 2017 13:59
that just links your local repo with the github repo
no worries
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 14:01
ok so I will paste this ? git remote add origin https://github.com/Mr-Henderson/CampCode.git for #1
JD Tadlock
@jdtdesigns
Jun 02 2017 14:01
yep
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 14:01
ok here it goes
JD Tadlock
@jdtdesigns
Jun 02 2017 14:01
if you cloned, you'll have to use the set-url from earlier
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 14:02
I did not clone
JD Tadlock
@jdtdesigns
Jun 02 2017 14:02
ok, should work then ;)
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 14:02
#1 I made completely new folder
k
JD Tadlock
@jdtdesigns
Jun 02 2017 14:02
did you git init?
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 14:02
yes
JD Tadlock
@jdtdesigns
Jun 02 2017 14:02
alright, go for it
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 14:03
let me paste my terminal if I can figure how to upload again the image
fatal: remote origin already exists.
Xarri Jorge
@xarrijorge
Jun 02 2017 14:05
@Mr-Henderson that is a git error right?
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 14:05
yes
james@james-Satellite-P775:~/Desktop/sites/camp-code$ git remote add origin https://github.com/Mr-Henderson/CampCode
fatal: remote origin already exists.
james@james-Satellite-P775:~/Desktop/sites/camp-code$ git remote add origin https://github.com/Mr-Henderson/CampCode.git
fatal: remote origin already exists.
james@james-Satellite-P775:~/Desktop/sites/camp-code$ git status
On branch master
Your branch is up-to-date with 'origin/master'.
nothing to commit, working directory clean
james@james-Satellite-P775:~/Desktop/sites/camp-code$
yet no files exist here except read me from the check box I toggled on... https://github.com/Mr-Henderson/CampCode
this looks super easy from the GUI yet doesnt seem to be working from terminal
Im doing something wrong
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 14:11
image.png
??
hmm perhaps the files need to be changed first not sure why it doesnt recognize them as new files if I pasted them in the folder... perhaps the folder is not being tracked ? no clue what to do
Juan Carlos Orozco
@juank0610
Jun 02 2017 14:13
@all
JD Tadlock
@jdtdesigns
Jun 02 2017 14:13
@Mr-Henderson git push origin master -f
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 14:14
k battery dying ill try
FINNALLY its doing something so that was a force push yes??
like Star Wars thats why it works
hahaha
JD Tadlock
@jdtdesigns
Jun 02 2017 14:16
@Mr-Henderson exactly, we used the force
Toby J. Henderson
@Mr-Henderson
Jun 02 2017 14:16
off course use the force
works every time
battery intermittent inverter not charging fast enough thank you so much
cya later
here it is https://github.com/Mr-Henderson/CampCode with all the files finally I can actually code this thing
JD Tadlock
@jdtdesigns
Jun 02 2017 14:20
welcome ;)
WizardlySundew
@wizardlysundew
Jun 02 2017 14:21
are we supposed to use divisions for the tribute page?
David Sevilla
@Zuben-Elgenubi
Jun 02 2017 14:22
Hi Guys, I am having some trouble with my "tribute page". I am trying to get the border around my image to be a constant size no matter the size of browser
here is what i have so far https://codepen.io/Efacelanroig/pen/Mogvpr
Thomas Lawless
@tlawless94
Jun 02 2017 14:23
would anyone know why this code isn't triggering the function calcOperate
<button class="calcButton decimal" id="decimal">.</button>

$("#decimal").on("click", function (){ calcOperate("decimal", ".")});

function calcOperate (keyPressed, keyValue){
  switch (calcVars.state){
    case states.on:
      if(keyPressed === "decimal"){
        calcVars.state = states.firstArgFloat;
        calcVars.dispVal = keyValue;
        console.log(calcVars.dispVal);
        displayText();
      }
Tim Mannino
@kettultim
Jun 02 2017 14:26
@tlawless94 is that your whole code? you're missing closing brackets...
Thomas Lawless
@tlawless94
Jun 02 2017 14:27
@kettultim no its not haha there's a closing bracket
Tom
@moT01
Jun 02 2017 14:27
$("#decimal").on("click", calcOperate("decimal", ".")); maybe that? not sure
Tim Mannino
@kettultim
Jun 02 2017 14:27
lol ok just making sure ;);)
um..
Tom
@moT01
Jun 02 2017 14:28
@Efacelangroig what are you trying to do?
Tim Mannino
@kettultim
Jun 02 2017 14:28
looks right to me
David Sevilla
@Zuben-Elgenubi
Jun 02 2017 14:29
@moT01 there is a margin around my picture with a caption.
Tim Mannino
@kettultim
Jun 02 2017 14:29
any js errors @tlawless94 ?
Thomas Lawless
@tlawless94
Jun 02 2017 14:29
@moT01 I don't think that works either I just tried implementing it thanks tho also thanks @kettultim
CamperBot
@camperbot
Jun 02 2017 14:29
tlawless94 sends brownie points to @mot01 and @kettultim :sparkles: :thumbsup: :sparkles:
:cookie: 681 | @mot01 |http://www.freecodecamp.com/mot01
:cookie: 187 | @kettultim |http://www.freecodecamp.com/kettultim
Tom
@moT01
Jun 02 2017 14:30
@tlawless94 do you make the click?
Tim Mannino
@kettultim
Jun 02 2017 14:30
can u throw it up in a fiddle or a pen?
Thomas Lawless
@tlawless94
Jun 02 2017 14:30
@moT01 oh wow I just changed around some of the ids of divs apparently #+ is causing problems
David Sevilla
@Zuben-Elgenubi
Jun 02 2017 14:30
@moT01 when I open my tribute page full size the box with the caption expands. I am trying to keep the box around the image on a constant distance from the image
Tom
@moT01
Jun 02 2017 14:30
did you add jquery?
WizardlySundew
@wizardlysundew
Jun 02 2017 14:31
Thomas Lawless
@tlawless94
Jun 02 2017 14:31
@moT01 yeah it's looking like a syntax error in a function above it rn
Tom
@moT01
Jun 02 2017 14:32
@Efacelangroig i think what you want to do is give your image a padding and add a border https://css-tricks.com/almanac/properties/b/border/
tanaya2017
@tanaya2016
Jun 02 2017 14:32
@wizardlysundew wrap it inside a container div and try
idk is that centred
or was that just the jumbtron
David Sevilla
@Zuben-Elgenubi
Jun 02 2017 14:33
@moT01 Thanks I will give it a try
CamperBot
@camperbot
Jun 02 2017 14:33
efacelangroig sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 682 | @mot01 |http://www.freecodecamp.com/mot01
tanaya2017
@tanaya2016
Jun 02 2017 14:34
@wizardlysundew This one looks better. Add some margin
Bill Hefty
@bhefty
Jun 02 2017 14:36
@wizardlysundew Change your class from "text-centre" to text-center
WizardlySundew
@wizardlysundew
Jun 02 2017 14:40
AHAHH
lol as u can tell my australian #centrelink
whats the best way to do the margin?
David Sevilla
@Zuben-Elgenubi
Jun 02 2017 14:41
@moT01 I added the padding and the border. It deffinitly looks nicer. But I still have the problem. The Image is responsive to size, but the box around is not.
tanaya2017
@tanaya2016
Jun 02 2017 14:43
@wizardlysundew you can use margin for specific div in css , use left-margin, right-margin etc.
Tom
@moT01
Jun 02 2017 14:43
save it so i can see @Efacelangroig
Maksim
@SirGoldman
Jun 02 2017 14:43
Do i need to use API for 'Build a Random Quote Machine', to get quotes? Or I can make them my self?
David Sevilla
@Zuben-Elgenubi
Jun 02 2017 14:44
@moT01 I just saved it, You can take a look at it
@moT01 on the editor view it looks good. But if I open it as a full page you can see that the box expands with the page
Gulsvi
@gulsvi
Jun 02 2017 14:46
@saeedjassani CORS is better than JSONP when you implement CORS :)
Technically, (and paranoically), you don't know who runs that CORS server - they can hijack your request and send back any response they want to your application. Also, you won't be notified if the server goes down, so your web application will fail. For a read-only request to a trusted API on a server (codepen) with an application like a free code camp quote machine, JSONP is preferred in my humble opinion :)
abraham anak agung
@padunk
Jun 02 2017 14:50
@LovroM Hi, i've been playing with your code for 2 hours. I am new with react too, so just curious with it. Why u use React 0.14.3?
Gulsvi
@gulsvi
Jun 02 2017 14:51
@SirGoldman You can do it either way - API is a good challenge I think. Lots of people use this one which has some good documentation: https://quotesondesign.com/api-v4-0/
David Sevilla
@Zuben-Elgenubi
Jun 02 2017 14:52
@moT01 I think I figure it out, It has to do with the max-width
Maksim
@SirGoldman
Jun 02 2017 14:52
@SkyC0der Yea i founded that too. But I just wondered, if you should do it. Thanks for advice :)
CamperBot
@camperbot
Jun 02 2017 14:52
sirgoldman sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1595 | @skyc0der |http://www.freecodecamp.com/skyc0der
Tom
@moT01
Jun 02 2017 14:54
@Efacelangroig there ya go
yea, i didnt get it
Kien Ngoc Nguyen
@tgsoon2002
Jun 02 2017 14:57
hi guys. I'm trying to make the navbar.
Brian
@Cornielle
Jun 02 2017 14:57
do it xd
Kien Ngoc Nguyen
@tgsoon2002
Jun 02 2017 14:57
so far the bar is not showing the sideway but it align vertical
Brian
@Cornielle
Jun 02 2017 14:58
can we see your pen? pls
Kien Ngoc Nguyen
@tgsoon2002
Jun 02 2017 14:58
they not align horizontal but vertical
i jsut copy the code from w3 and put in. idk what else missing on css and javascript.
Brian
@Cornielle
Jun 02 2017 14:59
read the documentation about align items in bootstrap
Maksim
@SirGoldman
Jun 02 2017 14:59
.nav.navbar-nav{
  display: inline-block;
}
Brian
@Cornielle
Jun 02 2017 14:59
but if you do the menu throught w3schools we can do a new css
yes , is fixed with that
Kien Ngoc Nguyen
@tgsoon2002
Jun 02 2017 15:01
hum.. sothe boostrap not make it already inline-block?
so does w3 already included that in their css?
Brian
@Cornielle
Jun 02 2017 15:01
they have but in this case just put that code and work
Kien Ngoc Nguyen
@tgsoon2002
Jun 02 2017 15:01
yeah it work. thanks
Brian
@Cornielle
Jun 02 2017 15:01
thanks for @SirGoldman
CamperBot
@camperbot
Jun 02 2017 15:01
cornielle sends brownie points to @sirgoldman :sparkles: :thumbsup: :sparkles:
:cookie: 262 | @sirgoldman |http://www.freecodecamp.com/sirgoldman
Maksim
@SirGoldman
Jun 02 2017 15:02
@Cornielle np :smile:
WizardlySundew
@wizardlysundew
Jun 02 2017 15:03
@junkiattan @bheftyhttps://codepen.io/wizardlysundew/pen/GmPoYR?editors=1101 i couldn't figure out the margin thing for the image -_-
Maksim
@SirGoldman
Jun 02 2017 15:06
@wizardlysundew You wan't to put image in the center?
Brian
@Cornielle
Jun 02 2017 15:11
img{margin-left: 10%!important; margin-right:10%; width:80%;}
will work
with responsive
@wizardlysundew when you want to move or change an img is important to think about percent values
Gulsvi
@gulsvi
Jun 02 2017 15:13
@tgsoon2002 Click "Settings" then click "CSS" and replace the link you have for bootstrap with this one: https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
Codepen adds a newer version of bootstrap that uses different HTML.
After you do that, remove all your custom CSS you created and it should look good!
@wizardlysundew Same issue for you ^^ replace the version of bootstrap you are using. Codepen uses a newer version by default, so classes like img-responsive, center-block, and col-xs-12 don't work.
Gulsvi
@gulsvi
Jun 02 2017 15:16
@Cornielle Yes, that's the last official release of Bootstrap 3
Brian
@Cornielle
Jun 02 2017 15:16
@SkyC0der thanks bro
CamperBot
@camperbot
Jun 02 2017 15:16
cornielle sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1596 | @skyc0der |http://www.freecodecamp.com/skyc0der
WizardlySundew
@wizardlysundew
Jun 02 2017 15:16
Thanks Dude! @Cornielle used alot of my time working out stuff lol
CamperBot
@camperbot
Jun 02 2017 15:16
wizardlysundew sends brownie points to @cornielle :sparkles: :thumbsup: :sparkles:
:cookie: 3 | @cornielle |http://www.freecodecamp.com/cornielle
WizardlySundew
@wizardlysundew
Jun 02 2017 15:17
jokes jus triggering u sky
thanks @SkyC0der
CamperBot
@camperbot
Jun 02 2017 15:17
:star2: 1597 | @skyc0der |http://www.freecodecamp.com/skyc0der
wizardlysundew sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
Brian
@Cornielle
Jun 02 2017 15:17
@wizardlysundew no problem but keep in mind the specification that @SkyC0der because is more professional
Aata-allah
@Atalaa
Jun 02 2017 15:24
Hi ! I am looking for an API for famous quotes movie, i cannot find, any help please ? Its for my Random Quote Machine project
Pagnito
@Pagnito
Jun 02 2017 15:24
@SkyC0der hey u on?
Gulsvi
@gulsvi
Jun 02 2017 15:25
@Atalaa Google pointed me to this one - but I haven't tried it: https://market.mashape.com/andruxnet/random-famous-quotes
They have a movies category
@Pagnito Hey
Aata-allah
@Atalaa
Jun 02 2017 15:26
@SkyC0der i didnt see the category, where can i find it
Pagnito
@Pagnito
Jun 02 2017 15:26
@SkyC0der i was wondering y do we specify the name of tthe queue in each method
(delay * 2, '_fx')
and y delay multiplied?
Aata-allah
@Atalaa
Jun 02 2017 15:27
@SkyC0der i find it thank u
CamperBot
@camperbot
Jun 02 2017 15:27
atalaa sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1598 | @skyc0der |http://www.freecodecamp.com/skyc0der
Pagnito
@Pagnito
Jun 02 2017 15:27
sorry, i just cant understand ur code yet lol, i feel like caveman looking at it
like when have two callbacks after map, i cant understand those either :(
Gulsvi
@gulsvi
Jun 02 2017 15:28
@Pagnito I'm not sure what's going on behind the scenes there and why that has to be repeated over and over again. Seems redundant
The two callbacks I could explain :)
Pagnito
@Pagnito
Jun 02 2017 15:28
sweet
Gulsvi
@gulsvi
Jun 02 2017 15:28
But adding the function is just one of those things that's required
Oh wait, by "two callbacks" you mean colors.map(color => next => ?
Pagnito
@Pagnito
Jun 02 2017 15:29
yea
Gulsvi
@gulsvi
Jun 02 2017 15:29
next() is a function inside the callback of .map(), not another callback function
Basically, the .map() callback returns a function called next()
and that just tells the queue what to process for each item in the array
(what to process next)
Pagnito
@Pagnito
Jun 02 2017 15:30
hmm, ok lemme try to explain it back to u
so u have a map function, to iterate thru the colors array
so does queue make it so each iteration executes instead of just the last one?
Gulsvi
@gulsvi
Jun 02 2017 15:32
Yes, it creates a queue of functions to run
InHo
@goceman86
Jun 02 2017 15:33

ok i think i have a misunderstanding of how col-*-* works
when i did this ``` <div class="col-sm-1">
<button class="btn-primary profbtn"><a href="#" class="btn">Profile</a></button>
</div>

<div class="col-sm-1">

<button class="btn-primary cmbtn"><a href="#" class="btn">Contact Me</a></button>
</div>```

the buttons arent on the same line but are 1 line down from each other. can someone explaine to me please whats wrong?

Gulsvi
@gulsvi
Jun 02 2017 15:33
similar to that stand in line challenge - where you have to add something to the end of the array and shift something off the front of the array. That's a queue. The .queue() is pushing a function to the end of the array, running the function at the beginning of the array, and then shifting it off. One at a time.
Not sure if :point_up: this version of the code is clearer
Pagnito
@Pagnito
Jun 02 2017 15:34
@SkyC0der yea i actuall alrdy went to babel and turned it back to regualr js lol
Gulsvi
@gulsvi
Jun 02 2017 15:35
okay :)
Pagnito
@Pagnito
Jun 02 2017 15:35
still having a hrd time understanding cuz a few things i lack
so if i say
Gulsvi
@gulsvi
Jun 02 2017 15:36
@goceman86 columns go in rows and rows go in containers. Be sure you have a div class="container" with a div class="row" first, before you use the columns
<div class="container">
  <div class="row">
    <div class="col-sm-1">
      <button class="btn-primary profbtn"><a href="#" class="btn">Profile</a></button>
    </div>
    <div class="col-sm-1">
      <button class="btn-primary cmbtn"><a href="#" class="btn">Contact Me</a></button>
    </div>
  </div>
</div>
Pagnito
@Pagnito
Jun 02 2017 15:38
var numbers = [1,2,3]
$(document).queue('fx', numbers.map(function(number) {
console.log(number)
})
it wont create que cuz there isnt a next function to creat the delay right?
and will simply print em all at once
InHo
@goceman86
Jun 02 2017 15:39
@SkyC0der thank you
Thomas Lawless
@tlawless94
Jun 02 2017 15:41
So I have an event listener for a click and on a click it's supposed to toggle the state of a calculator, however it seems like the click event spills over into the next function and triggers all the functions within it. Which means that when I press the on/off button it turns off and then on again immediately. Any solutions? Here's some of my code:
 $("#onOff").on("click", function () { calcOperate("onOff")});

function calcOperate (keyPressed, keyValue){
  switch (calcVars.state){
    //off state
    case states.off:
      if (keyPressed === "onOff"){
        changeBackColorOn();
        calcVars.state = states.on;
        console.log(calcVars.state);
      }

case states.on:
      if (keyPressed === "onOff"){
        allClear();
        displayText();
        changeBackColorOff();
        calcVars.state = states.off;
      }
InHo
@goceman86
Jun 02 2017 15:42
@SkyC0der so quick question
if i wanted to add another row the i would have to make a second <div class="row"> after the first row buttons? or have to make a completely seperate container?
Gulsvi
@gulsvi
Jun 02 2017 15:43
@Pagnito Yeah, that's correct
Matúš Námešný
@LordMathis
Jun 02 2017 15:43
@tlawless94 are you sure you aren't missing any closing brackets } ?
Pagnito
@Pagnito
Jun 02 2017 15:43
@SkyC0der sweet sweet, a step close
Gulsvi
@gulsvi
Jun 02 2017 15:43
@Pagnito I added some more code comments to the pen if you want to refresh
Pagnito
@Pagnito
Jun 02 2017 15:43
@SkyC0der ooh sweet dude thanks
CamperBot
@camperbot
Jun 02 2017 15:43
pagnito sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1599 | @skyc0der |http://www.freecodecamp.com/skyc0der
Matúš Námešný
@LordMathis
Jun 02 2017 15:43
@goceman86 you only need one container
Gulsvi
@gulsvi
Jun 02 2017 15:43
@goceman86 You would create another row, inside that same container
You can also create another container, if desired, up to you :)
Thomas Lawless
@tlawless94
Jun 02 2017 15:44
@LordMathis thanks, but that's abridged code haha do I need to put a semicolon after each switch?
CamperBot
@camperbot
Jun 02 2017 15:44
tlawless94 sends brownie points to @lordmathis :sparkles: :thumbsup: :sparkles:
:cookie: 326 | @lordmathis |http://www.freecodecamp.com/lordmathis
Gulsvi
@gulsvi
Jun 02 2017 15:44
The important thing - you can't have a container inside of another container.
Thomas Lawless
@tlawless94
Jun 02 2017 15:45
oh I'm not using break statements I think
Matúš Námešný
@LordMathis
Jun 02 2017 15:45
@tlawless94 no you don't need to
@tlawless94 yeah breaks are important
InHo
@goceman86
Jun 02 2017 15:47
also i know i sound like a idiot asking these questions but what exactly is the value part of the col-sm-* i dont really understand what the number represents .
is it the number of the brick in that size or the size of the button i dont understand like the difference between col-sm-1 and col-sm-2
MadsSN
@MadsSN
Jun 02 2017 15:48
Hey - Does someone have a suggest for why the "buttons" in the tic tac toe keeps jumping around?
https://codepen.io/MadsSN/pen/OgLxdo
Pagnito
@Pagnito
Jun 02 2017 15:48
@SkyC0der tho i understand what the next function does, i odnt understand how does it know to work on the elements of the array
Gulsvi
@gulsvi
Jun 02 2017 15:48
@goceman86 There can be up to 12 columns in a row - that number specifies the size of the column within that row
So, 6 means it takes up 6/12 of the row, or 50%
@Pagnito That's what the empty object is for and some jQuery magic I don't fully understand. Basically, the map() pushes the next() function into that object $({}) and then .queue uses that to track which functions to call and remove once they're done
Matúš Námešný
@LordMathis
Jun 02 2017 15:51
@MadsSN I had the same issue, I solved it by adding vertical-align: top to the divs that display the xs and os
Pagnito
@Pagnito
Jun 02 2017 15:51
@SkyC0der oh boi lol
MadsSN
@MadsSN
Jun 02 2017 15:52
@LordMathis Thanks - I'll try it out :)
CamperBot
@camperbot
Jun 02 2017 15:52
madssn sends brownie points to @lordmathis :sparkles: :thumbsup: :sparkles:
:cookie: 327 | @lordmathis |http://www.freecodecamp.com/lordmathis
InHo
@goceman86
Jun 02 2017 15:52
@SkyC0der ok i see.
so then its better to always add the other sizes? i.e. sm md lg so that all platfroms can keep the size of the column right? also then im going to assume that moving the coloum to the right side is done by a pull-right or float:right? but then my next question is how do you get it to take a spot that is col-sm-1 big lets say 75% of the way across to the right? would i have to place empty col-sm-1's to the right with pull right?
Gulsvi
@gulsvi
Jun 02 2017 15:53
@Pagnito :) think of it as a new array of next(color) functions. It kind of acts like a map to keep track of what has been called and what hasn't.
Pagnito
@Pagnito
Jun 02 2017 15:54
ok, sweet
Gulsvi
@gulsvi
Jun 02 2017 15:54
@goceman86 I think you're talking about using column offsets now - check out this part of the documentation: https://v4-alpha.getbootstrap.com/layout/grid/#offsetting-columns
Ayush Kumar
@Gr8ayu
Jun 02 2017 15:54

$(document).ready(function(){
alert("test");  // LINE 1

  var searchText="google";
   var url = 'https://en.wikipedia.org/w/api.php?action=opensearch&search=' + searchText + '&format=json&callback=?';



});
LINE 1 not working please tell why ??
https://codepen.io/gr8ayu/pen/GERRdP?editors=1010
InHo
@goceman86
Jun 02 2017 15:55
@SkyC0der aha thank you that is what i ment
CamperBot
@camperbot
Jun 02 2017 15:55
goceman86 sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1600 | @skyc0der |http://www.freecodecamp.com/skyc0der
Pagnito
@Pagnito
Jun 02 2017 15:55
@SkyC0der i noticed dequeue, how come we dont just use que and a delay only
Gulsvi
@gulsvi
Jun 02 2017 15:55
No problem! @goceman86 the grid is really useful, play around with it and get comfortable. It will save you a bunch of time
@Pagnito .dequeue handles queuing up the next function and removing the function after it has been called. Think of it as add (queue) and dequeue(remove)
(otherwise, we'd be running the same function that was initially queued and nothing else)
Pagnito
@Pagnito
Jun 02 2017 15:59
hmm so is that for the map and next functions?
Gulsvi
@gulsvi
Jun 02 2017 16:00
Maybe think of queue as a .push() to add the next function and .dequeue as a .shift() to remove the function that was just called
Pagnito
@Pagnito
Jun 02 2017 16:00
no i mean iget what those functions do
im just not sure which functions its queing and dequeuing
Gulsvi
@gulsvi
Jun 02 2017 16:01
Just the next() function
Pagnito
@Pagnito
Jun 02 2017 16:01
ok as its mapping
its put a delay on the next function
?
Gulsvi
@gulsvi
Jun 02 2017 16:03
The map just pushes all the next() functions to the queue
.map() returns an array, and in this code, it's kind of like:
[
  next(blue),
  next(red),
  next(green),
  etc...
]
Pagnito
@Pagnito
Jun 02 2017 16:04
so it recalls the same function on each array lement because of map?
Gulsvi
@gulsvi
Jun 02 2017 16:05
$({}).queue() then takes that array, names it '_fx', and puts it in those empty braces
As soon as we call .dequeue it gets next(blue) going, runs it, then we call dequeue again to remove it
then we call the next() function again - which starts the process over again until there's nothing left to queue
Pagnito
@Pagnito
Jun 02 2017 16:06
so the que acts as simply an empty time interval somewhat?
Gulsvi
@gulsvi
Jun 02 2017 16:07
The queue is just that - a queue, like a line of people going into a store and coming out of the store
Pagnito
@Pagnito
Jun 02 2017 16:07
hmm
The promise() is perhaps more like the empty time interval - it waits for the function's delays to finish before moving on to the next line of code
Pagnito
@Pagnito
Jun 02 2017 16:08
yea i can understand that queue is like a line of people as it kind of speaks for itself, but i guess im still struggling to see how it works here exactly, but hold ima read the wiki real quick
Yahia
@y-zaky
Jun 02 2017 16:09
Hi guys
I have a quick question, how do i get the last line of my app (Location: ) to be equally far from the BOTTOM of the border as my <h1> element is from the TOP ?
Been trying to tinker for a while and can't seem to get it right :s
Pagnito
@Pagnito
Jun 02 2017 16:11
@SkyC0der damn, i have to go the store to get some potatoes for my dad, i said id go at 12, ill be back in a few
Gulsvi
@gulsvi
Jun 02 2017 16:12
@Pagnito no worries, I'll be around
Yahia
@y-zaky
Jun 02 2017 16:12
@SkyC0der can you help xD
pretty please :)
Gulsvi
@gulsvi
Jun 02 2017 16:13
@bowssy88 Right-click, inspect your <h1> element. Click "Computed" and you'll see it's 16.185px from the top of the box. That's the bottom-margin to use for your location.
Make sense?
Yahia
@y-zaky
Jun 02 2017 16:15
@SkyC0der where is computed? I'm in chrome
Gulsvi
@gulsvi
Jun 02 2017 16:18
^^ Circled "computed" for you in chrome
Yahia
@y-zaky
Jun 02 2017 16:19
@SkyC0der thank you you absolute legend
CamperBot
@camperbot
Jun 02 2017 16:19
bowssy88 sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1601 | @skyc0der |http://www.freecodecamp.com/skyc0der
MadsSN
@MadsSN
Jun 02 2017 16:19
@LordMathis I ended up using "row" class instead to keep them in place, and then simple giving them the wanted distance between them with margins :)
Gulsvi
@gulsvi
Jun 02 2017 16:20
love that my proxy showed me in disneyland that time lol
Yahia
@y-zaky
Jun 02 2017 16:20
@SkyC0der looool
just one moe question XD @SkyC0der .... so i want my Loader to be in the exact position the weather app appears
and again, i can't figure out how to do it.... for some reason it is always below where the weather app appears...
Gulsvi
@gulsvi
Jun 02 2017 16:21
Seems you have a % margin?
  position: absolute;
  top: 50%;
  left: 50%;
firas omrane
@firou1925
Jun 02 2017 16:22
hi I am handling with the wiki viewer and and I got some problems using the form to get the text to search for and then make a search using wiki API any documentation!!
Yahia
@y-zaky
Jun 02 2017 16:22
@SkyC0der that was me manually trying to move it to where the weather app appears? was the best i could do but this is not the way to do it ?
Gulsvi
@gulsvi
Jun 02 2017 16:23
@bowssy88 I can't edit your project to play around with it, but you shouldn't need absolute positioning.
Use margin-top, with a number in pixels
Yahia
@y-zaky
Jun 02 2017 16:26
@SkyC0der hit refresh, when i delete
  position: absolute;
  top: 50%;
  left: 50%;
the loader goes to the top left of the page.... and thats what i can't grasp
why is it doing that
Gulsvi
@gulsvi
Jun 02 2017 16:26
because of: margin: -75px 0 0 -75px;
Since your loader is 150px wide, those margin settings place loader half way of the left and top of the screen
do something like margin: 75px auto 0
Yahia
@y-zaky
Jun 02 2017 16:31
@SkyC0der how did you know
:clap: @SkyC0der
Gulsvi
@gulsvi
Jun 02 2017 16:31
Did that work okay?
Yahia
@y-zaky
Jun 02 2017 16:32
hit refresh
Gulsvi
@gulsvi
Jun 02 2017 16:32
Lucky guess :)
auto margins will center it and the 75px was a guess
Saeed Jassani
@saeedjassani
Jun 02 2017 16:33
@SkyC0der thanks a lot for the detailed explanation!
CamperBot
@camperbot
Jun 02 2017 16:33
saeedjassani sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:star2: 1602 | @skyc0der |http://www.freecodecamp.com/skyc0der
Eric Voigt
@ericvoigt
Jun 02 2017 16:33
trying to float h3 over image element.. what other css classes do i need to do this.. h3 {
color: red;
position: absolute;
flaot: center;
}
then
top: ;
left: ;
?
Yahia
@y-zaky
Jun 02 2017 16:34
@SkyC0der xD I have one last question, so I want my entire weather app (myDiv section) to be positioned in the middle of the browser.... for some reason it is positioned in the middle of the top of the browser if you see what i mean
The section MyDiv should be positioned in the centre of the DOM ?
but not sure how
Gulsvi
@gulsvi
Jun 02 2017 16:35
@saeedjassani No problem! Both ways are fine...just my preference for these smaller projects. If you try to make money off that quote machine some day, set up your own CORS proxy :)
@bowssy88 You mean vertical centered?
Yahia
@y-zaky
Jun 02 2017 16:35
@SkyC0der yeah
vertical and horizontally centered
of the entire page
Saeed Jassani
@saeedjassani
Jun 02 2017 16:36
@SkyC0der Sure!
Gulsvi
@gulsvi
Jun 02 2017 16:36
Probably the easiest way is to use vh units and margin-top. 1vh = 1% of the screen, so maybe margin-top: 30vh for your myDiv
It's already centered, so just margin-top should work great
Yahia
@y-zaky
Jun 02 2017 16:38
why doesn't the system automatically centre the entire myDiv Section in the middle of the dom? i mean it vertically centres it only in the tiny mySection part of the page
not sure if I'm making sense lol
@SkyC0der why wouldn't margin:auto; work in this case?
Gulsvi
@gulsvi
Jun 02 2017 16:40
@bowssy88 I'm not sure what you mean :/
I see it centered right now horizontally
Yahia
@y-zaky
Jun 02 2017 16:40
@SkyC0der hit refresh, i changed it from margin auto to margin-top: 30vh
my question is why doesn't margin:auto (what it was before) automatically centre it in the middle of the entire dom if you see what i mean
Gulsvi
@gulsvi
Jun 02 2017 16:41
@bowssy88 You still need margin: auto to center it
technically, margin-left: auto; margin-right: auto
or margin: 30vh auto 0;
(shorthand)
Yahia
@y-zaky
Jun 02 2017 16:42
if i did margin-left: auto; margin-right: auto
what would be the margins of the top and bottom? given i did not specify them
@SkyC0der
Gulsvi
@gulsvi
Jun 02 2017 16:43
I'm not sure - I think it would take on either a browser default or one that bootstrap gives
You can use that compute trick I showed you earlier to know exactly what it is
Eric Voigt
@ericvoigt
Jun 02 2017 16:44
trying to center that text over that image.. can i get a little help from my freecodecamp friends? https://codepen.io/ericvoigt/pen/XRLQqw?editors=1100
Nikki L.R.
@nikkilr88
Jun 02 2017 16:46
Is there anyone around who can help me with React. I cannot for the life of me figure out where to put navigator.geolocation.getCurrentPosition()
Yahia
@y-zaky
Jun 02 2017 16:47
@SkyC0der please hit refresh ... did margin-left: auto; margin-right: auto and its the same as saying margin:auto ?
still not vertically entered on screen
maybe need to to margin top: auto as well?
Jorge
@OrangeKulture
Jun 02 2017 16:48
@nikkilr88 why not use the npm package geolocated?
Gulsvi
@gulsvi
Jun 02 2017 16:48
@bowssy88 I think you need to study the margin property some more :)
Jorge
@OrangeKulture
Jun 02 2017 16:48
haven't used it myself tho, so Im not sure if it's good or not
Gulsvi
@gulsvi
Jun 02 2017 16:48
where did you margin-top: 30vh go?
Yahia
@y-zaky
Jun 02 2017 16:49
@SkyC0der deleted it lol .... ok so thats the problem i need that
Gulsvi
@gulsvi
Jun 02 2017 16:49

@bowssy88 This:

    margin-left: auto; 
    margin-right: auto;
    margin-top: 30vh;
    margin-bottom: 0;

Is the same as:

margin: 30vh auto 0;
Yahia
@y-zaky
Jun 02 2017 16:50
@SkyC0der thank you i screen shotted that
CamperBot
@camperbot
Jun 02 2017 16:50
bowssy88 sends brownie points to @skyc0der :sparkles: :thumbsup: :sparkles:
:warning: bowssy88 already gave skyc0der points
Gulsvi
@gulsvi
Jun 02 2017 16:50
@bowssy88 This is a good tool to explain it better too: https://www.w3schools.com/cssref/playit.asp?filename=playcss_margin&preval=auto
Yahia
@y-zaky
Jun 02 2017 16:51
but how do i make the distance from the top equal to the distance from the bottom?
Jorge
@OrangeKulture
Jun 02 2017 16:51
@ericvoigt u still having probs?
Yahia
@y-zaky
Jun 02 2017 16:51
would that be @SkyC0der
Brian
@Cornielle
Jun 02 2017 16:51
@SkyC0der gad skycoder is the windbeast of frontend here xD
Yahia
@y-zaky
Jun 02 2017 16:51
margin: 30vh auto 30vh;
Gulsvi
@gulsvi
Jun 02 2017 16:51
:rage1:
:)
Brian
@Cornielle
Jun 02 2017 16:51
hahaha
Yahia
@y-zaky
Jun 02 2017 16:52
@SkyC0der ? :o master is that correct loool
Gulsvi
@gulsvi
Jun 02 2017 16:52
@ericvoigt It will be easier to make your image a background image to be honest, rather than inserting it as a <img> in your HTML
Nikki L.R.
@nikkilr88
Jun 02 2017 16:53
@OrangeKulture I don't know how
Jorge
@OrangeKulture
Jun 02 2017 16:53
@nikkilr88 do you currently use npm ?
Gulsvi
@gulsvi
Jun 02 2017 16:54
lol @bowssy88 just have lots of opinions :)
Yahia
@y-zaky
Jun 02 2017 16:54
@SkyC0der thank you so much xD i appreciate it so much...
its just weird why it doesn't appear in my browser to be entered vertically although it actually is due to margin: 30vh auto 30vh;
Nikki L.R.
@nikkilr88
Jun 02 2017 16:55
@OrangeKulture I just started the other day
Yahia
@y-zaky
Jun 02 2017 16:55
also even more weird why when margin:auto, that it doesn't spread myDiv equally (due to auto) between top and bottom margins
Brad Ledford
@bradledford
Jun 02 2017 16:55
@nikkilr88 CSS tricks has a good write up on that topic: https://css-tricks.com/almanac/properties/b/background-image/
Jorge
@OrangeKulture
Jun 02 2017 16:56
@nikkilr88 no worries .. im starting out too! I know it can be confusing. How do you start your react project?
do you just create the files independently, or do you use a boiler plate .. or how do you usually do it?
Nikki L.R.
@nikkilr88
Jun 02 2017 16:57
@OrangeKulture With create-react-app
@OrangeKulture I was doing everything in CodePen until a few days ago. I just moved over to Cloud9
Jorge
@OrangeKulture
Jun 02 2017 16:58
@nikkilr88 ahh ok cool .. yeah the boiler plate. Do you use a command line tool for that?
you know what's actually better? if you can do that on your own PC .. use your own text editor (pretty much like you do on cloud 9) and deploy to heroku. That really helps you learn a lot about deployment, unit testing and other stuff
Matthias Lang
@MatLang
Jun 02 2017 17:00
Hey guys, I am trying to setup my 2nd Project: Portfolio Page. Can you please help me figure out how to center my portrait picture vertically and horizontally? Here's my project: https://codepen.io/ltcMatt/full/owvONQ/. Thanks.
Nikki L.R.
@nikkilr88
Jun 02 2017 17:01
@OrangeKulture I used the command line in C9.
Jorge
@OrangeKulture
Jun 02 2017 17:01
so yeah, on the cloud9 enviroment, you would typically have the command line tool at the bottom. you need to navigate to the working directory for this particular project and run the npm command
in this case .. npm install react-geolocated --save
--save flag is so that it is saved to your dependencies
like I said, i haven't used it myself, but looks good .. you can read about it here ... https://www.npmjs.com/package/react-geolocated
maybe that helps you out
Gulsvi
@gulsvi
Jun 02 2017 17:02