API tools faq
paste
deyanivanov966

Contacts.html

deyanivanov966
Dec 24th, 2021
1,686
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 8.33 KB | None | 0 0
raw download clone embed print report
  1.  
  2. <!doctype html>
  3. <html lang="en">
  4.  
  5. <head>
  6.     <!-- Required meta tags -->
  7.     <meta charset="utf-8">
  8.     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  9.  
  10.     <!-- Bootstrap CSS -->
  11.     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
  12.     <link rel="stylesheet" href="style.css">
  13.     <title>Hristo Ivanov Portfolio</title>
  14. </head>
  15.  
  16. <body>
  17.  
  18.     <div id="bg">
  19.         <nav class="navbar navbar-custom navbar-expand-lg navbar-light fixed-top">
  20.             <a class="navbar-brand" href="index.html">Hristo Ivanov</a>
  21.             <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
  22.         <span class="navbar-toggler-icon"></span>
  23.       </button>
  24.  
  25.             <div class="collapse navbar-collapse" id="navbarSupportedContent">
  26.                 <ul class="navbar-nav ml-auto">
  27.                     <li class="nav-item active">
  28.                         <a class="nav-link" href="Resume.html">Resume<span class="sr-only">(current)</span></a>
  29.                     </li>
  30.                     <li class="nav-item active">
  31.                         <a class="nav-link" href="Projects.html">Projects <span class="sr-only">(current)</span></a>
  32.                     </li>
  33.                     <li class="nav-item active">
  34.                         <a class="nav-link" href="contactMe.html">Let's talk<span class="sr-only">(current)</span></a>
  35.                     </li>
  36.                 </ul>
  37.  
  38.                 <!-- <form class="form-inline my-2 my-lg-0">
  39.                    <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
  40.                    <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
  41.                </form> -->
  42.             </div>
  43.         </nav>
  44.         <div class="load">
  45.             <div id="dot">
  46.             </div>
  47.         </div>
  48.  
  49.  
  50.         <div class="col-md-12 m-0 p-0">
  51.             <div class="row">
  52.                 <div class="col-8" id="letsTalk">
  53.                     <h1 class="bigText">Let's</h1>
  54.                     <h1 class="bigText">Talk</h1>
  55.                 </div>
  56.             </div>
  57.         </div>
  58.  
  59.         <div class="row">
  60.             <div class="col-md-12" id="contactMe">
  61.                 <h1 class="bigText">Contact me</h1>
  62.             </div>
  63.  
  64.             <div class="col-md-12">
  65.                 <!--Section: Contact v.2-->
  66.                 <section class="mb-4">
  67.                     <div class="row" id="contactForm">
  68.                         <!--Grid column-->
  69.                         <div class="col-md-6 mb-md-0 mb-5">
  70.                             <form id="contact-form" name="contact-form" action="mail.php" method="POST">
  71.  
  72.                                 <!--Grid row-->
  73.                                 <div class="row">
  74.                                     <!--Grid column-->
  75.                                     <div class="col-md-6">
  76.                                         <div class="md-form mb-0">
  77.                                             <label for="message">Name</label>
  78.                                             <input type="text" id="senderName" name="name" class="form-control customInput" placeholder="Your name">
  79.                                         </div>
  80.                                     </div>
  81.                                     <!--Grid column-->
  82.  
  83.                                     <!--Grid column-->
  84.                                     <div class="col-md-6">
  85.                                         <div class="md-form mb-0">
  86.                                             <label for="message">Email</label>
  87.                                             <input type="text" id="email" name="email" class="form-control customInput" placeholder="Your email">
  88.                                         </div>
  89.                                     </div>
  90.                                     <!--Grid column-->
  91.  
  92.                                 </div>
  93.                                 <!--Grid row-->
  94.  
  95.                                 <!--Grid row-->
  96.                                 <div class="row">
  97.                                     <div class="col-md-12">
  98.                                         <div class="md-form mb-0">
  99.                                             <label for="message">Subject</label>
  100.                                             <input type="text" id="subject" name="subject" class="form-control customInput" placeholder="Subject">
  101.                                         </div>
  102.                                     </div>
  103.                                 </div>
  104.                                 <!--Grid row-->
  105.  
  106.                                 <!--Grid row-->
  107.                                 <div class="row">
  108.  
  109.                                     <!--Grid column-->
  110.                                     <div class="col-md-12">
  111.  
  112.                                         <div class="md-form">
  113.                                             <label for="message">Message</label>
  114.                                             <textarea id="message" name="message" rows="2" class="form-control md-textarea customInput" placeholder="Your message"></textarea>
  115.                                         </div>
  116.  
  117.                                     </div>
  118.                                 </div>
  119.                                 <!--Grid row-->
  120.  
  121.                             </form>
  122.  
  123.                             <div class="text-center text-md-left mt-4">
  124.                                 <a class="btn btn-outline-success my-2 my-sm-0" onclick="document.getElementById('contact-form').submit();">Send</a>
  125.                             </div>
  126.                             <div class="status"></div>
  127.                         </div>
  128.                         <!--Grid column-->
  129.  
  130.                         <!--Grid column-->
  131.                         <div class="col-md-6 text-center">
  132.                             <ul class="list-unstyled mb-0">
  133.                                 <li><i class="fas fa-map-marker-alt fa-2x"></i>
  134.                                     <p>Sofia, CA 94126, BG</p>
  135.                                 </li>
  136.  
  137.                                 <li><i class="fas fa-phone mt-4 fa-2x"></i>
  138.                                     <p>+ 01 234 567 89</p>
  139.                                 </li>
  140.  
  141.                                 <li><i class="fas fa-envelope mt-4 fa-2x"></i>
  142.                                     <p>[email protected]</p>
  143.                                 </li>
  144.  
  145.  
  146.  
  147.                                 <!--Google Maps-->
  148.                             </ul>
  149.                             <!--Google map-->
  150.                             <div><iframe src="https://maps.google.com/maps?width=100%25&amp;height=600&amp;hl=en&amp;q=Sofia+()&amp;t=&amp;z=14&amp;ie=UTF8&amp;iwloc=B&amp;output=embed" width="100%"><a href="https://www.gps.ie/sport-gps/">swimming watch</a></iframe></div>
  151.                         </div>
  152.                         <!--Grid column-->
  153.  
  154.                     </div>
  155.  
  156.                 </section>
  157.                 <!--Section: Contact v.2-->
  158.             </div>
  159.         </div>
  160.     </div>
  161.  
  162.  
  163.     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js" defer></script>
  164.     <script src="js/motus.js" defer></script>
  165.     <!-- jQuery first, then Bootstrap JS -->
  166.     <!-- CSS -->
  167.     <link rel="stylesheet " href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
  168.     <!-- jQuery and JS bundle w/ Popper.js -->
  169.     <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous" defer>
  170.     </script>
  171.     <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous" defer>
  172.     </script>
  173.     <!-- Personal JavaScript -->
  174.     <script src="js/contactMe.js" defer></script>
  175.     <!-- Optional JavaScript -->
  176. </body>
  177.  
  178. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!