These are chat archives for FreeCodeCamp/HelpFrontEnd

9th
Dec 2016
annabaum
@annabaum
Dec 09 2016 00:05
Hi guys! Can anyone tell me which lection contains info about how to do the one-page-scrolling design required in "Build a Personal Portfolio Webpage"?
Tyler Moeller
@TylerMoeller
Dec 09 2016 00:13
@Mr-Kumar-Abhishek Maybe add IP-location fallback, it doesn't work for me because I have location blocked :)
Jason Luboff
@JLuboff
Dec 09 2016 00:15
@annabaum http://getbootstrap.com/javascript/#scrollspy I think thats what you're looking for
Tyler Moeller
@TylerMoeller
Dec 09 2016 00:15
@annabaum None of the lessons teach how to use smooth scroll effects. You will need to implement it with JavaScript, but it is not a requirement for completing the portfolio project.
Franco Rufo
@francorufo
Dec 09 2016 00:18

http://codepen.io/franorufo/pen/yVvWJV

Can anyone see why my button with the class "random" is not appearing when clicking on the "knowledge is power" button?

Jason Luboff
@JLuboff
Dec 09 2016 00:23
@francorufo I could be wrong...but it might have to do with display: none;
annabaum
@annabaum
Dec 09 2016 00:23
Thanks guys! :)
Alec
@CalcCalcCalc
Dec 09 2016 00:25
http://codepen.io/Calc/pen/aBKdzr
Hi there guys, I was wondering if I could get a little bit of help with this twitch.tv api challenge?
How do i use the i variable in this .done callback so i can use jQuery to populate the names of the channels, and their links?
Franco Rufo
@francorufo
Dec 09 2016 00:29
@JLuboff I am chaning the display:none; to display:block; by toggling a class
changing*
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 00:29
@TylerMoeller yes doing that :)
Jason Luboff
@JLuboff
Dec 09 2016 00:31
@francorufo Ah, didn't see that. Perhaps we want to do something like $(".random").css("display", "block").toggleClass("pop"); (I might have my css off there)
@francorufo In fact...I just tried that and it worked..
Franco Rufo
@francorufo
Dec 09 2016 00:32
@JLuboff yeah that does work! thanks a lot man
CamperBot
@camperbot
Dec 09 2016 00:32
francorufo sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
:cookie: 481 | @jluboff |http://www.freecodecamp.com/jluboff
Jason Luboff
@JLuboff
Dec 09 2016 00:34
@francorufo And actually...if you just move the random class CSS info above the Pop class CSS, it works (without having to have the .css() in our JS). I think whats happening is since Pop is first, the random class is still overriding it. Alternatively, adding important! to the pop display element may work
Chris
@bestintown23
Dec 09 2016 00:36

function wordBlanks(myNoun, myAdjective, myVerb, myAdverb) {
var result = "";
// Your code below this line
myNoun="dog";
myAdjective="big";
myVerb = "ran";
myAdverb = "quickly";

result += "My "+ myAdjective +" "+ myNoun +" " + myVerb + " very " + myAdverb;

myNoun="cat";
myAdjective="little";
myVerb="hit";
myAdverb="slowly";

result += "My "+ myAdjective +" "+ myNoun +" " + myVerb + " very " + myAdverb;
// Your code above this line
return result;
}

// Change the words here to test your function
wordBlanks("dog", "big", "ran", "quickly");
wordBlanks("cat", "little", "hit", "slowly");
what is wrong with the code?

Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 00:40
@TylerMoeller anyone who has geo location could please check if it is working ?? especially the icons ??
anyone who has geo location could please check if it is working ?? especially the icons ?? *
darn
network outages
anyone who has geo location could please check if it is working ?? especially the icons ?? * https://mr-kumar-abhishek.github.io/weather/
Franco Rufo
@francorufo
Dec 09 2016 00:42
@JLuboff That's not working for me. Adding the .random css before the pop didn't work :S
aRtoo
@artoodeeto
Dec 09 2016 00:42
hi guys how can I float my text 2 and text 3 on the right. without overlapping the text1. codepen is here http://codepen.io/artoo/pen/ZBbYyM?editors=1100
Franco Rufo
@francorufo
Dec 09 2016 00:44
@JLuboff Oh never mind. Made a simple error. It works just fine. Thanks a lot again :)
CamperBot
@camperbot
Dec 09 2016 00:44
francorufo sends brownie points to @jluboff :sparkles: :thumbsup: :sparkles:
:warning: francorufo already gave jluboff points
Jason Luboff
@JLuboff
Dec 09 2016 00:45
:+1:
aRtoo
@artoodeeto
Dec 09 2016 00:46
hi sir how can I float my text 2 and text 3 on the right. without overlapping the text1. codepen is here http://codepen.io/artoo/pen/ZBbYyM?editors=1100
Tyler Moeller
@TylerMoeller
Dec 09 2016 00:51
@artoodeeto Use min-width on the containers around your text
John
@johnshelb
Dec 09 2016 01:02
Hi. I've been struggling to figure out JSON and JSONP and API for several days now. I've made a lot of progress, so I think I'm ready to ask for help. When I run my code, I'm getting an error I don't understand. Anyone willing to take a look and tell me what you think I need to do?
Franco Rufo
@francorufo
Dec 09 2016 01:06
@johnshelb show the codepen?
John
@johnshelb
Dec 09 2016 01:08
@francorufo How do I do that? Do I just paste in the url?
Franco Rufo
@francorufo
Dec 09 2016 01:12
I do that xD
Slusherman
@Slusherman
Dec 09 2016 01:12
@johnshelb Yea just paste your codepen url. I'm interested because I'm also having some issues
So it doesn't give an error in codepen (or function at all!) but when I use a text editor and browser, I get
?method=getQuote&key=67667&format=json&lang=en&callback=jQuery3110397…1481245520811&…:1 Uncaught SyntaxError: Unexpected token :smile:
Franco Rufo
@francorufo
Dec 09 2016 01:14
@johnshelb idk if it can work with json but I used jsonp
John
@johnshelb
Dec 09 2016 01:15
@francorufo I thought I was using jsonp just because of the callback=? at the end. I'll try your idea
Franco Rufo
@francorufo
Dec 09 2016 01:16
oh, didn't see that. my bad
@johnshelb haven't used callback yet so I don't know about that xD
@johnshelb btw you'll have to use an ajax call for that url
Tyler Moeller
@TylerMoeller
Dec 09 2016 01:20
$.getJSON will work fine for that URL :) - the unexpected token comes from format=json instead of format=jsonp @johnshelb
http://api.forismatic.com/api/1.0/?method=getQuote&key=67667&format=jsonp&lang=en&jsonp=?
If you visit this page, right-click and View Source, you can see how they do it without ajax or getJSON: http://api.forismatic.com/api/jsonp/
John
@johnshelb
Dec 09 2016 01:29
Much better! Thanks @francorufo and @TylerMoeller
CamperBot
@camperbot
Dec 09 2016 01:29
johnshelb sends brownie points to @francorufo and @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 266 | @francorufo |http://www.freecodecamp.com/francorufo
:star2: 1116 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Slusherman
@Slusherman
Dec 09 2016 01:40
having problems getting the Wiki api to work... just trying to pull the front page content
http://codepen.io/slusherman/pen/KNeJML?editors=1011
abdul
@funniviral
Dec 09 2016 02:29
ON THE "TRIBUTE PAGE " CHALLENGE, AM I SUPPOSED TO PICK ANY TOPIC OR PERSON TO WORK ON?
Can anyone help? ?
annabaum
@annabaum
Dec 09 2016 02:32
I think you can pick whatever you like
c0d0er
@c0d0er
Dec 09 2016 02:50

does anybody know why my following local js file doesnt work with bable and react? the first file is html file, and the 2nd file is js file, both files are in the same folder
this is html file

<html>
  <head><style>
    </style>
    <meta charset="UTF-8">
    <title>react sample</title>
    <link href=
    "https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css"
    rel="stylesheet">
    <link href=
    "https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css"
    rel="stylesheet">

    <link href="mstyle.css" rel="stylesheet">

  </head>
  <body>
    <div id="app"></div>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.1/react.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.1/react-dom.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.19.0/babel.js"></script>
    <script src="jquery.min.js"></script> 
    <script src="mscript.js" type="text/babel"></script>
  </body>
</html>

this is js file

var Example2 = React.createClass({
  render: function () {
    return <h1>hello world</h1>;
  }
});

ReactDOM.render(
  <Example2 />,
  document.getElementById('app')
);
grantknaver
@grantknaver
Dec 09 2016 02:52
anyone around to ask a quick question?
Robert Valmassoi
@valmassoi
Dec 09 2016 02:52
@c0d0er if you are starting with react - watch the first few of these: https://www.youtube.com/playlist?list=PLoYCgNOIyGABj2GQSlDRjgvXtqfDxKm5b
React.creatClass is an old way btw
c0d0er
@c0d0er
Dec 09 2016 02:54
@valmassoi thanks but this is way too complicated and cannot figure out, i used html address to load react and bable, but cannot figure out why cannot load from my js
CamperBot
@camperbot
Dec 09 2016 02:54
c0d0er sends brownie points to @valmassoi :sparkles: :thumbsup: :sparkles:
:cookie: 436 | @valmassoi |http://www.freecodecamp.com/valmassoi
Robert Valmassoi
@valmassoi
Dec 09 2016 02:59
I just got it working on mine @c0d0er
using your same code
I deleted the jQuery script
is your file named mscript.js supposed to be myscript.js?
c0d0er
@c0d0er
Dec 09 2016 03:01
@valmassoi i delete jquery script still doesnt work
@valmassoi could you please paste your working code?
Robert Valmassoi
@valmassoi
Dec 09 2016 03:03
  <head><style>
    </style>
    <meta charset="UTF-8">
    <title>react sample</title>
    <link href=
    "https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css"
    rel="stylesheet">
    <link href=
    "https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css"
    rel="stylesheet">

    <link href="mstyle.css" rel="stylesheet">

  </head>
  <body>
    <div id="app"></div>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.1/react.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.1/react-dom.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.19.0/babel.js"></script>
    <script src="mscript.js" type="text/babel"></script>
  </body>
