These are chat archives for FreeCodeCamp/HelpFrontEnd

9th
Nov 2017
huing
@huing
Nov 09 2017 00:40
image.png
我想问一下各位这是什么情况,怎么解决啊
Christopher Brown
@ChrisBrownie55
Nov 09 2017 01:50
@Botenga personally I set the font-size of html to px and then use rem. I also use percentages but when I use them it’s usually when I’m using flex and and trying to get each item to be a percent of parent. I also use vw and vh a lot
gaitchs gangmei
@gaitchs
Nov 09 2017 02:41
why is this not working
document.getElementById("demo1").innerHTML = $addrs ;
$addrs is an env variable
Christopher Susi
@chrisandsuch
Nov 09 2017 02:44
@ChrisBrownie55 Thats great advice!
@gaitchs are you using vanilla javascript or jQuery?
gaitchs gangmei
@gaitchs
Nov 09 2017 02:59
jquery
Christopher Susi
@chrisandsuch
Nov 09 2017 03:03
@gaitchs I would check your element id maybe?
gaitchs gangmei
@gaitchs
Nov 09 2017 03:07
missed quotes its working now
<h2 id="demo"></h2> document.getElementById("demo").innerHTML = "demo text hello world" ;
what css class should i use to make it adjust to screen size
heroiczero
@heroiczero
Nov 09 2017 03:28
@gaitchs Do you want to adjust the height or width of a div, or do you want to adjust items dependent on the screen with @media or CSS grid?
@gaitchs Even using % can change the height depending on your screen
gaitchs gangmei
@gaitchs
Nov 09 2017 03:33
the text size
its a long ethereum address inside a box, which i want to scale according to portrait screen size
dinesh
@1532j0004kg
Nov 09 2017 03:34
happiee morning mystery coders
heroiczero
@heroiczero
Nov 09 2017 03:39
@gaitchs if its text did you try rem or em font size
Christopher Brown
@ChrisBrownie55
Nov 09 2017 03:41
@gaitchs I saw this tip to use px(rems/ems) along with percentage in calc to create a stable dynamic sizing that scales well
gaitchs gangmei
@gaitchs
Nov 09 2017 03:42
how do i use em

