Advertisement
daniramadhan7

contact trusted

Oct 26th, 2021
935
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 10.25 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.     <head>
  4.         <meta charset="utf-8" />
  5.         <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
  6.         <meta name="description" content="" />
  7.         <meta name="author" content="" />
  8.         <title>TrustedNews.ID - Start Bootstrap Theme</title>
  9.         <link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
  10.         <!-- Font Awesome icons (free version)-->
  11.         <script src="https://use.fontawesome.com/releases/v5.15.4/js/all.js" crossorigin="anonymous"></script>
  12.         <!-- Google fonts-->
  13.         <link href="https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic" rel="stylesheet" type="text/css" />
  14.         <link href="https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800" rel="stylesheet" type="text/css" />
  15.         <!-- Core theme CSS (includes Bootstrap)-->
  16.         <link href="css/styles.css" rel="stylesheet" />
  17.     </head>
  18.     <body>
  19.         <!-- Navigation-->
  20.         <nav class="navbar navbar-expand-lg navbar-light" id="mainNav">
  21.             <div class="container px-4 px-lg-5">
  22.                 <a class="navbar-brand" href="index.html">TrustedNews.ID</a>
  23.                 <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
  24.                     Menu
  25.                     <i class="fas fa-bars"></i>
  26.                 </button>
  27.                 <div class="collapse navbar-collapse" id="navbarResponsive">
  28.                     <ul class="navbar-nav ms-auto py-4 py-lg-0">
  29.                         <li class="nav-item"><a class="nav-link px-lg-3 py-3 py-lg-4" href="index.html">Home</a></li>
  30.                         <li class="nav-item"><a class="nav-link px-lg-3 py-3 py-lg-4" href="about.html">About</a></li>
  31.                         <li class="nav-item"><a class="nav-link px-lg-3 py-3 py-lg-4" href="post.html">Sample Post</a></li>
  32.                         <li class="nav-item"><a class="nav-link px-lg-3 py-3 py-lg-4" href="contact.html">Contact</a></li>
  33.                         <li class="nav-item"><a class="nav-link px-lg-3 py-3 py-lg-4" href="login.html">Login</a></li>
  34.                     </ul>
  35.                 </div>
  36.             </div>
  37.         </nav>
  38.         <!-- Page Header-->
  39.         <header class="masthead" style="background-image: url('assets/img/contact-bg.jpg')">
  40.             <div class="container position-relative px-4 px-lg-5">
  41.                 <div class="row gx-4 gx-lg-5 justify-content-center">
  42.                     <div class="col-md-10 col-lg-8 col-xl-7">
  43.                         <div class="page-heading">
  44.                             <h1>Contact Us</h1>
  45.                             <span class="subheading">Have questions?</span>
  46.                         </div>
  47.                     </div>
  48.                 </div>
  49.             </div>
  50.         </header>
  51.         <!-- Main Content-->
  52.         <main class="mb-4">
  53.             <div class="container px-4 px-lg-5">
  54.                 <div class="row gx-4 gx-lg-5 justify-content-center">
  55.                     <div class="col-md-10 col-lg-8 col-xl-7">
  56.                         <p><b>Attention:</b> this form is for display only and does not work properly</p>
  57.                         <p>Want to get in touch? Fill out the form below to send us a message.</p>
  58.                         <div class="my-5">
  59.                             <!-- * * * * * * * * * * * * * * *-->
  60.                             <!-- * * SB Forms Contact Form * *-->
  61.                             <!-- * * * * * * * * * * * * * * *-->
  62.                             <!-- This form is pre-integrated with SB Forms.-->
  63.                             <!-- To make this form functional, sign up at-->
  64.                             <!-- https://startbootstrap.com/solution/contact-forms-->
  65.                             <!-- to get an API token!-->
  66.                             <form id="contactForm" data-sb-form-api-token="API_TOKEN">
  67.                                 <div class="form-floating">
  68.                                     <input class="form-control" id="name" type="text" placeholder="Enter your name..." data-sb-validations="required" />
  69.                                     <label for="name">Name</label>
  70.                                     <div class="invalid-feedback" data-sb-feedback="name:required">A name is required.</div>
  71.                                 </div>
  72.                                 <div class="form-floating">
  73.                                     <input class="form-control" id="email" type="email" placeholder="Enter your email..." data-sb-validations="required,email" />
  74.                                     <label for="email">Email address</label>
  75.                                     <div class="invalid-feedback" data-sb-feedback="email:required">An email is required.</div>
  76.                                     <div class="invalid-feedback" data-sb-feedback="email:email">Email is not valid.</div>
  77.                                 </div>
  78.                                 <div class="form-floating">
  79.                                     <input class="form-control" id="phone" type="tel" placeholder="Enter your phone number..." data-sb-validations="required" />
  80.                                     <label for="phone">Phone Number</label>
  81.                                     <div class="invalid-feedback" data-sb-feedback="phone:required">A phone number is required.</div>
  82.                                 </div>
  83.                                 <div class="form-floating">
  84.                                     <textarea class="form-control" id="message" placeholder="Enter your message here..." style="height: 12rem" data-sb-validations="required"></textarea>
  85.                                     <label for="message">Message</label>
  86.                                     <div class="invalid-feedback" data-sb-feedback="message:required">A message is required.</div>
  87.                                 </div>
  88.                                 <br />
  89.                                 <!-- Submit success message-->
  90.                                 <!---->
  91.                                 <!-- This is what your users will see when the form-->
  92.                                 <!-- has successfully submitted-->
  93.                                 <div class="d-none" id="submitSuccessMessage">
  94.                                     <div class="text-center mb-3">
  95.                                         <div class="fw-bolder">Form submission successful!</div>
  96.                                         To activate this form, sign up at
  97.                                         <br />
  98.                                         <a href="https://startbootstrap.com/solution/contact-forms">https://startbootstrap.com/solution/contact-forms</a>
  99.                                     </div>
  100.                                 </div>
  101.                                 <!-- Submit error message-->
  102.                                 <!---->
  103.                                 <!-- This is what your users will see when there is-->
  104.                                 <!-- an error submitting the form-->
  105.                                 <div class="d-none" id="submitErrorMessage"><div class="text-center text-danger mb-3">Error sending message!</div></div>
  106.                                 <!-- Submit Button-->
  107.                                 <button class="btn btn-primary text-uppercase disabled" id="submitButton" type="submit">Send</button>
  108.                             </form>
  109.                         </div>
  110.                     </div>
  111.                 </div>
  112.             </div>
  113.         </main>
  114.         <!-- Footer-->
  115.         <footer class="border-top">
  116.             <div class="container px-4 px-lg-5">
  117.                 <div class="row gx-4 gx-lg-5 justify-content-center">
  118.                     <div class="col-md-10 col-lg-8 col-xl-7">
  119.                         <ul class="list-inline text-center">
  120.                             <li class="list-inline-item">
  121.                                 <a href="#!">
  122.                                     <span class="fa-stack fa-lg">
  123.                                         <i class="fas fa-circle fa-stack-2x"></i>
  124.                                         <i class="fab fa-twitter fa-stack-1x fa-inverse"></i>
  125.                                     </span>
  126.                                 </a>
  127.                             </li>
  128.                             <li class="list-inline-item">
  129.                                 <a href="#!">
  130.                                     <span class="fa-stack fa-lg">
  131.                                         <i class="fas fa-circle fa-stack-2x"></i>
  132.                                         <i class="fab fa-facebook-f fa-stack-1x fa-inverse"></i>
  133.                                     </span>
  134.                                 </a>
  135.                             </li>
  136.                             <li class="list-inline-item">
  137.                                 <a href="#!">
  138.                                     <span class="fa-stack fa-lg">
  139.                                         <i class="fas fa-circle fa-stack-2x"></i>
  140.                                         <i class="fab fa-github fa-stack-1x fa-inverse"></i>
  141.                                     </span>
  142.                                 </a>
  143.                             </li>
  144.                         </ul>
  145.                         <div class="small text-center text-muted fst-italic">Copyright &copy; TrustedNews.ID 2021</div>
  146.                     </div>
  147.                 </div>
  148.             </div>
  149.         </footer>
  150.         <!-- Bootstrap core JS-->
  151.         <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
  152.         <!-- Core theme JS-->
  153.         <script src="js/scripts.js"></script>
  154.         <!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *-->
  155.         <!-- * *                               SB Forms JS                               * *-->
  156.         <!-- * * Activate your form at https://startbootstrap.com/solution/contact-forms * *-->
  157.         <!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *-->
  158.         <script src="https://cdn.startbootstrap.com/sb-forms-latest.js"></script>
  159.     </body>
  160. </html>
  161.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement