These are chat archives for FreeCodeCamp/HelpFrontEnd

13th
Jan 2018
Danny
@danieldsutter
Jan 13 2018 02:38
Evening all. I need some help, and I'll try to offer some too.
I'm working on the calculator project and can't figure out why my top button in each column shifts to the right. Any tips? https://codepen.io/danieldsutter/pen/OzZQqK
Tom
@moT01
Jan 13 2018 02:40
@danieldsutter opening the dev tools shows a margin on that row that isnt on the others
Danny
@danieldsutter
Jan 13 2018 02:42
@moT01 That did it. That's weird though that since I put it on button in CSS, it only added to the button on top and not all the buttons.
Tom
@moT01
Jan 13 2018 02:45
yea, im not quite sure
bootstrap
Danny
@danieldsutter
Jan 13 2018 02:46
@moT01 Thanks for your help though.
CamperBot
@camperbot
Jan 13 2018 02:46
danieldsutter sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 957 | @mot01 |http://www.freecodecamp.org/mot01
Joseph A. Sangine
@HTML-joe
Jan 13 2018 04:03
Hey new people like me
This is saving my life and wanted to share with all of you http://htmlcheatsheet.com/css/
dont be tempted to constantly copy and paste use it as a refrence sheet to learn off of
Joseph Joe
@JoeTinnySpace
Jan 13 2018 04:48
@HTML-joe , thanks fren Happy cakeday
CamperBot
@camperbot
Jan 13 2018 04:48
joetinnyspace sends brownie points to @html-joe :sparkles: :thumbsup: :sparkles:
:cookie: 296 | @html-joe |http://www.freecodecamp.org/html-joe
Marc
@MWBauer
Jan 13 2018 04:53
Good evening everyone :icecream:
How are we?
Andy
@kodemaster8
Jan 13 2018 05:18
@HTML-joe @HTML-joe nice one Joe thanks
CamperBot
@camperbot
Jan 13 2018 05:18
kodemaster8 sends brownie points to @html-joe :sparkles: :thumbsup: :sparkles:
:cookie: 297 | @html-joe |http://www.freecodecamp.org/html-joe
Andy
@kodemaster8
Jan 13 2018 05:20
@MWBauer good morning!
vivekumarsinha
@vivekumarsinha
Jan 13 2018 05:29
what is while loop?
Fabien SHAN
@X140hu4
Jan 13 2018 05:55
@vivekumarsinha Search. Read. Ask.
What do you understand of it so far?
Marc
@MWBauer
Jan 13 2018 06:01
Andy, what's shakin'?
Do you know how to use/build api?
Alexander Jarman
@HeinousTugboat
Jan 13 2018 06:15
"use/build api" is sort of like saying "drive/make a car"..
Razvan Jackson
@RazvanJackson
Jan 13 2018 07:16
Good morning!
Someone here good at design, i want some suggestions for my app..
Nathan
@clarken1996
Jan 13 2018 07:55
hey peeps have a css question
.navbar-nav > li > a:hover ~ .v-bar{
color: blue !important;
background: blue !important;
}
trying to change the color of a span inside the li when the li is being hovered
Alexander Jarman
@HeinousTugboat
Jan 13 2018 07:57
So put the :hover on the li?
That's setting a .v-bar blue when it's in the same li as a hovered a.
Nathan
@clarken1996
Jan 13 2018 08:00
let me show you the code, might be easier
Alexander Jarman
@HeinousTugboat
Jan 13 2018 08:00
Kk.
image.png
Nathan
@clarken1996
Jan 13 2018 08:01
<li><a href="#"><span class= 'v-bar'>|</span> hover here</a></li> so when hover here is being hovered I want the vertical to change color
Alexander Jarman
@HeinousTugboat
Jan 13 2018 08:02
image.png
Then you don't want to use the sibling selector.
li > a:hover > .v-bar should do it.
Or li:hover .v-bar.
Depending on where you want your hit boundaries for your hovering to actually be.
Nathan
@clarken1996
Jan 13 2018 08:10
thankyou @HeinousTugboat
Alexander Jarman
@HeinousTugboat
Jan 13 2018 08:10
Welcome. :-)
Nathan
@clarken1996
Jan 13 2018 08:11
was on stack overflow for 20 mins, putting way to much thought into it
Alexander Jarman
@HeinousTugboat
Jan 13 2018 08:12
Yeah, I can imagine. CSS selectors can be a royal PITA.
Fabien SHAN
@X140hu4
Jan 13 2018 08:14
Pita sounds delicious
Razvan Jackson
@RazvanJackson
Jan 13 2018 08:15
Someone here good at design, i want some suggestions for my app..
Alexander Jarman
@HeinousTugboat
Jan 13 2018 08:15
Sorry. I wasn't trying to ignore you, I just.. there's a reason my girlfriend's a designer. ;-)
Nathan
@clarken1996
Jan 13 2018 08:16
@HeinousTugboat :+1:
Razvan Jackson
@RazvanJackson
Jan 13 2018 08:16
@HeinousTugboat np, can she DM me on gitter?
Alexander Jarman
@HeinousTugboat
Jan 13 2018 08:17
I'd have to wake her up and convince her to sign up for github first. :-P
Razvan Jackson
@RazvanJackson
Jan 13 2018 08:17
@HeinousTugboat Nvm then :)
Daniel Romero
@Ranacode
Jan 13 2018 09:20
Hey guys
I have a css explosive issue
I'm using bulma css and on tablet resolution I have a problem
Daniel Romero
@Ranacode
Jan 13 2018 09:25
The flex properties are not working on that resolution
I have the "Chatmessages" and "Chatinput" with justify-content: space-between and it works on desktop resolution but is broken when I try to resize on lower resolutions
Kelvin Hong
@superokindonesia
Jan 13 2018 09:50
can anyone help me , why this error happen
CORS header 'Access-Control-Allow-Origin' missing
Im using axios on vue app, and symfony backend.
when I try send auth from postman its work, but when I host on real server/local browser, that cors error happen
Bjorn van de Peut
@bjorno43
Jan 13 2018 09:52
@superokindonesia CORS is a Same-origin Policy issue. It means you're trying to access something on a remote server that you're not allowed to do. Sometimes this is caused because you're using HTTP instead of HTTPS.
primuscovenant
@primuscovenant
Jan 13 2018 11:37
@heroiczero thx
CamperBot
@camperbot
Jan 13 2018 11:37
primuscovenant sends brownie points to @heroiczero :sparkles: :thumbsup: :sparkles:
:star2: 2135 | @heroiczero |http://www.freecodecamp.org/heroiczero
bg-grira53
@bg-grira53
Jan 13 2018 13:30
hey guys
Tom
@moT01
Jan 13 2018 13:31
:panda_face:
Roman Struna
@RomchyFCC
Jan 13 2018 13:42
is anyone learning with codecademy? ... the more i try to use it the more i find, it well don't wanna be rude so, "not helpful" would be a nice term i suppose
Aditya
@ezioda004
Jan 13 2018 13:49
Codecademy free or the pro? The free version is how I started to learn programming but as you've seen they hold your hand too much, I suppose its good to learn basics from them but other than that, it's not a good resource if you wanna get a job in this field.
Roman Struna
@RomchyFCC
Jan 13 2018 13:51
thats exactly what i am figuring out, i've done more advanced tutorials and this is just so easy, all of it, plus just copy and paste so it's kinda bad...
Aditya
@ezioda004
Jan 13 2018 13:57
Yep, thats codecademy in a nutshell. You're better off doing something else if you got the basics down.
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 13 2018 13:58
How can I get the JavaScript code for a particular part of the site using the inspect element ?
Stephen James
@sjames1958gm
Jan 13 2018 13:59
@ahmed-issa-mohd The developer tools has Sources tab which shows all files downloaded for the site.
Kelvin Hong
@superokindonesia
Jan 13 2018 14:01
@ahmed-issa-mohd you could just download from official site if you want use that carousel
https://owlcarousel2.github.io/OwlCarousel2/
much cleaner and documented
ahmed-issa-mohd
@ahmed-issa-mohd
Jan 13 2018 14:01
okay I see but I want to get this part ,Not all files
Kelvin Hong
@superokindonesia
Jan 13 2018 14:05
@ahmed-issa-mohd inspect element > source > there's owl-carousel folder, its all you need.
but my recommendation just download from official site
Stephen James
@sjames1958gm
Jan 13 2018 14:07
@ahmed-issa-mohd That link is the javascript file
Marc
@MWBauer
Jan 13 2018 14:58
Morning @sjames1958gm
How is everyone?
:wave::coffee:
I'm working on the wiki viewer and it's coming.....slowly
I want to make the page look more interesting but I'm not much into design.
I have to build the api, or find an api.
I'd rather build one so that I can learn how.
Liam Docherty
@ldocherty1
Jan 13 2018 15:14
<a class="btn btn-primary btn-xl js-scroll-trigger" href="#services">Find Out More <i class="fa fa-chevron-down" aria-hidden="true"></i></a>
.btn-xl {
  padding: 1rem 2rem
}