demo {

font-family: sans-serif;
color: rgb(255, 255, 255);
display: inline-block;
font-weight: 100;
text-align: center;
font-size: 30px;
padding: 10px;
border-radius: 3px;
background: rgb(92, 109, 129);
display: inline-block;
}
heroiczero
@heroiczero
Nov 09 2017 03:46
@gaitchs use font-size: 30em; instead of px
Botenga
@Botenga
Nov 09 2017 03:46
U
gaitchs gangmei
@gaitchs
Nov 09 2017 03:52
is it the font or the border that is not scalling acording to screen width
30em blows up the screen
heroiczero
@heroiczero
Nov 09 2017 03:55
@gaitchs change the em but it should be scaling according to the screen width
@gaitchs so it changes according to the viewing platform(ie Phone, tablet, etc.)
gaitchs gangmei
@gaitchs
Nov 09 2017 03:57
when text is long , the border is still overlaping
heroiczero
@heroiczero
Nov 09 2017 04:00
@gaitchs You may want to add more padding because it is overflowing or use max-width
gaitchs gangmei
@gaitchs
Nov 09 2017 04:02
NOP padding is not scalling it
heroiczero
@heroiczero
Nov 09 2017 04:04
@gaitchs i am assuming the text is overlapping the border which is called a overflow. Or is it something else?
gaitchs gangmei
@gaitchs
Nov 09 2017 04:11
its not scalling text size on my mobile screen
overlapping mobile not the border
heroiczero
@heroiczero
Nov 09 2017 04:16
@gaitchs is the font-size different from the PC? You could use vw where 3vw is 3% of the viewport
@gaitchs or you could use @media to customize your page in different viewports
glitz20
@glitz20
Nov 09 2017 04:39
Hey guys how can I include a function in a class in React.js?
class App extends Component {
   function tick() {
  const element = (
    <div>

      <h2>It is {new Date().toLocaleTimeString()}.</h2>
    </div>
  );}
  render() {      
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">Hi There</h1>
        </header>
        <p className="App-intro">
          Welcome to news aggregator.


    setInterval(tick, 1000);

    <hr />

        </p>
      </div>
    );
  }
}
Tom
@moT01
Nov 09 2017 04:45
what are you trying to do
@sabin20
glitz20
@glitz20
Nov 09 2017 04:47
@moT01 I am trying to display which updates every second
*time
Tom
@moT01
Nov 09 2017 04:48
use the state and change the state in the function
glitz20
@glitz20
Nov 09 2017 04:49
I am still unclear @moT01 .Can you please give me an example
Tom
@moT01
Nov 09 2017 04:51
im making one
abraham anak agung
@padunk
Nov 09 2017 04:55
@sabin20 your setInterval should be before render
glitz20
@glitz20
Nov 09 2017 04:57
ok @padunk but how can I add function to a class? I am confused about that
abraham anak agung
@padunk
Nov 09 2017 04:58
class App extends Component {
//your function here
render() {
return (
<div></div>
)
}
}
glitz20
@glitz20
Nov 09 2017 04:59
@padunk I did something like that and called the function using tick(), but I am been receiving problem.
class App extends Component {
   function tick() {
  const element = (
    <div>

      <h2>It is {new Date().toLocaleTimeString()}.</h2>
    </div>
  );
   setInterval(tick, 1000)}
  render() {      
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">Hi There</h1>
        </header>
        <p className="App-intro">
          Welcome to news aggregator.
        {tick()}



    <hr />

        </p>
      </div>
    );
  }
}
abraham anak agung
@padunk
Nov 09 2017 05:02
class App extends Component {
constructor(){
super():
this.tick() = this.tick.bind(this);
}
tick() {
}
render(){
return()
}
}
and you need to bind that function in the constructor or use es6 arrow function
Long Nguyen
@longnt80
Nov 09 2017 05:03
@padunk @sabin20 or you can use the fat arrow and not have to use bind
tick = () => ...
abraham anak agung
@padunk
Nov 09 2017 05:05
@sabin20 and you call it in render {this.tick}
@longnt80 yes
glitz20
@glitz20
Nov 09 2017 05:06
@padunk I am implementing it right now. Will let you know the results
Long Nguyen
@longnt80
Nov 09 2017 05:08
@sabin20 also you need to use state and change the state at every 1s
glitz20
@glitz20
Nov 09 2017 05:08
@padunk I am receiving this error
./src/App.js
Syntax error: C:/Users/sapko/Desktop/React.js/my-app/src/App.js: Unexpected token, expected ; (9:15)

   7 | 
   8 |     constructor(){
>  9 |         super():
     |                ^
  10 |         this.tick() = this.tick.bind(this);
  11 |     }
  12 |     tick() {
Long Nguyen
@longnt80
Nov 09 2017 05:09
semi-colon
glitz20
@glitz20
Nov 09 2017 05:09
@longnt80 I am new at react. Can you please show me with example
Long Nguyen
@longnt80
Nov 09 2017 05:09
change the : to ;
abraham anak agung
@padunk
Nov 09 2017 05:09
sorry it is ;
glitz20
@glitz20
Nov 09 2017 05:10
 this.tick() = this.tick.bind(this);
     |         ^
Long Nguyen
@longnt80
Nov 09 2017 05:10
I think it should be this.tick = this.tick.bind(this);
abraham anak agung
@padunk
Nov 09 2017 05:12
haha, i got many typo. my kid is playing around. gtg hope @longnt80 can help u
Long Nguyen
@longnt80
Nov 09 2017 05:14
@sabin20 do you use create-react-app?
glitz20
@glitz20
Nov 09 2017 05:14
@longnt80 yeah I am using that
How should I define tick function?
I have received this error
Line 19:  'tick' is not defined  no-undef
  Line 29:  'tick' is not defined  no-undef
any idea @longnt80
Long Nguyen
@longnt80
Nov 09 2017 05:18
Show your component again
glitz20
@glitz20
Nov 09 2017 05:20
class App extends Component {

    constructor(){
        super();
        this.tick = this.tick.bind(this);
    }
   function tick() {
  const element = (
    <div>

      <h2>It is {new Date().toLocaleTimeString()}.</h2>
    </div>
  );
   setInterval(tick, 1000)}
  render() {      
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">Hi There</h1>
        </header>
        <p className="App-intro">
          Welcome to news aggregator.
        {tick()}



    <hr />

        </p>
      </div>
    );
  }
}
Long Nguyen
@longnt80
Nov 09 2017 05:22
Try tick() instead of function tick()
Jaimus
@JVeeKay
Nov 09 2017 05:22
@moT01 Hey Tom! I got the menu page done... Still needs some tweaks and I haven't messed with the footer. Had to make some changes.. but you wanna check it out?
glitz20
@glitz20
Nov 09 2017 05:23
@longnt80 i did that too. But the error is the same
is tick() the right way to call function?
Long Nguyen
@longnt80
Nov 09 2017 05:25
No, should be this.tick()
glitz20
@glitz20
Nov 09 2017 05:27
I did that, how should I call it though to return?
Long Nguyen
@longnt80
Nov 09 2017 05:28
Same, this.tick()
glitz20
@glitz20
Nov 09 2017 05:28
I did that but i reveived this error
RangeError: Maximum call stack size exceeded
Long Nguyen
@longnt80
Nov 09 2017 05:31
You need to use state to store the new Date
Then use tick to update that every 1s and change the state to that
Tom
@moT01
Nov 09 2017 05:32
@JVeeKay lets see it
glitz20
@glitz20
Nov 09 2017 05:32
can you please show me that with code snippet @longnt80
Long Nguyen
@longnt80
Nov 09 2017 05:32
@sabin20 im on mobile right now so I can't write the code
I can try later if you are not sleeping yet
:)
glitz20
@glitz20
Nov 09 2017 05:33
yeah sure @longnt80
Long Nguyen
@longnt80
Nov 09 2017 05:34
@sabin20 you know about state yet?
heroiczero
@heroiczero
Nov 09 2017 05:34
@JVeeKay nice site :+1: Now i want some BBQ lol
glitz20
@glitz20
Nov 09 2017 05:35
@longnt80 no not really, I just started react 2-3 days ago
Reading about it now
Jaimus
@JVeeKay
Nov 09 2017 05:35
@heroiczero HAHA! oh man.... Those guys do some hella good BBQ too. :)
@heroiczero Thank you so much!
CamperBot
@camperbot
Nov 09 2017 05:36
jveekay sends brownie points to @heroiczero :sparkles: :thumbsup: :sparkles:
:star2: 2044 | @heroiczero |http://www.freecodecamp.com/heroiczero
heroiczero
@heroiczero
Nov 09 2017 05:36
especially that image is golden freaking looks like succulent pork. Gets my saliva going :)
Jaimus
@JVeeKay
Nov 09 2017 05:38
@heroiczero I gotta resize it somehow cos it's showing way too large and it looks grainy. It's a great pic.
And my little slideshow guy is glitching out a bit but there are some good shots in there as well. Need better images eventually tho.
It's been a cool project. What do you think of the body panel accordion?
Tom
@moT01
Nov 09 2017 05:40
@JVeeKay the menu buttons are not built? or am i just having issues?
locations seems to be working
Jaimus
@JVeeKay
Nov 09 2017 05:41
They worked for me? I'll just send a link tot hat page. GHPages doesn't like this site I'm thinking lol.
Tom
@moT01
Nov 09 2017 05:43
so shop goes to a blank page, and about goes nowhere
that's not happening for you?
Jaimus
@JVeeKay
Nov 09 2017 05:43
Yeah shop page is getting done next. I broke the about link and I already shut everything down.. LOL.
Tom
@moT01
Nov 09 2017 05:43
okay
Jaimus
@JVeeKay
Nov 09 2017 05:44
So about isn't working right now. I had to switch some stuff so I probably deleted the anchor.
but he menu buttons are both working for me so I dunno what thats about.
Tom
@moT01
Nov 09 2017 05:48
well, im not sure that makes sense
the menu page looks great
a few prices aren't quite lined up perfect
the one thing i helped with
ha
i really can't find anything to complain about
Jaimus
@JVeeKay
Nov 09 2017 05:50
Are you kidding?? You should have seen it BEFORE you helped... Omg. It looks this good because of you man. :) I just plugged it in. :)
Yes!!! except that footer... omg. it's a nightmare. Tomorrow. It'll get handled tomorrow. I'll double check all the links and I gotta throw in a few media queries on the dropdown panels and see about that slideshow glitching out. Other than that....I'm STOKED!
Tom
@moT01
Nov 09 2017 05:52
i didnt see slideshow issues, that i noticed
a few things on the main page
when you click location and go to that section it takes you down too far
the section title is hidden
Jaimus
@JVeeKay
Nov 09 2017 05:53
oh really? when I was watching it it like skips really fast and goes back and forth between the last item and some random one.
Yeah I gotta anchor that up higher somewhere.
Tom
@moT01
Nov 09 2017 05:54
and maybe you have this in mind for the media query
but the nav bar, when the screen gets real small
the hamburger button goes below the logo
and perhaps that whole nav should be smaller in general when the window is that small
my thoughts
Jaimus
@JVeeKay
Nov 09 2017 05:56
What are you viewing it on?
Tom
@moT01
Nov 09 2017 05:56
firefox
Jaimus
@JVeeKay
Nov 09 2017 05:56
Love it.
ok cool.. just squishing the window?
Tom
@moT01
Nov 09 2017 05:57
yea
Jaimus
@JVeeKay
Nov 09 2017 05:57
It's good on my phone. I'll check it out.
Tom
@moT01
Nov 09 2017 05:57
not checking on a phone
one other thing
that picture could be a little better resolution
the home page
maybe
i know it doesn't sound like much, but you might be surprised
Jaimus
@JVeeKay
Nov 09 2017 05:59
Yeah... I gotta fix that. I had a hell of a time getting it there but yes. That needs to get taken care of. I don't why it's so damn hard to get an image to scale like that. Also... I've finally broken up with Bootstrap. 4 sucks.
The love is in the details.... :+1:
Tom
@moT01
Nov 09 2017 06:00
not sure it's anything you can do - i think it might be the picture itself
Jaimus
@JVeeKay
Nov 09 2017 06:01
Their component selection sucks now. and half the shit doesn't work anyway. i'm disappointed in BS.
Yeah that image was pretty huge when i got it. I've resized it like 50 times. I gotta dig through my junk drawer of files and find the original. It's in here somewhere.
Do you work in development Tom?
Did I ask you that already?
Long Nguyen
@longnt80
Nov 09 2017 06:07
@sabin20 I'm back
let me try the code
glitz20
@glitz20
Nov 09 2017 06:08
@longnt80 sure
Tom
@moT01
Nov 09 2017 06:09
@JVeeKay huge doesn't mean clear
no and no
maybe i can take a look at the original tomorrow or some time if you dig it up
those are minor details
keep me updated, im off for the night
Jaimus
@JVeeKay
Nov 09 2017 06:10
@moT01 True. I'm crossing my fingers cos I like it lol! Yeah totally. :) I'll find it somewhere... Me too. :smoking: and bedtime. :)
Have a good night Tom!
Laters all! :wave:
Long Nguyen
@longnt80
Nov 09 2017 06:24
@sabin20 it's trickier than I thought
let me try a little longer
glitz20
@glitz20
Nov 09 2017 06:24
really?
Long Nguyen
@longnt80
Nov 09 2017 06:27
never try setTimeout in react
hold on
@sabin20 ok I got it
I change to Date.now() so you can see it changes every 1s
glitz20
@glitz20
Nov 09 2017 06:33
cool. I see now how it works. great solution. Thanks @longnt80
CamperBot
@camperbot
Nov 09 2017 06:33
sabin20 sends brownie points to @longnt80 :sparkles: :thumbsup: :sparkles:
:cookie: 667 | @longnt80 |http://www.freecodecamp.com/longnt80
Long Nguyen
@longnt80
Nov 09 2017 06:34
@sabin20 thank you
I learned something from it too
CamperBot
@camperbot
Nov 09 2017 06:34
longnt80 sends brownie points to @sabin20 :sparkles: :thumbsup: :sparkles:
:cookie: 303 | @sabin20 |http://www.freecodecamp.com/sabin20
Long Nguyen
@longnt80
Nov 09 2017 06:39

@sabin20 also, if you don't have props, you can declare only state, so instead of this:

constructor() {
    super();
    this.state = {
      date: Date.now(),
    }

  }

become only this:

state = {
    date: Date.now(),
}
glitz20
@glitz20
Nov 09 2017 06:40
gotcha
Long Nguyen
@longnt80
Nov 09 2017 06:41
this one is hard if you just start with react
sagar82
@sagar82
Nov 09 2017 07:43
hello friends i need help to complete my task , can anybody check my code
, my code is returning correct value still i am not able to complete the task
var remAmt = 0; 
var run = true; 
var newArr = [];     
var dummyArr = [];      

     function filterArr(item){
             for(var k = 0; k < dummyArr.length; k++){
                  if(item[0] === dummyArr[k]){
                       return item;
                  } 
             }

    }       



function checkCashRegister(price, cash, cid) {
  var change;
  // Here is your change, ma'am.

  var usCurrency = {
      "PENNY" : 0.01,
      "NICKEL" : 0.05,
      "DIME" : 0.10,
      "QUARTER" : 0.25,
      "ONE" : 1,
      "FIVE" : 5,
      "TEN" : 10,
      "TWENTY" : 20,
      "ONE HUNDRED" : 100
  };


  remAmt = parseFloat(cash - price);



  for(var key in usCurrency){

      if(usCurrency[key] < remAmt || usCurrency[key] == remAmt){
           dummyArr.push(key);
      }

  }



  var smallest = 0;

  var totalCashAmt = 0;

   totalCashAmt = cid.reduce(function(a,b){
       return a + b[1];
   },0);

   totalCashAmt = totalCashAmt.toFixed(2);


    var vtotal = 0;

    for(var z = 0; z < cid.length; z++){        

          if(dummyArr.indexOf(cid[z][0]) !== -1){
             vtotal += cid[z][1];

          }

    }

   if(vtotal < remAmt ){
     return "Insufficient Funds";
   }else if(vtotal == remAmt){
     return "Closed";
   }else{



    /*function sortFunction(a, b) {         

         a =  a.toString().split(".");
         b =  b.toString().split(".");
            return (
                 b.shift() - a.shift()
           );
    } */  


   var newfilterArr = cid.filter(filterArr);

   //newfilterArr =  newfilterArr.sort(sortFunction);



   var mergeArr = [];       


         for(var k in usCurrency){             
          for(var i = 0; i < newfilterArr.length ; i++){ 

                 if(k === newfilterArr[i][0]){
                      // console.log(newfilterArr[i][0]); 
                      newfilterArr[i].push(usCurrency[k]);         
                  }

             }      
         }   

     newfilterArr =  newfilterArr.reverse();


      var loopEnd = 0; 
      var result;     



       for(var j = 0; j < newfilterArr.length; j++){          

        var count = 0;   
        loopEnd = Math.round(newfilterArr[j][1] / newfilterArr[j][2]);


        var curName =   newfilterArr[j][0];    
        var avlAmount =   newfilterArr[j][1]; 
        var curVal =  newfilterArr[j][2];   

        if(remAmt > 0){

            run = true;
                 while(run) {  
                     result = checkVal(curName,avlAmount,curVal,loopEnd,count); 
                   }

             newArr.push(result); 
          } 

       }

       change = newArr.filter(function(itemVal,index){
           if(itemVal[1] !== 0){
               return itemVal;
           }           
       });

       /*change = change.map(function(objArr,index){
          return addZero(objArr);
       });*/

       return  change;       

    }
}



function addZero(objArr){

var priceVal = objArr[1];    

  if(priceVal%1 != 0){

        var stringValue = priceVal.toString();
        var splitStr =  stringValue.split(".")[1];
        var dcmLength =  splitStr.length;

          if(dcmLength == 1 && splitStr != 0 ){
              stringValue = stringValue.concat("0");
              objArr[1] = parseFloat(stringValue).toFixed(2);
               //console.log(objArr[1]) 
          }
   }

  return objArr;     

 }      



  function checkVal(curName,avlAmount,curVal,loopEnd,count){

       run = false;
        var returnArr = [];

          for(var m = 1; m <= loopEnd; m++){  

                  if( remAmt >= curVal && remAmt > 0){                       
                            count = m * curVal;
avlAmount = avlAmount - curVal;
                            remAmt =  (remAmt - curVal).toFixed(2);                            
                    }

              }


       returnArr.push(curName,count);
       return returnArr;


  }       

checkCashRegister(19.50, 20.00, [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.10], ["QUARTER", 4.25], ["ONE", 90.00], ["FIVE", 55.00], ["TEN", 20.00], ["TWENTY", 60.00], ["ONE HUNDRED", 100.00]]);
Bogdan
@oblanao
Nov 09 2017 09:44
Hello, back with my recipebox project. I hope I fixed all the localStorage issues. I checked Chrome devTools and there should be a localStorage item called 'personalRecipes'. Please take a look at http://5a0422fc4c4b937ff7136cc8.optician-alkalinity-60277.netlify.com/ . Thanks!
dinesh
@1532j0004kg
Nov 09 2017 10:14
@sagar82 task number?
Simon Sardorf
@SSardorf
Nov 09 2017 10:33
Hey guys! I'm looking for a website where I can collaborate with some friends on a HTML project. (Realtime coding etc). Are there any ideas on where I could find such a thing? :)
I realize codepen has collaborative coding, but we're really not in a position to pay for such a thing right now :/
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 10:34
@SSardorf you mean like 1 write one line the other ones see it?
the only thing I can think of is github, pull the changes when needed, changes made by your friends
Simon Sardorf
@SSardorf
Nov 09 2017 10:35
@tiagocorreiaalmeida I actually mean a place where we can write together
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 10:36
wouldnt that be confusing even more when creating html templates?
Simon Sardorf
@SSardorf
Nov 09 2017 10:36
@tiagocorreiaalmeida Much like codepen, but where multiple users can use it at the same time
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 10:36
I mean you could divide the pages and each one of you wouldw ork on the specific on and then commit it so others can see it
Simon Sardorf
@SSardorf
Nov 09 2017 10:36
Yeah, I suppose
But why are software people doing it. Wouldn't they run into the same problem? Is it very uncommon to collaborate on front end sites?
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 10:37
what working all on the same page?
A-J Roos
@Asjas
Nov 09 2017 10:37
No you colloborate on front end. Using github.
Works more than fine
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 10:38
you split the pages 3 for each user iamgine
and each user takes care of it
but you should have some css standard for all users
or that css file gonna endup a bit strange
A-J Roos
@Asjas
Nov 09 2017 10:38
Yeah that's why people use linters
And something like travis ci
Enforce a style guide.
You even now have github desktop for windows and mac making branching and PRs even easier than before.
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 10:39
never heard of them tough, ther only thing that came to my mind was using scss architecture folder and stuff and maybe using the bem method that would make it consistent aswell I think
Simon Sardorf
@SSardorf
Nov 09 2017 10:39
Right. I'm not really familiar with using github. FCC has a guide on it, yeah?
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 10:39
install the desktop version
I still use the command line but since it has an interface the desktop version wont be that hard I think
A-J Roos
@Asjas
Nov 09 2017 10:40
Yeah. You can go to quite a few github pages that explain how merge, branching, forking, PRs and merge conflicts works. Quite a lot of youtube videos too
Simon Sardorf
@SSardorf
Nov 09 2017 10:42
Awesome. Will check it out :)
A-J Roos
@Asjas
Nov 09 2017 10:44
You can also use something like trello to break up what every person needs to do so that you don't have people working on the same thing.
kartter
@kartter
Nov 09 2017 10:58
hello
i need help with moving 3 buttons, thats "ABOUT" "PORTFOLIO" and "CONTACTS" to the left top corner of my header, please help
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 11:00
@kartter sure
is there a codepen'
kartter
@kartter
Nov 09 2017 11:00
yes @tiagocorreiaalmeida
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 11:01
llink?
kartter
@kartter
Nov 09 2017 11:03
<body>
  <div>
  <header>
   <div style="align: center">
    <button class="btn btn-default btn-info">ABBOUT</button>
    <button class="btn btn-default btn-info">PORTFOLIO</button>  
     <button class="btn btn-default btn-info">CONTACT</button>
  </div>
    <h1 class="text-center text-info"><b>MARTIAN SYSTEMS SUPPORT</b></h1>
    </headre>
  </div>
  <div class="container">

  </div> 
</body>
@tiagocorreiaalmeida this is my code
@tiagocorreiaalmeida link https://codepen.io/Kartter/pen/OObZeO
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 11:04
arent they allready there?
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 11:04
image.png
kartter
@kartter
Nov 09 2017 11:05
@tiagocorreiaalmeida cneter i mean
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 11:05
on the parent div of the buttons add
text-align: center;
plus dont to inlinestyles liek this
<div style="align: center">
for some reason css exists :D
kartter
@kartter
Nov 09 2017 11:08
@tiagocorreiaalmeida i tried and it didnt work.. ill try again and give reply. can i use bootstrap "col--" class for this same purpose?
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 11:08
oh you are using bootstrap
then you can add on the div the class="text-center"
its a builted on by bootstrap
kartter
@kartter
Nov 09 2017 11:09
okay thanks @tiagocorreiaalmeida
CamperBot
@camperbot
Nov 09 2017 11:09
kartter sends brownie points to @tiagocorreiaalmeida :sparkles: :thumbsup: :sparkles:
:cookie: 434 | @tiagocorreiaalmeida |http://www.freecodecamp.com/tiagocorreiaalmeida
saurabhagrawal525
@saurabhagrawal525
Nov 09 2017 11:09
@sagar82 hi
sagar82
@sagar82
Nov 09 2017 11:09