</html>
its the same
whats your console say
c0d0er
@c0d0er
Dec 09 2016 03:04
Capture.PNG
@valmassoi this is the console pic
Robert Valmassoi
@valmassoi
Dec 09 2016 03:04
didn't work for me in chrome
try a diff browser
safari and fire fox work
c0d0er
@c0d0er
Dec 09 2016 03:06
anyway to figure out why chrome doesnt work?
@valmassoi
Robert Valmassoi
@valmassoi
Dec 09 2016 03:06
the console logs
you'll want to learn how to compile/bundle it to a minified js file
you have a cors issue. this might fix that https://www.youtube.com/watch?v=q78u9lBXvj0
Robert Valmassoi
@valmassoi
Dec 09 2016 03:11
I just tried it. it does fix it
are you on a Mac?
@c0d0er
c0d0er
@c0d0er
Dec 09 2016 03:12
@valmassoi i am on windows
Robert Valmassoi
@valmassoi
Dec 09 2016 03:13
ok well open up the console
Tyler Moeller
@TylerMoeller
Dec 09 2016 03:13
@c0d0er How are you trying to view your html file?
c0d0er
@c0d0er
Dec 09 2016 03:14
@TylerMoeller still trying to find out the problem of cannot load html
@valmassoi i opened
Robert Valmassoi
@valmassoi
Dec 09 2016 03:14
paste this in:
npm install -g live-server
not sure if it works on windows but won't hurt anything
Tyler Moeller
@TylerMoeller
Dec 09 2016 03:15
I have my markdown previewer working in Atom, with https://atom.io/packages/atom-html-preview
Robert Valmassoi
@valmassoi
Dec 09 2016 03:16
let me know if that command ran
c0d0er
@c0d0er
Dec 09 2016 03:16
@valmassoi no, doesnt run in console
@TylerMoeller thanks, i am using sublime now, will try atom definitely later
Robert Valmassoi
@valmassoi
Dec 09 2016 03:17
ops I meant command propt
CamperBot
@camperbot
Dec 09 2016 03:17
c0d0er sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1117 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Dec 09 2016 03:17
Robert Valmassoi
@valmassoi
Dec 09 2016 03:19
might need to get node first (ull want it as you continue dev) http://blog.teamtreehouse.com/install-node-js-npm-windows
c0d0er
@c0d0er
Dec 09 2016 03:20
@valmassoi @TylerMoeller but the weired thing is if i put js code in html under script text='babel', then it does work, but if i put js code in js file, then doesnt work
Robert Valmassoi
@valmassoi
Dec 09 2016 03:21
@TylerMoeller it depends on browser
c0d0er
@c0d0er
Dec 09 2016 03:21
@valmassoi i installed npm install -g live-server in node cmd, but still doesnt work
Robert Valmassoi
@valmassoi
Dec 09 2016 03:21
it installed?
c0d0er
@c0d0er
Dec 09 2016 03:21
@TylerMoeller which browser do you use?
Tyler Moeller
@TylerMoeller
Dec 09 2016 03:22
This is in Atom with HTML Preview
I get a big "hello world"
c0d0er
@c0d0er
Dec 09 2016 03:22
@TylerMoeller do you use chrome or firefox?
Robert Valmassoi
@valmassoi
Dec 09 2016 03:22
if it installed then u can go to that directory and run live-server and it will work in chrome
Tyler Moeller
@TylerMoeller
Dec 09 2016 03:22
Both Chrome and Firefox
c0d0er
@c0d0er
Dec 09 2016 03:23
@valmassoi how do i run live-server
Tyler Moeller
@TylerMoeller
Dec 09 2016 03:23
It won't work in a browser though unless you're loading it from a web server, that's what that error means: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource. you can't load it from file://c:/users/....
Robert Valmassoi
@valmassoi
Dec 09 2016 03:24
Screen Shot 2016-12-08 at 8.23.40 PM.png
Tyler Moeller
@TylerMoeller
Dec 09 2016 03:24
Need an HTML previewer, Express.js, IIS, etc
Robert Valmassoi
@valmassoi
Dec 09 2016 03:24
do this command: cd /Users/... where the dots the rest of the path to that folder
in command propt
copy the path from the folder and paste
then just type live-server it will open in chrome and work
c0d0er
@c0d0er
Dec 09 2016 03:27
@valmassoi i got in the folder which contains js file and html, type live-server, but still not work
Robert Valmassoi
@valmassoi
Dec 09 2016 03:27
what does live-server -v give you
did you go to that url in chrome?
make sure it running, looks like it was
disregard the -v command
c0d0er
@c0d0er
Dec 09 2016 03:29
yes, i got it
Robert Valmassoi
@valmassoi
Dec 09 2016 03:30
its working?
c0d0er
@c0d0er
Dec 09 2016 03:30
no
Robert Valmassoi
@valmassoi
Dec 09 2016 03:31
can you screen shot chrome and the command prompt
c0d0er
@c0d0er
Dec 09 2016 03:31
Capture.PNG
live server showed like this
and this http://127.0.0.1:8080/
Robert Valmassoi
@valmassoi
Dec 09 2016 03:32
change file name to index.html
c0d0er
@c0d0er
Dec 09 2016 03:33
it worked
Robert Valmassoi
@valmassoi
Dec 09 2016 03:33
!!!
live server is cool
c0d0er
@c0d0er
Dec 09 2016 03:33
when i click html file in the live server page
Robert Valmassoi
@valmassoi
Dec 09 2016 03:33
try changing hello world to hello world!!! and save
c0d0er
@c0d0er
Dec 09 2016 03:33
then it shows: http://127.0.0.1:8080/mindex.html
Robert Valmassoi
@valmassoi
Dec 09 2016 03:33
it auto refreshes
yeah if u name it just index.html it will auto go there
c0d0er
@c0d0er
Dec 09 2016 03:35
do i need to run live-server everytime i need to load html the FIRST time?
Robert Valmassoi
@valmassoi
Dec 09 2016 03:36
with how you are setup, yes
you can leave it running
c0d0er
@c0d0er
Dec 09 2016 03:39
@valmassoi thanks!
CamperBot
@camperbot
Dec 09 2016 03:39
c0d0er sends brownie points to @valmassoi :sparkles: :thumbsup: :sparkles:
:warning: c0d0er already gave valmassoi points
c0d0er
@c0d0er
Dec 09 2016 03:40
do you know how to only use html addresses like with babel and react to load scss file? @valmassoi
Robert Valmassoi
@valmassoi
Dec 09 2016 03:41
you need to compile the js
the index.min.js contains all of the js files
by running npm run deploy
it takes awhile to figure all that out
Jacob
@jdc101214
Dec 09 2016 03:46
hey guys. Im trying to write a js function that returns the factorial of the integer provided and I cant figure out how to do so.
Code
function factorialize(num) {
  var subNum = "";
   subNum = num;
  for(i = 1; i <= num; i++){
    subNum = subNum * i;
  }
  return subNum;
}

factorialize(1);
John
@johnshelb
Dec 09 2016 03:54
Hi again. This is working perfectly when I open it in my browser from a text editor, but it doesn't work in codepen. Any ideas why not?
https://codepen.io/johnshelby/pen/KNeYpZ
John
@johnshelb
Dec 09 2016 04:01
Hey @jdc101214 , I think that the only problem is that in your for loop, you never want i = num, you want so instead of i <=num, try i < num
Robert Valmassoi
@valmassoi
Dec 09 2016 04:03
for(var i = 1; ...
@jdc101214 have you looked in the console for errors?
c0d0er
@c0d0er
Dec 09 2016 04:12
i can use the following code to use react and babel, is there any similar links i can use to run scss in my local file?
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.1/react.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.1/react-dom.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.19.0/babel.js"></script>
    <script src="jquery.min.js"></script> 
    <script src="mscript.js" type="text/babel"></script>
Kenny Batista
@kennybatista
Dec 09 2016 04:19
Front-End Developers out there! For mobile friendly, do you guys recommend me to use native Media Queries, or A library
John
@johnshelb
Dec 09 2016 04:40
also, @jdc101214 , don't forget to account for the fact that the factorial of zero is 1.
Zaurbek Zhakupov
@zzhakupov
Dec 09 2016 05:03
Hello everybody, can I have some feedback on my React Markdown Previewer http://codepen.io/Zooll/pen/gLKqqZ?
Heama Sadagopan
@Heama-s
Dec 09 2016 05:27
can any one help me with this doubt
i m trying to place a text in a well, the well already has an image... but the text gets displayed outside well in bootstrap
lyndxe
@lyndxe
Dec 09 2016 05:39
curious if it's essentially "cheating" to look at the code and markdown using the CodePen sample, and emulating the structure (although not copying?), to make sure we're on the right track should we get stuck?
Coy Sanders
@coymeetsworld
Dec 09 2016 06:07
should try and avoid it if you can @lyndxe, but depends on what you're looking for
you don't want to build a habit of doing that because instead of thinking about the problem you just try to find the answer instead
Naveen
@hope4
Dec 09 2016 06:20
I guess,i am unable to operate my bootstrap in the code,because after completion of the code when the change the editor view i was unable to get the exact what i did, the page is also changing as per the editor view ,can somehelp help me in solving this issue
Coy Sanders
@coymeetsworld
Dec 09 2016 06:29
@hope4 are you working on a challenge or a project? Do you have a link or code you can share?
James Moore
@James-N-M
Dec 09 2016 06:34
@lyndxe i cheat i look at tutorials...
kirbyedy
@kirbyedy
Dec 09 2016 06:35
@James-N-M how is that cheating ? :D
grantknaver
@grantknaver
Dec 09 2016 07:01
hey I got a quick question about an .each method and the current project I am working on
anyone free to answer a question
anyone
Sorin Ruse
@sorinr
Dec 09 2016 07:15
@grantknaver hi. whats the problem?
ambat25
@ambat25
Dec 09 2016 07:17
Hello all
grantknaver
@grantknaver
Dec 09 2016 07:21
@sorinr
sorry didnt look for sec
Im using the .each() jquery method and it cycled through all the items I needed to, but there is one problem
at the beginning of the cycle an undefined element is produced, and I have no idea where it came from
I have logged it and there is no info
Anton Walker
@GreenEagle11-18-81
Dec 09 2016 07:23
What ide do you use?
grantknaver
@grantknaver
Dec 09 2016 07:23
I attempted to get each to skip first index, but cant
Sorin Ruse
@sorinr
Dec 09 2016 07:24
@grantknaver can you repost the link to your pen
there you go
thanks
Sorin Ruse
@sorinr
Dec 09 2016 07:28
@grantknaver but its working. i don't see where the problem is
grantknaver
@grantknaver
Dec 09 2016 07:34
when you search the first thing that populates is
is an undefined object. you arent seeing it?
@sorinr
Sorin Ruse
@sorinr
Dec 09 2016 07:40
@grantknaver yep i see it now. it was on red bg and i was looking at the generated content. just a sec
@grantknaver make var content='';
Shaneooo
@Shaneooo
Dec 09 2016 07:43
Hi team, I just got to the 'Build a Tribute Page' on FCC. I just got a little stressed because I don't know where to start? Should I already know how to do this? or is there a link to resources? or should I go back through the content up onto this point?
Sorin Ruse
@sorinr
Dec 09 2016 07:45
@grantknaver otherwise when you make content += "<div>"; the content is undefined first loop
grantknaver
@grantknaver
Dec 09 2016 07:46
gotcha
makes sense it needs to know what it is adding too
Sorin Ruse
@sorinr
Dec 09 2016 07:47
@grantknaver yep
wangyiming21212
@wangyiming21212
Dec 09 2016 08:21
someone helpme
how to turn "[[[[5]]],[1],{},3]" into"[5,1,{},3]"
to do the stream roller
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 08:21
I have just transferred my code to codepen want to ask if this work (I adding the IP fallback and background changes ) http://codepen.io/Mr-Kumar-Abhishek/full/LbrKvv/
Marianissimus
@Marianissimus
Dec 09 2016 08:22
@Mr-Kumar-Abhishek doesn't work. undefined f or c
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 08:23
@Marianissimus wait for it to load ? (refresh)
@Marianissimus I should add some wait ui I suppose thanks :)
CamperBot
@camperbot
Dec 09 2016 08:24
mr-kumar-abhishek sends brownie points to @marianissimus :sparkles: :thumbsup: :sparkles:
:cookie: 179 | @marianissimus |http://www.freecodecamp.com/marianissimus
Marianissimus
@Marianissimus
Dec 09 2016 08:24
you're welcome. resend it when you're done
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 08:25
@Marianissimus but does it work after waiting ?/
Marianissimus
@Marianissimus
Dec 09 2016 08:25
nope, and I've got a pretty good internet connection
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 08:26
@Marianissimus it loads here o.0
@Marianissimus have geo location ?
vuka92
@vuka92
Dec 09 2016 08:26
hello guys, i need some help on the pomodoro clock project
Marianissimus
@Marianissimus
Dec 09 2016 08:27
@Mr-Kumar-Abhishek it doesn't ask me, I've seen this challenge before, they all asked for data - permission to use geolocation or smth like this
vuka92
@vuka92
Dec 09 2016 08:27

$(document).ready(function() {
var buzzer = $("#buzzer")0;
var count = parseInt($("#num").html());
var breakTime = parseInt($("#break").html());

$("#reset").hide();

$("#start").click(function() {
var counter = setInterval(timer, 1000);
count*=60;

function timer() {
  //hide buttons
  $("#start, #minusClock, #addClock, #minusBreak, #addBreak, #break, #title1, #title2").hide();
  $("#time").html('<i class="fa fa-hourglass-start" aria-hidden="true"></i>');
  count-=1;
  if (count === 0) {
    buzzer.play();
    clearInterval(counter);
    var startBreak = setInterval(breakTimer, 1000);

    $("#num, #time").hide();
  }
  if (count%60>=10) {
    $("#num").html(Math.floor(count/60)+":"+count%60);
  } else {
    $("#num").html(Math.floor(count/60)+":"+"0"+count%60);
  }

  function breakTimer() {
    $("#rest").html("Breaktime");      
    $("#break").fadeIn();
      breakTime*=60;
    $("#rest").show();
    breakTime-=1;
    if (breakTime===0) {
      clearInterval(startBreak);
      buzzer.play();
      $(".well").hide();
      $("#reset").show();

    }
    if (breakTime%60>=10) {
      $("#break").html(Math.floor(breakTime/60)+":"+breakTime%60);
    } else {
      $("#break").html(Math.floor(breakTime/60)+":"+"0"+breakTime%60);
    }

  }
}

});

$("#reset").click(function() {
count=25;
breakTime=5;
$("#num").html(count);
$("#break").html(breakTime);
$("#rest, #reset").hide();
$(".well, #start, #minusClock, #addClock, #minusBreak, #addBreak, #num, #break, #title1, #title2").fadeIn();
});

$("#minusClock").click(function() {
if (count>1) {
count-=1;
$("#num").html(count);
}
});
$("#addClock").click(function() {

count+=1;
$("#num").html(count);

});

$("#minusBreak").click(function() {
if (breakTime>1) {
breakTime-=1;
$("#break").html(breakTime);
}
});
$("#addBreak").click(function() {
breakTime+=1;
$("#break").html(breakTime);
});
});

