Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Aug 17 09:32
    User @bjorno43 unbanned @linkin-park
  • Jun 20 21:19
    @bjorno43 banned @shenerd140
  • Apr 25 17:13
    @mstellaluna banned @cmal
  • Jan 08 22:05
    @mstellaluna banned @dertiuss323
  • Nov 07 2018 04:42
    User @texas2010 unbanned @ows-ali
  • Nov 02 2018 16:25
    @texas2010 banned @ows-ali
  • Oct 12 2018 05:50
    @bjorno43 banned @NACH74
  • Oct 05 2018 23:02
    @mstellaluna banned @JomoPipi
  • Sep 16 2018 12:21
    @bjorno43 banned @yash-kedia
  • Sep 16 2018 12:16
    @bjorno43 banned @vnikifirov
  • Sep 05 2018 08:12
    User @bjorno43 unbanned @androuino
  • Sep 05 2018 07:38
    @bjorno43 banned @androuino
  • Aug 23 2018 16:57
    User @bjorno43 unbanned @rahuldkjain
  • Aug 23 2018 16:23
    @bjorno43 banned @rahuldkjain
  • Jul 29 2018 14:13
    User @bjorno43 unbanned @jkyereh
  • Jul 29 2018 01:00
    @bjorno43 banned @jkyereh
  • Jul 10 2018 22:09
    @bjorno43 banned @manafn
  • Jul 06 2018 15:20
    @texas2010 banned @imlegend19
  • Jul 03 2018 12:28
    @bjorno43 banned @vbvmatta
  • Jun 29 2018 13:54
    @bjorno43 banned @OGTechnoBoy
CamperBot
@camperbot
:cookie: 287 | @bazill03 |http://www.freecodecamp.com/bazill03
PreatzalGamer99
@PreatzalGamer99
does this look good
daveygf
@daveygf
looks good
PreatzalGamer99
@PreatzalGamer99
Zachary
@Bazill03
@PreatzalGamer99 Might want to center some things.
PreatzalGamer99
@PreatzalGamer99
i know and that is what i need help with
Brittany Rutherford
@brittanyrutherford

do we need to write this even after referencing normalize.css?

margin: 0; padding: 0;

doesn't normalize.css make this for us? why do we need to write it again?

Zachary
@Bazill03
@PreatzalGamer99 Are you trying to avoid using bootstrap?
PreatzalGamer99
@PreatzalGamer99
no
Zachary
@Bazill03
@PreatzalGamer99 Import bootstrap and that text-center class you're already using will work.
PreatzalGamer99
@PreatzalGamer99
and how do i do that
Zachary
@Bazill03
@PreatzalGamer99 Settings at the top right. Under CSS use the quick-add at the bottom to add bootstrap.
PreatzalGamer99
@PreatzalGamer99
so how do i add it in the code
and where?
Zachary
@Bazill03
Well your "Tribute to Bob Marley" h2 already has a class of "text-center" doesn't it?
PreatzalGamer99
@PreatzalGamer99
yes
Zachary
@Bazill03
Is that text now centered?
jump020305
@jump020305