@saurabhagrawal525

Hi saurabh

kartter
@kartter
Nov 09 2017 11:15
<div style="align: center"> this didnt work .. u can even see i used that in my codepen @tiagocorreiaalmeida
<div style="align: center"> oh i see this now bro.. bless @tiagocorreiaalmeida
A-J Roos
@Asjas
Nov 09 2017 11:18
@kartter he said text-align: center;
kartter
@kartter
Nov 09 2017 11:19
@Asjas i just noticed that. i didnt see that before
Eivind
@NonDesistas
Nov 09 2017 13:12
can I ask about something c# related? can't find a C# group to join
A-J Roos
@Asjas
Nov 09 2017 13:32
@NonDesistas You can ask and if someone knows they'll answer it but freecodecamp does not learn anyone here C#. You might get a faster answer on stackoverflow
Kshitijaa Jaglan
@KshitijaaJaglan
Nov 09 2017 13:56
Hi, can someone tell me why the second info para of the about section isn't aligned left?
https://kshitijaajaglan.github.io/nCrypt/
Repo- https://github.com/KshitijaaJaglan/nCrypt
heroiczero
@heroiczero
Nov 09 2017 13:59
@KshitijaaJaglan you do know <center>has been removed from web Standards.. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/center
@KshitijaaJaglan plus all your <div> has a padding in style
div{
    padding: 3vh 6vh 3vh 6vw;
    margin: 0;
}
Kshitijaa Jaglan
@KshitijaaJaglan
Nov 09 2017 14:02
ohk
I'll change the <center> tag
but @heroiczero why isn't the about section right aligned?
heroiczero
@heroiczero
Nov 09 2017 14:03
@KshitijaaJaglan to center div try: https://www.w3.org/Style/Examples/007/center.en.html
@KshitijaaJaglan i thought you wanted aligned to the left?
Kshitijaa Jaglan
@KshitijaaJaglan
Nov 09 2017 14:04
oh sorry.
I wanted it to get right aligned
heroiczero
@heroiczero
Nov 09 2017 14:04
@KshitijaaJaglan oh ok let me see :)
@KshitijaaJaglan if its just text did you try text-align:right; https://developer.mozilla.org/en-US/docs/Web/CSS/text-align more info
Kshitijaa Jaglan
@KshitijaaJaglan
Nov 09 2017 14:07
thanks a lot @heroiczero :smile: :smile:
CamperBot
@camperbot
Nov 09 2017 14:07
kshitijaajaglan sends brownie points to @heroiczero :sparkles: :thumbsup: :sparkles:
:star2: 2045 | @heroiczero |http://www.freecodecamp.com/heroiczero
Kshitijaa Jaglan
@KshitijaaJaglan
Nov 09 2017 14:07
It worked
heroiczero
@heroiczero
Nov 09 2017 14:07
Glad to help :)
Kshitijaa Jaglan
@KshitijaaJaglan
Nov 09 2017 14:08
:sparkles: :+1: :sparkles:
Znadams
@Znadams
Nov 09 2017 14:31
goodmroning guys
is eloquent javascript a suitable book for beginners?
Ken Haduch
@khaduch
Nov 09 2017 14:34
@Znadams - i would say that it isn't a good book for beginners - the author gets into some really involved things that I would think are just more confusing... it's been a while since I looked at the book, I was thinking about revisiting it to see if some of the topics made more sense to me now.
Znadams
@Znadams
Nov 09 2017 14:34
Doi you have any reccomendations?
Ken Haduch
@khaduch
Nov 09 2017 14:34
it depends on your goals, though - if you really want to dig into the gory details and invest a lot of time there, then go for it!
Znadams
@Znadams
Nov 09 2017 14:35
I know some of the very basics of programming
im trying to get JS down super solid before moving onto a front framework
I can only write very simple programs atm
Ken Haduch
@khaduch
Nov 09 2017 14:37
If you want a book, I'm not sure because I haven't used a book for javascript besides that one. If you want something that would walk you through a lot of javascript beginner stuff, I have found the w3schools.com to be a really nice environment for learning (although you would also find people who disagree.) I haven't revisited their javascript lessons, but I would give that a look. It's free, they have a nice environment for trying things. You should see if it works for you. If you do want a book, there are many out there, I just don't have knowledge of a specific one.
Kevin K. Lee
@kevinkiklee
Nov 09 2017 14:39
i don't recommend ejs. stick wtih fcc. if you really need a book, look into YouDontKnowJS series.
Ken Haduch
@khaduch
Nov 09 2017 14:42
that (sticking with FCC) is a good recommendation, although sometimes there are things that you have to read between the lines for, more detail is helpful for some people. I've heard of the "You Don't Know JS" books, but never have used them.
A-J Roos
@Asjas
Nov 09 2017 14:45
I'm about to start the YouDontKnowJS series myself since I'm still a noob with JS. Every single person recommends it as one of the best series to go through
Znadams
@Znadams
Nov 09 2017 14:45
istated YDKJS but it got pretty tough pretty fast for me
Ken Haduch
@khaduch
Nov 09 2017 14:54
@Znadams - https://www.w3schools.com/js/default.asp - I would say to give that a try - even though there might be some things that people don't like about it, I think that it will give you a good start on the basics. You can go as far with it as you want, I even go back there as a reference for a lot of things, they have HTML, CSS, and on the javascript side, they go into jquery, etc. You can skim if things are too basic, go through the examples and "Try it yourself" as you need.
Znadams
@Znadams
Nov 09 2017 14:54
Thanks guys
im starting at baiscally grouind 0 and trying to get a front end job in 12 months
Kevin K. Lee
@kevinkiklee
Nov 09 2017 15:04
hey @Znadams try out this curriculum:
fcc frontend cert alone will not get you a frontend job, unless you have something very impressive on the resume.
Ken Haduch
@khaduch
Nov 09 2017 15:19
@kevinkiklee - wow, that's quite a list! Thanks for sharing it, I haven't seen that before...
CamperBot
@camperbot
Nov 09 2017 15:19
khaduch sends brownie points to @kevinkiklee :sparkles: :thumbsup: :sparkles:
:cookie: 323 | @kevinkiklee |http://www.freecodecamp.com/kevinkiklee
Ken Haduch
@khaduch
Nov 09 2017 15:19
did you go through that?
Kevin K. Lee
@kevinkiklee
Nov 09 2017 15:19
no, but going through that would have gotten me to a similar level.
if you do everything in that curriculum, you will have a very very very good chance of getting a job
and the last project on there: http://rubix410.sketchpixy.com/ltr/dashboard
if you can clone that, i will go out of my way to find you and get you hired.
Tiago Correia
@tiagocorreiaalmeida
Nov 09 2017 15:22
I can tell you that almost 0 junior developers would be doing such thing, plus the ammout of time it would take is gigant, to not mention about the good structure this would need based on its dimension, anyway looks like a great challenge that would get you at a job for sure with such thing made by yourself
Znadams
@Znadams
Nov 09 2017 15:23
@khaduch Thats what i've "been" working on....however it seems that i need a little more baseline knowledge as the YDKJS books seem to scale very fast for me
Cameron Pick
@Fullmight
Nov 09 2017 15:24
Yeah I started on that P1xt guide recently. Seems good so far. Made me realize how much javascript specific stuff I need to know. Been programming on my own time and in school for a while now so I thought it'd be easier to pickup coming from C#/Cpp but noooope.
Znadams
@Znadams
Nov 09 2017 15:24
oppsi ment @kevinkiklee
im actually doing the 2.0 version
with sopme added algorithms/data structures
Chris Rutherford
@cjrutherford
Nov 09 2017 17:19