this code has an error but i cant see
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 08:28
@Marianissimus yes geo location must be enabled... (I making the fall back for IP if you don't allow me to get that xP )
how can i join unicode after typing
??
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 08:40
@Marianissimus does it works in this ?? http://s.codepen.io/Mr-Kumar-Abhishek/debug/LbrKvv
thats the link
Aryan Agal
@grubdragon
Dec 09 2016 08:42
http://codepen.io/grubdragon/pen/dOKNPg can anyone tell why my twitter button isnt working
It was working before
I must've made some error
anyone care to identify?
Marianissimus
@Marianissimus
Dec 09 2016 08:44
@Mr-Kumar-Abhishek doesn't work on any browser (ie, ff, chrome), but it now asks for location
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 08:44
@Marianissimus after giving the location ??
vuka92
@vuka92
Dec 09 2016 08:44
http://codepen.io/VukaK/pen/gLKwbL need your help guys, my breaktime clock is not working properly
Marianissimus
@Marianissimus
Dec 09 2016 08:45
@Mr-Kumar-Abhishek yes, after giving the location - it still does not work
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 08:45
mr-kumar-abhishek.github.io/weather <-- I have the working site here it is the same code does this work on your computer ??
@Marianissimus http://mr-kumar-abhishek.github.io/weather <-- I have the working site here it is the same code does this work on your computer ??
@Marianissimus https://mr-kumar-abhishek.github.io/weather <-- I have the working site here it is the same code does this work on your computer ??
Marianissimus
@Marianissimus
Dec 09 2016 08:47
@Mr-Kumar-Abhishek yeah, that works just fine
maybe it's smth with codepen, i have no idea
Aryan Agal
@grubdragon
Dec 09 2016 08:47
http://codepen.io/grubdragon/pen/dOKNPg why isnt my twitter button working>
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 08:47
@Marianissimus strange ..
kirbyedy
@kirbyedy
Dec 09 2016 08:48
if your codepen starts with https:// geolocation should work
Aryan Agal
@grubdragon
Dec 09 2016 08:48
use http not https
Marianissimus
@Marianissimus
Dec 09 2016 08:48
@Mr-Kumar-Abhishek or a broken link somewehere
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 08:49
@Marianissimus checked all the link ... even the API is interacting with the pen ... There must be some permission issues with codepen
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 08:55
@Marianissimus erm.... could you try once more made some changes. http://s.codepen.io/Mr-Kumar-Abhishek/debug/LbrKvv If it doesn't work I have to codepair with someone now
@kirbyedy thanks for the tip
CamperBot
@camperbot
Dec 09 2016 08:56
mr-kumar-abhishek sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1642 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
kirbyedy
@kirbyedy
Dec 09 2016 08:56
if the link is like this it will work
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 08:58
@kirbyedy yes it is working from https thanks a lot :) I will read into it for more understanding of whys and hows :p
CamperBot
@camperbot
Dec 09 2016 08:58
mr-kumar-abhishek sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:warning: mr-kumar-abhishek already gave kirbyedy points
kirbyedy
@kirbyedy
Dec 09 2016 08:58
geolocation does not work from unsecured origins
so http does not work, https works
Coy Sanders
@coymeetsworld
Dec 09 2016 09:01
That's true at least in Chrome @kirbyedy, are other browsers also doing that now?
kirbyedy
@kirbyedy
Dec 09 2016 09:02
soon they will follow
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 09:03
@kirbyedy I see... this is the case for firefox too I suppose :)
the latest one *
kirbyedy
@kirbyedy
Dec 09 2016 09:04
In safari does not work at all for example :D
I just tried it
jayisray
@jayisray
Dec 09 2016 09:05
@jayisray
Hey guys, how do you make background scroll behind text?
kind of like this website http://www.moresleep.net/
ive been trying to figure it out for hours and just cant get it to work on mine
i tried the position relative on a div but it didnt work
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 09:06
@kirbyedy yeah.... fall back for IPs is kind of important to support old technology
走你飛艇
@gofighting123
Dec 09 2016 09:17
can someone tell me how to cleanup html file exported from word @@
i had tried tidy2 @@ not work
wordoff @@
Navid Dezashibi
@dezashibi
Dec 09 2016 09:21
@TylerMoeller Hey mate I have a new problem with the HTTPS/HTTP in codepen, because geolocation is working only on https and weather api is on http, what should I do to get the ajax and weather api both working!?
Clyde Lobo
@oppiniated
Dec 09 2016 09:31
@dezashibi try changing the weather api to https as well, should work
Navid Dezashibi
@dezashibi
Dec 09 2016 09:31
I tried that already but unfortunately it didn't worked
jayisray
@jayisray
Dec 09 2016 09:32
can someone please tell me why it is necessary to set the height of BOTH the body and html to 100%? What exactly does this do? When I remove either of these heights, the entire page goes blank. http://www.w3schools.com/howto/tryhow_css_parallax_demo.htm
Navid Dezashibi
@dezashibi
Dec 09 2016 09:32
the api has only http and the geolocation only works on https
don't know what to do about this
kirbyedy
@kirbyedy
Dec 09 2016 09:36
@dezashibi how about using darksky api
Navid Dezashibi
@dezashibi
Dec 09 2016 09:37
@kirbyedy let me take a look ;)
nadin88
@nadin88
Dec 09 2016 09:42
<html>
<head>
<style>
 h1 {font-size:70px;font-family:Arial;}
  h2{font-size:30;font-family:Lobster,Sherif;}
  .gray-background{background-color:#e0e0d1;}

</style>
<body>
 <div class="gray-background">
  <center>  <h1>Dr. Norman Borlaug<h1></center>
    <center> <h2>The man who saved a billion lives</h2></center></div>
    <img src="bbb.jpg"/>
   </body>
  the problem its wit the Image is not worked , I change the name wit bbb , but also wit the original one its not ok
Adi2Point0
@Adi2Point0
Dec 09 2016 09:45
@nadin88 : Img src needs either a url or a relative path.
For <img src="bbb.jpg">to work, your index.html and bbb.jpg MUST be at same path.
grantknaver
@grantknaver
Dec 09 2016 09:47
OK my animations dont seem to be working when I change my container's height property to min-height. Any idea as to why?
Navid Dezashibi
@dezashibi
Dec 09 2016 09:48
@kirbyedy I tried that and the api is https and that's ok but why I get the "XMLHttpRequest cannot load https://api.darksky.net/forecast/1b2cfa539dbe2cc54841ad438581468b/35.8069675,51.517219499999996. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://s.codepen.io' is therefore not allowed access." error, I'm on Codepen HTTPS
grantknaver
@grantknaver
Dec 09 2016 09:48
Im trying to get my footer to not cover part of my content, and the change to min-height works but it breaks my animation
nadin88
@nadin88
Dec 09 2016 09:49
@Adi2Point0 I know that but if its aBKeig whare its my html saved
grantknaver
@grantknaver
Dec 09 2016 09:49
if I change my containers height property to min-height it breaks the animation
help if anyone can
CamperBot
@camperbot
Dec 09 2016 09:49
no wiki entry for: if anyone can
grantknaver
@grantknaver
Dec 09 2016 09:50
lol thanks CamperBot
kirbyedy
@kirbyedy
Dec 09 2016 09:50
@dezashibi yea thats a cors problem, and you can sort it out by adding callback=? into your api line
somewhere at the end or whatever
grantknaver
@grantknaver
Dec 09 2016 09:50
yep jsonp
ionut
@ionutinz
Dec 09 2016 09:52
is it a bad practice to have multiple containers on a page?
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 09:54
@ionutinz nope, just don't nest them
Navid Dezashibi
@dezashibi
Dec 09 2016 09:54
@kirbyedy it didn't work, it even failed to start.
@grantknaver I don't know how to use jsonp
kirbyedy
@kirbyedy
Dec 09 2016 09:54
@dezashibi link your pen
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 09:59
https://codepen.io/FreeCodeCamp/full/wGqEga/ <-- how to make this kind of search box I could include Icons and border radius etc ... but the animations :o ! any pointers ????
Uzair Ali
@uajkhan
Dec 09 2016 10:03
http://codepen.io/uajkhan/pen/rWKXVZ?editors=1100
can someone tell me why is the green box appearing in the left side of nav bar ?
Navid Dezashibi
@dezashibi
Dec 09 2016 10:04
Uzair Ali
@uajkhan
Dec 09 2016 10:05
got it
kirbyedy
@kirbyedy
Dec 09 2016 10:06
@dezashibi nope its working fine, check the image
Uzair Ali
@uajkhan
Dec 09 2016 10:06
no need to help
kirbyedy
@kirbyedy
Dec 09 2016 10:06
Screen Shot 2016-12-09 at 12.05.47.png
@dezashibi there is your object in the console
jayisray
@jayisray
Dec 09 2016 10:08
Anyone here super amazing at html/css and would be able to answer a question of mine? Kinda lost
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 10:10
@jayisray just throw the question you never know who knows what to what extent in any particular field
nadin88
@nadin88
Dec 09 2016 10:11

<!DOCKTYPE html>

<html>
<head>
<style>

 h1 {font-size:70px;font-family:Arial;}
  h2{font-size:30;font-family:Lobster,Sherif;}
  .gray-background{background-color:#e0e0d1;}

</style>
</head>
<body>
 <div class="gray-background">
  <center>  <h1>Dr. Norman Borlaug<h1></center>
    <center> <h2>The man who saved a billion lives</h2></center>

<img src="untitled.png"/> </div>
</body>
I ask before why my img its not working but , it its woking on notpad++ but its not working on codepan ???????

Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 10:12
@nadin88 use cloundinary then link it from there
@nadin88 image is located in your computer not in code pen. that is the local address in image tag
@nadin88 (src={absolute url here })
@nadin88 https://cloudinary.com/ upload the images here , you will get the links
nadin88
@nadin88
Dec 09 2016 10:17
ok tnx , so codepen its a platform wit its working wit things that its inside the platform , not wit this that's its on the computer hahahaha I understand now
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 10:17
@nadin88 hopefully it helps
that's it I am using react js now...
nadin88
@nadin88
Dec 09 2016 10:20
tnx :)
Navid Dezashibi
@dezashibi
Dec 09 2016 10:21
@kirbyedy it does nothing :( I don't know what is the problem, there is no error or anything, the console is empty
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 10:31
going through react js ... it seems pretty straight forward.... a tough decision ... angular js or react js ...:/
Yerrapotu Manojkiran
@nani554
Dec 09 2016 10:51
hello
Naveen
@hope4
Dec 09 2016 10:51
@coymeetsworld here is the link to my code ,https://codepen.io/hope4/pen/YpveYa/ ,help me to sort out this problem
Marianissimus
@Marianissimus
Dec 09 2016 10:52
what problem? @hope4
@hope4 you have several there. col-md-16 is not a valid bootstrap class, the max is 12. as you're also adding col-md-offset-2, that means it's way off the page - horizontally, at least
Naveen
@hope4
Dec 09 2016 10:55
First thing is how to open only the page i created. Secondly when the change the editor view the text is changing its position not the entire thing.
@Marianissimus , please let me know how to make the page such that when i increase or decrease the window it will adjust accordingly
Marianissimus
@Marianissimus
Dec 09 2016 10:59
bootstrap will do that automatically, but you have to implement it the right way.
read the documentation again - there is no col-md-16. The maximum span of a col is 12, so maximum col-md-12. there are other errors, too, but I saw this one first. :)
Naveen
@hope4
Dec 09 2016 11:00
i have changed it to col-md-12
Marianissimus
@Marianissimus
Dec 09 2016 11:01
now remove the col-md-offset-2, because that is 12+2 = 14, still going out of the box. or change the first to 10. the total must be 12! (eg: col-md-10 col-md-offset-2)
Naveen
@hope4
Dec 09 2016 11:04
done sir
Marianissimus
@Marianissimus
Dec 09 2016 11:05
ok, it's still overflowing a little, we must find out why. let's inspect the elements and figure this out
Naveen
@hope4
Dec 09 2016 11:06
ohk sir
Naveen
@hope4
Dec 09 2016 11:12
what changes should i do now sir?
Marianissimus
@Marianissimus
Dec 09 2016 11:13
don't sir me, I'm young. :) I'm trying to figure it out, there is a problem in the ul
Naveen
@hope4
Dec 09 2016 11:16
ohk! basically sir is just a sign of respect as you are helping me out and i dont know you so , i used sir .So what should i call you?
Marianissimus
@Marianissimus
Dec 09 2016 11:16
it's ok, don't worry, I was kidding. let's figure this one out
Naveen
@hope4
Dec 09 2016 11:20
I am Naveen, by the way new to web development, worked with html in the past now want to know some more stuffs and wanna become professional. I m a student right now persuing undergraduate course.
Marianissimus
@Marianissimus
Dec 09 2016 11:21
actually, adding margin: 60px; to the body solves a bit of the problem. there seems to be some unclosed div in there, I can't find it. Good luck, anyway.
Adam Dąbrowski
@a-dabrowski
Dec 09 2016 11:23
hey guys I'm having problem with my Weather App, it used to work on Firefox, now it doesn't, i think it is a problem with navigator.geoLocation but i'm linking to my CodePen for you to see
Any suggestion will help :)
Naveen
@hope4
Dec 09 2016 11:24
@Marianissimus theres already a margin :60px; to the body,i cant get what you said
Naveen
@hope4
Dec 09 2016 11:30
hello can someone solve this to me ,this was just a tribute page butbut problem in bootstrap unable to figure it out,when i changed the window size only text is changing https://codepen.io/hope4/pen/YpveYa/?editors=1010
Adam Dąbrowski
@a-dabrowski
Dec 09 2016 11:34
@hope4 and you want images to change size, or that text wouldn't change?
Naveen
@hope4
Dec 09 2016 11:40
@a-dabrowski ,the problem is when i change the editor view only text is changed,i want as per bootstrap entire page must resize,thats not working for me
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 11:56
I am drawing a blank with the wikipedia viewer please help :(
A_A
@Otto-AA
Dec 09 2016 12:00
@Mr-Kumar-Abhishek What exactly do you want to know?
Uzair Ali
@uajkhan
Dec 09 2016 12:01
How Can I center a image inside a container ?
Rodrigo Vieira
@rodrigo85br
Dec 09 2016 12:01
Hello everyone, can anybody help me understand this line of code: col-xs-12 col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 from Quincy's tribute page?
A_A
@Otto-AA
Dec 09 2016 12:02
@uajkhan have you tried googling it?
Rodrigo Vieira
@rodrigo85br
Dec 09 2016 12:02
@uajkhan add it inside a div using "thumbnail" class
Manish Giri
@Manish-Giri
Dec 09 2016 12:02
@rodrigo85br it sets different column sizes on different screens
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 12:02
@Otto-AA https://github.com/Mr-Kumar-Abhishek/wikipedia-viewer I have just started the project and I don't have a clue which assets to use , angular js react or what :/
Uzair Ali
@uajkhan
Dec 09 2016 12:02
@rodrigo85br ty
CamperBot
@camperbot
Dec 09 2016 12:02
uajkhan sends brownie points to @rodrigo85br :sparkles: :thumbsup: :sparkles:
:cookie: 124 | @rodrigo85br |http://www.freecodecamp.com/rodrigo85br
Rodrigo Vieira
@rodrigo85br
Dec 09 2016 12:03
@Manish-Giri right but why do we start with the smallest one?
Manish Giri
@Manish-Giri
Dec 09 2016 12:03
@rodrigo85br the offset part specifies how far off a column would be from the left
@rodrigo85br it's convention to start with that, more like the "mobile first" way of doing things. Target the smallest screen sizes, then work your way up.
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 12:04
@Otto-AA https://github.com/Mr-Kumar-Abhishek/wikipedia-viewer I have just started the project and I don't have a clue which assets to use , angular js react or what :/ the pen for demonstration has a pretty good ui https://codepen.io/FreeCodeCamp/full/wGqEga/.
@Otto-AA I don't know how to make an approach in order to make this ui
Rodrigo Vieira
@rodrigo85br
Dec 09 2016 12:04
@Manish-Giri Ok I see your point "mobile first", how come col-lg is never used in his example?
A_A
@Otto-AA
Dec 09 2016 12:04
@Mr-Kumar-Abhishek You don't need angular.js but if you want you can use it. I myself did it without and it worked out fine :)
Manish Giri
@Manish-Giri
Dec 09 2016 12:05
@rodrigo85br you gotta ask him, I guess!
if lg is not specified, the md rules will apply for lg screens too @rodrigo85br
Uzair Ali
@uajkhan
Dec 09 2016 12:05
It didn't work
@rodrigo85br
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 12:05
@Otto-AA could I see your pen's ui ?
Uzair Ali
@uajkhan
Dec 09 2016 12:06
I want the image to be centered into its own container but it just stays to the left
Rodrigo Vieira
@rodrigo85br
Dec 09 2016 12:06
@uajkhan use a containger, and inside that a jumbotron, and then add you image inside a div using thumbnail class
@Manish-Giri got it! thanks!
CamperBot
@camperbot
Dec 09 2016 12:06
rodrigo85br sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 2872 | @manish-giri |http://www.freecodecamp.com/manish-giri
Manish Giri
@Manish-Giri
Dec 09 2016 12:06
@uajkhan try this line -
<img class="img-responsive center-block " src="https://s28.postimg.org/6kk3cca4d/portfolio_logo1.png" alt="Logo">
Uzair Ali
@uajkhan
Dec 09 2016 12:06
@rodrigo85br I think that's the case here
A_A
@Otto-AA
Dec 09 2016 12:06
Uzair Ali
@uajkhan
Dec 09 2016 12:07
@Manish-Giri @Manish-Giri ty
CamperBot
@camperbot
Dec 09 2016 12:07
uajkhan sends brownie points to @manish-giri :sparkles: :thumbsup: :sparkles:
:star2: 2873 | @manish-giri |http://www.freecodecamp.com/manish-giri
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 12:08
@Otto-AA what assets did you use ?? only css and html ??
Manish Giri
@Manish-Giri
Dec 09 2016 12:08
@uajkhan welcome
A_A
@Otto-AA
Dec 09 2016 12:08
@Mr-Kumar-Abhishek HTML, CSS for the layout and JS for the API-call :P
Uzair Ali
@uajkhan
Dec 09 2016 12:09
btw can the jumbotoron's background be set to transparent ?
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 12:10
@Otto-AA so this search icon which transforms to searchbox could be made with only css and html ??
A_A
@Otto-AA
Dec 09 2016 12:10
@Mr-Kumar-Abhishek yeah, with the pseudo-selector .yourClass:focus and transitions
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 12:11
@Otto-AA okay I will look into transitions thanks , did you used bootstrap as well ?
CamperBot
@camperbot
Dec 09 2016 12:11
mr-kumar-abhishek sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:cookie: 378 | @otto-aa |http://www.freecodecamp.com/otto-aa
Uzair Ali
@uajkhan
Dec 09 2016 12:12
@Manish-Giri ?
A_A
@Otto-AA
Dec 09 2016 12:12
@Mr-Kumar-Abhishek No, I didn't, but it's up to you if you want to use it ;)
Manish Giri
@Manish-Giri
Dec 09 2016 12:13
@uajkhan yes, you can override it in your own css
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 12:13
@Otto-AA nice ... I will throw the bootstrap out ... :) and for search icon ??
A_A
@Otto-AA
Dec 09 2016 12:14
@Mr-Kumar-Abhishek It's just an designed input + another div for the bar.
Uzair Ali
@uajkhan
Dec 09 2016 12:14
@Manish-Giri I don't know hoe to do it
Care to explain
?
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 12:15
@Otto-AA okay thanks a lot ! this discussion saved me a lot of time and hours of studying and searching :)
CamperBot
@camperbot
Dec 09 2016 12:15
mr-kumar-abhishek sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:warning: mr-kumar-abhishek already gave otto-aa points
A_A
@Otto-AA
Dec 09 2016 12:16
@Mr-Kumar-Abhishek You're welcome =D
Manish Giri
@Manish-Giri
Dec 09 2016 12:16
@uajkhan
.jumbotron {
opacity: 0.4;
}
Uzair Ali
@uajkhan
Dec 09 2016 12:17
That would also affect the opacity of stuff on the jumbotron
@Manish-Giri and the block stains white
A_A
@Otto-AA
Dec 09 2016 12:18
@uajkhan what about background-color: rgba(0,0,0,0);
Uzair Ali
@uajkhan
Dec 09 2016 12:21
@Otto-AA nope
A_A
@Otto-AA
Dec 09 2016 12:23
@uajkhan can you link it?
@Otto-AA here
@Otto-AA I am trying to change it from inspect element dev tolls in chrome but still no change
A_A
@Otto-AA
Dec 09 2016 12:27
@uajkhan Try this:
.jumbotron{
    background-color: rgba(0,0,0,0);
}
body {
    background-color: aqua;
}
@uajkhan I think it already is transparent, but the thing behind it is just white
Uzair Ali
@uajkhan
Dec 09 2016 12:30
@Otto-AA got it thank you
CamperBot
@camperbot
Dec 09 2016 12:30
uajkhan sends brownie points to @otto-aa :sparkles: :thumbsup: :sparkles:
:cookie: 379 | @otto-aa |http://www.freecodecamp.com/otto-aa
A_A
@Otto-AA
Dec 09 2016 12:30
@uajkhan You're welcome :)
Scobie
@Scobiie
Dec 09 2016 12:46
How do we add .svg files again?, can we do it using pure HTML and not using CSS and Jquery?
Minoy
@minoy
Dec 09 2016 13:05
Hello!

I am trying to create a table where there is space between the rows. I am trying to apply border-spacing property to <tr> tags. Following is the HTML
<table>
<tr>
<td>First Name:</td>
<td><input type="text" value="John"></td>
</tr>
<tr>
<td>Last Name:</td>
<td><input type="text" value="Doe"></td>
</tr>
<tr>
<td>Email ID:</td>
<td><input type="text" value="someone@something.com"></td>
</tr>
<tr >
<td>Message:</td>
<td><input type="text" value="Hi!"></td>
</tr>
</table>

And the CSS styling is,

tr{
border-spacing:10px;
}

