pshear.github.io/index.html at main · pshear/pshear.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
<!doctype html>
<html lang="en">
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css">
   <script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.slim.min.js"></script>
   <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
   <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>
   <style>
    .picture{
      border-radius: 100%;
    }
   </style>
   <title>Peyton's Portfolio</title>
   <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
   <link rel="stylesheet" href="style1/mystyle4.css">

 </head>
 <body>
    <nav class="navbar navbar-expand-lg">
      <div class="container-fluid">
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
          <ul class="navbar-nav me-auto mb-2 mb-lg-0">
            <li class="nav-item">
              <a class="nav-link" aria-current="page" href="index.html">Home</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="sports.html" target="_blank">Sports</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="aca.html" target="_blank">Academics/Clubs</a>
            </li>
            <li class="nav-item dropdown">
              <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                Recipes
              </a>
              <ul class="dropdown-menu">
                <li><a class="dropdown-item" href="recipe.html" target="_blank">HTML</a></li>
                <li><a class="dropdown-item" href="recipe2.html" target="_blank">CSS</a></li>
                <li><a class="dropdown-item" href="recipe3.html" target="_blank">Bootstrap</a></li>
              </ul>
            </li>
          </ul>
        </div>
      </div>
    </nav>

   <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
   <br>
   <div class="container bg-light">
       <div class="row">
           <div class="col-md-3">
               <img src="media/me.jpg" class="picture" alt="Picture of Me" height="300px" width="200px">
           </div>
           <div class="col-md-9">
               <h3>Peyton Shear</h3>
               <p>My name is Peyton Shear, and I am a freshman at Lane Tech. I am a straight-A student, and am involved in various clubs and sports. I have done club gymnastics for 8 years, and have won many awards for my performance! I am also member of the  Lane Tech Cheer Team, where I am a backspot. Additionally, I am a part of four clubs at Lane, such as Unified Buddies, Children's Cancer Club, Think Pink, and Sports Broadcasting Club.</p>
           </div>
       </div>
       <br>
       <div class="row">
           <div class="col-md-4">
                <div class="card">
                  <img class="card-img-top" src="media/gym.jpg" alt="Medals Picture" style="width:100%">
                  <div class="card-body">
                    <h4 class="gymnastics text-center">Gymnastics</h4>
                    <p class="card-text">I have done competitive gymnastics for 8 years, click to learn more!</p>
                    <a href="sports.html" class="btn btn-secondary">Sports</a>
                  </div>
                </div>
           </div>
            <div class="col-md-4">
                <div class="card">
                  <img class="card-img-top" src="media/cheer1.jpeg" alt="Cheer Picture" style="width:100%">
                  <div class="card-body">
                    <h4 class="cheer text-center">Cheer</h4>
                    <p class="card-text">I started cheer at Lane this year, click to learn more!</p>
                    <a href="sports.html" class="btn btn-secondary">Sports</a>
                  </div>
                </div>
           </div>

           <div class="col-md-4">
                <div class="card">
                  <img class="card-img-top" src="media/homework.jpeg" alt="Homework Picture" height="250px" style="width:100%">
                  <div class="card-body">
                    <h4 class="school text-center">Academics/Clubs</h4>
                    <p class="card-text">I am very dedicated to my schoolwork, and make sure to put in extra effort! Click to learn more!</p>
                    <a href="aca.html" class="btn btn-secondary">Academics/Clubs</a>
                  </div>
                </div>
           </div>
       </div>
   </div>
   <br>
      <footer>
       <p class="footer text-center"><b>Email:</b> <a href="mailto:shearpeyton00@gmail.com" target="_blank">shearpeyton00@gmail.com</p></a>
       <p class="footer text-center"><b>Phone Number:</b> 847-975-4944</p>
      </footer>
 </body>
</html>