Implementing ABOUT Component

 THE ABOUT COMPONENT HAS TWO COMPONENTS, HERO AND TEAM.

IN THE HERO COMPONENT, WE HAVE A h1 TAG AND SOME <p> TAGS

THE PARAGRAPH IS DIVIDED INTO TWO ROWS.

IN THE TEAM COMPONENT , WE WILL INCLUDE THE FOUNDER'S IMAGE AND SOME DETAILS USING THE SAME CONTAINER CLASS.

HERO.JS

import React from "react";
function Hero() {
  return (
    <>
      <div className="container mt-5 p-5">
        <div className="row text-center flex flex-start">
          <h1 className="fs-2">
            We pioneered the discount broking model in India.
            <br /> Now, we are breaking ground with our technology.
          </h1>
          <div
            className="col-6  border-top"
            style={{
              marginTop: "100px",
              padding: "75px",
              fontSize: "15px",
              lineHeight: "1.8",
              textAlign:"left",

            }}
          >
            <p>
              We kick-started operations on the 15th of August, 2010 with the
              goal of breaking all barriers that traders and investors face in
              India in terms of cost, support, and technology. We named the
              company Zerodha, a combination of Zero and "Rodha", the Sanskrit
              word for barrier.
            </p>

            <p>
              Today, our disruptive pricing models and in-house technology have
              made us the biggest stock broker in India.
            </p>

            <p>
              Over 1+ Crore clients place millions of orders every day through
              our powerful ecosystem of investment platforms, contributing over
              15% of all Indian retail trading volumes.
            </p>
          </div>
          <div
            className="col-6 border-top "
            style={{
              marginTop: "100px",
              padding: "75px",
              fontSize: "15px",
              lineHeight: "1.8",
            }}
          >
            <p>
              In addition, we run a number of popular open online educational
              and community initiatives to empower retail traders and investors.
            </p>

            <p>
              <a href="" style={{textDecoration:"none"}}>Rainmatter</a>, our fintech
              fund and incubator, has invested in several fintech startups with
              the goal of growing the Indian capital markets
            </p>

            <p>
              And yet, we are always up to something new every day. Catch up on
              the latest updates on our blog or see what the media is saying
              about us
            </p>
          </div>
        </div>
      </div>
    </>
  );
}

export default Hero;




TEAM.JS

import React from "react";
function Team() {
  return (
    <>
      <>
        <div className="container mt-5 p-5">
          <div className="row text-center flex flex-start">
            <h1 className="fs-2">People</h1>
            <div className="col-6 mt-5">
                <img src="media/images/nithinKamath.jpg" style={{border:"1px",borderRadius:"100%",width:"60%"}}/>
                <h5 className="mt-3 text-muted">Nithin Kamath</h5>
                <p>Founder,CEO</p>
            </div>
            <div
              className="col-6 p-5 mt-5 "
              style={{
              textAlign:"left",
                fontSize: "15px",
                lineHeight: "1.8",
              }}
            >
              <p>
                Nithin bootstrapped and founded Zerodha in 2010 to overcome the
                hurdles he faced during his decade long stint as a trader.
                Today, Zerodha has changed the landscape of the Indian broking
                industry.
              </p>

              <p>
                He is a member of the SEBI Secondary Market Advisory Committee
                (SMAC) and the Market Data Advisory Committee (MDAC).
              </p>

              <p>Playing basketball is his zen.</p>
              <p>
                Connect on&nbsp;
                <a href="" style={{ textDecoration: "none" }}>
                  Homepage/&nbsp;
                </a>
                <a href="" style={{ textDecoration: "none" }}>
                 
                  TradingQnA/&nbsp;
                </a>
                <a href=""style={{textDecoration:"none"}}> Twitter </a>
              </p>
            </div>
          </div>
        </div>
      </>
    </>
  );
}

export default Team;





Comments

Popular posts from this blog

*********UPDATING THE FRONTEND*********

**************** EXTRACTING DATA FROM API **************