But it is not working. Any ideas?

Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 13:12
<Otto-AA>
*
@Otto-AA I was looking at your pen did you changed the design of something ?
@minoy why are you using tables when you are not displaying any data ??
@minoy this is not 2002 that you are using tables for design purpose
@minoy we are already edging over to 2017
Minoy
@minoy
Dec 09 2016 13:16
@Mr-Kumar-Abhishek Yes, I am aware of the year. I started coding in Nov 2016.
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 13:20
@minoy yeah.. so it is best not to use tables for design purpose :) use css grid system like bootstrap instead if you have difficulty in making grids
Minoy
@minoy
Dec 09 2016 13:22
@Mr-Kumar-Abhishek Hmm... yes, I think I know what you are talking about (not sure though!). Let me try that...
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 13:24
@minoy http://getbootstrap.com/ its been more than a decade since we left tables for design :) brings back awful and good memories
Sorin Ruse
@sorinr
Dec 09 2016 13:28
@minoy you can use line-height: 24px; instead of border-spacing
@minoy 24px its just for example. you change it as you wish
@minoy here an example
Minoy
@minoy
Dec 09 2016 13:33
@sorinr Thanks Sorin! :)
CamperBot
@camperbot
Dec 09 2016 13:33
minoy sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 917 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Dec 09 2016 13:33
@minoy welcome
M1ck00
@M1ck00
Dec 09 2016 13:58
hey guys
anyone?
Uzair Ali
@uajkhan
Dec 09 2016 14:00
Can someone tell me why the <hr> tag is giving out two lines instead of 1 in my code
http://codepen.io/uajkhan/pen/rWKXVZ?editors=1100
ignore this ^
Ken Haduch
@khaduch
Dec 09 2016 14:08
@uajkhan - hello... do you mean the one with the class="styled"? You are styling it with CSS that makes it more than a normal horizontal rule, so it's going to take more space? The extra margin on top and bottom will make it take more vertical space.
M1ck00
@M1ck00
Dec 09 2016 14:10
guys I need help from someone here..
I need to create portfolio now but I don't have skill needed for that.. any suggestions?
Uzair Ali
@uajkhan
Dec 09 2016 14:11
@khaduch I fixed it
now I have another question care to answer ?
@khaduch never mind solved it too
M1ck00
@M1ck00
Dec 09 2016 14:17
guys?
Uzair Ali
@uajkhan
Dec 09 2016 14:18
@M1ck00 yes yes
@M1ck00 I am on the same project and had no clue what to do
So I just made a sketch in my mind of what I wanted and without any css or js just wrote down the html
then comes the researching part
you have to research and refine and if you get stuck we are always here to help
ionut
@ionutinz
Dec 09 2016 14:21
whats the point of using wells when you could just use a container?
Sorin Ruse
@sorinr
Dec 09 2016 14:24
@ionutinz sal. have u seen my message?
alpox
@alpox
Dec 09 2016 14:32
@ionutinz a well is a normal container with a bit css added to make it look a bit fancy :)
zKruki
@zKruki
Dec 09 2016 14:41
function reverseString(str) {
  str.split("").reverse().join("");



  return str;
}

reverseString("hello");
any help with reversing the string
Sorin Ruse
@sorinr
Dec 09 2016 14:46
@zKruki just return str.split...... coz str var its "hello" all the time
ionut
@ionutinz
Dec 09 2016 14:48
@sorinr hi :) yes, i think i've fixed it now
Sorin Ruse
@sorinr
Dec 09 2016 14:48
@ionutinz :+1:
zKruki
@zKruki
Dec 09 2016 14:51
@sorinr thanks!
CamperBot
@camperbot
Dec 09 2016 14:51
:cookie: 918 | @sorinr |http://www.freecodecamp.com/sorinr
zkruki sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
Sorin Ruse
@sorinr
Dec 09 2016 14:51
@zKruki welcome
Ken Haduch
@khaduch
Dec 09 2016 15:32
@uajkhan - sorry, I was away from the computer for a while. If you have another question, please post it.
Harikrishnan
@krharikrishnan
Dec 09 2016 15:34
hey
Ken Haduch
@khaduch
Dec 09 2016 15:37
@uajkhan - one thing I noticed is that you have container.fluid on your wrapper div - the bootstrap class is container-fluid.
Also, on CodePen, you do not need (and should not put) certain tags in the HTML panel - those are <html>, <body>, <style>, <head> - the CodePen way of doing things is that they use a template that has all of that boilerplate code in there. Mostly it doesn't cause a problem, other than generating invalid HTML, which most browsers jump through hoops to handle anyway. Mobile browsers are not as robust in that way, at least I've seen a few problems where the mobile browsers would not handle the page properly.
I hope that helps, and if you have another question, please feel free to ask.
Lewis
@LewisLA
Dec 09 2016 15:37
I cannot for the life of me create a div using a background-image thats full width and responsive (bootstrap)! any ideas?
Ken Haduch
@khaduch
Dec 09 2016 15:38
@LewisLA - would you like to share your project URL?
Lewis
@LewisLA
Dec 09 2016 15:39
I only have a nav bar atm, as nothings been working for the image (portfolio project). My aim is a full-width image, responsive, and for text to go over the top?
Adel
@AdelMahjoub
Dec 09 2016 15:42
why a portfolio has to be responsive ?
human ressources uses their smartphones to look at portfolios ?
Ken Haduch
@khaduch
Dec 09 2016 15:43

@LewisLA - okay, I've used something like this in my portfolio, and it seems to work out okay. Let's see what my basic code is for this

<!-- I define different "section" elements -->
<section id="about" class="section-style home-background" data-type="background">

</section>

and the CSS for that .home-background looks like this:

.home-background {
  background: url(YOUR_IMAGE_URL_HERE) no-repeat 0 fixed;
  /* background-size: cover; */
}

seems to work for me.
And I forgot this, in case it is key:

.section-style {
  /* need a background URL or pattern to go along */
  background-size: cover;
  min-height: 1000px;
  margin: 0 auto;
  /* width: 80%; */
  position: relative;
  /*box-shadow: 0 0 50px rgba(0, 0, 0, 0.8); */
  padding: 100px 0;
  color: #000;
}

Of course, I won't claim that it is all perfection - I'm learning, too! :)

Lewis
@LewisLA
Dec 09 2016 15:43
its for the portfolio challenge, i wanted a big (splash type of thing) image, just visually pleasing i guess
Ken Haduch
@khaduch
Dec 09 2016 15:44
@AdelMahjoub - I'd be willing to bet that more people are looking at pages on mobile devices than you'd think - even HR folks, using a tablet computer in a conference room, etc. Definitely a good idea to make things mobile responsive, if for no other reason than to become familiar with how to property make a page that is fully responsive. Practice makes perfect!
Adel
@AdelMahjoub
Dec 09 2016 15:47
@khaduch I understand, my point is that portfolios are often visted on 12" + devices
not to mention that those latest devices render twice the number of pixels
zKruki
@zKruki
Dec 09 2016 15:50
@sorinr How did you remember all of the basic javaScript concepts? :grinning: It hard to know what 'questions' I'm suppose to be asking. Sure, i could just google the solution to: how to find the longest word in the string.
Lewis
@LewisLA
Dec 09 2016 15:56
things seem to be working nicely image-wise, thanks!
ionut
@ionutinz
Dec 09 2016 16:01
Hey! I've finished my Tribute page, what do you guys think ? https://codepen.io/ionutinz/full/mOKyQB/ :smile:
Ken Haduch
@khaduch
Dec 09 2016 16:08
@ionutinz - the page looks nice. There is one little responsive glitch, it seems? Maybe a couple little things, as the screen width changes. But it looks really nice, in general. The thing that I think might be a problem is that you close the container that starts at the top, and then make a new row, with the text starting at "the rumors of a Danish destroyer are true." That row is not within a container, and it should be. That might be the reason for the jumpy placement of things, where that text section sometimes overlaps the first section with the images? You might see if if you look on a desktop and resize the window.
@AdelMahjoub - most likely true, but you would want to make sure, if you're going for a position as a web developer / designer, that your page displays well on all devices, as much as possible?
Lewis
@LewisLA
Dec 09 2016 16:12
@khaduch I made my tribute page just yesterday (or maybe the day before)http://codepen.io/LewisLA/full/jVKXPa/ Is there any way of making the "profile" box appear above the main paragraph when the view is collapsed to a smaller size? while still appearing on the right-hand side in large view?
Ken Haduch
@khaduch
Dec 09 2016 16:15
@LewisLA - yes, there should be a way to do that. Do I know it? Not off the top of my head... let me research for a few minutes... :)
Faiz Ahmed
@Faiz7412
Dec 09 2016 16:21
I'm trying to link up recent blog posts on the front landing page of the website. Is there any right way it should be done?
I mean, the blogs can be random, recent, or featured. But they need to show in the blog section of the landing page. Do website in general do it by hardcoding the blog title and details, or is it all automated?
Jason Luboff
@JLuboff
Dec 09 2016 16:25
@Faiz7412 If I'm understanding correctly...I'd imagine they either hard code based on a set number of blogs and then rotate them. Or they use an API that feeds the same information regardless of the blog (i.e an object with the title, first couple sentences, etc) that then can be manipulated the same regardless
Ken Haduch
@khaduch
Dec 09 2016 16:27
@LewisLA - there are these column classes that are under the heading "push and pull" - I think that if you use those you can get what you want. This column gives information and examples: https://scotch.io/tutorials/reorder-css-columns-using-bootstrap
Faiz Ahmed
@Faiz7412
Dec 09 2016 16:28
@JLuboff Yeah, I thought of that. But it's too much work. I was searching for some efficient way to automatically add new blog posts on the front page. I guess hard coding it into the html is the only way.
Adel
@AdelMahjoub
Dec 09 2016 16:32
@khaduch yes, I agree with that
Chris
@bestintown23
Dec 09 2016 16:35

@bestintown23

function wordBlanks(myNoun, myAdjective, myVerb, myAdverb) {
var result = "";
// Your code below this line

myNoun="dog";
myAdjective="big";
myVerb = "ran";
myAdverb = "quickly";
result = "My "+ myAdjective +" "+ myNoun +" " + myVerb + " very " + myAdverb;

// Your code above this line
return result;
}
// Change the words here to test your function
wordBlanks("dog", "big", "ran", "quickly");
wordBlanks("cat", "little", "hit", "slowly");
need help fixing this

