These are chat archives for FreeCodeCamp/HelpFrontEnd

8th
Apr 2017
Gulsvi
@gulsvi
Apr 08 2017 00:00
@Pabloey It isn't necessary to add the white caption, but it makes it look nice and it's pretty easy to set up. You can use CSS if you want, even JavaScript. The only requirements are to fulfill the User Stories mentioned in the challenge.
Pabloey
@Pabloey
Apr 08 2017 00:00
ah..alright, thank you!
Gulsvi
@gulsvi
Apr 08 2017 00:00
@Pabloey This may help with that white caption: https://v4-alpha.getbootstrap.com/content/figures/
Hoppy
@Hoppy1982
Apr 08 2017 00:01
ahh yeah, it's returning xml instead of json
Pabloey
@Pabloey
Apr 08 2017 00:03
I got a different alternative lol
Hoppy
@Hoppy1982
Apr 08 2017 00:06
@thodorisanta I just finished that one, I did what you're saying by having a container div and adding elements for options with js then killing them and adding different elements for the game part
Moustapha
@moustaflo
Apr 08 2017 00:20
why is display = "none" leaving a gap from where the div is removed?
in js
Spyrantis Theodoros
@thodorisanta
Apr 08 2017 00:35
@Hoppy1982 can you send me your project?
Jorge
@OrangeKulture
Apr 08 2017 00:46
display: none will always remove the div and the width/height it takes @moustaflo
@moustaflo if you want to populate the content with an event, i suggest you use visibility: hidden;
mattr12
@mattr12
Apr 08 2017 01:19
I modified the display of an element to "inline-block" and now it won't center--it is a feature containing an img and a figcaption element--any ideas?
Victor Teixeira
@victortp
Apr 08 2017 02:03
Can someone help me? "XMLHttpRequest cannot load https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://s.codepen.io' is therefore not allowed access."
Jorge
@OrangeKulture
Apr 08 2017 02:04
@victortp you have the link the the pen?
@mattr12 hard to tell without looking at the elements
Victor Teixeira
@victortp
Apr 08 2017 02:04
Jorge
@OrangeKulture
Apr 08 2017 02:06
hmm
@victortp the call to the API works, it actually returns this:
[
  {
    "ID": 1013,
    "title": "David A. Stuebe",
    "content": "<p>Don&#8217;t try and reinvent the wheel &#8211; just work on making it better than anyone else.  </p>\n",
    "link": "https://quotesondesign.com/david-a-stuebe-2/"
  }
]
looks like they wont allow the request from codepen
Victor Teixeira
@victortp
Apr 08 2017 02:07
@OrangeKulture seriously?! :(
Jorge
@OrangeKulture
Apr 08 2017 02:07
thats what I imagine, looking at the error message
u would have implement a catch function and see what's up
@victortp you are using jquery to pass in the request ..so im not entirely sure. I did an XMLHttp
Victor Teixeira
@victortp
Apr 08 2017 02:10
i'll try another api @OrangeKulture
the0ffh
@the0ffh
Apr 08 2017 02:27
Hello!
I have a problem with displaying the following on mobile [unfortunately i have only a Windows Phone to test it at]. On pc the page works as intended. I admit I run out of ideas how to bite on this. Thanks in advance for any help.
http://codepen.io/the0ffh/pen/gmNoKb
Jorge
@OrangeKulture
Apr 08 2017 02:30
@the0ffh looks awesome! I would look into adding row and col classes, that will definitely help.
@the0ffh give that a try im sure it can help .. gtg tho, c u guys later!
Ken Haduch
@khaduch
Apr 08 2017 02:31
@the0ffh - looks pretty good on an iPhone. A little overlap in the footer, perhaps?
the0ffh
@the0ffh
Apr 08 2017 02:31
@OrangeKulture Thx!
CamperBot
@camperbot
Apr 08 2017 02:31
the0ffh sends brownie points to @orangekulture :sparkles: :thumbsup: :sparkles:
:cookie: 276 | @orangekulture |http://www.freecodecamp.com/orangekulture
the0ffh
@the0ffh
Apr 08 2017 02:32
@khaduch I have missed that part - thank you for pointing it.
CamperBot
@camperbot
Apr 08 2017 02:32
the0ffh sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2712 | @khaduch |http://www.freecodecamp.com/khaduch
the0ffh
@the0ffh
Apr 08 2017 02:35
Time to hit the bed - have a good night/day, guys! :]
Victor Teixeira
@victortp
Apr 08 2017 02:48
@OrangeKulture the problem was indeed the API
klae32
@klae32
Apr 08 2017 02:56
Hey all I am having some issues in where to start for my portfolio project and was wondering if any of you guys would be willing to help
Tom
@moT01
Apr 08 2017 03:01
whats up @klae32
Ken Haduch
@khaduch
Apr 08 2017 04:01
@klae32 - not sure if you're still around. I found the example at the w3schools.com/boostrap, in the "Themes" section, helpful to see some examples (walkthroughs) of a site design and layout for something that looked like the sample portfolio project. If you need that kind of help. Just make sure, if you try any of those things, I think that they are based on bootstrap V3 - CodePen currently loads V4 by default, so you have to paste in the V3 URL....
klae32
@klae32
Apr 08 2017 04:03
@khaduch thanks. I appreciate that :) I will look into that soon. :+1:
CamperBot
@camperbot
Apr 08 2017 04:03
klae32 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 2714 | @khaduch |http://www.freecodecamp.com/khaduch
NixonRichard
@NixonRichard
Apr 08 2017 04:24
sup
Gulsvi
@gulsvi
Apr 08 2017 04:36
sup
jmariomejiap
@jmariomejiap
Apr 08 2017 05:01
hey guys.
hey guys. Iam a real beginner at front end. can someone give me a hand. I am trying to get my quote generator challenge working but I am having issues connecting with the API. http://codepen.io/jmariomejia/pen/GWbvBg?editors=1010
Gulsvi
@gulsvi
Apr 08 2017 05:05
@jmariomejiap You will need to add jQuery to your project.
jmariomejiap
@jmariomejiap
Apr 08 2017 05:05
I've tried to follow some of the examples from previews lessons but dont seem to get way it is not working. It looks like the click event is not being heard... i dont know if that is possible
ohhhh.... i see. how do I do that @SkyCoder01
Gulsvi
@gulsvi
Apr 08 2017 05:06
@jmariomejiap Click "Settings" and then click "JavaScript" there is a "Quick-Add" menu, select jQuery.
That will show you the next error :)
You will have to look at the data variable and access that JSON to get the quote text
jmariomejiap
@jmariomejiap
Apr 08 2017 05:07
@SkyCoder01 oh man. I guess that explains a lot. it is like trying to start a car without the key.
Gulsvi
@gulsvi
Apr 08 2017 05:07
Similar yes :)
jmariomejiap
@jmariomejiap
Apr 08 2017 05:07
@SkyCoder01 Ill get back to it now. thanks for you help.
CamperBot
@camperbot
Apr 08 2017 05:07
jmariomejiap sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 928 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Gulsvi
@gulsvi
Apr 08 2017 05:08
No problem
anfusion
@anfusion
Apr 08 2017 05:20
hey i was wondering if anyone knows about transitions in css
i was trying to get one working, but instead of going from the original gray to the target background color, it goes from white to the background color when u hover over it
its here anyway if anyone has time for a look
sorry that was not uptodate
Gulsvi
@gulsvi
Apr 08 2017 05:25
@anfusion Use background-color instead of background
nav ul li a:hover {
  background-color: #585858;
  color:#000;
  box-shadow: 0 0 1px #000; /* x offset, y offset, size, color */
  transition: all 1s ease;
}
(A little better it seems with transition "all", edited)
anfusion
@anfusion
Apr 08 2017 05:28
let me have a go
thanks
@SkyCoder01 thank that made the white go away
CamperBot
@camperbot
Apr 08 2017 05:29
anfusion sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 929 | @skycoder01 |http://www.freecodecamp.com/skycoder01
anfusion
@anfusion
Apr 08 2017 05:30
@SkyCoder01 but if i want the hover to apply tothe whole menu item (not just the text) do i need to move it to within a differnet selector/element?
sorry i mean if i want the transition to appl*
Gulsvi
@gulsvi
Apr 08 2017 05:34
@anfusion Yes, you'll need the :hover to apply to the li instead.
anfusion
@anfusion
Apr 08 2017 05:35
ok ta let me try
Gulsvi
@gulsvi
Apr 08 2017 05:36
You can also have some effects apply to the <a> while others apply to the <li> to help fine tune it.
Sometimes it helps to put a temporary border around the elements to better identify their boundaries
anfusion
@anfusion
Apr 08 2017 05:40
thing is tho
i defined the background color within the <a>
would i need to remove that and put it in the li to get the background color transition u rekon?
omg
it works
jmariomejiap
@jmariomejiap
Apr 08 2017 06:08
@SkyCoder01 thanks again. it is working now.http://codepen.io/jmariomejia/full/GWbvBg/
CamperBot
@camperbot
Apr 08 2017 06:08
jmariomejiap sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 930 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Tanushree Samanta
@TSamanta
Apr 08 2017 06:35
hi! I have been given a project where I have to fetch search the word and the content from wikipedia onto my webpage also in 10 different languages. I am learning js could you please guide me how to go about it i just have 2 days to prepare this project. could you please guide me?
Kenard Ellis
@Kenard0
Apr 08 2017 06:38
j
Mychal Simka
@msimka
Apr 08 2017 07:58
@TSamanta sure
def
@defregga
Apr 08 2017 07:59
Good morning
Spyrantis Theodoros
@thodorisanta
Apr 08 2017 08:10
can someone guide me through the tic tac toe project please :P
Josh Beyer
@Joshbeyer
Apr 08 2017 08:11
@thodorisanta send me the link
Spyrantis Theodoros
@thodorisanta
Apr 08 2017 08:12
Josh Beyer
@Joshbeyer
Apr 08 2017 08:13
i haven't done the tic tac toe, but I can help you. What are you trying to do here? Make it look like a tic tac toe board
Spyrantis Theodoros
@thodorisanta
Apr 08 2017 08:16
i kinda did the graphic part
now i have to make the user decide if he will play with the X or O and if he will play with another person or a bot
but i dont know how to make this, cause i want the beggining screen to be like "How do you want to play?" and the options to be "one player" "two players
and after that this screen will dissapear and a new one will pop up and ask if he wants to play with X or O
and ofcource after that the game will start
like in the project freecodecad gives
Tanushree Samanta
@TSamanta
Apr 08 2017 08:43
how do we fetch content in different languages
?
via wikipedia api
Deepan Udaiyar
@CodeToOvercome
Apr 08 2017 09:07
@SkyCoder01 thank you so much... that worked..
CamperBot
@camperbot
Apr 08 2017 09:07
codetoovercome sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 931 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Jashaswee Jena
@jashasweejena
Apr 08 2017 09:12
I have never coded a website by myself :/ . How do I get started on the 1st project?
heroiczero
@heroiczero
Apr 08 2017 09:14
@jashasweejena use the knowledge that you acquired doing the previous exercises to build a tribute page. Use Bootstrap, CSS, HTML.
Deepan Udaiyar
@CodeToOvercome
Apr 08 2017 09:27
@jashasweejena it might be overwhelming ..So don't think about whole project..See what you can do to implement the basic strucuture first and then build something on top of it..
Jasdeep Singh
@jasdeep92
Apr 08 2017 09:39
https://expandk.blogspot.com .... Hello world. Here's my new post. check out my blog.. It no fiction just a real and practical thinking. please do check and comment...please
_
Derek B. McIntire
@derekbmcintire
Apr 08 2017 09:44
Does anyone see why my on click function isn't working here? thanks! - https://codepen.io/derekbmcintire/pen/RpzGyb?editors=1111
Trommelochse
@Trommelochse
Apr 08 2017 09:54
what exactly do you expect to happen?
ok, now I see
@derekbmcintire you have to add jQuery
if you want to use it
Atanas Kolev Beychev
@morfeibox
Apr 08 2017 10:13
Hi guys , i had hard times to solve this issue. Is somebody know wy my code is not working in that particular case. Istead of 'i' it gave me 'n' as a result : http://www.clipular.com/c/4805017094848512.png?k=V8H8wrVYWoAk1b2tVDHuw3soCtE
Spyrantis Theodoros
@thodorisanta
Apr 08 2017 10:21