having some trouble with CSS z-indexes.... I'm making a CSS envelope that I'll animate, but the problem is, I'm using z-indexes elsewhere too to control the layers of the page, but I can't get the open flap on the envelope to show. (Full Disclaimer, using SASS)

.env-content
  position: absolute
  z-index: 25
  display: flex
  flex-direction: column
  align-items: center
  .body
    display: flex
    flex-direction: row
    .body:children
      width: 150px
.envelope
  height: 0
  width: 0
  border-top: 370px solid gray
  border-left: 370px solid transparent
  border-bottom: 400px solid transparent
  border-right: 470px solid transparent
  position: absolute
  left: 160px
  top: 140px
  z-index: 8
.envelope:after
  content: ''
  position: absolute
  width: 840px
  height: 700px
  background: radial-gradient(rgba(205,205,205,1), rgba(150,150,150,1))
  left: -370px
  top: -380px
  z-index: 7

The highest index is 6 for non-related elements, but the "flap" is under the "main body" of the envelope. How could I fix that?

Isaiah Trembley
@IsaiahCT
Nov 09 2017 17:19
your clon
oh
so, should I use use a margin
Kaz Baig
@kbaig
Nov 09 2017 19:03
@cjrutherford prob gonna have to show a pen for us to be able to help
Christopher Susi
@chrisandsuch
Nov 09 2017 19:07
@heroiczero Thats a super helpful link. Thank you!
CamperBot
@camperbot
Nov 09 2017 19:07
chrisandsuch sends brownie points to @heroiczero :sparkles: :thumbsup: :sparkles:
:star2: 2048 | @heroiczero |http://www.freecodecamp.com/heroiczero
Wrong window friends, I wanted to send it to a senior dev who wanted me to fix a bug
Jessie Cryer
@j-cryer
Nov 09 2017 22:28
does anyone know t-sql