@all - i am new to js. I have written accordion code
onSelect(id) {

  • I am trying to increase the performance of the code.
  • In my code I have used onSelect function in both the components.
  • is it possible to combine to into one.so that it will be faster
  • providing my code below...

http://jsfiddle.net/b4L6kyg4/89/

class Accordion extends React.Component {
  constructor(props) {
    super(props);
    this.state = { selected: props.selected };
    this.enhanceSection = this.enhanceSection.bind(this);
    this.onSelect = this.onSelect.bind(this);
  }
  enhanceSection(child) {

    //var child;
    //var props;

    console.log("enhanceSection");

    // debugger;


    var selectedId = this.state.selected,
           id = child.props.id;

        return React.cloneElement(child, {
            key: id,
            selected: id === selectedId,
            onSelect: this.onSelect
        });

  }

  onSelect(id) {
        console.log("onSelect");


        if (this.state.selected === id) {
          console.log("onSelect if");
          console.log("his.state.selected---->" + this.state.selected);
          this.setState({selected: ""});
        } else {

            console.log("onSelect else");

            this.setState({selected: id});
        } 

  }

  render() {
        console.log("render");
        // debugger;


    var children = React.Children.map(
            this.props.children, this.enhanceSection);

    console.log("children----->" + JSON.stringify(children));

    return (
      <div className="accordion">
        <p> testing </p>
          {children}
      </div>
    );
  }

}


class SectionAccordion extends React.Component {
  constructor(props) {
    super(props);
    this.onSelect = this.onSelect.bind(this)
  };

  onSelect() {
        console.log("onSelect");
       // debugger;


    this.props.onSelect(this.props.id);
  }

  render() {
        console.log("render section");
        //debugger;


        console.log("accordion / the Accordion Section component");
        var className = 'accordion-section' + (this.props.selected ? ' selected' : '');

        return (
            <div className={className}>
                <div className = "mobile-accordion-question-title mobile-submenu-dropmenuHeader">

                  <h3 onClick={this.onSelect}>
                      {this.props.title}
                  </h3>

                  <div className="up-arrow"></div>
                </div>




                <div onClick={this.onSelect} className="body">
                    {this.props.children}
                </div>
            </div>
        );

  }

}


React.render((

    <div className="form-section">

        <div className="accordionTesting">
            <h2 className="mobile-h2 mobile-accordionTitle">kick 1</h2>

            <Accordion selected="">
              <SectionAccordion title="Section 1" id="1">
                  Section 1 content
              </SectionAccordion>
              <SectionAccordion title="Section 2" id="2">
                  Section 2 content
              </SectionAccordion>
              <SectionAccordion title="Section 3" id="3">
                  Section 3 content
              </SectionAccordion>
          </Accordion>
        </div>

        <div className="accordionTesting">
            <h2 className="mobile-h2 mobile-accordionTitle">kick 2</h2>

            <Accordion selected="">
              <SectionAccordion title="Section 3" id="4">
                  Section 3
PreatzalGamer99
@PreatzalGamer99
does this look good
Zachary
@Bazill03
@PreatzalGamer99 Much better but you'll want to center the image caption and fix the tribute misspelling.
PreatzalGamer99
@PreatzalGamer99
what mispelling?
and how do I center the caption
Zachary
@Bazill03
@PreatzalGamer99 Move the caption into it's own paragraph and center that. Tribute is misspelled as tirbute.
PreatzalGamer99
@PreatzalGamer99
I see the misspelling
Zachary
@Bazill03
@PreatzalGamer99 Lookin good
PreatzalGamer99
@PreatzalGamer99
looks good?
Johnny
@jtan3
@PreatzalGamer99 maybe a different color for the text. It's kinda hard to read.
Zachary
@Bazill03
@PreatzalGamer99 Much better. Close your row and container divs though.
PreatzalGamer99
@PreatzalGamer99
Zachary
@Bazill03
@PreatzalGamer99 Definitely change the link color to black.
PreatzalGamer99
@PreatzalGamer99
how do you do that
Gulsvi
@gulsvi
@PreatzalGamer99 There are some issues with your codepen settings. There's a v3.3.7 Bootstrap JS file in your CSS settings (only CSS files go there) and a Bootstrap 4 JS file in your JavaScript settings (which doesn't match your CSS version). You don't need either of the JS files - remove them from your settings :)
Add the img-responsive class to your image and it will scale down smaller for mobile devices.
This CSS isn't needed:
center-block {
  display: block;
  margin-right: auto;
  margin-left: auto;
}
To make your link black, assign it a class and give it a color, like:
a.black-text,
a:hover.black-text {
  color: black;
}
Alan Saber
@Alan95
is it even worth to finish the frontend certificate since the new beta is coming soon?
Eduar Tua
@eduartua
Hi guys
do you recommend to switch to the beta versiĆ³n?
Gulsvi
@gulsvi
If you switch to the beta, save your progress. It won't be saved when the beta is finished.
Eduar Tua
@eduartua
Then it is better to wait
Gulsvi
@gulsvi
I'm waiting, but I'm not in a hurry - this is just a hobby for now
Lots of good lessons in the beta
Keon Samuel
@keonsam
Im in hurry
speed
Gulsvi
@gulsvi
Yeah, I can tell :)
Keon Samuel
@keonsam
I want everything .
how old are you Sky?
Gulsvi
@gulsvi
21