PTB-fe/pages/pt/bantuanPT/index.js

import React from "react";
import ContentWrapper from "@/components/Layout/ContentWrapper";
import { Row, Jumbotron, Col, Button } from "reactstrap";
import Link from "next/link";

class Bantuan extends React.Component {
    render() {
        return (
            <div>
                <ContentWrapper>
                    <div className="content-heading">
                        <span className="font-color-white">Buku Panduan</span>
                        <div className="ml-auto"></div>
                    </div>
                    <Jumbotron>
                        <Row className="home-1-1">
                            <Col lg={5} className="d-flex flex-column justify-content-center align-items-start">
                                <h1 className="display-5 home-2 txt-size">Buku Panduan</h1>
                                <h1 className="display-5 txt-size">Penggunaan Aplikasi SIDALI</h1>
                                <hr className="my-4" />
                                <p className="txt-size">Buku Panduan ini dapat membantu Anda dalam menggunakan Aplikasi SIDALI. Pelajari lebih lanjut Aplikasi SIDALI dengan mengunduh buku panduan dibawah ini.</p>
                                <p className="lead">
                                    <a href="/static/img/buku_panduan_PT.pdf" download="Buku Panduan Sidali">
                                        <span className="btn-radius">
                                            <Button color="" className="btn-labeled">
                                                <h4 className="p-1 font-color-white mt-2">Download</h4>
                                            </Button>
                                        </span>
                                    </a>
                                    <a target="_blank" rel="noopener noreferrer" href="/static/img/buku_panduan_PT.pdf">
                                        <span className="btn-radius">
                                            <Button color className="btn-labeled-3">
                                                <h4 className="p-0 mt-2">Buka Buku Panduan</h4>
                                            </Button>
                                        </span>
                                    </a>
                                </p>

                            </Col>
                            <Col lg={5}>
                                <img className="responsive-1" src="/static/img/Ilustrasi.png" alt="gambar" />
                            </Col>
                        </Row>
                    </Jumbotron>
                </ContentWrapper>

            </div>

        )
    }
}

export default Bantuan;