im trying to write a sql script that creates a database, selects it, and then creates the tables for the database.

create database db_name;
use db_name;
go
create table (
...
);

This doesnt seem to work

Jacob Colborn
@jcolborn-dropdeadgames
Nov 09 2017 22:44
@j-cryer It looks like you are missing the GO between the create database and use commands
Alexx Martínez
@AlexxMart
Nov 09 2017 23:35
Helllo, I have a situation. I'm in the "Pomodoro Clock" challenge and I already have the code to start the timer but I want to stop with with the "Stop" button and I read that I need to store my setInterval in a variable to then use clearInterval() to stop the timer but when I do that the timer doesn't even start. My code:
var trial;

function pomodoro () {
  trial = setInterval(clock, 1000);
}

start.click(function clock (){
  start.attr("disabled", "true");
  moreWork.attr("disabled", "true");
  lessWork.attr("disabled", "true");
function startTimer(duration, display) {
    var time = duration, minutes, seconds;

        minutes = parseInt(time / 60, 10);
        seconds = parseInt(time % 60, 10);

        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;

        display.text(minutes + ":" + seconds);

        if (--time < 0) {
          time = 00;
        }
}

jQuery(function ($) {
    var xMinutes = 60 * timer.text(),
        display = $('#work');
    startTimer(xMinutes, display);
});
  })

stop.click(function(){
  clearInterval(trial)
})
Kevin K. Lee
@kevinkiklee
Nov 09 2017 23:48
@AlexxMart where does pomodoro() get called? i'm having trouble finding where it actually gets invoked.