HEX
Server: Apache/2.4.52 (Ubuntu)
System: Linux spn-python 5.15.0-89-generic #99-Ubuntu SMP Mon Oct 30 20:42:41 UTC 2023 x86_64
User: arjun (1000)
PHP: 8.1.2-1ubuntu2.20
Disabled: NONE
Upload Files
File: //home/arjun/projects/propbase/propbase_website/components/Resources.tsx
import { SelectedPage } from '@/types/home';
import { motion } from 'framer-motion';

type Props = {
  setSelected: (value: SelectedPage) => void;
};

const Resources = ({ setSelected }: Props) => {
  return (
    <motion.div
      onViewportEnter={() => setSelected(SelectedPage.Resources)}
      id={SelectedPage.Resources}
    >
      <section className="pricing-sec layer-1">
        <div className="container-1400 container">
          <div className="sub-title-block text-center">
            <h4>
              <span className="sub-title-label">Resources</span>
            </h4>
            <h2 className="sub-title">
              A powerful transformation in
              <br /> property transactions <span className="txt-blue">Economy</span>
            </h2>
            <p>
              A fast, secure, and seamless tokenized property transaction platform
              <br />
              positioned to become the global brand name for the future of real estate investment!
            </p>
          </div>
          <div className="price-col-wrapper d-flex">
            <div className="price-card">
              <div className="price-det-block">
                <div className="img-block">
                  <img src="img/price-logo-1.svg" alt="" />
                </div>
                <h4>White Paper</h4>
                <p>What propbase is, how it is designed, legal and technical framework.</p>
                <ul>
                  <li>60 min read</li>
                  <li>33 pages</li>
                  <li>Technical document</li>
                  <li>Product Description</li>
                  <li>9.8 mb</li>
                </ul>
              </div>
              <div className="btn-block">
                <a href="#" className="download-btn">
                  Download
                </a>
              </div>
            </div>
            <div className="price-card">
              <span className="popular-badge">Popular</span>
              <div className="price-det-block">
                <div className="img-block">
                  <img src="img/price-logo-1.svg" alt="" />
                </div>
                <h4>White Paper</h4>
                <p>What propbase is, how it is designed, legal and technical framework.</p>
                <ul>
                  <li>60 min read</li>
                  <li>33 pages</li>
                  <li>Technical document</li>
                  <li>Product Description</li>
                  <li>9.8 mb</li>
                </ul>
              </div>
              <div className="btn-block">
                <a href="#" className="download-btn">
                  Download
                </a>
              </div>
            </div>
            <div className="price-card">
              <div className="price-det-block">
                <div className="img-block">
                  <img src="img/price-logo-2.svg" alt="" />
                </div>
                <h4>White Paper</h4>
                <p>What propbase is, how it is designed, legal and technical framework.</p>
                <ul>
                  <li>60 min read</li>
                  <li>33 pages</li>
                  <li>Technical document</li>
                  <li>Product Description</li>
                  <li>9.8 mb</li>
                </ul>
              </div>
              <div className="btn-block">
                <a href="#" className="download-btn">
                  Download
                </a>
              </div>
            </div>
          </div>
        </div>
      </section>
      <section className="blog-sec layer-1">
        <div className="container-1400 container">
          <div className="blog-title-block d-flex">
            <div className="sub-title-block">
              <h4>
                <span className="sub-title-label">Our Blog</span>
              </h4>
              <h2 className="sub-title mb-0">
                Take a look at our <br />
                <span className="txt-blue">articles &amp; resources</span>
              </h2>
            </div>
            <div className="btn-block">
              <a href="#" className="browse-btn">
                Browse all
              </a>
            </div>
          </div>
          <div className="row gx-5">
            <div className="col-lg-6 blog-col">
              <div className="blog-card blog-card-lg">
                <div className="img-block">
                  <img src="img/blog-md.png" alt="" />
                </div>
                <h2>Propbase Monthly Development Summary - September 2024</h2>
                <h5>And overview of September Product Development Progress</h5>
                <p>
                  In September, Propbase made remarkable strides across several key development
                  areas, building upon the groundwork laid in previous months. The Yield platform
                  saw the completion of major tasks related to analytics tracking, enhancing the
                  app`&apos;`s ability to provide deeper insights into user behavior and platform
                  performance. Meanwhile, both Nexus and Secondary Marketplace received minor bug
                  fixes and new feature additions, particularly focusing on the integration of the
                  rental yield claim feature in Nexus and new screens for trading. These updates
                  ensure a smoother and more reliable experience for users.
                </p>
              </div>
            </div>
            <div className="col-lg-6 blog-col">
              <div className="blog-card blog-card-sm d-flex">
                <div className="img-block">
                  <img src="img/blog-sm.png" alt="" />
                </div>
                <div className="det-block">
                  <div className="date">28-10-2024 </div>
                  <h2>Propbase Monthly Development Summary - September 2024</h2>
                  <p>And overview of September Product Development Progress</p>
                </div>
              </div>
              <div className="blog-card blog-card-sm d-flex">
                <div className="img-block">
                  <img src="img/blog-sm.png" alt="" />
                </div>
                <div className="det-block">
                  <div className="date">28-10-2024 </div>
                  <h2>Propbase Monthly Development Summary - September 2024</h2>
                  <p>And overview of September Product Development Progress</p>
                </div>
              </div>
              <div className="blog-card blog-card-sm d-flex">
                <div className="img-block">
                  <img src="img/blog-sm.png" alt="" />
                </div>
                <div className="det-block">
                  <div className="date">28-10-2024 </div>
                  <h2>Propbase Monthly Development Summary - September 2024</h2>
                  <p>And overview of September Product Development Progress</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
      <section className="performance-sec layer-1">
        <div className="container-1400 container">
          <div className="performance-row row">
            <div className="col-md-4 performance-col">
              <a href="#" className="performance-card">
                <h5>Performance Report</h5>
                <p>Read the Report</p>
                <div className="arw-btn-block">
                  <img src="img/arrow-right-lg.svg" alt="" />
                </div>
              </a>
            </div>
            <div className="col-md-4 performance-col">
              <a href="#" className="performance-card">
                <h5>Tokenomics</h5>
                <p>Lorem ipusm is a dummy text </p>
                <div className="arw-btn-block">
                  <img src="img/arrow-right-lg.svg" alt="" />
                </div>
              </a>
            </div>
            <div className="col-md-4 performance-col">
              <a href="#" className="performance-card bg-1">
                <h5>Topics</h5>
                <p>Lorem ipusm is a dummy text </p>
                <div className="arw-btn-block">
                  <img src="img/arrow-right-lg.svg" alt="" />
                </div>
              </a>
            </div>
            <div className="col-md-8 performance-col">
              <a href="#" className="performance-card performance-card-lg">
                <h5>Lorem ipusm is a dummy text</h5>
                <p>
                  Sapiente necessitatibus expedita aspernatur dolore voluptas voluptates animi nam?
                  Animi mollitia obcaecati error temporibus illo voluptatibus doloribus sequi
                  tenetur fugiat?
                </p>
                <div className="arw-btn-block">
                  <img src="img/arrow-right-lg.svg" alt="" />
                </div>
              </a>
            </div>
            <div className="col-md-4 performance-col">
              <a href="#" className="performance-card bg-2">
                <h5>Topics</h5>
                <p>Lorem, ipsum dolor sit amet consectetur </p>
                <div className="arw-btn-block">
                  <img src="img/arrow-right-lg.svg" alt="" />
                </div>
              </a>
            </div>
          </div>
        </div>
      </section>
    </motion.div>
  );
};

export default Resources;