Web/about.html at main · diffior/Web · 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
<!DOCTYPE html>
<html lang="en">
<head>
  <title>About — Christian Campbell</title>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="css/style.css">
  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400&display=swap" rel="stylesheet">
</head>
<body>

<div class="page-bg">
  <a href="index.html" class="back-nav">Home</a>

  <div class="about-container">

    <div class="profile-section">
      <!--
        ✏️ PHOTO: Replace the src below with your own image file.
           Drop your photo into Web/images/ and update the path, e.g.:
           src="images/profile.jpg"
           The GitHub avatar is used as a placeholder for now.
      -->
      <img
        src="https://avatars.githubusercontent.com/u/57920390?s=400&u=797fd2d0db8abbafeb11f1eeb484302d75c78cec&v=4"
        alt="Christian Campbell"
        class="profile-img"
      >
      <div class="profile-info">
        <h1>Christian Avery Campbell</h1>
        <p class="role">Software Engineer &nbsp;·&nbsp; Backend &nbsp;·&nbsp; Data &nbsp;·&nbsp; DevOps</p>
        <div class="social-links">
          <a href="http://ca.linkedin.com/in/christian-a-campbell1" target="_blank" rel="noopener noreferrer" class="social-link">
            LinkedIn
          </a>
          <a href="https://github.com/diffior" target="_blank" rel="noopener noreferrer" class="social-link">
            GitHub
          </a>
        </div>
      </div>
    </div>

    <div class="divider"></div>

    <div class="bio-section">
      <h2>About</h2>
      <!--
        ✏️ BIO: Replace the paragraph below with your own words.
           Tell visitors who you are — your background, what drives you,
           your focus areas, and what you're building toward.
      -->
      <p class="bio-text">
        [Write your bio here. From USMC Squad Leader to software engineer — share what shaped your path, what you're focused on now (databases, backend engineering, DevOps, data analytics), and where you're headed. Keep it direct and genuine.]
      </p>
    </div>

    <div class="divider"></div>

    <div class="bio-section">
      <h2>Background</h2>
      <!--
        ✏️ BACKGROUND: Add experience highlights, education, or interests below.
      -->
      <p class="bio-text">
        [Add career highlights, education milestones, or personal interests here — e.g., your time at USMC, Perspecta, MSU Denver, or Microsoft Software & Systems Academy.]
      </p>
    </div>

  </div>
</div>


<script data-goatcounter="https://chrisaveri.goatcounter.com/count" async src="//gc.zgo.at/count.js"></script>
</body>
</html>