Jason Luboff
@JLuboff
Dec 09 2016 16:38
@Faiz7412 Using an API (if there is one), would make things quite simple and dynamic. You only write the code once (assuming the API doesn't change)
Ken Haduch
@khaduch
Dec 09 2016 16:39
@bestintown23 - remove your re-definitions of the myNoun, myAdjective, etc - those are the function argument variables, which will be set to the corresponding values in the function call. Other than that, it looks like you would be on track for having it correctly set up
Lewis
@LewisLA
Dec 09 2016 16:40
@khaduch neat! thanks
CamperBot
@camperbot
Dec 09 2016 16:40
lewisla sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2065 | @khaduch |http://www.freecodecamp.com/khaduch
Aaron Bell
@awb715
Dec 09 2016 16:42
anyone know any free hosting sites for a website just of text?
i own a godaddy domain
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 16:43
@aw715 for text only ?? use github pages :)
Jason Luboff
@JLuboff
Dec 09 2016 16:43
@awb715 Don't you get a single page hosting with godaddy?
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 16:44
@awb715 https://mr-kumar-abhishek.github.io/weather/ I could add my own domain in this and remove github.io from this :)
@awb715 refer github pages docs
Aaron Bell
@awb715
Dec 09 2016 16:47
its charging me money to host
Ken Haduch
@khaduch
Dec 09 2016 16:48
@awb715 - you mean GoDaddy is charging you money? Of course it is, if that's the case - you have to pay to have hosting on their site. There are free web hosting site - just google for that and you can find them and evaluate their TOS.
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 16:49
@awb715 for static website your best host is github pages... if you want source code private... then ... you have to rely on....hmm..... openshift was offering hosting services free I suppose ...but ... let me check
Aaron Bell
@awb715
Dec 09 2016 16:51
thanks @Mr-Kumar-Abhishek i just want to play around with setting this up cus fcc doesnt teach u
CamperBot
@camperbot
Dec 09 2016 16:51
awb715 sends brownie points to @mr-kumar-abhishek :sparkles: :thumbsup: :sparkles:
:cookie: 430 | @mr-kumar-abhishek |http://www.freecodecamp.com/mr-kumar-abhishek
Ken Haduch
@khaduch
Dec 09 2016 16:54
@awb715 - if you want to see how your codepen pages are fully set up - just render the page in your browser, right click and see "show frame source" - you'll see all of the "hidden" things that you don't ever really seem to set up in a project. All of the boilerplate stuff - the <html>, <head>, <body>, etc. After you see a few, you'll know what to do. Once you set up your own template, you don't really have to think about it too much. And a lot of code editors have templates built in.
Not sure if that would give you what you're after, but it's a source of information.
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 16:54
@awb715 for learning on how to set it up there is one should you look on is of openshift, then github pages and then any heroku then any low cost LAMP host
Aaron Bell
@awb715
Dec 09 2016 16:56
i want to host a basic static site
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 16:56
@awb715 for learning on how to set it up there is one should you look on is of openshift, then github pages and then heroku then any low cost LAMP host *
@awb715 go for github pages then :)
@awb715 https://mr-kumar-abhishek.github.io/ I still building a blog in this... but as the github docs said before you could use your own domain :p
@awb715 https://mr-kumar-abhishek.github.io/ I am still building a blog in this... but as the github docs said before you could use your own domain :p
Aaron Bell
@awb715
Dec 09 2016 17:00
i needa learn the whole git github environment functionality
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 17:01
@awb715 https://
Ken Haduch
@khaduch
Dec 09 2016 17:01
@awb715 - https://guides.github.com/ - some docs that they have
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 17:01
@awb715 hold on ~
@awb715 https://try.github.io/levels/1/challenges/1 start from here.. for other servers you need to learn FTP ... that is an old technology... git is way better
Sorin Ruse
@sorinr
Dec 09 2016 17:03
@zKruki i'm not remembering all of the js concepts, functions, etc, am too "old" for that. i just try to think logical to solve one problem. i know (i remember) there are some functions that could fit my logic and if i don't remember the syntax i just google it
Aaron Bell
@awb715
Dec 09 2016 17:03
thanks @khaduch @Mr-Kumar-Abhishek
CamperBot
@camperbot
Dec 09 2016 17:03
awb715 sends brownie points to @khaduch and @mr-kumar-abhishek :sparkles: :thumbsup: :sparkles:
:warning: awb715 already gave mr-kumar-abhishek points
:star2: 2066 | @khaduch |http://www.freecodecamp.com/khaduch
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 17:06
@awb715 also read the first two chapters of the git book https://git-scm.com/book/en/v2
Uzair Ali
@uajkhan
Dec 09 2016 17:06
@khaduch oh thank you for pointing that out
CamperBot
@camperbot
Dec 09 2016 17:06
uajkhan sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2068 | @khaduch |http://www.freecodecamp.com/khaduch
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 17:07
@awb715 old lamp servers started with elfinder instead of FTP but comparing two both have pros and cons
@awb715 and both is needed in those weak servers
Aaron Bell
@awb715
Dec 09 2016 17:09
this is all way over my head
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 17:09
Aaron Bell
@awb715
Dec 09 2016 17:09
but ill get working
Abhishek Kumar
@Mr-Kumar-Abhishek
Dec 09 2016 17:09
old lamp server also have these too ... for ease of uploading files etc.. not for... .NET MVC servers though...
@awb715 codepen could export your files in compressed format unzip then keep them in which ever server you like
Fabio Di Pane
@saylos
Dec 09 2016 17:14
Hi guys, could you please check why the picture (wall) covers the yellow .quoteBox? I tried using id instead of a class, but nothing. The only solution is to add inline styles
http://codepen.io/saylos/pen/BQxYey
Harikrishnan
@krharikrishnan
Dec 09 2016 17:15
hey guys
Tyler Moeller
@TylerMoeller
Dec 09 2016 17:27
@saylos Your CSS syntax is incorrect and causing the problem. Click the arrow in the top, right-hand corner of the CSS panel and select "Analyze CSS" to see the errors.
blob
Sorin Ruse
@sorinr
Dec 09 2016 17:28
@saylos what yellow .quoteBox?
Data Detective
@WCoaster77
Dec 09 2016 17:32
can anyone help me to deal with: XMLHttpRequest cannot load http://api.androidhive.info/contacts/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:58067' is therefore not allowed access. type errors
Fabio Di Pane
@saylos
Dec 09 2016 17:32
@TylerMoeller great, I didn't know about that trick, thanks for the tip!
CamperBot
@camperbot
Dec 09 2016 17:32
saylos sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1118 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Data Detective
@WCoaster77
Dec 09 2016 17:33
I understand that the error is to do with cross-domain requests, but I can not find clear documentation on how to fix it.
Tyler Moeller
@TylerMoeller
Dec 09 2016 17:37
I'm not familiar with that API, if you trust the API, you can use JSONP - usually by adding callback=? to the end of the API URL.
Sorin Ruse
@sorinr
Dec 09 2016 17:40
@saylos @TylerMoeller here my quick version for it example
Tyler Moeller
@TylerMoeller
Dec 09 2016 17:44
rgba transparency is a nice effect to use over photography
Data Detective
@WCoaster77
Dec 09 2016 17:44
@TylerMoeller can you please show me the full line of code? I am unclear on how to write it.
Sorin Ruse
@sorinr
Dec 09 2016 17:44
@TylerMoeller yep
Data Detective
@WCoaster77
Dec 09 2016 17:44
```$.getJSON("http://api.androidhive.info/contacts/", function (json)
```
$.getJSON("http://api.androidhive.info/contacts/", function (json)
Tyler Moeller
@TylerMoeller
Dec 09 2016 17:47
@WCoaster77 Every API can be unique, I would have to read the documentation, if there is any, to help you write the code.
Here's an example of a Quotes API and the $.getJSON call required: https://quotesondesign.com/api-v4-0/
James Shore
@Jimbobmahooley
Dec 09 2016 17:49
Hi I'm currently doing the personal portfolio web page and i am trying to get three pictures to appear the same size on the same row, however the original pictures are all different sizes are there any suggestions?
Data Detective
@WCoaster77
Dec 09 2016 17:49
thanks @TylerMoeller
CamperBot
@camperbot
Dec 09 2016 17:49
wcoaster77 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1119 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
EmmyPlayz
@EmmyPlayz
Dec 09 2016 17:57
http://codepen.io/EmmyPlayz/pen/qqKpBz?editors=1100
trying to get the two pictures side by side but my columns are messed up and they just keep doing weird things any pointers?
guys I can't seem to adjust mey footer to the full width
can someone help ?
Data Detective
@WCoaster77
Dec 09 2016 18:00
@Jimbobmahooley i used this css:
img {
    max-width: 100%;
    height: 100%;
    object-fit: contain;
    overflow: hidden;
}
and put images in a well.
Sorin Ruse
@sorinr
Dec 09 2016 18:01
@uajkhan try to move it out of the container-fluid div
EmmyPlayz
@EmmyPlayz
Dec 09 2016 18:01
I did set them up but they were very janky
Uzair Ali
@uajkhan
Dec 09 2016 18:02
@sorinr still it's not upto the whole width
vínαч puppαl
@vinaypuppal
Dec 09 2016 18:02
@uajkhan your footer is inside jumbotron and jumbotron has these styles
.container-fluid .jumbotron {
    padding-right: 60px;
    padding-left: 60px;
}
Sorin Ruse
@sorinr
Dec 09 2016 18:02
@uajkhan let me take a look at the code
James Shore
@Jimbobmahooley
Dec 09 2016 18:03
thanks @WCoaster77 @TylerMoeller
CamperBot
@camperbot
Dec 09 2016 18:03
jimbobmahooley sends brownie points to @wcoaster77 and @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 269 | @wcoaster77 |http://www.freecodecamp.com/wcoaster77
:star2: 1120 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
vínαч puppαl
@vinaypuppal
Dec 09 2016 18:03
@uajkhan becoz of that padding left and right 60px its not 100% width
Uzair Ali
@uajkhan
Dec 09 2016 18:04
@vinaypuppal now I have put it out of the body but still it's not fully wide
SabarJH
@SabarJH
Dec 09 2016 18:05

hello campers.
i just on bulid a tribute page challenge.
but i don't understand abiut :

  1. User Story: I can view a tribute page with an image and text.
  2. User Story: I can click on a link that will take me to an external website with further information on the topic.

what is user story?

vínαч puppαl
@vinaypuppal
Dec 09 2016 18:06
@uajkhan no now its inside .container-fluid move it out for full width
Uzair Ali
@uajkhan
Dec 09 2016 18:07
@vinaypuppal I did it but still no effect
So I just removed the padding from container.fluid
@sorinr now you gotta help me do something
Purcea Robert
@RobertPurcea
Dec 09 2016 18:08
does anyone know how I could edit just the color of the box shadow, after I import some text effect like neon?
Uzair Ali
@uajkhan
Dec 09 2016 18:08
I want to add smooth scroll with anchor hook and scroll spy
Sorin Ruse
@sorinr
Dec 09 2016 18:09
@uajkhan just a sec. let me finish my dinner first :)
Uzair Ali
@uajkhan
Dec 09 2016 18:09
@sorinr ok I asked the question reply when you get the time
Sorin Ruse
@sorinr
Dec 09 2016 18:09
@uajkhan ok
Alex Maday
@alexmaday
Dec 09 2016 18:10
@SabarJH user story is the 'story' a user might tell you if he was sitting right there, explaining to you what he wants the application to do.
Slusherman
@Slusherman
Dec 09 2016 18:15
@TylerMoeller :+1: Thanks man
CamperBot
@camperbot
Dec 09 2016 18:15
slusherman sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1121 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Dec 09 2016 18:19
@Robertb4 Are you talking about the neon effects mentioned here: https://developers.google.com/fonts/docs/getting_started
Purcea Robert
@RobertPurcea
Dec 09 2016 18:20
yes
Tyler Moeller
@TylerMoeller
Dec 09 2016 18:20
They're using text-shadow not box-shadow, assign a class to your element and change the hex values for a different color:
.neon-shadow {
  text-shadow: 0 0 0.1em #fff, 0 0 0.2em #fff, 0 0 0.3em #fff, 0 0 0.4em #f7f,0 0 0.6em #f0f, 0 0 0.8em #f0f, 0 0 1.0em #f0f, 0 0 1.2em #f0f;
  color: #fff;
}
Sorin Ruse
@sorinr
Dec 09 2016 18:21
@uajkhan first add in pen settings javascript part in this order: jquery lib and after bootstrap.js lib. second you have to pair your navigation href="#home", href="#about", etc with sections in your page where you want to navigate that must have the correspondind ids like <div id="home"> or <div id="about"> this is called in page linking. then take a look here for how to use srollspy: http://getbootstrap.com/javascript/#scrollspy. i'll get back with info also for smooth scrolling
Purcea Robert
@RobertPurcea
Dec 09 2016 18:21
oh lol my bad thanks @TylerMoeller
CamperBot
@camperbot
Dec 09 2016 18:21
robertb4 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1122 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
KedeXx
@KedeXx
Dec 09 2016 18:43
This would be white? Cuz #fff is white in hex
grantknaver
@grantknaver
Dec 09 2016 18:53
OK my animations dont seem to be working when I change my container's height property to min-height. Any idea as to why?
Im trying to get my footer to not cover part of my content, and the change to min-height works but it breaks my animation
http://codepen.io/GrantKnaver/pen/qqyWNq
McKay Williams
@Gamer41up
Dec 09 2016 18:53
So i have this function, this is on an onclick event in a table creation, so it toggles between two images. Can anyone help me to change this into a switch so it actually checks which cell was clicked. I'm super pressed for time for a final project and any help at all would be awesome thanks. change_image() {
var chi = document.getElementById("spotA").src;
if (chi.match("Assets/A.jpg")) {
document.getElementById("spotA").src = "Assets/Back.jpg";
} else {
document.getElementById("spotA").src = "Assets/A.jpg";
}
var chi1 = document.getElementById("spotA2").src;
if (chi1.match("Assets/A.jpg")) {
    document.getElementById("spotA2").src = "Assets/Back.jpg";
} else {
    document.getElementById("spotA2").src = "Assets/A.jpg";
}
Tyler Moeller
@TylerMoeller
Dec 09 2016 18:53
@KedeXx White #fff text with a green #009600 shadow
KedeXx
@KedeXx
Dec 09 2016 18:56
Where's green value
In your code
grantknaver
@grantknaver
Dec 09 2016 18:59
any ideas
could maybe a height property change in my animation break if I change the containers heigtht property to min-height
been trying but the other methods obscure some of the other content
Neeraj Lakhotia
@neeraj08
Dec 09 2016 19:07
anyone knows about window.open() ?
I am using
```js
url='www.twitter.com/share?';//text="'+quote+'"';window.open(url,"_blank");

ignore last line . it's
url='www.twitter.com/share?';
window.open(url,"_blank");
This takes me to http://s.codepen.io/neeraj08/fullpage/www.twitter.com/share?
instead of www.twitter.com/share?
Tyler Moeller
@TylerMoeller
Dec 09 2016 19:10
@neeraj08 Open your browser's dev console (Ctrl+Shift+J) - do you see any errors?
Sorin Ruse
@sorinr
Dec 09 2016 19:11
@grantknaver i would try to reapply the animation after everything is in place
Tyler Moeller
@TylerMoeller
Dec 09 2016 19:11
@neeraj08 nvm, didn't see you add those last two lines, use https:// in front of the twitter url
Neeraj Lakhotia
@neeraj08
Dec 09 2016 19:11
ok. let me try with https://
woah!!! it works
I thought it could just take the protocol by default
anyway , thanks @TylerMoeller
CamperBot
@camperbot
Dec 09 2016 19:13
neeraj08 sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1123 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Tyler Moeller
@TylerMoeller
Dec 09 2016 19:14
Sure, you're welcome
grantknaver
@grantknaver
Dec 09 2016 19:15
@sorinr thanks will try
CamperBot
@camperbot
Dec 09 2016 19:15
grantknaver sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 919 | @sorinr |http://www.freecodecamp.com/sorinr
zKruki
@zKruki
Dec 09 2016 19:22
@sorinr thanks
CamperBot
@camperbot
Dec 09 2016 19:22
zkruki sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 920 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Dec 09 2016 19:23
@zKruki np. welcome
RyanWng
@RyanWng
Dec 09 2016 20:03
Hi all programmers, may I ask how you guys learn and master css3?
I have learned some about it through W3C and Mozzila documentation where I know many definition, value, etc. of properties. However, putting them together is a problem because, for example, sometimes the properties would affect each other, and sometimes you have to set up different 'position' for different elements.
All these knowledges are not found on W3C and Mozzila, do you guys know where and how to make it ? Thanks all
Thinh Cao
@tcao2
Dec 09 2016 20:04
I have some problems with the grid system for the calculator project
i am trying to align the last row (bottom row) next to the "+" button
by setting changing the top-margin, but it does not seem to work as there must be some constraints in the grid
can someone take a look and help me?
the + button supposed to span over 2 rows
I did that, but the last row isn't aligned correctly
here is my pen
soccer1996
@soccer1996
Dec 09 2016 20:12
hey everyone quick question if I want to add an image to my code how do I format the URL because Ive been trying to just copy and paste the url but that doesnt work. Any ideas?
Thinh Cao
@tcao2
Dec 09 2016 20:17
Thank you @sorinr
CamperBot
@camperbot
Dec 09 2016 20:17
tcao2 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 921 | @sorinr |http://www.freecodecamp.com/sorinr
Sorin Ruse
@sorinr
Dec 09 2016 20:20
@soccer1996 something like <img src="http://openwalls.com/image/44399/thumb3_pretty_dog_3.jpg" alt="">
@tcao2 welcome
zKruki
@zKruki
Dec 09 2016 20:30
function findLongestWord(str) {

var myArray = str.split(" ");
 var wordLength = [];
  wordLength.push(myArray[0].length, myArray[1].length);
  return wordLength;


  }
// myArray[0].length; 

findLongestWord("The quick brown fox jumped over the lazy dog");
almost done :smile:
Eric Scott
@Escotty
Dec 09 2016 20:45
Hello all!
Pieter Stokkink
@forkerino
Dec 09 2016 20:51
@zKruki try making a loop to push all the different lengths to the wordLength array...
Then find the longest length.
zKruki
@zKruki
Dec 09 2016 20:57
@forkerino thanks
CamperBot
@camperbot
Dec 09 2016 20:57
:cookie: 321 | @forkerino |http://www.freecodecamp.com/forkerino
zkruki sends brownie points to @forkerino :sparkles: :thumbsup: :sparkles:
Nathanael-M
@Nathanael-M
Dec 09 2016 20:58
Just finished my portfolio project!
Opinions?
Thoughts?
zKruki
@zKruki
Dec 09 2016 21:01
function findLongestWord(str) {

var myArray = str.split(" ");
 var wordLength = [];
  wordLength.push(myArray[0].length, myArray[1].length, myArray[2].length, myArray[3].length, myArray[4].length, myArray[5].length, myArray[6].length, myArray[7].length, myArray[8].length);

 myArray2 = wordLength.sort();

  myArray2.reverse();
   return myArray2[0];



  }
// myArray[0].length; return wordLength; copyPasta

findLongestWord("The quick brown fox jumped over the lazy dog");
Pieter Stokkink
@forkerino
Dec 09 2016 21:01
@Nathanael-M Looks great. One thing I miss is the titles for the different sections. At the moment it isn't completely clear to the visitor of the site what is where.
zKruki
@zKruki
Dec 09 2016 21:02
:smirk_cat: don't work
Pieter Stokkink
@forkerino
Dec 09 2016 21:03
@zKruki Nope.
try a for loop
zKruki
@zKruki
Dec 09 2016 21:04
@forkerino if i can't script out like that then surely a for loop won't work on its own
Pieter Stokkink
@forkerino
Dec 09 2016 21:04
for  ( var i=0; i<myArray.length; i++) {
wordLength.push(myArray[i].length);
}
Nathanael-M
@Nathanael-M
Dec 09 2016 21:05
@forkerino Thanks! What do you think of the scroll menu in the top right corner
CamperBot
@camperbot
Dec 09 2016 21:05
nathanael-m sends brownie points to @forkerino :sparkles: :thumbsup: :sparkles:
:cookie: 322 | @forkerino |http://www.freecodecamp.com/forkerino
Pieter Stokkink
@forkerino
Dec 09 2016 21:05
@zKruki Yes, there's another problem
zKruki
@zKruki
Dec 09 2016 21:06
@forkerino i like your idea, don't get me wrong :smile:
Pieter Stokkink
@forkerino
Dec 09 2016 21:06
less typing, and it works with other strings in the tests.
zKruki
@zKruki
Dec 09 2016 21:07
@forkerino brilliant
Pieter Stokkink
@forkerino
Dec 09 2016 21:09
@zKruki Now it only works with strings consisting of nine words.
@Nathanael-M It looks nice, could be a little more prominent for my taste. Perhaps with a little icon explaining the section?
Nathanael-M
@Nathanael-M
Dec 09 2016 21:29
@forkerino Thanks for the feedback! I'll try and make something work.
CamperBot
@camperbot
Dec 09 2016 21:29
nathanael-m sends brownie points to @forkerino :sparkles: :thumbsup: :sparkles:
:warning: nathanael-m already gave forkerino points
Pieter Stokkink
@forkerino
Dec 09 2016 21:31
:beers:
zKruki
@zKruki
Dec 09 2016 21:31
@forkerino yea, kinda hesitant to copy your code and call it done. :smirk:
Pieter Stokkink
@forkerino
Dec 09 2016 21:32
@zKruki If you understand why it works, it isn't a problem, I think.
zKruki
@zKruki
Dec 09 2016 21:32
im failing more than the 10 letter word test.
im getting an undefined length somehow
your code = ferarri my code = something i MUST fix :laughing:
Joel Peters
@rjpetersiii
Dec 09 2016 21:53
How would I center this image on my page <img src="image"> Would it be something like <img class="img-center" src="image">?
Neeraj Lakhotia
@neeraj08
Dec 09 2016 21:57
@rjpetersiii <img style="text-align:center" src="...">
Tyler Moeller
@TylerMoeller
Dec 09 2016 21:59
@rjpetersiii You want class="center-block" if you're using bootstrap. More info: http://getbootstrap.com/css/#images
soccer1996
@soccer1996
Dec 09 2016 22:05
@sorinr thanks
CamperBot
@camperbot
Dec 09 2016 22:05
:cookie: 922 | @sorinr |http://www.freecodecamp.com/sorinr
soccer1996 sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
Joel Peters
@rjpetersiii
Dec 09 2016 22:09
Thank you Tyler I am using boot strap, I think Neeraj's method would have worked were I using CSS. I am working on the tribute page challenge. Thank you both for your help.
Waqas Abbasi
@Waqas909
Dec 09 2016 22:10
"<p>The ECS Season 2 Finals are finally here! The top 4 teams from Europe join the top 4 teams from North America. Tune in to see Astralis, Faze, EnVyUs </p>
Any Ideas, how I can just take out the the first sentence until the "." (Fullstop), the text above is just an example, I want to do the same thing for many other text extracts :3
Eric Hartline
@wildlifehexagon
Dec 09 2016 22:17
Hi! Could someone help me squash a bug in my tic tac toe game? I'm trying to get it so the computer doesn't make an extra move after the user wins. An easy way to replicate this most of the time is to play in square 8 (bottom middle), then square 5 (left middle), then play the winning square. You'll see the computer add their own "winning" square right after that. Here's the CodePen: http://codepen.io/wildlifehexagon/pen/PbBjvP
Waqas Abbasi
@Waqas909
Dec 09 2016 22:27
Nvm
Aida Woldegiorgis
@aow003
Dec 09 2016 22:31
I am trying to create a menu selection for my portfolio project but when I type in my code it comes up as a regular bullet point list

<header>
<link href="https://fonts.googleapis.com/css?family=Abril+Fatface" rel="stylesheet">
</header>

<div class="container-fluid">
<ul class= "nav nav-pills">
<li>
<a href ="#"> Aida's Facebook </a>
</li>
<li>
<a href ="#"> Aida's Facebook </a>
</li>
<li>
<a href ="#"> Aida's Facebook </a>
</li>
<li>
<a href ="#"> Aida's Facebook </a>
</li>
</div>

Neeraj Lakhotia
@neeraj08
Dec 09 2016 22:31
@wildlifehexagon got it
Aida Woldegiorgis
@aow003
Dec 09 2016 22:31
What do I need to do to make the code recognize the nav pills class?
Pieter Stokkink
@forkerino
Dec 09 2016 22:32
@aow003 Did you include the bootstrap css?
and jQuery?
Neeraj Lakhotia
@neeraj08
Dec 09 2016 22:32
@wildlifehexagon your gameOver() function needs to return something(say true) when you either lose or win. so that the previous function stops executin anymore
Aida Woldegiorgis
@aow003
Dec 09 2016 22:32
oh let me check!
Tyler Moeller
@TylerMoeller
Dec 09 2016 22:33
@wildlifehexagon Looks like you can add a condition to your compMove() function and check if $('.result').html() has a value. If so, return;
Aida Woldegiorgis
@aow003
Dec 09 2016 22:33
@neeraj08 THANK YOU!
CamperBot
@camperbot
Dec 09 2016 22:33
aow003 sends brownie points to @neeraj08 :sparkles: :thumbsup: :sparkles:
:cookie: 298 | @neeraj08 |http://www.freecodecamp.com/neeraj08
Neeraj Lakhotia
@neeraj08
Dec 09 2016 22:33
@wildlifehexagon in $(".box) function you need
    checkBoxes();
    if(gameOver()==true)
      return;
    turn = 1;
Eric Hartline
@wildlifehexagon
Dec 09 2016 22:36
@neeraj08 I tried that and it's still letting the computer move
Tariq
@beyallluv
Dec 09 2016 22:37
HI. Trying to get these buttons to jump to different sections of my portfolio page. I've tried several things to no luck. Can someone help me with that code?
Pieter Stokkink
@forkerino
Dec 09 2016 22:39
@beyallluv Hello! You need to put the anchor tags at the right place in your page. So the <a name="anchor"> should be at the place where you want to jump to.
Tyler Moeller
@TylerMoeller
Dec 09 2016 22:39
@wildlifehexagon To be specific:
  function compMove() {
    if($('.result').html()) return;
   // leave the rest of your code in the function as is
Neeraj Lakhotia
@neeraj08
Dec 09 2016 22:39
@wildlifehexagon no i tried that and the problem is no more
i put 'return true' in 3 places. did you?
Here's a link to my code: http://codepen.io/neeraj08/full/bBjrdg/
:D
Eric Hartline
@wildlifehexagon
Dec 09 2016 22:42
@neeraj08 Aha! I had tried adding return true 3x and also the if statement but not at the same time. Now it works (and makes sense)! Thank you very much!
CamperBot
@camperbot
Dec 09 2016 22:42
wildlifehexagon sends brownie points to @neeraj08 :sparkles: :thumbsup: :sparkles:
:cookie: 299 | @neeraj08 |http://www.freecodecamp.com/neeraj08
Aida Woldegiorgis
@aow003
Dec 09 2016 22:42
Now I am having an issue with CSS recognizing my font family class
Eric Hartline
@wildlifehexagon
Dec 09 2016 22:42
@TylerMoeller Thank you for your input too! I was exploring your suggestion before @neeraj08 responded again. Much appreciated
CamperBot
@camperbot
Dec 09 2016 22:42
wildlifehexagon sends brownie points to @tylermoeller and @neeraj08 :sparkles: :thumbsup: :sparkles:
:warning: wildlifehexagon already gave neeraj08 points
:star2: 1124 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Aida Woldegiorgis
@aow003
Dec 09 2016 22:42
nav-pills
{
font-family: "Abril Fatface" cursive;
}
Pieter Stokkink
@forkerino
Dec 09 2016 22:42
@neeraj08 I'm not looking at your code, because I just started this challenge, but after you win, you can still put X's in the empty boxes. @wildlifehexagon!
Aida Woldegiorgis
@aow003
Dec 09 2016 22:43
Bootstrap is on
Neeraj Lakhotia
@neeraj08
Dec 09 2016 22:43
@forkerino it's @wildlifehexagon 's code. He's still adding stuff to it :)
Eric Hartline
@wildlifehexagon
Dec 09 2016 22:44
@aow003 You have to add . before nav-pills
Pieter Stokkink
@forkerino
Dec 09 2016 22:44
@neeraj08 ah, ok
Eric Hartline
@wildlifehexagon
Dec 09 2016 22:44
@aow003 That way it knows it's attached to a class
Pieter Stokkink
@forkerino
Dec 09 2016 22:44
@aow003 and make sure to put the <link href="https://fonts.googleapis.com/css?family=Abril+Fatface" rel="stylesheet"> in the <head> tags.
Aida Woldegiorgis
@aow003
Dec 09 2016 22:45
Yes I did that^^^
Pieter Stokkink
@forkerino
Dec 09 2016 22:46
:D
Aida Woldegiorgis
@aow003
Dec 09 2016 22:46
mine is titled as <header>
but @wildlifehexagon If bootstrap is on and I add it in css it should work correct?
Pieter Stokkink
@forkerino
Dec 09 2016 22:46
It should be in <head>. Check the Settings/html tab
Neeraj Lakhotia
@neeraj08
Dec 09 2016 22:47
@aow003 @forkerino i was just gonna say that :D <head>
Aida Woldegiorgis
@aow003
Dec 09 2016 22:48
I see, I changed it but still is not recognizing font family
Pieter Stokkink
@forkerino
Dec 09 2016 22:49
did you also change nav-pills to .nav-pills, as per @wildlifehexagon 's suggestion?
Eric Hartline
@wildlifehexagon
Dec 09 2016 22:49
@aow003 Could you link to your Codepen so I can take a further look?
jacobus-brogly
@jacobus-brogly
Dec 09 2016 22:49
hello anyone experience with react and vscode?
redstuff.png
why am i getting red lines at the bottom?
Aida Woldegiorgis
@aow003
Dec 09 2016 22:49
@forkerino NO LET ME TRY THAT
jacobus-brogly
@jacobus-brogly
Dec 09 2016 22:49
note:it does compile with tsconfig.json
Aida Woldegiorgis
@aow003
Dec 09 2016 22:49
OMG I BET THAT IS WHY
still didnt work :(
@wildlifehexagon is there a way I can send it to you directly?
Pieter Stokkink
@forkerino
Dec 09 2016 22:51
@jacobus-brogly Not an expert, but shouldn't the last <span> at the bottom have className instead of class?
Eric Hartline
@wildlifehexagon
Dec 09 2016 22:51
@aow003 If you have a saved Codepen, you could just post the URL and it will embed it. Similar to what I did above w/ my tic tac toe issue
Aida Woldegiorgis
@aow003
Dec 09 2016 22:51
I got it to work now,
font-family: 'Abril Fatface', cursive;
I originally did not have , between Abril Fatface and cursive
Eric Hartline
@wildlifehexagon
Dec 09 2016 22:52
@aow003 Ahhh. Glad you got it to work!
Aida Woldegiorgis
@aow003
Dec 09 2016 22:52
I can still share it with you if you would like I dont mind taking a look still
Pieter Stokkink
@forkerino
Dec 09 2016 22:52
:thumbsup:
Aida Woldegiorgis
@aow003
Dec 09 2016 22:52
thanks guys
Neeraj Lakhotia
@neeraj08
Dec 09 2016 22:52
@aow003 that syntax is to choose the second font when first isn't available
jacobus-brogly
@jacobus-brogly
Dec 09 2016 22:52
@forkerino no its react jsx syntax
Aida Woldegiorgis
@aow003
Dec 09 2016 22:53
I see!
Pieter Stokkink
@forkerino
Dec 09 2016 22:53
@jacobus-brogly Yes, exaclty, it currently is class not className.
Aida Woldegiorgis
@aow003
Dec 09 2016 22:53
you are all awesome thank you so much hahaha
Neeraj Lakhotia
@neeraj08
Dec 09 2016 22:53
@aow003 you might just write
font-family: cursive
as well .. haha
jacobus-brogly
@jacobus-brogly
Dec 09 2016 22:54
right, oh right, whatever, no thats not the problem,
the problem is stated, re-read
vscode is giving a problem with any jsx,
it started doing this some days ago, must be a config error (i hope)
Pieter Stokkink
@forkerino
Dec 09 2016 22:56
@jacobus-brogly I use sublime, so can't really tell how vscode works. Sublime has some plugins that help to recognize jsx.
jacobus-brogly
@jacobus-brogly
Dec 09 2016 22:56
ok, cool, well i went from Atom to vscode, because typescript
does it recognize jsx + typescript (Sublime)?
it seems to be an issue
i asked them first (react/typescript groups) but no answers
Pieter Stokkink
@forkerino
Dec 09 2016 22:59
blob
@jacobus-brogly there are some typescript plugins.
jacobus-brogly
@jacobus-brogly
Dec 09 2016 23:00
nice, i recommend typescript it speeds up coding like 5x, because you make less mistakes
wish i learned it sooner
you can mix with vanilla js always
Pieter Stokkink
@forkerino
Dec 09 2016 23:01
@jacobus-brogly thanks for the tip! Will check it out.
CamperBot
@camperbot
Dec 09 2016 23:01
forkerino sends brownie points to @jacobus-brogly :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for jacobus-brogly
Lewis
@LewisLA
Dec 09 2016 23:02
Can somebody share their wisdom as to why there might be added (scrollable) space on the right-hand side of my project? https://codepen.io/LewisLA/full/QGxzvQ/
Pieter Stokkink
@forkerino
Dec 09 2016 23:05
@LewisLA You probably need to wrap your rows in a <div class="container-fluid"></div>
JackVizl
@JackVizl
Dec 09 2016 23:05
@sorinr
think you might be right about it being the api
Jason Luboff
@JLuboff
Dec 09 2016 23:08
I have a personal project I'm working on. It has a form submission that is handled by jQuery and using $.post sends the data to PHP which then writes it to a JSON file. I can't for the life of me, get the page to redirect to a different page. It just clears the form. Any ideas?
jacobus-brogly
@jacobus-brogly
Dec 09 2016 23:09
use 302 redirect as reply
Lewis
@LewisLA
Dec 09 2016 23:10
@forkerino Is that indivually (every "row") or all of them as one?
Jan
@burning-monk
Dec 09 2016 23:10
@LewisLA it's because of the width: 100%; in .splash-image
something is taking space outside of it
Tyler Moeller
@TylerMoeller
Dec 09 2016 23:11
@JackVizl They changed the URL recently, visit https://wind-bow.hyperdev.space and it will redirect you
Neeraj Lakhotia
@neeraj08
Dec 09 2016 23:11
@burning-monk no i tried reducing it. didn't help
Tyler Moeller
@TylerMoeller
Dec 09 2016 23:11
JackVizl
@JackVizl
Dec 09 2016 23:12
@TylerMoeller ahh thanks man, wondered why it worked and then suddenly, it didnt
CamperBot
@camperbot
Dec 09 2016 23:12
jackvizl sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1126 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Jan
@burning-monk
Dec 09 2016 23:12
@neeraj08 ? if you remove it you see that there is some black space
Pieter Stokkink
@forkerino
Dec 09 2016 23:12
@LewisLA All of them! Wrap your whole page in it.
Jan
@burning-monk
Dec 09 2016 23:12
maybe container-fluid creates some margin
Jason Luboff
@JLuboff
Dec 09 2016 23:12
@jacobus-brogly Thanks, but thats not quite what I'm looking for. That doesn't really give information on how to get the redirect working
CamperBot
@camperbot
Dec 09 2016 23:12
jluboff sends brownie points to @jacobus-brogly :sparkles: :thumbsup: :sparkles:
:warning: could not find receiver for jacobus-brogly
Waqas Abbasi
@Waqas909
Dec 09 2016 23:15
Feedback so far! Thank you!
Any is accepted :-)
Neeraj Lakhotia
@neeraj08
Dec 09 2016 23:16
@burning-monk yes did 90%. that didn't help. but i see his ode again now. he probably put everything in div . image is good at 100%
Jan
@burning-monk
Dec 09 2016 23:16
just remove it and give contain-fluid a background-color then you see it @neeraj08
c0d0er
@c0d0er
Dec 09 2016 23:18
@TylerMoeller thanks
CamperBot
@camperbot
Dec 09 2016 23:18
c0d0er sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
:star2: 1127 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
Jan
@burning-monk
Dec 09 2016 23:18
do you need a fluid-container for nav-bar?
Neeraj Lakhotia
@neeraj08
Dec 09 2016 23:19
@burning-monk i see the lower images are wider. those must have caused the problem
Jan
@burning-monk
Dec 09 2016 23:20
@neeraj08 is that youir pen?
Neeraj Lakhotia
@neeraj08
Dec 09 2016 23:21
@burning-monk no O.o
Lewis
@LewisLA
Dec 09 2016 23:23
Played around and nothings working so far!
Jan
@burning-monk
Dec 09 2016 23:23
I think it's the margin of container-fluid causes this
Tyler Moeller
@TylerMoeller
Dec 09 2016 23:24
You can't nest a container inside another container - put your container after the navbar
To debug visual issues, add a border around all elements:
* {
  border: 1px solid blue;
}
Neeraj Lakhotia
@neeraj08
Dec 09 2016 23:25
image 2,3 and 4 are slightly wider than image 1 and 5 (from top to bottom)
Pieter Stokkink
@forkerino
Dec 09 2016 23:25
@TylerMoeller good tip!
Tyler Moeller
@TylerMoeller
Dec 09 2016 23:25
Thanks, learned that the hard way - dealing with these same issues :)
Pieter Stokkink
@forkerino
Dec 09 2016 23:27
@TylerMoeller I can only imagine.
Lewis
@LewisLA
Dec 09 2016 23:29
I have placed the container-fluid after the nav and the problem persists
major headache
Lewis
@LewisLA
Dec 09 2016 23:47
for some reason, removing .row fixes it, but surely i need to use .row
Lewis
@LewisLA
Dec 09 2016 23:54
giving .row a "margin-right: 0;" also removed it, i'll stick with that for now