clueking2.github.io/about.html at main · clueking2/clueking2.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
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
---
layout: none
title: About Me
description: "About Claire Lueking's Values and Design Philosophy"
---
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="icon" href="./images/favicon1.png" type="image/png">
    <title>{{ page.title | default: "Home" }} | {{ site.title }}</title>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Patrick+Hand&family=Rock+Salt&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="{{ site.baseurl }}/styles.css">
  </head>
	<!-- //  BODY, MAIN TEXT  // -->
	<body>
		 <!-- //  NAV BAR  // -->
		 <div class="navbar">
			<div class="navbar-section">
			  <a href="{{ site.baseurl }}/index.html">
				<img src="{{ site.baseurl }}/images/Logo3.png" alt="Logo" class="logo">
			  </a>
			</div>

			<div class="hamburger" id="hamburger">
			  <span></span>
			  <span></span>
			  <span></span>
			</div>

			<div class="nav-links" id="navLinks">
			  <a href="{{ site.baseurl }}/index.html">Home</a>
			  <a href="{{ site.baseurl }}/about.html">About</a>
			  <a href="{{ site.baseurl }}/resume.html">Resume</a>
			  <a href="{{ site.baseurl }}/contact.html">Contact</a>

			  <div class="dropdown">
				<button class="dropbtn">Projects</button>
				<div class="dropdown-content">
					<a href="{{ site.baseurl }}/it.html">IT Projects</a>
					<a href="{{ site.baseurl }}/cybersecurity.html">Cybersecurity Projects</a>
				  <!-- <a href="{{ site.baseurl }}/FinAppandWebsite.html">Fin: A Finance App and Website</a>
				  <a href="{{ site.baseurl }}/ImpactLocalApp.html">ImpactLocal: A Civic Engagement App</a>
				  <a href="{{ site.baseurl }}/project3.html">Project 3</a> -->
				</div>
			  </div>
			</div>
		  </div>

		  <h1> About Me</h1>
		<!-- //  ABOUT ME  // -->
		<div class="img-container">
			<div class="about-img">
				<img src="./images/closeheadshot.png" alt="Picture of Claire in professional clothing with a gray background" width="300px" height="350px">
			</div>
		</div>

		<div class="blurb">
			<p class="about-text"> <span>I'm an entry-level IT and cybersecurity professional and recent Applied Computer Science graduate with a strong interest in security operations, IT support, and protecting users and organizational systems.</span>

				<p>I enjoy solving technical problems and working at the intersection of technology, security, and user trust. Through my coursework and hands-on learning, I've built a foundation in computer systems, networking concepts, scripting, and cybersecurity fundamentals, with a growing focus on how secure systems are designed, maintained, and defended.</p>

				<p>I recently completed my B.S. in Applied Computer Science and am currently pursuing CompTIA Security+ and CompTIA A+, along with having completed the Google Cybersecurity and IT Professional Certificates, to strengthen my knowledge of IT infrastructure, security controls, and troubleshooting.</p>

				Areas of Focus:

				<li>IT & Security Fundamentals: Operating systems, networking basics, access control, and system security</li>

				<li>Cybersecurity Learning: Security principles, risk awareness, and protecting user data</li>

				<li>Problem Solving: Troubleshooting issues, analyzing root causes, and improving system reliability</li>

				<li>Programming & Scripting: Python fundamentals and scripting for automation and learning labs</li>

				<p>Outside of technology, I value balance and discipline through staying active and exploring the outdoors, which helps me bring focus and persistence to my work.</p>

				<p>I'm actively seeking entry-level roles in IT support, cybersecurity, or technical operations, where I can continue learning, contribute to a team, and grow into a security-focused professional.To learn more about my work history, check out my <a href="./resume.html">resume</a>. Thanks for stopping by!</p>
			<br>
		</div>
		<!-- <hr/> -->

		<h2> <u>My Philosophy</u> </h2>
			<div class="value-header">
			<h3> Be Authentic </h3>
			</div>
			<div class="value-section">
				<p> Authenticity is essential in every aspect of cybersecurity and IT.</p>
				<p> This principle drives clear, ethical decision-making and ensures that every recommendation, configuration, and safeguard reflects the integritty and real-world needs--not shortcuts or assumptions., ensuring that design choices align with values and vision. </p>
			</div>

			<div class="value-header">
			<h3> Be Curious </h3>
			</div>
			<div class="value-section">
				<p> Curiosity is a key asset in security and technology.</p>
				<p> Threats evolve, systems change, and effective defense requires a mindset that constantly explores, questions, and learns. </p>
				<p>Curiosity fuels deeper problem-solving, reveals hidden vulnerabilities, and opens the door to innovative solutions to protect systems and empower users.</p>
			</div>
			<div class="value-header">
				<h3> Be Empathetic </h3>
			</div>
			<div class="value-section">
				<p> Empathy is the foundation of meaninful cybersecurity.</p>
				<p> True security begins with understanding people--their concerns, their habits, their challenges, and their goals. By listening carefully, we create an environemnt where collaboration thrives and security becomes accessible, not intimidating.</p>
				<p>Without empathy, trust erodes, and even the strongest technical controls fall short. With t, we build safer, more human-centered systems that truly support the people who rely on them.</p>
			</div>

	<!-- //  FOOTER INFO, SOCIAL MEDIA  // -->
    <footer>
		<div class="centered-container">
		  <h3>Let's Connect.</h3>
		  <div class="icon-container">
			<a href="https://www.linkedin.com/in/clairelueking"><img src="{{ site.baseurl }}/images/InBug-Black.png" class="icon" alt="LinkedIn Icon"></a>
			<a href="mailto:clairelueking@gmail.com"><img src="{{ site.baseurl }}/images/email.png" alt="Email Icon" class="icon"></a>
			<!-- <a href="https://dribbble.com/clueking"><img src="{{ site.baseurl }}/images/dribble_logo.svg" alt="Dribble Logo" class="icon"></a> -->
			<a href="https://github.com/clueking2"><img src="{{ site.baseurl }}/images/github-mark.png" alt="GitHub Icon" class="icon"></a>
		  </div>
		  <p>© 2026 By Claire Lueking, All Rights Reserved.</p>
		</div>
	</footer>
	<script>
		// JavaScript for hamburger menu functionality
		document.addEventListener("DOMContentLoaded", function() {
		  // Get elements
		  const hamburger = document.getElementById("hamburger");
		  const navLinks = document.getElementById("navLinks");
		  const dropdown = document.querySelector(".dropdown");
		  const dropbtn = document.querySelector(".dropbtn");

		  // Toggle menu when hamburger is clicked
		  hamburger.addEventListener("click", function(e) {
			e.stopPropagation(); // Prevent event bubbling
			hamburger.classList.toggle("active");
			navLinks.classList.toggle("active");
		  });

		  // Handle dropdown on mobile
		  dropbtn.addEventListener("click", function(e) {
			if (window.innerWidth <= 768) {
			  e.preventDefault();
			  e.stopPropagation(); // Prevent triggering parent click handlers
			  dropdown.classList.toggle("active");
			}
		  });

		  // Close menu when clicking outside
		  document.addEventListener("click", function(e) {
			// If click is outside hamburger and nav links
			if (!hamburger.contains(e.target) &&
				!navLinks.contains(e.target) &&
				navLinks.classList.contains("active")) {
			  hamburger.classList.remove("active");
			  navLinks.classList.remove("active");
			  dropdown.classList.remove("active");
			}
		  });

		  // Close menu when resizing to desktop
		  window.addEventListener("resize", function() {
			if (window.innerWidth > 768) {
			  hamburger.classList.remove("active");
			  navLinks.classList.remove("active");
			  dropdown.classList.remove("active");
			}
		  });
		});
	  </script>
	</body>
</html>