.btn-primary {
  background-color: #D5A021;
  border-color: #D5A021;
}

.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
  color: #fff;
  background-color: #D5A021!important;
}
How can I make the blue outline colour be #D5A021;?
I did try using border-color: #D5A021; but had no luck
it seems comes up as blue
Sorin Ruse
@sorinr
Jan 13 2018 15:29
@ldocherty1 think its outline-color
Marc
@MWBauer
Jan 13 2018 15:29
In order to use Math.max() do I have to use numbers, or can I use arr?
Liam Docherty
@ldocherty1
Jan 13 2018 15:29
@sorinr It can't be as it's gold? I think it has something to do with btn-primary
Omar Tan
@wheelhot
Jan 13 2018 15:33
Here’s a vanilla JS question for you all, if assuming a website has 1000 links (structured in HTML using li), how do I know which of the link is clicked? Do I have to create an ID for each link? That sounds tedious with 1000 links, suggestions?
Aditya
@ezioda004
Jan 13 2018 15:33
@ldocherty1 When you do border-color: #D5A021; it is indeed setting it to #D5A021(you can check it in inspect element) but since its width is 0 you cant see.
Sorin Ruse
@sorinr
Jan 13 2018 15:33
@ldocherty1 its outline-color when in :focus
Aditya
@ezioda004
Jan 13 2018 15:35
@wheelhot Use this? basically when you create an event listener for a link clicked, this will represent the current link clicked
@MWBauer You can use an array too but you'd have to use spread operator. Example max = Math.max( ...arr );
Alexander Jarman
@HeinousTugboat
Jan 13 2018 16:41
@wheelhot Event.target gives you the actual element that was clicked.
Sorin Ruse
@sorinr
Jan 13 2018 16:45
@HeinousTugboat must be very carefull with event propagation otherwise e.target will refer also to all elements clicked previously
Alexander Jarman
@HeinousTugboat
Jan 13 2018 16:47
Does it?
Sorin Ruse
@sorinr
Jan 13 2018 16:48
don't know @wheelhot should take care about it. here a good article about it: https://www.sitepoint.com/event-bubbling-javascript/
Alexander Jarman
@HeinousTugboat
Jan 13 2018 16:49
That only matters if you've got nested handlers though, right?
Even then, I'm pretty sure that if you click an element that has a parent with a click handler, the event fires with the actual child element that was clicked.
I might go run some tests with eventPropagation, see if I can capture a click before it even reaches the element and see what it's Target is set to.
Alexander Jarman
@HeinousTugboat
Jan 13 2018 17:07
So, Event.target will always point to the actual visible Element that was clicked. Event.currentTarget is identical to this, and is the element that the attached handler is firing from. Bubbling and Capturing will decide whether or not the event gets passed to multiple handlers, but if there's only one handler nothing changes.
Roman Struna
@RomchyFCC
Jan 13 2018 17:22
is it possible to get a popup window using _blank or some other atribute on <a> with just HTML and CSS?
VaseJS
@VaseJS
Jan 13 2018 17:23
@RomchyFCC a popup window is not truly a window. its a modal created with css
Roman Struna
@RomchyFCC
Jan 13 2018 17:24
maybe i was missunderstood, i want my anchor element instead of opening a new site or open in the same browser tab, to open in a smaller window above the page as a pop-up
Alexander Jarman
@HeinousTugboat
Jan 13 2018 17:24
target=_new maybe?
Roman Struna
@RomchyFCC
Jan 13 2018 17:24
lemme try
Alexander Jarman
@HeinousTugboat
Jan 13 2018 17:25
But I don't think you can easily control if it's a pop-up or new tab.
Pretty sure after the porn-pop-under-epidemic, browsers 86ed that functionality post haste.
Roman Struna
@RomchyFCC
Jan 13 2018 17:25
nope, still opens a new tab in chrome
Roman Struna
@RomchyFCC
Jan 13 2018 17:27
oh, hmmm, well i found some javascript to do it, but given the proiject i would prefer just html, but i checked the attributes
i just found it, i think i could make it work with target framename
Alexander Jarman
@HeinousTugboat
Jan 13 2018 17:27
Yeah, I think that's your only option.
VaseJS
@VaseJS
Jan 13 2018 17:33
@HeinousTugboat you can create new tabs in a window
Scott Lieber
@lieberscott
Jan 13 2018 17:37
Hey guys. Working through the React challenges on the beta site. A few bugs, but still really good! I'm at one of the last challenges (https://beta.freecodecamp.org/en/challenges/react/give-sibling-elements-a-unique-key-attribute). I don't understand what the challenge means by giving each element a unique "key". I'm rendering a list as a sort of key-value pair, but failing the last test for the check. Here's a Codepen of what I'm doing. What does it mean by adding a "key" to each element? (Codepen: https://codepen.io/lieberscott/pen/LerMmV)
Alexander Jarman
@HeinousTugboat
Jan 13 2018 17:42
@VaseJS You can, but I didn't think you could with HTML/CSS?
So, @lieberscott, a "key" is referring to a key-value store.
VaseJS
@VaseJS
Jan 13 2018 17:43
it may be a js thing, but i know it can be done. lets explore
Scott Lieber
@lieberscott
Jan 13 2018 17:44
nevermind, i figured it out
Alexander Jarman
@HeinousTugboat
Jan 13 2018 17:44
:thumbsup: Cool. :-D
Scott Lieber
@lieberscott
Jan 13 2018 17:44
@HeinousTugboat it means to use a "key" attribute within the <li>
so, <li key="somethingHere">arrayItem</li>
anyway, thanks!
Alexander Jarman
@HeinousTugboat
Jan 13 2018 17:45
Oh! My bad. I probably shouldn't try to help people with React stuff. :laughing:
VaseJS
@VaseJS
Jan 13 2018 17:46
ok, its what i thought. it is an HTML thing but it depends on how the user has configured their browser to handle those actions
or they should mention its React if they have not done so
Alexander Jarman
@HeinousTugboat
Jan 13 2018 17:46
@VaseJS That's what I said, and he did. :-P
progrobam
@progrobam
Jan 13 2018 22:21
test
Stephan Lamoureux
@slamoureux
Jan 13 2018 22:23
when I make my navbar fixed I lose the right padding on my last link. Why does this happen?
just using plain css
Kent Saeteurn
@sansae
Jan 13 2018 22:23
hello. i'm working on "No Repeats Please" in the advanced algorithm section. It's basically a permutation problem. My issue is that I don't understand how to go about finding all the permutations of a string. I've found solutions online, but people don't talk about it, they just show a solution. would anyone like to help me find an approach to solving permutations? (the repeated consec letters is not an issue for me)
Stephan Lamoureux
@slamoureux
Jan 13 2018 22:24
tried putting <nav> in its own container and centering but nothing changed
progrobam
@progrobam
Jan 13 2018 22:25
Alexander Jarman
@HeinousTugboat
Jan 13 2018 22:27
@sansae Do you just mean literally finding every permutation?
Stephen James
@sjames1958gm
Jan 13 2018 22:43
@sansae My algorithm was to select each element from the string and the calculate all the permuations on the rest (recursively)
bg-grira53
@bg-grira53
Jan 13 2018 22:45
hey guys
bg-grira53
@bg-grira53
Jan 13 2018 23:00
can anyone help me plz ??
Alexander Jarman
@HeinousTugboat
Jan 13 2018 23:01
Sure, what's up?
bg-grira53
@bg-grira53
Jan 13 2018 23:03
hey http://lionsclubstunisie.com/actions/# resize the browser and u will notice that the divs are moving and i am wondering how u can do that ??
Alexander Jarman
@HeinousTugboat
Jan 13 2018 23:09
bg-grira53
@bg-grira53
Jan 13 2018 23:13
thank for your help , i appreciate it
Jason Landrian
@jlandrian
Jan 13 2018 23:45
Hey everyone! Looking for help with the Twitch API project if anyone is available. Thanks!
Having trouble looping through the array of users and getting it to display properly in the DOM...
Stephen James
@sjames1958gm
Jan 13 2018 23:48
@jlandrian Do you have a link to your code?
Jason Landrian
@jlandrian
Jan 13 2018 23:49
@sjames1958gm here it is https://codepen.io/jlandrian/pen/PEavLX
Stephen James
@sjames1958gm
Jan 13 2018 23:51
@jlandrian You are adding a row for each streamer, but they all have the same class, so later when you update the element by class you updated all of them
@jlandrian There are three online that are added to every row. You will need to have each row assigned a class unique to the streamer (perhaps using the streamer name?)
Jason Landrian
@jlandrian
Jan 13 2018 23:53
@sjames1958gm Thank you! I think I understand what you mean.
CamperBot
@camperbot
Jan 13 2018 23:53
jlandrian sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8853 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
Stephen James
@sjames1958gm
Jan 13 2018 23:54
@jlandrian :+1: If you have more questions just swing back by.
Jason Landrian
@jlandrian
Jan 13 2018 23:54
Thanks so much!