http://codepen.io/oshikurou/pen/dvEOOX?editors=1100

whenever i hover my mouse over the "one player" and "two player" buttons, the buttons move. how can i change that?

Trommelochse
@Trommelochse
Apr 08 2017 10:23
@Thodoris seems like they move because you add a border to them on hover
and your button on non-hover state don't have a border
to get the same effect
try to give you non-hover buttons a border of
2px solid transparent
that should do the trick
in order for it to show, you obviously need to remove the 'border: none' property as well
Ross
@rossauusa
Apr 08 2017 10:29
Hi everyone, just working on my tribute page. I am thinking the image isn't responsive and would like to move the social icons closer together but as i split it up with col-xs-4 im not sure what to do next? since ive done that my footer notes have also gone off centre and text-align doesnt seem to work? http://codepen.io/rossauusa/pen/peXLrz any help would be appreciated.
Federico Dente
@fez994
Apr 08 2017 10:36
HI guys, i have a problem with the Local Weather API project, when i open it with my pc it works fine with all the browsers (chrome, firefox) but when i try open it from mobile nothing show up, do you guys know why ? https://fez994.github.io/Local-Weather-APP/
Atanas Kolev Beychev
@morfeibox
Apr 08 2017 10:42
Hi guys , i had hard times to solve this issue. Is somebody know wy my code is not working in that particular case. Istead of 'i' it gave me 'n' as a result : http://www.clipular.com/c/4805017094848512.png?k=V8H8wrVYWoAk1b2tVDHuw3soCtE
def
@defregga
Apr 08 2017 10:42
@rossauusa 1. Regarding social media icons: you give the <div> containing the name a class, but fail to do so for the remaining 3 <div> with the icons.
@rossauusa 2. Regarding off center footer: you never close that first <div class="row">
def
@defregga
Apr 08 2017 10:48
@rossauusa Also for 1. Read up in the Bootstrap documentation on the grid, so you can split up the 4 fields (title + 3 icons) in a way you like.
@rossauusa Also, your first line includes Bootstrap version 3, whereas in settings you include Bootstrap version 4. Will likely lead to issues, as some of their classes are behaviors are different. So decide on one and remove the other.
def
@defregga
Apr 08 2017 10:58
@morfeibox What's that challenge called?
Atanas Kolev Beychev
@morfeibox
Apr 08 2017 11:03
Hi , Missing letters
Ross
@rossauusa
Apr 08 2017 11:04
Hi @defregga , #1 I still do not quite understand? at the moment i think what you mentioned are all class="smaller-image thick-black-border"... #2 complete #1.1 will do now thanks!
CamperBot
@camperbot
Apr 08 2017 11:04
rossauusa sends brownie points to @defregga :sparkles: :thumbsup: :sparkles:
:cookie: 227 | @defregga |http://www.freecodecamp.com/defregga
Atanas Kolev Beychev
@morfeibox
Apr 08 2017 11:08
@defregga Hi , Missing letters
def
@defregga
Apr 08 2017 11:28
@morfeibox You seem to not get a successful "hit" on the position where 'i' should be. If you test the string "abcef" you'll see that the return value won't be 'd', but 'e'. This suggests, it processes all the way to the last letter in the sequence and then returns the letter of that char code minus one .
def
@defregga
Apr 08 2017 11:37
If you use the Dev Console, you can actually see that he correctly determines the first index at which loopedChar !== str.charCodeAt(0) + index is true. The issue is, your forEach loop keeps processing the rest of the elements in StrArr as well. And since all of them cause the condition to be true, the all overwrite the value of missing. Consequently, the function only returns the value for the second to last element of each string that has a missing letter in it.
You got it from here. :)
Atanas Kolev Beychev
@morfeibox
Apr 08 2017 11:46
@defregga Thanks !!
nadir199
@nadir199
Apr 08 2017 12:00
Hi dudes ^^
Can someone help me with an error i'm getting please?
Markus Kiili
@Masd925
Apr 08 2017 12:02
@nadir199 You can just post the question and relevant code here. No need to separately ask for help.
nadir199
@nadir199
Apr 08 2017 12:03
oh thanks, well i'm getting this error as i'm trying to add the tweet button.
Refused to display 'https://twitter.com/intent/tweet?text=Hello%20World' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self'".
nadir199
@nadir199
Apr 08 2017 12:15
well, i found a solution, i think that the problem was that i was using CodePen IDE... i changed the target of my link to _blank
rugano
@rugano
Apr 08 2017 12:19
Hello campers!
nadir199
@nadir199
Apr 08 2017 12:21
hello
rugano
@rugano
Apr 08 2017 12:23
I am struggling to build social media buttons but they are not visible inside to differentiate them. Kindly help me out unlock the styling of these buttons.Thanks; here: https://codepen.io/Njue/pen/jBjpoP
Atanas Kolev Beychev
@morfeibox
Apr 08 2017 12:24
@defregga this well debuged ! i'm going to check what can i do :)
rugano
@rugano
Apr 08 2017 12:29
also the sizes of the buttons are minute.How do i make them bigger?
Rimi.
@Codevotee
Apr 08 2017 12:31
@rugano your Font Awesome CSS link is not right, try placing this one instead: https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css
rugano
@rugano
Apr 08 2017 12:35
@APRim05 thanks,let me check that
CamperBot
@camperbot
Apr 08 2017 12:35
rugano sends brownie points to @aprim05 :sparkles: :thumbsup: :sparkles:
:cookie: 595 | @aprim05 |http://www.freecodecamp.com/aprim05
rugano
@rugano
Apr 08 2017 12:39
@APRim05 It worked !thank you.
def
@defregga
Apr 08 2017 13:01
@morfeibox Glad I could give some pointers, I am a newbie myself.
jpcr2807
@jpcr2807
Apr 08 2017 15:09
Hello Guys I am having trouble with AimTux I hope someone can help me out.
The problem is after I successfully injected AimTux the game crashes/closes on the Loading screen of any type of match MM, DM, Casual and even with customized maps
I think this is the wrong place am I right? hahhaa I've realized after I sent the message sry
Nitin Chandran Nair
@NitinNair89
Apr 08 2017 15:20
np @jpcr2807
Level One
@WelcomeToLevelOne
Apr 08 2017 15:32
Hey guys I am trying to center a <ul> using bootstrap and I can't figure out how to use offset. Any help?
kickkick479
@kickkick479
Apr 08 2017 15:38
<ul class=center-block> won't work?
lhoward465
@lhoward465
Apr 08 2017 15:49
Hi everyone :)
I'm having some ridiculous problems with dynamically generated html, does anyone have a little time to help me out on this one because I can't see what the problem is.
(to be honest it's probably something straight forward, I'm just looking too closely at it.
)
EK Azubuike
@ekazubuike
Apr 08 2017 15:57
Hey y'all! I'm putting some finishing touches on my Wikipedia Viewer, and I can't get the CSS for my links to work. I want to remove the text-decorations and change the color of the links on a:hover
nadir199
@nadir199
Apr 08 2017 15:57
hello
I have a problem when i try to get weather information from an API using ajax :/
Gulsvi
@gulsvi
Apr 08 2017 16:01
@nadir199 Check your Browser's Developer Console for errors (Ctrl+Shift+J on Windows/Linux). You will need to use a different Weather API if you want to use https (https://codepen.io/Jhnu/pen/QpXZGa). If you use HTTP though (http://codepen.io/Jhnu/pen/QpXZGa) you'll need to use a different location API. This will explain in more detail if needed: http://codepen.io/skycoder/post/apisandlocation
lhoward465
@lhoward465
Apr 08 2017 16:02
@SkyCoder01 I don't suppose you could spot the mistake I've made in my code could you? https://codepen.io/lhoward465/pen/mWxwWY?editors=1010
I'm having issues with the dynamic html stuff, I'm trying to apply a grid of users with a new row for every 3 users displayed but it doesn't want to add the closing div for each row correctly.
I can't see my mistake :S
Gulsvi
@gulsvi
Apr 08 2017 16:03
@ekazubuike Try this CSS instead:
a#url:hover {
  color: #EF6461;
  text-decoration: none;
}
I'll take a look @lhoward465 -- long time, btw, welcome back :)
nadir199
@nadir199
Apr 08 2017 16:06
@SkyCoder01 yeah thanks i actually checked it but i get an error because of using http so i switch to http and i get an error " net::ERR_CONNECTION_REFUSED"
CamperBot
@camperbot
Apr 08 2017 16:06
nadir199 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 932 | @skycoder01 |http://www.freecodecamp.com/skycoder01
EK Azubuike
@ekazubuike
Apr 08 2017 16:07
@SkyCoder01 It works, but why do I have to do it this way?
Gulsvi
@gulsvi
Apr 08 2017 16:11
@ekazubuike I looked closer and you have CSS conflicts. Bootstrap 3 in your html and Bootstrap 4 in your codepen settings. All of your external resources should be in your codepen settings. Only the code between your <body> tags should be in the HTML panel of codepen.
@lhoward465 Your counter only hits 0 once
  var count = 0;

  users.forEach(users => {
  // code
  if(count == 2) {
  // code
  count = 0;
  } else {
  // code
  }
  count = count + 1;  // goes from 0 to 1 again before starting the loop over
Gulsvi
@gulsvi
Apr 08 2017 16:19
@WelcomeToLevelOne this is one way to offset a list with Bootsrap 4 columns:
          <div class="row">
            <div class="col-6 offset-3 text-left">
              <ul>
                <li>list item</li>
                <li>list item</li>
                <li>list item</li>
              </ul>
            </div>
          </div>
You could also use CSS:
ul {
  text-align: left;
  width: 50%;
  margin: 0 auto;
}
EK Azubuike
@ekazubuike
Apr 08 2017 16:22
Fixed it
Thanks @SkyCoder01
CamperBot
@camperbot
Apr 08 2017 16:22
ekazubuike sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 933 | @skycoder01 |http://www.freecodecamp.com/skycoder01
lhoward465
@lhoward465
Apr 08 2017 16:43
@SkyCoder01 how's that possible? I have the count == 2 that resets the count
(sorry I had a call)
Gulsvi
@gulsvi
Apr 08 2017 16:44
@lhoward465 Yes, but you increase it again by 1 at the end of your loop
It is 0 briefly, but not at the start of your loop
lhoward465
@lhoward465
Apr 08 2017 16:44
...
crap
lol
you're absolutely right
well...I'm a dumbass
Gulsvi
@gulsvi
Apr 08 2017 16:45
lol, it's kind of complicated to do
maybe easier to use % and if it's divisible by 3 without a remainder - then no need to reset the counter
lhoward465
@lhoward465
Apr 08 2017 16:51
definitely a smarter way to do it
Pagnito
@Pagnito
Apr 08 2017 16:59
is the update_at part the one we base our offline or online status off of
oh i think i found out how to do it
Onur Ozbek
@omaroz92
Apr 08 2017 17:28
Hi guys. So I'm working on my tribute page. I have my HTML and CSS set up the way I want so far but I want to align paragraphed text (an article/essay) with my image but I couldn't figure it out.
So this is my page
And if you guys can access my src code from there, then you can see what'
what's wrong.
Looking forward to any suggestion.
Doni Yafi
@yafiwebdev
Apr 08 2017 17:30
You want to align text with the current image?
and why is it so huge
@omaroz92
Onur Ozbek
@omaroz92
Apr 08 2017 17:31
I'm thinking of resizing the image but for now I want to aling the text I will input below with the left side of the image.
So the starting position of the image should align with the left corner.
lhoward465
@lhoward465
Apr 08 2017 17:44
@SkyCoder01 can you see why this isn't placing them next to each other? https://codepen.io/lhoward465/pen/mWxwWY
each user is on a new line
but I can't see what's putting each on a new line
Gulsvi
@gulsvi
Apr 08 2017 17:46
@lhoward465 When I right-click -> inspect your HTML, I don't see any rows being created
lhoward465
@lhoward465
Apr 08 2017 17:46
@SkyCoder01 nope, there shouldn't be any atm, I thought the default would put them side by side
Gulsvi
@gulsvi
Apr 08 2017 17:46
columns need to be in rows
lhoward465
@lhoward465
Apr 08 2017 17:47
I know, I'm not applying the rows and columns yet
Vamp
@the-vampiire
Apr 08 2017 17:47

I want to use these switches https://www.w3schools.com/howto/howto_css_switch.asp

2 questions:
How can I input text into the switch?
How can I check whether the switch has been activated? (default and active)?

I thought this was just a CSS styling of a checkbox so I tried testing for .checked but that didnt work (returns false in default state but does not return true when switch is flipped)

lhoward465
@lhoward465
Apr 08 2017 17:47
I would've thought by default if you don't apply any line breaks or anything like that elements are stacked side by side
Gulsvi
@gulsvi
Apr 08 2017 17:48
@lhoward465 For inline elements, yes, but with <div> elements, they each sit on their own line.
<div> is a block element. You could use <span> instead and it might make them next to each other
But it's hard to see what's going on in the HTML code you're generating
Vamp
@the-vampiire
Apr 08 2017 17:50

relevant code:

html:

 <label class="switch">
          <input id="Units" type="checkbox">
                  <div class="slider"></div>
           </label>

JS:

var x = document.getElementById("Units").checked;
    console.log(x) // returns false on default ('off' switch position)
Gulsvi
@gulsvi
Apr 08 2017 17:50
@lhoward465 Try to manually create the HTML first in a separate pen, then it will be easier to know what to put in your JavaScript
Vamp
@the-vampiire
Apr 08 2017 17:51

also very confused why

var x = document.getElementById("Units").checked;
    console.log(x) // returns false on default ('off' switch position)

works but

var x = $(‘#Units).checked;
console.log(x) // returns undefined

I was under the impression that $(‘#id_here’) === document.getElementById(“id_here”)

Gulsvi
@gulsvi
Apr 08 2017 17:58
@the-vampiire $('#id_here')[0] is the same as document.getElementById('id_here')
Vamp
@the-vampiire
Apr 08 2017 17:59
ah I see
Gulsvi
@gulsvi
Apr 08 2017 17:59
To see if it's checked to .checked === 'true'
Vamp
@the-vampiire
Apr 08 2017 17:59
well I mean i was watching the console
and it was not reporting true when I switched
Saboor Malik
@MathematicsCoding
Apr 08 2017 17:59
How do I add another background and make it center?
Onur Ozbek
@omaroz92
Apr 08 2017 17:59
Guys do you know how to decrease the gap between bullet and text?
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:00
@SkyCoder01 :wave:
Gulsvi
@gulsvi
Apr 08 2017 18:01
@omaroz92 You can use the text-indent property in your CSS
@MathematicsCoding Hello :wave: :)
Onur Ozbek
@omaroz92
Apr 08 2017 18:01
I tried.
@SkyCoder01 I tried doing that but it didn't work.
Gulsvi
@gulsvi
Apr 08 2017 18:02
@omaroz92 Show your code please and I'll try to see what's wrong
Onur Ozbek
@omaroz92
Apr 08 2017 18:02
@SkyCoder01 You want me to copy-paste here?
Gulsvi
@gulsvi
Apr 08 2017 18:02
@omaroz92 Yes, show your CSS text-indent code
Onur Ozbek
@omaroz92
Apr 08 2017 18:02

HTML

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />

<div class="container-fluid">
<div class="container">
<div class="jumbotron">
<div class="row">
<div class="col-xs-12">
<div class="span12 text-center" style="float: none; margin: 0 auto;">

<h1 class="h1-styles">Sheikh Atıf of İskilip</h1>
<h2 class="h2-styles"><em>The Hat Martyr</em></h2>
<img src="https://tinyurl.com/mokheew" class="img-size">
<div class="caption"><strong>Sheikh Atıf was in active dissidence against westernization of Turkey</strong></div>
<div>
<p class="para-margin para-text"><strong>Here is a breakdown of Sheikh Atif's life: </strong></p>
<ul>
<li style="padding-left:20px;">cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>

CSS

.h1-styles{
color: #333333;
text-align: center;
font-size: 500%;
font-weight: 900;
font-family: Copperplate / Copperplate Gothic Light, sans-serif;
}

.h2-styles{
color: #000000;
text-align: center;
font-weight: 100;
}

.img-size{
width: 650px;
}

.caption {
font-size: 20px;
color: black;
text-align: center;
width: 800px;
max-width: 100%;
height: 50px;
font-family: Copperplate / Copperplate Gothic Light, sans-serif;
margin: 0 auto 5%;
box-sizing: border-box;
}

.para-margin{
margin: 0 auto 5%
}

.para-text{
font-size: 2px;
font-family: "Times New Roman", Times, serif;
text-orientation: inherit;
}

li {
text-indent: -8px;
}

Gulsvi
@gulsvi
Apr 08 2017 18:04
@omaroz92 It works for me: http://codepen.io/skycoder/pen/mWZaoy
@MathematicsCoding Any element can have a background - use CSS to assign a new background-color or background-image. Use background-position to center it.
@omaroz92 It might be a problem with your HTML if it is not working for you. Do you have a codepen link?
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:06
I did
Second background doesnt show up
Hm I will try use background color instead
Gulsvi
@gulsvi
Apr 08 2017 18:07
@MathematicsCoding Make sure the element has content in it or a height
many elements have 0 height until you put something in them
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:09
background {
  background-color: red;
  background-position: center;}
Gulsvi
@gulsvi
Apr 08 2017 18:09
@MathematicsCoding maybe try .background with a dot in front
Onur Ozbek
@omaroz92
Apr 08 2017 18:09
@SkyCoder01 I copy-pasta your code to mine just to try it out and still the gap exists.
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:09
Then add that class to element?
Gulsvi
@gulsvi
Apr 08 2017 18:10
@MathematicsCoding yeah, but background-position is for images, not colors
@omaroz92 Do you have a codepen you can share?
ch33zyp00fs
@ch33zyp00fs
Apr 08 2017 18:11

tutorials vs the real world is... meh. Maybe someone can help, I'm doing the first front end project (nothing crazy) but under my <h1> tag (the person's name i am doing the page on) I have my <div class"row"> element with 3 buttons for his social media pages and website

My issue is that the 3 buttons are off center compared to the <h1> tag at the top. In the tutorials it was all centered so perfectly and this is really getting to me. Am i missing something with positioning/padding/margins for my "row" div?

Saboor Malik
@MathematicsCoding
Apr 08 2017 18:11
@SkyCoder01 ooh
What then?
Onur Ozbek
@omaroz92
Apr 08 2017 18:12
@SkyCoder01 You mean my source code? Sure.
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:12
<div class="background">
<body background="http://www.yikingdo.eu/wa_images/background_wallpaper_karate_do_1600x1200_by_vindork-d6l7xd7_%282%29.jpg?v=1cd7m3a">  
  </div>
.background {
  background-color: red;}
Gulsvi
@gulsvi
Apr 08 2017 18:14
@MathematicsCoding Maybe this will help: http://codepen.io/skycoder/pen/zZVyVJ
@omaroz92 I think you need to click "Save" - I don't see any list items in your code
Onur Ozbek
@omaroz92
Apr 08 2017 18:15
@SkyCoder01 Here it is: https://codepen.io/omaroz92/pen/evodGP
Gulsvi
@gulsvi
Apr 08 2017 18:16
@omaroz92 Your bullet list text is centered. Do this instead:
.negative-text-indent li {
  text-align: left;
  text-indent: -8px;
}
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:16
@SkyCoder01 Well I wanted something like this
Onur Ozbek
@omaroz92
Apr 08 2017 18:17
@SkyCoder01 yea but when I do that, the list goes all the way to the left edge of the grey panel.
Gulsvi
@gulsvi
Apr 08 2017 18:17
@omaroz92 If you want your bullet lists centered, :point_up: See my code above
@MathematicsCoding In your CSS, you apply the background-color to the body element. Don't add a <body> element to your code. Codepen adds it for you behind the scenes.
body {
  background-color: red;
}
and you can only have one <body> element in a HTML page
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:19
oh..
I guess that explain why I tried to add two but didnt works
My project is kinda ugly and Im going to start other one
Gulsvi
@gulsvi
Apr 08 2017 18:19
I thought you were making a Bruce Lee Quote Machine?
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:20
Well I was
But there is not alot of quotes
You know?
Gulsvi
@gulsvi
Apr 08 2017 18:20
That's what I did, thought that great minds think alike :) click on bruce lee for more quotes: http://s.codepen.io/skycoder/pen/yMWNRm
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:21
Thats nice
Gulsvi
@gulsvi
Apr 08 2017 18:21
But yeah.... not a lot of good quotes unfortunately. I did a joke machine in the end
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:21
Is that your?
Gulsvi
@gulsvi
Apr 08 2017 18:21
I made a few quote machines until I was happy with one
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:21
I see
I will try add bruce lee wallpaper with a background color
Onur Ozbek
@omaroz92
Apr 08 2017 18:23
@SkyCoder01 Thanks a lot. Do you also know how to put space between each bullet?
CamperBot
@camperbot
Apr 08 2017 18:23
omaroz92 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 935 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Gulsvi
@gulsvi
Apr 08 2017 18:25
@omaroz92 use margin-top on the li element in your CSS
li {
  margin-top: 20px;
}
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:38
can body element have a class?
Like background center?
Danish Gujjar
@Dani-0-7
Apr 08 2017 18:39
yes
Gulsvi
@gulsvi
Apr 08 2017 18:40
Typically you do not assign classes to the <body> tag
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:41
To div actually
For color
Danish Gujjar
@Dani-0-7
Apr 08 2017 18:42
nyc
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:42
How do I move div element...
On page
Gulsvi
@gulsvi
Apr 08 2017 18:43
@MathematicsCoding Use margin-top to move it further down the page
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:44
.css {margin-top: center;}?
Gulsvi
@gulsvi
Apr 08 2017 18:44
You also need to get rid of your <body> tag. Codepen adds it for you. Do this in your CSS instead:
body {
  background-image: url('http://www.yikingdo.eu/wa_images/background_wallpaper_karate_do_1600x1200_by_vindork-d6l7xd7_%282%29.jpg?v=1cd7m3a');
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  margin: 0;
}
There are lots of ways to vertically center a div on a page: http://stackoverflow.com/questions/42187838/how-to-vertically-center-a-div-on-page
Maybe give those a try - the flexbox way is probably the easiest. It needs to have a height though.
lhoward465
@lhoward465
Apr 08 2017 18:49
@SkyCoder01 thanks for your help :)
CamperBot
@camperbot
Apr 08 2017 18:49
lhoward465 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 937 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Saboor Malik
@MathematicsCoding
Apr 08 2017 18:50
@SkyCoder01 Hey I found this
Gulsvi
@gulsvi
Apr 08 2017 18:58
@MathematicsCoding This is an article that helped me figure out background images: https://css-tricks.com/perfect-full-page-background-image/
acarosell1
@acarosell1
Apr 08 2017 19:13
<a href="https://twitter.com/intent/tweet?
button_hashtag=Bible verse" id ="help" class="twitter-hashtag-button"data-text="Help!" data-show-count="false">Tweet Bible Verse</a><script async src="//platform.twitter.com/widgets.js" charset="utf-8">
Hello. I am looking for help to change the "data-text" attribute on clicking the Tweet button for the Random Quote Generator project. I am looking to discover what Javascript code I would need to write in order to change the "data-text" from the "Help!" message I have in the button markup to my quote. Thank you.
Saboor Malik
@MathematicsCoding
Apr 08 2017 19:26
Jeez I almost went rage when I had problem with API for like 5 mins then I was like "F this" then I realized I forgot to add jQuery to JS setting...
Gulsvi
@gulsvi
Apr 08 2017 19:29
@acarosell1 It was really challenging getting that to work for me because the twitter widget code takes a while to load and by the time it loads, it overwrites the data-text setting. The easy way to build that URL is to not use the twitter Widget and just create a basic link that you can style to look like a twitter button. If you want to use the official twitter share button though, you'll have to learn their JavaScript API. Start by binding a ready event for when the script is loaded: https://dev.twitter.com/web/javascript/events
And then create the share button after you have your text ready for data-text: https://dev.twitter.com/web/tweet-button/javascript-create
Saboor Malik
@MathematicsCoding
Apr 08 2017 19:30
@SkyCoder01 I need your help
Take a look at my project
Gulsvi
@gulsvi
Apr 08 2017 19:31
@MathematicsCoding Sure, what's up?
Saboor Malik
@MathematicsCoding
Apr 08 2017 19:31
I cant pick any string in var arr
When I click button
acarosell1
@acarosell1
Apr 08 2017 19:32
@SkyCoder01 Thanks for your reply. I do not even know how to get it to work while styling my own button. What should my Javascript look like?
CamperBot
@camperbot
Apr 08 2017 19:32
acarosell1 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 938 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Onur Ozbek
@omaroz92
Apr 08 2017 19:32
Hi. When my text in the bullet points hit the next line, there is an indentation.
Does anyone know how to come across this?
Gulsvi
@gulsvi
Apr 08 2017 19:32
@MathematicsCoding It looks like it's working on the first try, but not after that. You are setting a random number with var and never update that variable again. So, it keeps gettiing the same quote over and over
Saboor Malik
@MathematicsCoding
Apr 08 2017 19:32
...
How do I fix that?
Gulsvi
@gulsvi
Apr 08 2017 19:33
$(document).ready(function() {
  var arr = ['ahsjjhw', 'ahhqhj', 'ghcghvgiu'];
  var array = Math.floor(Math.random() * arr.length); // this only gets updated once
  $("#quote").on("click", function() {
    $(".quote1").html(arr[array]);
  });
});
Saboor Malik
@MathematicsCoding
Apr 08 2017 19:33
Oh
Gulsvi
@gulsvi
Apr 08 2017 19:33
Update the array variable on every click
Saboor Malik
@MathematicsCoding
Apr 08 2017 19:33
I dont understand
Gulsvi
@gulsvi
Apr 08 2017 19:34
@acarosell1 You can use .attr() in jQuery to update the href attribute of a link. That would be the easiest way. For styling, it's about using CSS - or even a basic bootstrap button.
@acarosell1 This is an example of the URL to use: https://twitter.com/intent/tweet?text=Hello
Roxroy
@roxroy
Apr 08 2017 19:35
@omaroz92 , remove text-indent: -8px; from negative-text-indent li. It is what is causing the problem.
Gulsvi
@gulsvi
Apr 08 2017 19:36
@MathematicsCoding When you click the quote button, you can run code over and over again, as a hint.
Onur Ozbek
@omaroz92
Apr 08 2017 19:37
@roxroy Thanks a lot man. It worked.
CamperBot
@camperbot
Apr 08 2017 19:37
omaroz92 sends brownie points to @roxroy :sparkles: :thumbsup: :sparkles:
:cookie: 586 | @roxroy |http://www.freecodecamp.com/roxroy
Saboor Malik
@MathematicsCoding
Apr 08 2017 19:37
@SkyCoder01 for loop?
Gulsvi
@gulsvi
Apr 08 2017 19:37
@MathematicsCoding no
Every time you click the button, code runs
how might you get a new random number every time you click the button?
G-4-R-Y
@G-4-R-Y
Apr 08 2017 19:38
hey guys, my page is almost done, but i can't get the twitter button to share the quotes :c
and can't change it's background color as well
Gulsvi
@gulsvi
Apr 08 2017 19:41
@G-4-R-Y Feel free to share your codepen link and we can take a look. :point_up: See above for some instructions about Twitter
Onur Ozbek
@omaroz92
Apr 08 2017 19:41
How do we add photos to this?
I want to make his mopbile responsive
I want to add a screenshot of how it looks on mobile.
Gulsvi
@gulsvi
Apr 08 2017 19:42
@omaroz92 Here is the documentation on responsive images: https://v4-alpha.getbootstrap.com/content/images/#responsive-images
Onur Ozbek
@omaroz92
Apr 08 2017 19:43
@SkyCoder01 I want to make the entire website mobile friendlky
dpstrijker
@dpstrijker
Apr 08 2017 19:43
hi, I want my flex-item to have an image as background , but for some reason it doesnt work. Can someone take a look? http://codepen.io/dpstrijker/pen/evaLKK
Gulsvi
@gulsvi
Apr 08 2017 19:45
@omaroz92 The Bootstrap Grid is helpful for that. https://v4-alpha.getbootstrap.com/layout/grid/
It's a good time to practice the grid - it will be helpful for your next challenge when you build the portfolio.
G-4-R-Y
@G-4-R-Y
Apr 08 2017 19:45
@SkyCoder01 here it is :D
http://codepen.io/G4RY/pen/zZbEdB
Gulsvi
@gulsvi
Apr 08 2017 19:46
@G-4-R-Y Looks like your background color is working now :)
The twitter button though - what's your question? I don't see any code for it yet.
G-4-R-Y
@G-4-R-Y
Apr 08 2017 19:47
yes! thanks to you guys haha
Saboor Malik
@MathematicsCoding
Apr 08 2017 19:47
@SkyCoder01 Well I could make restore button
G-4-R-Y
@G-4-R-Y
Apr 08 2017 19:48
i don't quite understand the code for twitter button (i copied and pasted from here: https://support.twitter.com/articles/231474)
and i need to make it share my quote
Gulsvi
@gulsvi
Apr 08 2017 19:48
@MathematicsCoding You don't need another button, you just have to create a new random number every time you click the quote button
@G-4-R-Y The easiest thing to do is to update the URL. This is the URL to send a tweet: https://twitter.com/intent/tweet?text=Hello
G-4-R-Y
@G-4-R-Y
Apr 08 2017 19:49
can i put a variable in the url?
Gulsvi
@gulsvi
Apr 08 2017 19:50
Yes, you can
G-4-R-Y
@G-4-R-Y
Apr 08 2017 19:50
okay, ill try to do it, thanks! @SkyCoder01
CamperBot
@camperbot
Apr 08 2017 19:50
g-4-r-y sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 939 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Gulsvi
@gulsvi
Apr 08 2017 19:50
Same as how you are writing HTML to your page with a variable @G-4-R-Y Javascript does it for you
document.getElementById("quote").innerHTML = quotesBank[a]
@dpstrijker You are very close, no space between url and the parentheses:
background-image: url(http://oi63.tinypic.com/24zd6h0.jpg);
Robin
@LuckyRabbits
Apr 08 2017 19:52
@here
Saboor Malik
@MathematicsCoding
Apr 08 2017 19:52
Cant figure it out..
Gulsvi
@gulsvi
Apr 08 2017 19:52
@G-4-R-Y Also, be sure to remove that twitter widget code unless you want lots of headaches :)
Robin
@LuckyRabbits
Apr 08 2017 19:53
@here Is there a way to zero index multiple indexes in a string? can you do [ 0 ,5,6 or is that invalid syntax?]
dpstrijker
@dpstrijker
Apr 08 2017 19:53
@SkyCoder01 holy shit - 1 hour of my life gone haha. thx@skycoder01
CamperBot
@camperbot
Apr 08 2017 19:53
dpstrijker sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 940 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Gulsvi
@gulsvi
Apr 08 2017 19:54
@dpstrijker LOL :) glad to save you another hour
Mychal Simka
@msimka
Apr 08 2017 19:55
@LuckyRabbits What do you mean by zero indexing multiple indices?
Gulsvi
@gulsvi
Apr 08 2017 19:55
@MathematicsCoding I can't think of any other way to explain that you need to move your random number code into the click function.
So that every time you click it generates a new random number
Robin
@LuckyRabbits
Apr 08 2017 19:58
@msimka Like if you wanted to zero index the word "Dog" D= 0 O=1 and G=2 could you index all three and return that value using one line of code?
Mychal Simka
@msimka
Apr 08 2017 19:59
@LuckyRabbits Sure. You could pass it as a nested array, or you could sum the numerical value of those indices.
Ali Ahmad
@aliahmad-code
Apr 08 2017 19:59
A bit stuck on the Random Quote Machine, when you click, the random quote is generated once, and that's it. How can I get the click function to reset and go through the function every time it's clicked? https://codepen.io/ali-ahmad/pen/ryERVB
Mychal Simka
@msimka
Apr 08 2017 20:00
@LuckyRabbits Not sure what your objective is. What are you trying to accomplish by this?
Robin
@LuckyRabbits
Apr 08 2017 20:01
idk encryption maybe? @msimka kind of thinking out loud about how indexing works.
Sunil Kumar
@sunil16
Apr 08 2017 20:03
How do, home>watches>
Robin
@LuckyRabbits
Apr 08 2017 20:04
@msimka how would you code a nested array?
[ [0], [5], [7] ]; ect
Mychal Simka
@msimka
Apr 08 2017 20:06
[[0,5,7]] or [0,5,7]]
Sunil Kumar
@sunil16
Apr 08 2017 20:06
Like : home>somepage>somepage>somepage>somitem
Robin
@LuckyRabbits
Apr 08 2017 20:07
🙌🏼 🙃 🌈 Thank you @msimka
CamperBot
@camperbot
Apr 08 2017 20:07
luckyrabbits sends brownie points to @msimka :sparkles: :thumbsup: :sparkles:
:cookie: 303 | @msimka |http://www.freecodecamp.com/msimka
Gulsvi
@gulsvi
Apr 08 2017 20:10
@sunil16 I think you're looking for bread crumbs
Sunil Kumar
@sunil16
Apr 08 2017 20:12
@sky thnks man I'll try
Aaron Peck
@apeck14
Apr 08 2017 20:13
Can someone look at my code quick and tell me whats wrong? I suspect it's a minor error
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:18
@SkyCoder01
Can you look at my JS code again
Why unknown tokens?
Gulsvi
@gulsvi
Apr 08 2017 20:19
@MathematicsCoding You're missing a closing bracket. Make your last 3 lines look like this:
    });
  }
});
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:19
I see that solved the problem but why?
Gulsvi
@gulsvi
Apr 08 2017 20:20
@MathematicsCoding Your function quote2() { didn't have a closing bracket }
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:20
I knew it...
Gulsvi
@gulsvi
Apr 08 2017 20:20
Go to https://codepen.io/MathematicsCoding/settings/editor
And then make sure "Match Brackets" is turned on (down at the bottom)
It will help you see what's missing
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:21
Its already on?
Gulsvi
@gulsvi
Apr 08 2017 20:21
Good, now you can put your cursor next to a bracket and it will underline where the starting/ending ones are
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:21
Okay
So that what underline is for...
I have been wondering why they were there..
Aaron Peck
@apeck14
Apr 08 2017 20:22
@SkyCoder01 Can you help me quick?
Gulsvi
@gulsvi
Apr 08 2017 20:23
Sure @apeck14
Aaron Peck
@apeck14
Apr 08 2017 20:23
I could swear my code is right
@SkyCoder01 Its for the "Wherefore art thou" challenge
Gulsvi
@gulsvi
Apr 08 2017 20:23
Uggh, I hate javascript algos lol, that's why I'm in this room :p
I'll try though lol
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:23
lol
Aaron Peck
@apeck14
Apr 08 2017 20:24
@SkyCoder01 Haha
collection[i].hasOwnProperty(srcKeys[s])
I think thats whats wrong
JaredPresnell
@JaredPresnell
Apr 08 2017 20:25
Hey I have a question about the Twitter API page. I was wondering if anyone has figured out how to tell the difference between an account that is offline and an account that doesnt exist/has been closed. As far as i can tell, both cases return the same thing
Aaron Peck
@apeck14
Apr 08 2017 20:26
@JaredPresnell You want to take a look at mine?
JaredPresnell
@JaredPresnell
Apr 08 2017 20:26
sure
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:26
@SkyCoder01 For some reasons API isnt working
Gulsvi
@gulsvi
Apr 08 2017 20:26
@apeck14 I used .filter() and .every(). It gets confusing with nested for loops
Aaron Peck
@apeck14
Apr 08 2017 20:26
@SkyCoder01 I tried to use those but Im not good with them yet
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:27
@SkyCoder01 can you help me finding my mistake here?
document.getElementById("tt-btn").href = "https://twitter.com/intent/tweet?text=" + quotesBank[a] + "-" + authorsBank[a];
Gulsvi
@gulsvi
Apr 08 2017 20:27
Compare those two - and you'll see the difference
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:28
@G-4-R-Y .href maybe?
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:28
doesn't it exist? lol
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:28
I guess..
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:28
it was on the link you sent me
JaredPresnell
@JaredPresnell
Apr 08 2017 20:28
thanks @apeck14
CamperBot
@camperbot
Apr 08 2017 20:28
jaredpresnell sends brownie points to @apeck14 :sparkles: :thumbsup: :sparkles:
:cookie: 272 | @apeck14 |http://www.freecodecamp.com/apeck14
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:28
oh, not you
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:28
xD
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:28
sky sent me
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:28
Yeah
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:29
that smooth switch to colors is done with jquery, right?
Gulsvi
@gulsvi
Apr 08 2017 20:29
@G-4-R-Y Only <a> elements can have a href. Change your <button> to an <a> and add target="_blank" so it works in codepen. Your javascript looks good.
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:30
Seriously I dont see any problem with my code...
Why isnt API working?!
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:31
@SkyCoder01 why do i have to use target="_blank"?
Gulsvi
@gulsvi
Apr 08 2017 20:31
@G-4-R-Y It's a codepen thing, the link will open in a new tab.
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:32
Yeah
Otherwise it show up nothing
Right?
Gulsvi
@gulsvi
Apr 08 2017 20:32
^^ Yes
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:32
^^ :+1:
Seriously this code is killing me...
Gulsvi
@gulsvi
Apr 08 2017 20:33
Me too..... :/ I don't like Google's Javascript API...
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:33
@SkyCoder01 i see
It worked!! thanks!
CamperBot
@camperbot
Apr 08 2017 20:33
g-4-r-y sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:warning: g-4-r-y already gave skycoder01 points
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:34
What is wrong with this JS code seriously..
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:34
how do i get it beautiful now? lol
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:34
lol
Make it beautiful
That is how
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:34
i don't know how to get <a> beautiful
rofl
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:34
..
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:35
i will figure it out, whanks guys, again!
thanks*
Gulsvi
@gulsvi
Apr 08 2017 20:36
@G-4-R-Y Add the btn class to your <a> element and it will look like a beautiful button :)
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:36
yay
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:36
@SkyCoder01 Do you see whats wrong with my code?
@G-4-R-Y Oh.. i thought it was a joke I could've help you lol
Gulsvi
@gulsvi
Apr 08 2017 20:37
@MathematicsCoding I can take a look
But you haven't said thanks once today lol :p
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:37
I will say it once I solved a problem..
xD
Gulsvi
@gulsvi
Apr 08 2017 20:38
I don't see an API
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:38
What
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:40
@MathematicsCoding no problem hahahaha
Gulsvi
@gulsvi
Apr 08 2017 20:40
@MathematicsCoding This is a Quotes API: https://quotesondesign.com/api-v4-0/
Your code has an array and you use a random number to get a value from the array. I'm not seeing an API call.
G-4-R-Y
@G-4-R-Y
Apr 08 2017 20:41
@MathematicsCoding although, if you still want to, how do I create a border radius for an <a> btn? it's not working on css :c
Gulsvi
@gulsvi
Apr 08 2017 20:42
// Run this code when everything on the page has loaded
$(document).ready(function() {
  $(".btn").on("click", getQuote);  // register the button click
  getQuote(); // call the getQuote function
});

// Get a quote
function getQuote() {
  var quotes = ['Abcbc', 'Bbcbc', 'Cbcbc'];
  var randomNum = Math.floor((Math.random() * quotes.length));
  var randomQuote = quotes[randomNum];
  $(".quote").text(randomQuote);
}
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:42
.abd {border-radius: 10%;}
I think
Gulsvi
@gulsvi
Apr 08 2017 20:42
You have all the right code, just not in the right order - look at the code comments and try to build it on your own again.
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:42
Oh..
Curse you CodeTurtiol360
Anatoliy
@uzrptav
Apr 08 2017 20:43
Hi! Please advice, what bootstrap version i must use in codepen?
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:43
Tutorials
Gulsvi
@gulsvi
Apr 08 2017 20:43
@uzrptav You can use any version you want. We learned this version in Free Code Camp: https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:43
@SkyCoder01 Thanks lol
CamperBot
@camperbot
Apr 08 2017 20:43
mathematicscoding sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 941 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Gulsvi
@gulsvi
Apr 08 2017 20:44
That was hard earned :)
Going to take a nap :zzz:
need to finish my local picture slide show though
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:44
Have a good nap
Anatoliy
@uzrptav
Apr 08 2017 20:45
@SkyCoder01 thx!!!!
CamperBot
@camperbot
Apr 08 2017 20:45
uzrptav sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 942 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:49
Finally
I finished my random quote machine...
What do you think?
Anything should I edit or add?
Anatoliy
@uzrptav
Apr 08 2017 20:52
Bruce Lee?
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:53
Yeah
Gulsvi
@gulsvi
Apr 08 2017 20:53
You might want to look at it on a phone
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:53
...
Gulsvi
@gulsvi
Apr 08 2017 20:53
image.png
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:53
Who use codepen on phone?
..
Anatoliy
@uzrptav
Apr 08 2017 20:54
it is content. Content like water )
Shivani
@cosmogal12
Apr 08 2017 20:54
Hi
Gulsvi
@gulsvi
Apr 08 2017 20:54
lol @uzrptav
Saboor Malik
@MathematicsCoding
Apr 08 2017 20:54
Ok check project's name
Shivani
@cosmogal12
Apr 08 2017 20:54
I need some help with Build a tribute page challenge
Gulsvi
@gulsvi
Apr 08 2017 20:56
@cosmogal12 What is your question?
Shivani
@cosmogal12
Apr 08 2017 20:56
The jumbotron class is not working in my html snippet
Could you please let me know if I'm missing out on something
Roxroy
@roxroy
Apr 08 2017 20:59
@cosmogal12 , what is the url of your page?
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:00
<button href="url" class="btn button fa fa-fire" target="_blank"></button>
Is that correct?
Daniel Mattox
@dmattox10
Apr 08 2017 21:02
I don't understand the "Build a tribute page" at all. Am I to choose a significant figure, or is this about me, or is this a tribute to a technology?
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:02
@ShowStopperLED Pick any person you want to write about
Daniel Mattox
@dmattox10
Apr 08 2017 21:02
Thank you!
Gulsvi
@gulsvi
Apr 08 2017 21:02
@cosmogal12 Click the "Settings" button, then click "CSS", and add Bootstrap: https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
Roxroy
@roxroy
Apr 08 2017 21:03
@cosmogal12 , you should add bootstrap 3 to the settings page
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:03
If it is about you there is a project called "Personal Page" something which you will do after that @ShowStopperLED
Personal pro folio
@SkyCoder01 I cant add a link to button..
<button href="url" class="btn button fa fa-fire" target="_blank"></button>
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:04
@SkyCoder01 is the default <a> btn a bit "brighter" than the usual btn? look:
Roxroy
@roxroy
Apr 08 2017 21:04
@cosmogal12 , add //maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:04
@roxroy To which? css, JS?
html??
Gulsvi
@gulsvi
Apr 08 2017 21:04
@MathematicsCoding This is what I just told @G-4-R-Y :) only <a> element can have href attribute
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:04
oh..
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:04
yeah, i was goign to tell you that @MathematicsCoding
Gulsvi
@gulsvi
Apr 08 2017 21:04
To add an icon to your button, see this challenge for a refresher: https://www.freecodecamp.com/challenges/add-font-awesome-icons-to-our-buttons
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:05
they have the same background color, but one of them is "whiter" than the other
Roxroy
@roxroy
Apr 08 2017 21:05
@cosmogal12 , put it the css part of the setting tag
Gulsvi
@gulsvi
Apr 08 2017 21:06
I guess you could do this, but it's probably not a best practice:
<button class="btn button" onclick="window.open('http://freecodecamp.com')">Free Code Camp</button>
Shivani
@cosmogal12
Apr 08 2017 21:06
@SkyCoder01 @roxroy it works :) thanks
CamperBot
@camperbot
Apr 08 2017 21:06
cosmogal12 sends brownie points to @skycoder01 and @roxroy :sparkles: :thumbsup: :sparkles:
:cookie: 588 | @roxroy |http://www.freecodecamp.com/roxroy
:cookie: 943 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Anatoliy
@uzrptav
Apr 08 2017 21:15
Why background-image does not fully load in Codepen?
Gulsvi
@gulsvi
Apr 08 2017 21:16
@uzrptav Add height: 100vh; to the element with your background
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:16
ok I added a little to my project again
Take a look at it
What do you think?
Robin
@LuckyRabbits
Apr 08 2017 21:18
@here could someone take a look at my code? I'm working a madlib.
function wordBlanks(myNoun, myAdjective, myVerb, myAdverb) {
  var result = myMadLib;
  // Your code below this line
  var myMadlib = "One morning a "+ myNoun + "and a "+ myAdjective + "man"+ myVerb + "across the countryside" + myAdverb;

  // Your code above this line
  return result;
}

// Change the words here to test your function
wordBlanks(" dog", " big", " ran", " quickly");
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:19
@LuckyRabbits You need to add " " too
Gulsvi
@gulsvi
Apr 08 2017 21:19
@LuckyRabbits Don't forget the spaces
Anatoliy
@uzrptav
Apr 08 2017 21:19
@SkyCoder01 thnx
CamperBot
@camperbot
Apr 08 2017 21:19
uzrptav sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:warning: uzrptav already gave skycoder01 points
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:19
@LuckyRabbits " " is spaces
dpstrijker
@dpstrijker
Apr 08 2017 21:19
Can anyone help me. Why arn't my objects floating left and right? http://codepen.io/dpstrijker/pen/evaLKK
Kenard Ellis
@Kenard0
Apr 08 2017 21:20
is this project okay to submit https://codepen.io/Nard0/full/YZoePP/
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:20
@Kenard0 Its awesome
Strange I was going to type "Its great" but instead I typed "Its awesome"...
Robin
@LuckyRabbits
Apr 08 2017 21:21
@MathematicsCoding are you referring to adding "" around var result = " myMabLIb "; ?
Kenard Ellis
@Kenard0
Apr 08 2017 21:21
@MathematicsCoding thanks
CamperBot
@camperbot
Apr 08 2017 21:21
kenard0 sends brownie points to @mathematicscoding :sparkles: :thumbsup: :sparkles:
:cookie: 303 | @mathematicscoding |http://www.freecodecamp.com/mathematicscoding
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:21
@LuckyRabbits no
" " + etc...
@LuckyRabbits If you added spaces to strings it could work but it doesnt because of myNoun , myVerb, etc...
Get it?
Robin
@LuckyRabbits
Apr 08 2017 21:24
var result = " " + "One morning a "+ myNoun + "and a "+ myAdjective + "man"+ myVerb + "across the countryside" + myAdverb;
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:24
No '''='''
CamperBot
@camperbot
Apr 08 2017 21:24
:bulb: to format code use backticks! ``` more info
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:24
=
Oh Never mind
Yeah but you dont need that at front
I always read incorrectly..
Roxroy
@roxroy
Apr 08 2017 21:25
@LuckyRabbits , you have to add a space before and after each of the words you are adding . The words you have in quotes
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:25
@roxroy yeah but There is another way..
" "
Either of these ways @LuckyRabbits
Robin
@LuckyRabbits
Apr 08 2017 21:26
var result = " One morning a " + myNoun + " and a "+ myAdjective + " man "+ myVerb + " across the countryside " + myAdverb;
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:26
:+1:
Roxroy
@roxroy
Apr 08 2017 21:27
@MathematicsCoding , @MathematicsCoding " and " would work equally as " ". The key is the space between words.
Mojammel
@MojammelW
Apr 08 2017 21:27
hey will someone help me im trying to make panels like this
https://codepen.io/freeCodeCamp/full/YqLyXB
Alan Saber
@Alan95
Apr 08 2017 21:27
hello guys! i need help with my wikipedia viewer. somehow i cant get access to the api data if i console.log(titles) my array is empty. what am i doing wrong? http://codepen.io/BearCoding/pen/JWzEra?editors=1111
Robin
@LuckyRabbits
Apr 08 2017 21:28
Thank you @MathematicsCoding and @roxroy
CamperBot
@camperbot
Apr 08 2017 21:28
luckyrabbits sends brownie points to @mathematicscoding and @roxroy :sparkles: :thumbsup: :sparkles:
:cookie: 304 | @mathematicscoding |http://www.freecodecamp.com/mathematicscoding
:cookie: 590 | @roxroy |http://www.freecodecamp.com/roxroy
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:28
I know you could pass with that code but I just want to show you
var result =   "One morning a " + " " + myNoun + " " + "and a" + " " + myAdjective + " " + "man" + " " myVerb + " " +  "across the countryside" + " " + myAdverb;
@LuckyRabbits No problem
okay Im going to typing online to improve my speed higher than 70 WPM...
Robin
@LuckyRabbits
Apr 08 2017 21:30
Aha, so using + " " when you concatenate a string will populate a space with the returned result. @MathematicsCoding
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:31
Yeah
And OMFG!
I recently took 1 min test and managed to get 77 WPM
Gulsvi
@gulsvi
Apr 08 2017 21:31
@Alan95 It's var values = data.query.search;
You have data.query.pages
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:31
@SkyCoder01 What's your WPM?
Gulsvi
@gulsvi
Apr 08 2017 21:32
@MathematicsCoding 79 average
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:32
Damn..
Gulsvi
@gulsvi
Apr 08 2017 21:32
90 with lots of errors :)
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:32
@SkyCoder01 just past few days I couldnt even get more than 70
Today 77...
Im gonna try 80 lol
77 with fewer errors
Alan Saber
@Alan95
Apr 08 2017 21:34
what does data.query search do?
couldnt find anything about it actually
Gulsvi
@gulsvi
Apr 08 2017 21:35
@Alan95 You have to analyze the data object that comes back. It's from your query URL
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:35
Wtf?
I just typed a bit slower and managed to get 75..
I guess 70+ is my average
Alan Saber
@Alan95
Apr 08 2017 21:35
is that only for wikipedia or for any ajax request?
Gulsvi
@gulsvi
Apr 08 2017 21:36
@Alan95 Yeah, only for wikipedia
Every API returns different objects
And with Wikipedia, they give back all sorts of objects depending on your URL parameters
Alan Saber
@Alan95
Apr 08 2017 21:36
thats why i found nothing in the internet
ok thanks @SkyCoder01
CamperBot
@camperbot
Apr 08 2017 21:37
alan95 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 944 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:39
Wtf...
I took 3 min test and got 63?
@SkyCoder01 How do you get faster?
Gulsvi
@gulsvi
Apr 08 2017 21:42
Practice, I guess
Jorge
@OrangeKulture
Apr 08 2017 21:42
hey guys!
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:42
..
Gulsvi
@gulsvi
Apr 08 2017 21:42
Hi Jorge
..
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:42
lol
Gulsvi
@gulsvi
Apr 08 2017 21:42
One letter at a time in your head - don't think about words
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:42
Hm
Jorge
@OrangeKulture
Apr 08 2017 21:42
hows it going today Sky? that 1k brownies is looking a lot closer
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:42
I will take your advice
Gulsvi
@gulsvi
Apr 08 2017 21:43
Yep, can't wait for my free trip to vegas for reaching 1k :)
Jorge
@OrangeKulture
Apr 08 2017 21:44
hahah awesome! can't wait either .. gonna start packing, actually :D
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:44
I got 77 again..
Jorge
@OrangeKulture
Apr 08 2017 21:44
@SkyCoder01 r we gonna destroy the blackjack tables?
Gulsvi
@gulsvi
Apr 08 2017 21:44
And don't hit backspace - just keep going if you make mistakes
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:44
Yeah That what im doing
Gulsvi
@gulsvi
Apr 08 2017 21:44
lol, yes, now that we know how to count cards
Mojammel
@MojammelW
Apr 08 2017 21:44
guys how did this guy make the 3 boxes in the middle to put his content in i need to know thanks
https://codepen.io/freeCodeCamp/full/YqLyXB
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:44
@MojammelW div element with background color
@SkyCoder01 How did you get free trip to vegas?
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:45
@SkyCoder01 how do i get the width to always fill the whole page?
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:45
cover
I think?
Gulsvi
@gulsvi
Apr 08 2017 21:45
1k brownie points = free trip to vegas :p (just kidding)
Mojammel
@MojammelW
Apr 08 2017 21:45
@MathematicsCoding show me a example of the code i dont understand you fully
Jorge
@OrangeKulture
Apr 08 2017 21:45
hahaha !!
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:45
Sigh..
Jorge
@OrangeKulture
Apr 08 2017 21:45
its catching on ..
Gulsvi
@gulsvi
Apr 08 2017 21:45
@G-4-R-Y width: 100vw could work
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:46
@SkyCoder01 Give him that example you showed me before
Gulsvi
@gulsvi
Apr 08 2017 21:46
vw = viewport width. 1vw = 1% of width of screen
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:46
@SkyCoder01 what is vw?
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:46
view width?
oh
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:46
makes sense
lol
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:46
xD
Whats your WPM
Mojammel
@MojammelW
Apr 08 2017 21:46
@MathematicsCoding show me the code to do that please
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:46
@G-4-R-Y
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:47
lemme see
long time since i don't do this kind of stuff
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:47
@G-4-R-Y okay
tell me then :)

@MojammelW

<div class = red>
</div>
<div class= blue>
</div> etc...

with background color in css

Mojammel
@MojammelW
Apr 08 2017 21:49
so that makes boxes?
@MathematicsCoding so that makes boxes?
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:49
@MathematicsCoding 51 with 2 mistakes, what's yours?
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:49
Well you know what div elements does?
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:49
i would guess 70
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:49
@G-4-R-Y My best record is 77
Gulsvi
@gulsvi
Apr 08 2017 21:49
@MojammelW It's the grid system. http://getbootstrap.com/examples/grid
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:49
Yeah my average is 70+
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:49
almost got it haha
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:50
someday i will reach you
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:50
My goal was actually to reach 70 but I managed to reach 77 today..
I guess my next goal would be 80-90
@G-4-R-Y You will lol
Some reasons I typed faster is because of coding
If i didnt i would get less than 70 because of ' " ; : . , etc..
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:52
im a bit rusty, last year in school so i have to study a lot to enter in a university
Mojammel
@MojammelW
Apr 08 2017 21:52
alright thanks guys
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:53
@G-4-R-Y So you are senior?
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:53
@MathematicsCoding i don't quite know what senior means... :c
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:53
wha..
Dont you live in US?
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:53
nops haha
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:53
oh
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:53
I'm from Brazil
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:53
In US there is 4th years of high school
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:53
that would explain my bad english haha
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:54
Freshman, sophomore, junior, and senior
Nah your english is fine
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:54
oh, wait, im 17
I guess you are either junior or senior..
Or "Second year" or "Third year"
Idk about brazil..
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:54
third year, thats me
haha
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:55
Xd
See that link i sent you?
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:55
how old are you?
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:55
I did get 77 but I forgot to log in
15
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:55
oh, ill now
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:55
My bad Im actually 16... Turned 16 recently...
G-4-R-Y
@G-4-R-Y
Apr 08 2017 21:57
I know how do you fell, my birthday is on january and I just started telling people my age correctly on march
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:57
lol
I guess I could type faster if im on correct place...
Im on couch..
Jorge
@OrangeKulture
Apr 08 2017 21:58
why do u guys wanna type fast?
Jose Diaz
@jsd540
Apr 08 2017 21:58
I have a simple gallery that I can add photos to but the thumbnails hover in front of the nabber when scrolling and i don't understand why any help would be great
Jorge
@OrangeKulture
Apr 08 2017 21:58
im a lil lost in this convo
Saboor Malik
@MathematicsCoding
Apr 08 2017 21:58
I dont know just for fun
I just want to type faster as I can
@OrangeKulture Whats your WPM?
Jorge
@OrangeKulture
Apr 08 2017 21:59
do you look at the keyboard when typing? first thing is to just look at the screen the entire time
@MathematicsCoding umm i worked for a poker company for a while, and I had to write about 150 emails a day .. I can type pretty fast
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:00
@OrangeKulture lol
I dont look at keyboard...
Jorge
@OrangeKulture
Apr 08 2017 22:00
a lot of ppl do
thats why im asking
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:00
I dont think I can just look at keyboard to get 70+ WPM...
I can type without looking at it
Jorge
@OrangeKulture
Apr 08 2017 22:00
yeah thats good ..
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:01
I took computer class last year :)
Alot of ppl does cause they are inexperieced
@OrangeKulture You can take test to see your WPM
Go to typing.com then click test then take 1 min test
Gulsvi
@gulsvi
Apr 08 2017 22:03
@jsd540 Try adding a z-index to your navbar. z-index: 99, for example. With Fixed Position elements, that's often needed.
G-4-R-Y
@G-4-R-Y
Apr 08 2017 22:05
@SkyCoder01 still got that color problem with the buttons, what should i do?
https://codepen.io/G4RY/pen/zZbEdB
Jose Diaz
@jsd540
Apr 08 2017 22:05
it worked but what is a z-index I haven't seen it in al the docs I looked at
G-4-R-Y
@G-4-R-Y
Apr 08 2017 22:06
i would be the "distance" the thing will be form the screen
Jorge
@OrangeKulture
Apr 08 2017 22:06
says 85, 97%
G-4-R-Y
@G-4-R-Y
Apr 08 2017 22:06
a high index means it very close to the screen
it would be like a 3d thing
Jorge
@OrangeKulture
Apr 08 2017 22:06
i just sat down at the comp tho , im guessing that if u type for a while, u do it a lot faster
G-4-R-Y
@G-4-R-Y
Apr 08 2017 22:06
@jsd540
Roxroy
@roxroy
Apr 08 2017 22:06
@G-4-R-Y , it is coming up blank, any reason for that?
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:06
@OrangeKulture Dang
Nice
G-4-R-Y
@G-4-R-Y
Apr 08 2017 22:07
@roxroy oh boy, we got a problem then
Jorge
@OrangeKulture
Apr 08 2017 22:07
kept hitting backspace tho, lot of mistypes
G-4-R-Y
@G-4-R-Y
Apr 08 2017 22:07
@roxroy are you on pc?
Gulsvi
@gulsvi
Apr 08 2017 22:07
@G-4-R-Y You can make your "New quote" button an <a> tag too. Style it the same as your "Tweet" button so they look the same.
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:07
@OrangeKulture You could keep going on if you make mistakes
Jorge
@OrangeKulture
Apr 08 2017 22:07
maaaan im kinda bored
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:07
I cant believe you just fix it then go back..'
To get 80+
Jorge
@OrangeKulture
Apr 08 2017 22:07
it would let you .. you have to type exactly where u get the mistake
@SkyCoder01 how did the weather app thing go?
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:07
You dont have to
Gulsvi
@gulsvi
Apr 08 2017 22:08
I'm still playing around with it @OrangeKulture. Getting an array of local images and putting it a slider bar at the bottom
Roxroy
@roxroy
Apr 08 2017 22:08
@G-4-R-Y , I am using chrome, have click new quote to see it
Jose Diaz
@jsd540
Apr 08 2017 22:08
@SkyCoder01 forgot to add the @SkyCoder01 ... it worked but what is z-index I saw no info in any of the documentation.
Jorge
@OrangeKulture
Apr 08 2017 22:08
if you do a mistake its red, but then if you skip a letter, you have to go back and type the letter you missed
@SkyCoder01 nice! yeah it looked pretty cool yesterday, after the mini heart attack, lol :P
@SkyCoder01 have you done all the algorithms yet?
Gulsvi
@gulsvi
Apr 08 2017 22:09
@jsd540 With Fixed Position elements, they are taken out of the document flow, this means that other elements can hover over the top of them. To prevent an element from hovering over another element, you can use z-index, it's like a 3d layer.
The higher the number, the closer it is to your
Jose Diaz
@jsd540
Apr 08 2017 22:10
@SkyCoder01 Ahhhh, thanks for that!
CamperBot
@camperbot
Apr 08 2017 22:10
jsd540 sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 945 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Gulsvi
@gulsvi
Apr 08 2017 22:10
@OrangeKulture I have a few left still - I'm on exact change
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:10
@OrangeKulture You could just skip it... For example I got "P" wrong for Phone then type h ...
Gulsvi
@gulsvi
Apr 08 2017 22:10
@jsd540 No problem :)
I've been on exact change for a couple weeks though lol
never spend any time dedicated to solving it, keep getting distracted with codewars
Jorge
@OrangeKulture
Apr 08 2017 22:11
ahh thats cool .. yeah i have to do all of them :S well the intermediate and advance that is
codewars?
Gulsvi
@gulsvi
Apr 08 2017 22:11
It's an algorithm coding site
Jorge
@OrangeKulture
Apr 08 2017 22:11
dunno what that is, but sounds fun as hell
Gulsvi
@gulsvi
Apr 08 2017 22:11
haha, not as cool as it sounds
Jorge
@OrangeKulture
Apr 08 2017 22:12
ahh :( alright .. let me check it out tho .. i did check out nodeschool, believe you mentioned that the other day
pretty awesome
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:12
OMFG
I managed to get 79
Gulsvi
@gulsvi
Apr 08 2017 22:12
Yeah, nodeschool is fun :)
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:13
Is it free? @SkyCoder01
Gulsvi
@gulsvi
Apr 08 2017 22:13
Yes, it's free. Online workshops
Gulsvi
@gulsvi
Apr 08 2017 22:13
You run them locally though
Jorge
@OrangeKulture
Apr 08 2017 22:14
ohh wow you have to prove yourself to be worthy haha.. thats cool !
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:14
me?
Gulsvi
@gulsvi
Apr 08 2017 22:14
lol, it's true. Lots of katas to do
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:14
@SkyCoder01 Did u take a look at that link?
It says my average speed is 79...
G-4-R-Y
@G-4-R-Y
Apr 08 2017 22:15
@roxroy it's normal for me o-o
im using chrome too
Jorge
@OrangeKulture
Apr 08 2017 22:15
you are not on fire ricky bobby!
G-4-R-Y
@G-4-R-Y
Apr 08 2017 22:16
perhaps it's height and width problems?
Gulsvi
@gulsvi
Apr 08 2017 22:17
@MathematicsCoding It says "invalid test or you are no longer logged in"
But I believe you - nice work :)
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:18
@SkyCoder01 Thanks for your advice :)
CamperBot
@camperbot
Apr 08 2017 22:18
mathematicscoding sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 946 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:18
A letter at a time
Gulsvi
@gulsvi
Apr 08 2017 22:19
It helps to say them out loud too :)
exali
@exali
Apr 08 2017 22:20
I need help removing my tab icon
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:20
@SkyCoder01 Did you know highest WPM is 200+
exali
@exali
Apr 08 2017 22:20
I copied some HTML so I can experiment with it, and then the icon stayed there.
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:21
217 to be exactly
c0d0er
@c0d0er
Apr 08 2017 22:21
does anybody know why my tooltip doesnt fire out? in the code line 51-55, http://codepen.io/c0d0er/pen/RpzOZO?editors=0010
Gulsvi
@gulsvi
Apr 08 2017 22:21
@MathematicsCoding 212 is the world record :)
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:21
217 now
exali
@exali
Apr 08 2017 22:22
Does anyone know why is my problem persisting? I made an index.html file and copied some other code in there so I figure out how it works. For some reason the tab icon stayed the same and it's annoying me.
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:22
Well that guy got 217 without dot quotes numbers etc...
10fastfinger.com
Gulsvi
@gulsvi
Apr 08 2017 22:22
I was looking here: https://en.wikipedia.org/wiki/Words_per_minute
I guess some people got 290 and 276 on other sites
exali
@exali
Apr 08 2017 22:23
@SkyCoder01 can u help me with smth
its quite simple
but I dont know how to solve it for some reason
Gulsvi
@gulsvi
Apr 08 2017 22:24
I can try
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:24
290 wtf?
exali
@exali
Apr 08 2017 22:24
I copied some website html so I can experiment with it.
and later when I deleted the file
and started a new one
the browser icon stayed the same
its annoying me
Gulsvi
@gulsvi
Apr 08 2017 22:25
The browser icon?
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:25
lol
Chrome 2.0??
exali
@exali
Apr 08 2017 22:26
the tab icon sorry
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:26
xD
exali
@exali
Apr 08 2017 22:26
:D
Gulsvi
@gulsvi
Apr 08 2017 22:26
@exali I have no idea how to make a website show a new tab icon :/
exali
@exali
Apr 08 2017 22:26
damn
Gulsvi
@gulsvi
Apr 08 2017 22:27
Never tried, it's always codepen for all of my projects
Jorge
@OrangeKulture
Apr 08 2017 22:27
i have 8kyu what does that mean? @SkyCoder01
exali
@exali
Apr 08 2017 22:27
its quite annoying
Gulsvi
@gulsvi
Apr 08 2017 22:27
8kyu means you are novice :)
Jorge
@OrangeKulture
Apr 08 2017 22:27
@SkyCoder01 waahah daamit!
Gulsvi
@gulsvi
Apr 08 2017 22:27
like white belt in karate
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:27
lol
Jorge
@OrangeKulture
Apr 08 2017 22:28
maan i used to be red ! back when i was a kid, maybe i can have my sensei call them :D
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:28
Whats black belt then?
@OrangeKulture lol
I used to be in karate...
Gulsvi
@gulsvi
Apr 08 2017 22:28
lol, black belt is kyu1 I think
I'm kyu 6
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:28
Color?
Gulsvi
@gulsvi
Apr 08 2017 22:28
This is in codewars
Moisés Man
@moigithub
Apr 08 2017 22:28
const div = d3.select('mapdata').append('div'); @c0d0er
mising dot
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:29
oh lol
Tf
I typed longer than I did on 77 but I got 71
How does WPM work...
Gulsvi
@gulsvi
Apr 08 2017 22:34
@exali Try Ctrl+F5 and reload the page without using cache. Or, clear cache + cookies. It seems that icon is set as favorite icon you can put in you <head> code.
Mychal Simka
@msimka
Apr 08 2017 22:35
@SkyCoder01 nodeschool looks awesome
Gulsvi
@gulsvi
Apr 08 2017 22:35
@msimka I can't wait to go through more
Mychal Simka
@msimka
Apr 08 2017 22:35
Do they have anything for React Native?
Gulsvi
@gulsvi
Apr 08 2017 22:35
They have Electron, but I don't know about React
Not the same, I know :)
@msimka Is redux react native? Looks like someone is working on it: https://github.com/Code-Craftsmanship-Saturdays/redux-adventures
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:37
Do they have swift?
Mychal Simka
@msimka
Apr 08 2017 22:37
Was thinking for dual platform mobile app development which I think is at the top of everyone's list of priorities now. Node will be a great step in that direction though because it disconnects you from the DOM
@SkyCoder01 Redux is a state management tool which is used in React, and also other platforms
It's used in React-Native as well.
Gulsvi
@gulsvi
Apr 08 2017 22:38
Ah okay
Mychal Simka
@msimka
Apr 08 2017 22:39
And has become almost standard practice with the exception of a handful of people who use MobX
Gulsvi
@gulsvi
Apr 08 2017 22:41
It is crazy how many projects are out there :)
Mychal Simka
@msimka
Apr 08 2017 22:42
@SkyCoder01 Just npm installed learnyounode but how do I run it? lol
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:43
Damn it
Mychal Simka
@msimka
Apr 08 2017 22:43
well that was easy nevermind
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:43
I was so close to 80
Roxroy
@roxroy
Apr 08 2017 22:43
@msimka , type learnyounode to start, go down the menu and then verify each unit
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:44
YES
YES
YES
YES
83!
No joke!
Jorge
@OrangeKulture
Apr 08 2017 22:45
dammit now I can't get the soundtrack from 'bloodsport' outta my head .. the one that says "kumite, kumite, kumite!" hahah
Check it out!
MUST
My goal is changed to 90 WPM now
Mychal Simka
@msimka
Apr 08 2017 22:47

PASS Your solution to HELLO WORLD passed!

Im so excited
lol
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:48
lol
@SkyCoder01 Did you see it?!
Mychal Simka
@msimka
Apr 08 2017 22:48
This is dope. I love that it's all in the terminal
Thanks for the tip @SkyCoder01
CamperBot
@camperbot
Apr 08 2017 22:48
msimka sends brownie points to @skycoder01 :sparkles: :thumbsup: :sparkles:
:cookie: 947 | @skycoder01 |http://www.freecodecamp.com/skycoder01
Saboor Malik
@MathematicsCoding
Apr 08 2017 22:57
theegoosh
@theegoosh
Apr 08 2017 23:03

hey world

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style>
.red-text {
color: red;
}

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.smaller-image {
width: 100px;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>

<style>
img
.thick-green border {
border-color: green;
border-width: 10px;
border-style: Solid;
}
</style>
<img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

i dont know why it is not correct
the challenge is to add a green border around an html element
Saboor Malik
@MathematicsCoding
Apr 08 2017 23:05
WHich element do you want to add
theegoosh
@theegoosh
Apr 08 2017 23:05
img element
Saboor Malik
@MathematicsCoding
Apr 08 2017 23:05
You need to add that class to that element
You add . inside style tags is a class and without . is an element in html
.h2 {} <-- class
h2 {} <-- html element
theegoosh
@theegoosh
Apr 08 2017 23:07
thanks!
Saboor Malik
@MathematicsCoding
Apr 08 2017 23:07
:+1:
I got 80 WPM again
Gulsvi
@gulsvi
Apr 08 2017 23:14
@msimka Glad you're having fun with it! Learn you the Node for much win :)
Nice work @MathematicsCoding :)
Saboor Malik
@MathematicsCoding
Apr 08 2017 23:15
Thanks
@SkyCoder01 Whats your best WPM?
Gulsvi
@gulsvi
Apr 08 2017 23:17
@MathematicsCoding I'm not sure, don't log in to keep track!
Maybe around 90 or so with lots of errors
Saboor Malik
@MathematicsCoding
Apr 08 2017 23:17
lol
I got 83 because of few errors
Error slow me down
Gulsvi
@gulsvi
Apr 08 2017 23:17
sucks when you're off by one and then get 10 errors in a row lol
Saboor Malik
@MathematicsCoding
Apr 08 2017 23:19
Yeah lol
c0d0er
@c0d0er
Apr 08 2017 23:19
@moigithub thanks!
CamperBot
@camperbot
Apr 08 2017 23:19
:star2: 3024 | @moigithub |http://www.freecodecamp.com/moigithub
c0d0er sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
Saboor Malik
@MathematicsCoding
Apr 08 2017 23:20
I remember when I took computer class in first year of HS and I had around 50+ WPM
40+ sometime..
Learningtoplaytheguitarcanbeanextremely
rewardingexperience,butitismadeevenmore
soifyoufindtherightteacherwhoisalsoa
guidethatwillhelpyouachieveyourmusical
Whoops
I tried on my school tablet yesterday and couldnt even get more than 70
Saboor Malik
@MathematicsCoding
Apr 08 2017 23:25
They sucks...
Mario Galindo
@mariogalindov
Apr 08 2017 23:32
Hi mi frieds, can anyone help me figure out why the data-offset of the scrollspy isn’t working and the navbar isn’t correctly highlighted? Thanks in advance
Jorge
@OrangeKulture
Apr 08 2017 23:47
@mariogalindov u mean the portfolio part?
Gulsvi
@gulsvi
Apr 08 2017 23:48
@mariogalindov Add jQuery + Bootstrap.js for ScrollSpy to work. Click Settings -> JavaScript and add these links in this order:
https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js
https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js
Jorge
@OrangeKulture
Apr 08 2017 23:48
cuz it does highlight for me ..
ohh you mean active/inactive
Gulsvi
@gulsvi
Apr 08 2017 23:50
scrollspy is when the navbar automatically highlights the section you are in as you scroll down the page
Jorge
@OrangeKulture
Apr 08 2017 23:51
right .. i thought he meant something else, like highlight on hover
Mario Galindo
@mariogalindov
Apr 08 2017 23:51
Exactly, sorry if I’m not making myself clear. The thing is that when I scroll to the portfolio or the contact divs the navbar dont get highlighted and on the other hand I want to add the offset to get the titles of portfolio and contact displayed correctly when clicked in the navbar